/* Common styles */

.plate.plate {

	background: rgba(255,255,255,0.6);

	padding: 20px 20px;

	color: #000;

	overflow: hidden;

}



.page-heading {

	color: rgb(84,84,84);

	font-size: 50px;

	white-space: nowrap;
    margin-bottom: .2em;

}



#st-control-1:checked ~ .st-scroll #st-panel-1 .page-heading, #st-control-2:checked ~ .st-scroll #st-panel-2 .page-heading, #st-control-3:checked ~ .st-scroll #st-panel-3 .page-heading, #st-control-4:checked ~ .st-scroll #st-panel-4 .page-heading, #st-control-5:checked ~ .st-scroll #st-panel-5 .page-heading, #st-control-6:checked ~ .st-scroll #st-panel-6 .page-heading {

	-webkit-animation: moveDown 1s ease-in-out 0.2s backwards;

	-moz-animation: moveDown 1s ease-in-out 0.2s backwards;

	-o-animation: moveDown 1.s ease-in-out 0.2s backwards;

	-ms-animation: moveDown 1.0s ease-in-out 0.2s backwards;

	animation: moveDown 1.0s ease-in-out 0.2s backwards;

}



#st-control-1:checked ~ .st-scroll #st-panel-1 .plate, #st-control-2:checked ~ .st-scroll #st-panel-2 .plate, #st-control-3:checked ~ .st-scroll #st-panel-3 .plate, #st-control-4:checked ~ .st-scroll #st-panel-4 .plate, #st-control-5:checked ~ .st-scroll #st-panel-5 .plate, #st-control-6:checked ~ .st-scroll #st-panel-6 .plate {

	-webkit-animation: moveUp 0.6s ease-in-out 0.2s backwards;

	-moz-animation: moveUp 0.6s ease-in-out 0.2s backwards;

	-o-animation: moveUp 0.6s ease-in-out 0.2s backwards;

	-ms-animation: moveUp 0.6s ease-in-out 0.2s backwards;

	animation: moveUp 0.6s ease-in-out 0.2s backwards;

}



.page-sub-heading {

	color: rgb(112,113,115);

	font-size: 2.3em;

	white-space: nowrap;

}



.page-content.page-content {

	color: rgb(84,84,82);

	font-size: 16px;

	text-align: justify;

	/*min-width: 764px; */

	padding-right: 15px;

	padding-left: 10px;

	overflow: auto;

	height: 100%;

}



.headings {

	background-color: transparent;

	position: absolute;

	z-index: 1;

	margin: 0 auto;

	left: 0;

	right: 0;

	display: inline-block;

}



/* Home page. */

.home.headings {

	top: 32%;

	-webkit-animation: moveDown 1s ease-in-out 0.2s backwards;

	-moz-animation: moveDown 1s ease-in-out 0.2s backwards;

	-o-animation: moveDown 1.s ease-in-out 0.2s backwards;

	-ms-animation: moveDown 1.0s ease-in-out 0.2s backwards;

	animation: moveDown 1.0s ease-in-out 0.2s backwards;

}



@media screen and (max-width: 1500px) {

	.home .page-heading {

		font-size: 2em;

	}

	

	.home .page-sub-heading, .about .page-sub-heading, .clients .page-sub-heading {

		font-size: 1.5em;

	}

	
	.home.headings {

		top: 35%;

	}

}



@media screen and (max-width: 1250px) {

	.home .page-heading {

		font-size: 40px;

	}


	.home .page-sub-heading, .about .page-sub-heading , .clients .page-sub-heading {

		font-size: 25px;

	}

	

	.home.headings {

		top: 37%;

	}

}



@media screen and (max-width: 1000px) {

	.home .page-heading {

		font-size: 30px;

	}

	

	.home .page-sub-heading, .about .page-sub-heading, .clients .page-sub-heading  {

		font-size: 20px;

	}

	

	.home.headings {

		top: 41%;

	}

}



@media screen and (max-width: 750px) {

	.home .page-heading {

		font-size: 1em;

		font-weight: bold;

	}

	

	.home .page-sub-heading, .about .page-sub-heading, .clients .page-sub-heading  {

		font-size: 1em;

		font-weight: bold;

	}

	

	.home.headings {

		top: 43%;

	}

	

	.about .page-sub-heading.page-sub-heading {

		top: 29%;

	}

}





