/*
Theme Name: TRO Template One
Description: Tema Responsive con Boostrap
Author: Troitiño 
Version: 1.0
*/
@import url('bootstrap/css/bootstrap.css');

/*---------- Margin Fix ----------*/

@media (max-width: 978px) {
    .navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
    }
}


/*---------- Global ----------*/
 html, body {
	margin: 0;
}
body {
	font-family: 'canada-type-gibson', sans-serif;
	font-size: 16px;
	color: #585f4f;
	background-color:  #ffffff;
	overflow-x:hidden;
	width:100%;
}

body > .container-fluid {}

.acenter {text-align: center;}
.aright {text-align: right;}
.aleft {text-align: left;}

.navbar-default {border: none;}
.container-fluid {}
/* nav .row{width: 100%;} */

#header-social ul.cnss-social-icon li.cn-fa-icon a {background: transparent!important;}


.container{max-width: 1200px;position: relative; 
  position: relative;
  display: block;
  }


body.home {}

header {}
.navbar-header {}
.navbar-header{}
.navbar-header .brand{width: 100%; text-align: left;display:inline-block;margin-top: 0px;}
.navbar-header .brand img{max-width: 240px;height: auto;} 
.navbar-toggle {float: right;margin-top: 15px;}

#header .brand {padding-top:15px;    display: block;}
#header .brand img{width: 250px;height:auto;}

#navbarSupportedContentMobile {flex-direction: row-reverse}


.dropdown-menu {background: rgba(230,30,107,.53)!important;color: #ffffff;    min-width: 200px;text-align:center;}
.dropdown-item:hover, .dropdown-item:focus {color: #ffffff;
background-color: rgba(230,30,107,.53)!important;}

#btn-coll-cont {width: 100%; padding: 5px; border: 0; background: #000;  margin: 10px 0 0 0;}

#top_header {background: #585f4f; width: 100vw;
        padding: 5px 45px;  margin: 0;color: #ffffff;
		font-size: 14px;
		font-family:'canada-type-gibson';
		height:30px;
		-webkit-transition: opacity 0.5s, height 1s;
		transition: opacity 0.5s, height 1s;
		}
#top_header a{color: #ffffff;}
.fixed #top_header {opacity:0;height:0;}
#navfluid {}
#navfluid .col-md-9 {text-align:right;padding-top:10px;font-size: 14px;font-family: 'Campton-Medium';}

.navmenu-fixed-right {
   left: auto !important;
}
#header {font-size: 15px; font-weight: 100;    width: 100vw;
    padding: 0;    margin: 0;
	border-bottom: 3px solid transparent;
	transition: all 1s;
	}
#header.fixed{border-bottom: 1px solid #585f4f;background: #ffffff; }

div.wpcf7-mail-sent-ok {
    border: none!important;
    float: left!important;
    font-size: 24px!important;
    text-align: center;
}

#overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0; 
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5); /* Black background with opacity */
    z-index: 99998; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
}

#navfluid a.nav-link {color:#585f4f;font-family:'canada-type-gibson'; font-weight: normal;font-size: 16px;    padding: 20px 20px;}

ul.cnss-social-icon {display: flex;float: left;    margin-top: 17px;margin-left: 10px;}

#navfluid {/* padding-top: 15px;padding-bottom: 10px;  */}

