/*  Fonts  */
@font-face {
    font-family: 'lato_regular';
    src: url('../fonts/lato-regular.eot');
    src: url('../fonts/lato-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-regular.woff') format('woff'),
         url('../fonts/lato-regular.ttf') format('truetype'),
         url('../fonts/lato-regular.svg#LatoRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'lato_bold';
    src: url('../fonts/lato-bold.eot');
    src: url('../fonts/lato-bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-bold.woff') format('woff'),
         url('../fonts/lato-bold.ttf') format('truetype'),
         url('../fonts/lato-bold.svg#LatoBold') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'avantgardelt-extralight';
    src: url('../fonts/avantgardelt-extralight.eot');
    src: url('../fonts/avantgardelt-extralight.eot?#iefix') format('embedded-opentype'),
         url('../fonts/avantgardelt-extralight.woff') format('woff'),
         url('../fonts/avantgardelt-extralight.ttf') format('truetype'),
         url('../fonts/avantgardelt-extralight.svg#avantgardelt-extralight') format('svg');
    font-weight: normal;
    font-style: normal;

}


/*  General CSS*/
body {
	background: url('../img/bg.jpg') center/150% repeat-y;
	background-color: #fff;

    }

.wrapper{
	max-width: 100%;
	height: auto;
	margin: 0 auto;
    position: relative;
}

::selection {color:#ffffff;background:#353434;}
::-moz-selection {color:#ffffff;background:#353434;}

.feature a,
.cta a.cta_btn,
.testimonials #t_navigation a,
header ul.social li a,
header nav ul li a{
	transition:all .2s linear;
	-webkit-transition:all .2s linear;
	-moz-transition:all .2s linear;
	-o-transition:all .2s linear;
}


/*  header  */
header{
    width: 100%;
    height: auto;
	margin-top: -5px;
	background: url('../img/palmiers.png') right 20% bottom no-repeat;
	border-bottom: 1px #000000 solid;
}

header .logo{
	display: block;
	margin-left: 20%;
}

header .iph{
    color: #fff;
    font-family: "lato_regular", arial;
    font-size: 12px;
    margin: 30px auto 0px auto;
	padding: 5px;
    line-height: 25px;
	background-color: rgba(0, 0, 0, 0.4);
	
}
header .iph img{float: right;}
header .iph span{margin-left: 15px; float: right; text-align: left; line-height: 16px;}

/* Slideshow*/

/* Slideshow container */
.slideshow-container {
  max-width: 100%;
  position: relative;
  margin: 0;
  padding: 0;
}

/* Hide the images by default */
.mySlides {
  display: none;
}
/* Fading animation */
.fade img{
  -webkit-animation-name: fade;
  -webkit-animation-duration: 20s;
  animation-name: fade;
  animation-duration: 20s;
}

.fade img:nth-child(1) { animation-delay: 0s;}
.fade img:nth-child(2) { animation-delay: 4s;}
.fade img:nth-child(3) { animation-delay: 8s;}
.fade img:nth-child(4) { animation-delay: 12s;}
.fade img:nth-child(5) { animation-delay: 16s;}

@-webkit-keyframes fade {
   0%, 100% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  20% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }

}

@keyframes fade {
   0%, 100% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  20% {
    opacity: 1;
  }
  30% {
    opacity: 0;
  }

}

/* The dots/bullets/indicators */
.dot_container {
	text-align: center;
	background-color: #000;
}

.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #000000;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
  visibility: visible;
}
.active {
  background-color: #717171;
}


/*  Billboard  */
.billboard_contact{
	border: 1px solid black;
	width: 100%;
    height: 300px;
    background: #ffffff;

}

.billboard_contact .caption{
    margin-left: 30%;
    margin-top: 5%;;
}

.billboard_contact .caption p{
    display: inline-block;
    color: #ffffff;
    font-family: "avantgardelt-extralight", arial;
    font-weight: lighter;
    font-size: 35px;
    padding: 20px;
    background: rgba(0, 0, 0, 0.75);
    margin-bottom: 2px;
    text-transform: uppercase;
    z-index: 8888;
}

/*  Services/features  */
.features{
    width: 100%;
    padding-top: 50px;
    overflow: hidden;
	background: #ffffff;
}

.features .feature_half{
    display: block;
    width: 45%;
    height: auto;
    padding: 0;
	margin-left: 5%;
    margin-bottom: 50px;
	min-height: 250px;
	float: left;
}

.feature_half p{
    margin-bottom: 20px;
    color: #000000;
    font-family: "lato_regular", arial;
    font-size: 15px;
    line-height: 22px;
	text-align: justify;
}

.feature_half a{
    color: #ff9900;
    font-family: "lato_regular", arial;
    font-size: 15px;
    text-decoration: none;
    letter-spacing: .5px;
}

.feature_half a:hover{
    color: #ffffff;
}

.feature_half ul li {
	margin: 10px;
    font-family: "lato_regular", arial;
    font-size: 15px;
}

.feature_half_title {
	min-height: 100px;
	text-align: center;
}

.feature_half_title h3{
    font-family: "avantgardelt-extralight", arial;
    font-size: 22px;
    font-weight: bold;
    text-transform: uppercase;
	text-align: center;
	padding: 10px;
	margin: 5px;
}
.clear {clear: both;}

.title0 h3{
	color: #000;
	background: #fae2c1;
	width: 100%;
	height: 50px;
	line-height: 27px;
	margin-left: 1%;
	float: left;	
}
.title1 h3{
	color: #000;
	background: #fae2c1;
	width: 30%;
	height: 50px;
	line-height: 27px;
	margin-left: 1%;
	float: left;	
}
.title2 h3{
	color: #fff;
	background: #cc7b16;
	width: 20%;
	height: 50px;
	line-height: 50px;
	float: left;
}
.title3 h3{
	color: #fff;
	background: #c49a6c;
	width: 20%;
	height: 50px;
	line-height: 50px;
	float: left;
}
.title4 h3{
	color: #fff;
	background: #0e76bc;
	width: 20%;
	height: 50px;
	line-height: 50px;
	float: left;
}



/*  Call To Action Section  */
.cta{
    text-align: center;
    padding: 50px 0px;
    width: 50%;
	margin: auto;
}

.cta h2{
    color: #0099ff;
    font-family: "avantgardelt-extralight", arial;
    font-size: 28px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.cta p{
    color: #ffffff;
    font-family: "lato_regular", arial;
    font-size: 17px;
    margin-top: 20px;
    letter-spacing: .5px;
}

.cta ul {
	padding: 20px;
	width: 30%;
	float: left;
}

.cta ul li {
    margin: 10px;
	color: #ffffff;
    font-family: "lato_regular", arial;
    font-size: 18px;
	text-transform:uppercase;
    line-height: 22px;
	list-style-type:none;
}

.cta a.cta_btn{
    display: inline-block;
    padding: 20px 60px;
    background-color: #0099ff;
    color: #fff;
    font-family: "lato_regular", arial;
    font-size: 20px;
    text-decoration: none;
    margin-top: 60px;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: 1px;
    -moz-border-radius: 1px;
    -webkit-border-radius: 1px;
}

.cta a.cta_btn:hover{
    background: #0099ff;
}

.cta .cta_sep{
    display: block;
    width: 1px;
    height: 100px;
    background: #dedede;
    margin: 0 auto;
}
.cta h2{
    color: #fff;
    font-family: "avantgardelt-extralight", arial;
    font-size: 26px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.cta form p{
	width: 310px;
	margin: auto;
	padding: 10px;
}

.cta a.cta_btn{
    display: inline-block;
    padding: 20px 60px;
    background: #0099ff;
    color: #fff;
    font-family: "lato_regular", arial;
    font-size: 20px;
    text-decoration: none;
    margin-top: 30px;
    text-transform: uppercase;
    letter-spacing: 1px;
	border: 1px solid #000000;
}

.cta a.cta_btn:hover{
    background: #0099ff;
}

.cta .cta_sep{
    display: block;
    width: 1px;
    height: 100px;
    background: #000000;
    margin: 0 auto;
}

.cta input {
	width: 200px;
	font-family: "lato_regular", arial;
	margin: 5px;
	padding: 5px;
	border: 1px solid #000000;
}
.cta textarea {
	width: 200px;
	font-family: "lato_regular", arial;
	margin: 5px;
	padding: 5px;
	border: 1px solid #000000;
}

.cta label {
  display: block;
  float: left;
  width: 85px;
  text-align: right;
  padding: 10px 0 10px 0;
}

input.but_valid {
    width: 300px;
	padding: 20px;
    background-color: #0099ff;
    color: #fff;
    font-family: "lato_regular", arial;
    font-size: 21px;
    text-decoration: none;
    margin: 50px 0 0 0;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.but_valid:hover{
    background: #3b3b3b;
}

/*Gallerie photos*/
.gallerie{
	width: 100%;
	padding: 20px 0;
	background: #ffffff;
	border-bottom: 1px solid #000;
}
.gallerie_img{margin: 0 5px; padding: 0; text-align: center; width: auto;}


/*  Footer  */
footer{
    padding: 50px 0;
    text-align: center;
}

footer .rights{
    color: #000;
    font-family: "lato_regular", arial;
    font-size: 14px;
    margin-top: 30px;
    line-height: 25px;
}

a{
    color: #ec7404;
}

footer .credits a {
	font-family: "lato_regular", arial;
	color:#000000;
	font-size: 12px;
	text-decoration: none;
	text align: center;
}

footer .credits a:hover {
	color: #ec7404;
}




/*  Responsive code  */
@media (max-width:1200px){
    .wrapper{
        padding: 0;
    }
    .info_pic,
    .info_details{
        width: 100%;
    }

    .info_details{
        height: auto;
        padding: 40px 0;
    }

    .info_details h3,
    .info_details p,
    .info_details a{
        max-width: 80%;
        display: block;
        text-align: center;
        margin: 40px auto;
    }
	.features .feature_ref1{
        width: 88%;
        margin-right: 5%!important;

	}
	.features .feature_ref{
        width: 15%;
        margin-right: 1%!important;
		margin-left: 1%!important;
		min-height: 750px;
	}
    .features .feature_ref:nth-child(2n+2)
    {
        margin-right: 1%!important;
		margin-left: 1%!important;
    }
	.features .feature_half{
        width: 45%;
        margin-right: 2%!important;
		margin-left: 2%!important;
	}
    .features .feature_half:nth-child(2n+2)
    {
        margin-right: 2%!important;
		margin-left: 2%!important;
    }
	.focus{
		width: 100%;
		padding-top: 100px;
		overflow: hidden;
	}
	
	.focus .focus1{
			width: 90%;
			margin-right: 0!important;
			margin-left: 2%!important;
	}
	
	.focus .focus1:nth-child(3n+0)
	{
			margin-right: 0!important;
			margin-left: 2%!important;
			border: 0px;
		
	}
	.testimonials .imgt_col {float: left; padding: 10px 10px 10px 10px;}
	.testimonials .t_col {float: left; text-align: left; width: 78%; border: 1px solid red;}
}


@media (max-width:1000px){
	.wrapper {padding: 0;}

    .cta{
        width: 80%;
        margin: 0 auto;
    }
    .features .feature{
        width: 40%;
        margin-right: 0!important;
    }
    .features .feature:nth-child(2n+2)
    {
        margin-right: 0!important;
    }
	
	.featuresx .feature{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
    }
    .featuresx .feature:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }
	.features .feature_ref1{
        width: 88%;
        margin-right: 5%!important;

	}
	.features .feature_ref{
        width: 40%;
        margin-right: 5%!important;
		margin-left: 5%!important;
	}
    .features .feature_ref:nth-child(2n+2)
    {
        margin-right: 2%!important;
		margin-left: 2%!important;
    }
	.features .feature_half{
        width: 90%;
        margin-right: 2%!important;
		margin-left: 2%!important;
	}
    .features .feature_half:nth-child(2n+2)
    {
        margin-right: 2%!important;
		margin-left: 2%!important;
    }

	.billboard .caption{
		text-align: center;
		margin-left: 5%;
		width: 50%;
	}
	
	.focus{
		width: 100%;
		padding-top: 100px;
		overflow: hidden;
	}
	
	.focus .focus1{
			width: 90%;
			margin-right: 0!important;
			margin-left: 2%!important;
	}
	
	.focus .focus1:nth-child(3n+0)
	{
			margin-right: 0!important;
			margin-left: 2%!important;
			border: 0px;
		
	}
	.testimonials .imgt_col {float: left; padding: 10px 10px 10px 10px;}
	.testimonials .t_col {float: left; text-align: left; width: 60%;}
}


@media (max-width:800px){
	.wrapper {padding: 0;}

	.billboard .caption{
		text-align: center;
		margin-left: 5%;
		width: 40%;
	}
    .features .feature{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
    }
    .features .feature:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }
	
	.featuresx .feature{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
    }
    .featuresx .feature:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }
	.features .feature_ref{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
	}
    .features .feature_ref:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }
	.features .feature_half{
        width: 90%;
        margin-right: 2%!important;
		margin-left: 2%!important;
	}
    .features .feature_half:nth-child(2n+2)
    {
        margin-right: 2%!important;
		margin-left: 2%!important;
    }
	.focus{
		width: 100%;
		padding-top: 100px;
		overflow: hidden;
	}
	
	.focus .focus1{
			width: 90%;
			margin-right: 0!important;
			margin-left: 2%!important;
	}
	
	.focus .focus1:nth-child(3n+0)
	{
			margin-right: 0!important;
			margin-left: 2%!important;
			border: 0px;
		
	}
	.testimonials .imgt_col {float: none; padding: 10px 10px 10px 10px;}
	.testimonials .t_col {float: none; text-align: center; width: 70%;}
}