.home .page-heading {

	color: rgb(84,84,84);

	white-space: nowrap;

	text-align: center;

}





.home .page-sub-heading {

	color: rgb(112,113,115);

	white-space: nowrap;

	text-align: center;

}

/* About page. */

.about .page-heading {
    
	display: inline-block;

	position: absolute;

	margin: 0 auto;

	left: calc(50% - 90px);

	top: 10%;

}


.about .page-sub-heading  {

	font-size: 30px;

	margin-bottom: 20px;

}


.about .plate {

	display: inline-block;

	top: 35%;

	position: absolute;

	margin: 0 auto;

	left: 0;

	right: 0;

	width: 350px;

}


.about .st-deco {

	top: -90px;

}


.about .st-deco:after {

	top: 70%;

	left: 70%;

	font-size: 40px;

}



/* services */



.services .page-heading {

	display: inline-block;

	position: absolute;

	margin: 0 auto;

	left: calc(50% - 110px);

	top: 10%;

}


.services .plate {

	display: inline-block;

	top: 35%;

	position: absolute;

	margin: 0 auto;

	left: 0;

	right: 0;

	width: 350px;

}

.services .st-deco {

	top: -80px;

}



.services .st-deco:after {

	top: 70%;

	left: 70%;

	font-size: 40px;

}




/* clients */ 



.clients .page-heading.center {

	display: inline-block;

	position: absolute;

	margin: 0 auto;

	left: calc(50% - 90px);

	top: 10%;

}



.clients .page-sub-heading {

	margin-bottom: 20px;

	text-align: center;

}

.clients .page-content{
    text-align: left
}
.clients .plate {

	position: absolute;

	width: 44%;

	display: inline-block;

	top: 25%;

	height: 40%;

}

.clients .plate.left  {

	left: 5%;

}

.clients .plate.right {

	right: 5%;

}



.clients .page-content.page-content {

	height: 75%;

}

.clients ul {
  list-style-position: inside;
    margin: 0;
    padding: 0 0 0 .2em;
}

.clients .st-deco {

	top: -80px;

}



.clients .st-deco:after {

	top: 70%;

	left: 70%;

	font-size: 40px;

}



/* Logistics */



.logistics .page-heading.center {

	display: inline-block;

	position: absolute;

	margin: 0 auto;

	left: calc(50% - 100px);

	top: 10%;

}



.logistics .page-sub-heading {

	font-size: 30px;

	margin-bottom: 20px;

}

.logistics .plate {

	display: inline-block;

	top: 30%;

	position: absolute;

	margin: 0 auto;

	left: 0;

	right: 0;

	width: 350px;


}



.logistics .st-deco {

	top: -80px;

}



.logistics .st-deco:after {

	top: 70%;

	left: 70%;

	font-size: 40px;

}



.logistics h4 {

	color: rgb(112,113,115);

}






/* Dialog Popup styles */

.more-dialog , .full{

	display: inline-block;

	position: absolute;

	height: 150px;

	padding: 5px 15px;

	background-color: rgba(255, 255, 255, 0.5);

    color: #444444 !important;

	transition: opacity 0.4s ease;

}



.more-dialog.center {

	width: 50%;

	left: 25%;

	top: 50%;

}



.pop {

	width: 45%;

	height: 20%;

	min-width: 480px;

}



 .more ,  .less{

	position: absolute;

	bottom: 10px;

	right: 10px;

	color: #888888;

	transition: all 0.4s ease;

	cursor: pointer;

}



 .more:hover ,  .less:hover {

    letter-spacing: 3px;

	color: steelblue;

	transform: scale(1.1);

}



.pop .partial {

	margin : -25px 0;

}



.pop .full  {

	opacity: 0;

	left: 0;

	top: 0;

	overflow-y: auto;

	z-index: -1;

	background: rgba(255,255,255,0.9);

	font: inherit;

	color: inherit;

    transition: opacity 0.4s ease;

	position: absolute;

}



.pop h4, .services-popup h4 {

	color: rgb(112,113,115);

	text-align: center;

	font-size: 18px;

}



.pop1, .pop2 {

	top: 20%;

}



.pop3, .pop4 {

	top: 45%;

}



.pop5,  .pop6{

	top: 70%;

}



.pop1, .pop3, .pop5 {

	left: 1%;

}



.pop2, .pop4, .pop6{

	left: 54%;

}