.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(122, 109, 69, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar-toggler {padding: 6px 10px;}
.navbar-toggler-icon {
    width: 1em;
    height: 1em;
}

footer {font-size: 13px;}
footer #topfooter {padding: 40px 0 10px;background:#585f4f; color: #fff;}
footer a{text-decoration: none;color: #fff;font-size: 13px;}
footer a:hover{color: #fff;}
footer .fright {text-align:right;padding-top: 83px;}
footer .fleft .brand {margin-bottom:30px;}

footer .fright ul.cnss-social-icon li.cn-fa-icon a {background: transparent!important; color:#000!important;}
footer .fright ul.cnss-social-icon {float: none; display: inline-block;}
  /* HOME */

  h2 {font-weight: bold; font-size: 30px;color: #585f4f;letter-spacing:1px}
  #home1 {background: url(images/h1bg.jpg) no-repeat center center;background-size: cover;}
  #h1contentl,#h1contentr {min-height: 100vh;}
  #h1contentl img{display: none;}
  #h1contentr h2{color: #ffffff;}
  
  @media (max-width:767px) {
	  #home1 {background: url(images/h1bgmobile.jpg) no-repeat center center;background-size: cover;min-height: 100vh;}
	  #h1contentl {min-height: 66vh;padding-bottom:40px;}
	  #h1contentr {min-height: 0;padding-bottom:40px;padding-top:40px;background:rgba(255,255,255,.8)}
	  /* #h1contentl img{display: block;margin-top: 100px;max-width:100%;} */
	  #h1contentr h2{color: #585f4f;}
	  #h1contentr h2 br{display: none;}
  }
  
  #h1contentr p{    max-width: 300px;}
  #h1contentr a{border: 1px solid #f0e01f; border-radius:25px;display: inline-block;padding:10px 25px;
  color: #585f4f; font-size:16px;font-family:"proxima-nova";font-weight:700;transition: all .5s;-webkit-transition: all .5s;
  background: #f0e01f;
  }
  #h1contentr a:hover{background: #585f4f; color: #fff;text-decoration: none;}
  
  #home2 {background: url(images/h2bg.jpg) no-repeat center center;background-size: cover;}
  
  #h2contentl,#h2contentr {min-height: 100vh;}
  
  #h2contentl p{    max-width: 470px;font-size:15px;font-weight: 300;}
  #h2contentl a{border: 1px solid #585f4f; border-radius:25px;display: inline-block;padding:10px 25px;
  color: #585f4f; font-size:16px;font-family:"proxima-nova";font-weight:700;transition: all .5s;-webkit-transition: all .5s;}
  #h2contentl a:hover{background: #585f4f; color: #fff;text-decoration: none;}
  
  /* #home3 {background: url(images/h3.jpg) no-repeat center center;background-size: cover;background-attachment:fixed;} */
  #home3 {background: transparent;}
  
  #h3content {min-height: 50vh;}
  #h3content  h2 {color: #ffffff;letter-spacing:2px}
  
  
  #h4contentl,#h4contentr {min-height: 100vh;}
  
  #h4contentl img {    max-width: 100%;
    margin-top: -50vh;}
	
  #h4contentr p{    max-width: 470px;font-size:15px;font-weight: 300;}
  #h4contentr a{border: 1px solid #585f4f; border-radius:25px;display: inline-block;padding:10px 25px;
  color: #585f4f; font-size:16px;font-family:"proxima-nova";font-weight:700;transition: all .5s;-webkit-transition: all .5s;}
  #h4contentr a:hover{background: #585f4f; color: #fff;text-decoration: none;}
  
  #home5 {background: url(images/h5bg.jpg) repeat-x 0 0;}
  #h5contentl,#h5contentr {min-height: 80vh;}
  #h5contentl address{padding-left:48px;margin-bottom:25px}  
  #h5contentl h2{ margin-bottom:45px;} 
  #h5contentl h3{  
	font-size: 18px;
    font-weight: 600;
	margin: 0;
	padding-left:48px;
	
	}
  #h5contentl address h3{padding-left:0;}  
	 #h5contentl a{border: 1px solid #585f4f; border-radius:25px;display: inline-block;padding:10px 25px;
  color: #585f4f; font-size:16px;font-family:"proxima-nova";font-weight:700;
  margin: 30px 48px;transition: all .5s;-webkit-transition: all .5s;}
  #h5contentl a:hover{background: #585f4f; color: #fff;text-decoration: none;}
  
	#h5contentl address.address {background: url(images/icomarker.svg) no-repeat 14px 0;background-size:18px auto;}
	#h5contentl address.phone {background: url(images/icophone.svg) no-repeat 14px 0;background-size:24px auto;}
	#h5contentl address.mail {background: url(images/icomail.svg) no-repeat 14px 0;background-size:24px auto;}
	
	
	#contactform {width:767px;max-width:90%;}
	#contactform fieldset {padding: 40px 60px;}
	
	#contactform label {font-size:14px;}
	#contactform label a{color: #585f4f;}
	#contactform .form-control {border: 1px solid #000;font-size: 14px;}
	#contactform .wpcf7-submit {border: 1px solid #585f4f;background: #585f4f; padding:7px 35px;
  color: #ffffff; font-size:14px;font-family:"proxima-nova";
  transition: all .5s;-webkit-transition: all .5s;    float: right;}
  
	#contactform ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
		color: #000;
		opacity: 1; /* Firefox */
	}
	#contactform :-ms-input-placeholder { /* Internet Explorer 10-11 */
		color: #000;
	}
	#contactform ::-ms-input-placeholder { /* Microsoft Edge */
		color: #000;
	}
  
  #legal1 {padding-top:200px;}
  
	
@media (min-width: 900px) {
	#home5 .relative{
		position: relative;
	}
	#h5contentr{
		position: absolute;
	}
	#h5contentr iframe{width:50vw;height:80vh;}
	#h5contentr{
		left: 48%;
		right: 0;
	}
}
	
  .wpcf7-not-valid-tip {    color: #ad463e;}
  .mobile {display: none;}

 /* responsive */
 

@media (min-width: 900px) {
	
}
@media (max-width: 1024px) {
	
}
@media (max-width: 768px) {
    
	#navfluid .brand{max-width:60%;float: left;}
	
	#navfluid a.nav-link {padding: 5px 15px;}
	
	#primary-menu li {
    float: none;
    width: 100%;
    text-align: center;
	}
	
	/* .navbar-dark .navbar-toggler {position: absolute;    top: 0;    right: 0;border-color: #7a6d45;} */
	 .navbar-dark .navbar-toggler {border-color: #585f4f;float:right;margin-top: 5px;margin-bottom: 5px;}
	#header {background: #ffffff;}
	
	#h4contentl,#h4contentr {min-height: 0;padding-top:40px;padding-bottom:40px;}
}
@media (max-width: 480px) {
	.navbar-fixed-top {position:relative!important;}
	
	.col-xs-0 {display: none;}
	
	#header-social {display: none;}
	
	img {max-width: 100%;}
	
	body {overflow-x: hidden;}
	.mobile {display: block;}
	
	footer .fright {padding-top: 0px;}
	
	#primary-menu {    padding-left: 15px;}	
	.navbar {margin-bottom: 0;}
	nav .row {width:100%;}
	/* #navfluid .col-md-3{  display: none;} */
	/* .navbar-dark .navbar-toggler {position: absolute;    top: 8px;    right: 0;border-color: #7a6d45;} */

	
	#navfluid span{}
	#navfluid a{ margin-left: 15px;margin-top: 0px;}
	#navfluid a img{width: 100%;}
	#primary-menu li {float: none;width: 100%;text-align: center;}
	 #home2  {background: none;}
	 #h2contentr  {display: none!important;}
	 #h4contentl img {margin-top: 0;}
}
 
@media (max-width: 480px) {
	.aleft {text-align: center!important;}
	.aright {text-align: center!important;}
}

@media (max-width: 320px) {
	 
	.mobile {display: block;}
	
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 2/3)
{
    #header {position:relative;}
}
