/* CSS Document */
/*-------------------------------------------------
GLOBALS & GENERAL CASES
-------------------------------------------------*/
 * {margin:0;padding:0;}
html, body {
	height: 100%;
	width:100%;
	margin: 0 0 0 2px;
	padding:0;
	overflow-x: hidden;
	overflow-y:auto;
}
body {background:#ffffff;font-family: 'Trebuchet MS', serif;font-size:12px;color:#000000;}

h1{font-family: 'Oswald', sans-serif; font-size:24px; text-transform: uppercase; font-weight:normal; color:#fff;}
h2{font-family: 'Oswald', sans-serif; font-size:20px; text-transform: uppercase; font-weight:normal;  font-weight: 700;   padding-left: 30px}
h3{font-family: 'Oswald', sans-serif; font-size:14px; text-transform: uppercase; font-weight:normal;}
h4{ color:#ffc01d; font-size:15px; font-weight:normal; font-family: 'Trebuchet MS', serif;} 
h6{ color:#ffc01d; font-size:14px; font-weight:normal;}

p{ font-size:15px; padding:5px 5px 5px 5px;}
a{ color:#000; text-decoration:none;}
a:hover{ color:#ffc01d;}
.clear{clear:both;}
.title{ margin-bottom:10px;}
.title h1{ color:#ffc01d;}
.title h2{ color:#fff;}
/*-------------------------------------------------
body sytles start
-------------------------------------------------*/
header{
	height:5%;
	max-height:5%;
	width: 100%;
	max-width:100%;
	padding-top: 25px;
	padding-left:55px;
}
header h1{
		color:#E31E24; 
		text-transform:uppercase; 
		text-align:absmiddle; 
		font-weight: 700;
		font-size:24px;
}
.left {
    float: left;
    width:40%;
	padding: 16px 0px 0px 24px;
	}
.right{
   float:right;
    width:15%;
 }
img {
    max-width: 100%;
	max-height: 100%;
}
  .middle{
      float:right;   width: 12%;
 }
section{
	width:85%;
	/*margin: 0px auto;*/
	margin-right:10%;
	max-width:100%;
	/*height:97%;*/

}

article{
	width:100%;
	margin: 0 auto;
	max-width:100%;
	/*height: 100%;*/
	background:transparent;
}
article #homeText{
	float: left;
    /* width: 50%; */
    color: #ffffff;
    font-size: 32px;
    /* padding-top: 194px; */
    /* padding-left: 115px; */
    overflow: hidden;
    max-width: 100%;
	width:60%;
}
.button{
	background:url(../images/button.png) no-repeat; 
	width:170px; 
	height:50px;
	text-align:center;
	line-height:50px; 
	margin-top:50px; 
	margin-bottom:116px;
	color:#ffc01d;
	font-size:20px;
	text-transform: uppercase;
	border:0px;
	outline: none;
}
.button a:hover{ color:#fff;}
/*article .button{ background:url(../images/button.png) no-repeat; width:170px; height:50px; text-align:center; line-height:50px; margin-top:50px; margin-bottom:116px;}
article .button:hover{ background:url(../images/button-hover.png) no-repeat; width:170px; height:50px; text-align:center; line-height:50px; margin-top:50px; margin-bottom:116px;}
*/
article #homeImg{
	float:right; 
	width:40%;
	max-width: 100%;
	/*overflow: hidden;*/
}
#homeImg  img{
	padding-top: 0px;
	max-width:100%;
	/*margin-bottom: -3px;*/
}
     img {
	max-width: 100%;
    height: auto;
  }
/*-------------------------------------------------
PAGE CONTENT SECTION 
-------------------------------------------------*/
.pageHome-content{background:#ffc01d; overflow:auto;
	/*padding: 10px;*/
	min-height: -webkit-calc(100% - 100px);     /* Chrome */
	min-height: -moz-calc(100% - 100px);     /* Firefox */
	min-height: calc(100% - 100px);     /* native */
}
.pageHome{width:78%; margin:0 auto; padding-top: 122px;}

.page-content{background:#1664b9; overflow:auto;
	/*padding: 10px;*/
	min-height: -webkit-calc(100% - 100px);     /* Chrome */
	min-height: -moz-calc(100% - 100px);     /* Firefox */
	min-height: calc(100% - 100px);     /* native */

}
#page{width:85%; margin:0 auto; padding-bottom:70px; padding-right:50px; overflow:auto; vertical-align:top;}
#page h1{ margin-bottom:5px; color:#E31E24; text-transform:uppercase; text-align:absmiddle; font-weight: 700; }
#page h2{ color:#fff; font-size:16px;}
#page h3{ color:#E31E24; font-size:17px; text-transform:lowercase; font-weight: 700;}
#page h3:first-letter {text-transform: uppercase;}
#page span .content{padding-bottom:20px; color:#9ac5f5; text-align: justify;}
#page span .phone{display: inline; }
#page p{ padding-bottom:15px; text-align: justify;}
/*#page ul{padding-left:30px;}
#page ul li{padding-left:0px; font-size:16px;}*/
#page ol{padding-left:30px;}
#page ol li{padding-left:0px; font-size:16px;}

.div-wrapper {
    white-space: nowrap;
    max-width: 100%;
}
.single-div {
    width: 30%;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    margin: 2% 2% 0% 0%;
    white-space: normal;
    border: 1px solid #000;
    height: 180px;
    line-height: 180px;
	font-size:16px;
}
/*.single-div img {
    width: 50px;
    border-radius: 3px;
    margin: 5px;
    transition-duration: 0.1s;
	max-width: 100%;
	max-height: 100%;

}

.single-div img:hover {
    transform: scale(2.4,2.4);
    border-radius: 0;
    box-shadow: 0 0 10px 0px #333;
}*/

table{
	width:90%;
	padding:5px;
	border-spacing: 0;
    border-collapse: collapse;
}
table tr th{	
    font-size: 12px;
    color:#065eff; 
    background-color:transparent;
    border: 1px solid #065eff;
}

table tr td{	
	border:1px solid #cccccc;
}
.inside td {
    padding:3px;
	padding-left:7px !important;
	border:1px solid #065eff; 
}
	/* provide some minimal visual accomodation for IE8 and below */
	.inside tr{
		background: #ffffff;
	}
	/*  Define the background color for all the ODD background rows  */
	.inside tr:nth-child(odd){ 
		background: #ffffff;
	}
	/*  Define the background color for all the EVEN background rows  */
	.inside tr:nth-child(even){
		background:#e1ecff;
	}
    .inside tr:hover {
        background:#aac8ff;
	}
	.inside tr:first-child:hover {
        background:initial;
	}
	.artical table td {
		text-align: center;
	}
	.artical table td:nth-child(2){
		text-align: left;
		width:30%;
	}
	.artical table td:nth-child(3){
		text-align: left;
		width:30%;
	}
/*-------------------------------------------------
IMAGE CAPTION
-------------------------------------------------*/
.caption-style-4{
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		
	}
	.caption-style-4 li{
		float: left;
		padding: 3px;
		position: relative;
		overflow: hidden;

	}
	.caption-style-4 li:hover .caption{
		opacity: 1;
	}
	.caption-style-4 li:hover img{
		opacity: 1;
		transform: scale(1.15,1.15);
		-webkit-transform:scale(1.15,1.15);
		-moz-transform:scale(1.15,1.15);
		-ms-transform:scale(1.15,1.15);
		-o-transform:scale(1.15,1.15);
	}
	.caption-style-4 img{
		margin: 0px;
		padding: 0px;
		float: left;
		z-index: 4;
	}
	.caption-style-4 .caption{
		cursor: pointer;
		position: absolute;
		opacity: 0;
		-webkit-transition:all 0.45s ease-in-out;
		-moz-transition:all 0.45s ease-in-out;
		-o-transition:all 0.45s ease-in-out;
		-ms-transition:all 0.45s ease-in-out;
		transition:all 0.45s ease-in-out;
	}
	.caption-style-4 img{
		-webkit-transition:all 0.25s ease-in-out;
		-moz-transition:all 0.25s ease-in-out;
		-o-transition:all 0.25s ease-in-out;
		-ms-transition:all 0.25s ease-in-out;
		transition:all 0.25s ease-in-out;
	}
	.caption-style-4 .blur{
		background-color: rgba(0,0,0,0.65);
		height: 182px;
		width: 280px;
		z-index: 5;
		position: absolute;
	}
	.caption-style-4 .caption-text h1{
		text-transform: uppercase;
		font-size: 24px;
		color:#FFFFFF !important;
		font-weight: 700;
	}
	.caption-style-4 .caption-text p{
		text-align: center !important;
	}
	.caption-style-4 .caption-text{
		z-index: 10;
		color: #fff;
		position: absolute;
		width: 280px;
		height: 182px;
		text-align: center;
		top:70px;
	}
/*-------------------------------------------------
FOOTER SECTION 
-------------------------------------------------*/
footer{
	position: fixed;
	bottom: 0;
}
.footer-distributed{
	background-color: #292c2f;
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
	width: 100%;
	text-align: left;
	/*font: bold 15px sans-serif;*/

	padding: 15px 20px;
	margin: 0px;
}

.footer-distributed .footer-left,
.footer-distributed .footer-center,
.footer-distributed .footer-right{
	display: inline-block;
	vertical-align: top;
}

/* Footer left */

.footer-distributed .footer-left{
	width: 28%;
}

/* The company logo */

.footer-distributed h3{
	color:  #ffffff;
	font: normal 32px 'Oswald', sans-serif; 
	margin: 0;
}

.footer-distributed h3 span{
	color:  #ecd113;
	font-family: 'Oswald', sans-serif; 
	font-size:28px;
	font-weight: 700;
}

/* Footer links */

.footer-distributed .footer-links{
	color:  #ffffff;
	margin: 10px 0 12px;
	padding: 0;
}

.footer-distributed .footer-links a{
	display:inline-block;
	line-height: 1.5;
	text-decoration: none;
	color:  inherit;
}

.footer-distributed .footer-company-name{
	color:  #8f9296;
	font-size: 14px;
	font-weight: normal;
	margin: 0;
}

/* Footer Center */

.footer-distributed .footer-center{
	width: 25%;
}

.footer-distributed .footer-center i{
	background-color:  #33383b;
	color: #ffffff;
	font-size: 25px;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	text-align: center;
	line-height: 42px;
	margin: 10px 15px;
	vertical-align: middle;
}

.footer-distributed .footer-center i.fa-envelope{
	font-size: 17px;
	line-height: 38px;
}

.footer-distributed .footer-center p{
	display: inline-block;
	color: #ffffff;
	vertical-align: middle;
	margin:0;
}

.footer-distributed .footer-center p span{
	display:block;
	font-weight: normal;
	font-size:14px;
	line-height:2;
}

.footer-distributed .footer-center p a{
	color:  #5383d3;
	text-decoration: none;;
}


/* Footer Right */

.footer-distributed .footer-right{
	width: 25%;
}

.footer-distributed .footer-company-about{
	line-height: 20px;
	color:  #92999f;
	font-size: 13px;
	font-weight: normal;
	margin: 0;
}

.footer-distributed .footer-company-about span{
	display: block;
	color:  #ffffff;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 20px;
}

.footer-distributed .footer-icons{
	margin-top: 10px;
}

.footer-distributed .footer-icons a{
	display: inline-block;
	width: 35px;
	height: 35px;
	cursor: pointer;
	background-color:  #33383b;
	border-radius: 2px;

	font-size: 20px;
	color: #ffffff;
	text-align: center;
	line-height: 35px;

	margin-right: 3px;
	margin-bottom: 5px;
}

/* If you don't want the footer to be responsive, remove these media queries */
@media (max-height:800px){
	footer { position: static; }
	header { padding-top:20px; padding-left:50px;}
	header h1{	font-size:15px;}
	#page{width:90%; margin:0 auto; padding-bottom:20px; padding-right:0px; overflow:auto; vertical-align:top;}

}

@media (max-width: 880px) {

	.footer-distributed{
		font: bold 14px sans-serif;
	}

	.footer-distributed .footer-left,
	.footer-distributed .footer-center,
	.footer-distributed .footer-right{
		display: block;
		width: 100%;
		margin-bottom: 40px;
		text-align: center;
	}

	.footer-distributed .footer-center i{
		margin-left: 0;
	}

}

/*Responsive CSS3*/

@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) 
{
	section{
		width:100%;
		max-width:100%;
		height:auto;

	}
	.menu .avatar img {
    width:80%;
	max-width: 100%;
    height: auto;

	article{
		width:100%;
		max-width:100%;
		height: 100%;
		background: #1664b9;
		padding-bottom:30px;
	}


}
@media screen and (max-width: 480px) { /*Smartphone*/

    .single-div {
        display: block;
        width: 65%;
        margin: 0 auto;
		padding-bottom:3px;
		max-height:150px;
		height:auto;

    }

}
@media (min-width: 768px) {/*TAB*/
    .single-div {
        display: block;
        width: 46%;
        margin: 0 auto;
		padding-bottom:3px;
		max-height:150px;
		height:auto;

    }

}