@media (max-width:500px){
    header .logo{
	display: block;
	margin-left: 0;
}
	.wrapper {padding: 0;}
	.billboard{
		min-width: 450px;
		height: 300px;
	}
	
	.billboard .caption{
		text-align: center;
		margin-left: 1%;
		margin-top: -50%;
		width: 90%;
	}
	.slideshow-container{
		width: 100%;
		
	}
	.fade img{
	  height: 300px;
	  object-fit: cover;
	}


    .features .feature{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
    }
    .features .feature:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }
	
	.featuresx .feature{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
    }
    .featuresx .feature:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }
	.features .feature_ref{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
	}
    .features .feature_ref:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }
	.features .feature_ref1{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
		padding: 10px 9px;
	}
	.features .feature_half{
        width: 90%;
        margin-right: 0!important;
		margin-left: 2%!important;
	}
    .features .feature_half:nth-child(2n+2)
    {
        margin-right: 0!important;
		margin-left: 2%!important;
    }

	.focus{
		width: 100%;
		padding-top: 100px;
		overflow: hidden;
	}
	
	.focus .focus1{
			width: 90%;
			margin-right: 0!important;
			margin-left: 2%!important;
	}
	
	.focus .focus1:nth-child(3n+0)
	{
			margin-right: 0!important;
			margin-left: 2%!important;
			border: 0px;
		
	}
	.testimonials .imgt_col {float: none; padding: 10px 10px 10px 10px;}
	.testimonials .t_col {float: none; text-align: center; width: 70%;}
}