@font-face {
    font-family: "SohoGothicPro-Medium";
    src: url("../font/SohoGothicPro-Medium.otf");
  }

  @font-face {
    font-family: "SohoGothicPro-Bold";
    src: url("../font/SohoGothicPro-Bold.otf");
  }


  body {font-family: "SohoGothicPro-Medium" }

.SohoGothicStd-Medium { 
  font-family: SohoGothicStd-Medium;
  font-weight: normal;
  font-style: normal;
}
.SohoGothicStd-Light { 
  font-family: SohoGothicStd-Light; 
  font-weight: normal;
  font-style: normal;
}
.SohoGothicStd { 
  font-family: SohoGothicStd;
  font-weight: normal;
  font-style: normal;
}


  h1 {font-size: 40px}
  h2 {font-size: 30px;text-align: center; color:#858260; margin-bottom: 30px}
  h2 span {font-family:"SohoGothicPro-Bold" }
  a {transition: 0.5s all}

.navbar-brand img {transition: 0.5s all}
.navbar-brand img:hover {opacity: 0.7;  }

  /*Header*/
  #navbar {
  z-index: 10000 !important;
  position: sticky; /* Make it stick/fixed */
  top: 0; /* Stay on top */
  width: 100%; /* Full width */
  transition: top 0.3s; /* Transition effect when sliding down (and up) */
z-index: 10;
box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.1)
}

  /*Top Bar*/
  .top-bar ul {text-align: right; margin-bottom: 0px; padding: 5px}
  .top-bar li {display: inline-block;}
  .col-redes {background: #e1e1df}
  .list-redes li a {text-decoration: none; color: #3c3c3b; font-size: 12px; text-transform: uppercase;}
  .list-redes li a:hover {color: #858260}
  .list-redes li {margin:0px 10px}
  .list-redes i {font-size: 15px;}
  .list-idiomas {font-size:12px;color: #fff; padding: 5px !important;}
  .col-search {background: #b6b6b5; padding: 5px; transition: 0.5s all;}
  .col-search:hover {background: #858260;}
  .col-idiomas {background:#a1a0a0 }
  .list-idiomas {text-align: center!important;}
  .list-idiomas li {margin: 2px 5px;}
  .list-idiomas li a{text-decoration: none; color: #ffff; font-size: 12px; text-transform: uppercase;font-family: "SohoGothicPro-Medium";font-weight: 100 !important;}
  .list-idiomas li a:hover {color: #3c3c3b}
   .list-idiomas li a:active {color: #3c3c3b}



.list-redes li a{font-family: "SohoGothicPro-Medium";font-weight: 100 !important;}

/*Buscador*/
.message {
background:#b6b6b5;
color:#FFF;
position: absolute;
top: -250px;
left: 0;
width: 100%;
height: 150px;
padding: 20px;
transition: top 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
overflow: hidden;
box-sizing: border-box;
z-index: 10
  
}


#toggle {
  position:absolute;
  appearance:none;
  cursor:pointer;
  left:-100%;
  top:-100%;
}

#toggle + label {
  cursor:pointer;
width: 100px;
border-radius: 3px;
color: #FFF;
font-size:15px;
text-align:center;
-webkit-font-smoothing: antialiased;
cursor: pointer;
  transition:all 500ms ease;
}


#toggle:checked ~ .message {
  top: 0;
}



#toggle:checked + label:after {
	position: absolute;
  content:"X";
  z-index: 12;
  right: 15px;

}


.input-search {
	width: 80%;
	background: none;
	border:none;
	padding: 30px 30px 15px 0px;
	color: #fff;
	border-bottom: 1px solid #fff;
	font-size: 15px

}

.input-search:focus {
	border:none;
	background: none;
	outline:none !important;
    outline-width: 0 !important;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    border-bottom: 1px solid #fff;
}

.input-search::placeholder {
	color: #fff;
	
	
}

.input-search::-ms-clear{
    display: none;
}


.btn-submit {
	width: 10%;
	background: none;
	border:none;
	color: #fff;
	margin-top: 10px;
}

.btn-submit:hover {
	color: #3c3c3b;
}

.btn-submit:focus {
	outline:none !important;
    outline-width: 0 !important;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    color: #3c3c3b;
}




 /* Navbar*/
 .navbar {background: #fff!important; padding: 0px; box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);}
 .navbar .nav-link {text-transform: uppercase; font-size: 14px; color:#3c3c3b!important; margin:0px 15px}
 .navbar .nav-link:hover {color:#858260!important}
 .navbar-light .navbar-toggler {border:none!important;}


  /*Slider Home*/
 	.carousel-item, .carousel-item img {height: 400px; width: 100%; object-fit: cover; position: center center}
  .carousel-item video {height: 400px; width: 100%; object-fit: cover; position: center center}

  	.carousel-caption {top: 15%;text-align: left;left: 8%; max-width: 90%;}
  	.black-overlay {position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; background:rgba(0,0,0,0.3);}
  	.carousel-caption p {margin: 30px 0px 40px 0px ; font-size: 18px;width: 80%;letter-spacing: normal;}
  	.carousel-caption a {font-size: 18px; color: #f7f1c8; text-decoration: none; border-radius: 5px; border:1px solid #f7f1c8; padding: 10px 15px; letter-spacing: normal;}
  	.carousel-caption a:hover {background:#f7f1c8;color: #858260}
  	.carousel-indicators li {width: 10px;height: 10px; border-radius: 100%;}
  	.carousel-indicators {bottom: 30px}


  /*Botonera*/
  	.botonera a {background:#858260;color: #f7f1c8;letter-spacing: normal;padding: 15px 15px 12px 15px;text-transform: uppercase; font-size: 15px; border-bottom: 3px solid #858260;}
  	.botonera a:hover {background: #f7f1c8; color:#858260; border-bottom: 3px solid #858260; }
  	/*.botonera a:hover >  i {margin-left: 10px}*/

.botonera a i {transition: all .35s cubic-bezier(0,0,.2,1); padding-left: 5px; }
.botonera a:hover > i {transition: all .25s ease-in-out; transform: translate3d(15px, 0, 0);}

  	.botonera li {margin: 0px 10px}
  	.botonera {position: relative; top: -30px}


  /*Servicios*/
  .sec-servicios {padding:30px 0px;}
  .circle-img {height: 230px;width: 230px;border-radius: 125px;background-position: center; background-size: cover; margin:0px auto 30px;}


  .sec-servicios h3, .sec-novedades h3 {font-size: 16px; text-transform: uppercase; color: #3c3c3b}
  .sec-servicios p, .sec-novedades p {font-size: 16px;color: #3c3c3b; font-family: SohoGothicStd-Light; }
  .sec-servicios h3 a {color: #3c3c3b}
  .sec-servicios h3 a:hover {color: #858260}

  .sec-servicios .circle-img:hover {transform: scale(1.02);}
  .sec-servicios .circle-img {transition: 0.5s all}



  /*.sec-servicios .circle-img {border:3px solid #fff; transition: 0.5s all}
  .sec-servicios .circle-img:hover {border:3px solid #858260;}*/
  .link-servicios:hover + h3 a {color: #858260!important}

  /*Mauá*/
  .sec-maua {background:linear-gradient(0deg, #1d1d1b, #4a4a49);max-height: 350px;}
  .col-maua {padding: 40px 30px 40px 8%; }
  .col-maua h2 {color: #fff; text-align: left;}
  .col-maua h3 {color:#f8af00; text-transform: uppercase; font-size: 16px; margin-bottom: 15px}
  .col-maua a {color: #1d1d1b; background:#f8af00;text-decoration: none; padding: 10px 15px; border-radius: 5px;border:1px solid #f8af00}
  .col-maua a:hover {border:1px solid #f8af00; color: #f8af00; background:none;}


  .sec-maua .div-video {background: url(../uploads/home/bg-video-home-grupolosgrobo.jpg); min-height: 300px; max-height: 350px; height: 100%; width: 100%; background-size: cover; background-position: center center;}
  .div-video img {position: relative;top: 27%; left: 43%; transition: 0.5s all}
  .div-video img:hover {transform: scale(1.08);}

  #carouselMaua .carousel-item, 
  #carouselMaua .carousel-item img {height: 350px; width: 100%; object-fit: cover; position: center center}
  #carouselMaua .carousel-item video {height: 350px; width: 100%; object-fit: cover; position: center center}



  /*Números*/
  .sec-numeros {padding: 30px 0px;}
  .sec-numeros h3 {font-size: 14px; text-transform: uppercase; color:#f7f1c8; letter-spacing: normal;}
  .sec-numeros h3 span {font-size: 27px}
  .row-num .col-12 {padding: 0px}
  .div-numeros {padding: 15px; display: flex; align-items: flex-end;}
  .num-1 { height: 240px; position: relative; border: 1px solid #fff;}
  


  .num-2 {background: #858260; height: 100px; border: 1px solid #fff;}
  .num-3 {background: #625f45; height: 115px; border: 1px solid #fff;}
  .num-4 {height: 225px; position: relative; border: 1px solid #fff;}
  




  .num-5 {height: 115px; position: relative; border: 1px solid #fff;}
  

  .num-6 {background: linear-gradient(90deg, #949300, #007934); height: 112.5px; border: 1px solid #fff;}
  .num-7 {background: #858260; height: 112.5px; border: 1px solid #fff;}

 /*Las compañías del grupo*/

 .sec-elgrupo {padding: 30px 0px; background:#ededed }
 .sec-elgrupo img {transition: 0.5s all}
 .sec-elgrupo img:hover {filter: grayscale(1); cursor: pointer;}

img.logo-comp {max-height: 70px;}



 /*Novedades*/
 .sec-novedades {padding: 30px 0px; text-align: center;}
 /*.sec-novedades .nov-1 {background-image: url(../images/novedades1.jpg);}
 .sec-novedades .nov-2 {background-image: url(../images/novedades2.jpg);}
 .sec-novedades .nov-3 {background-image: url(../images/novedades3.jpg);}*/
 .sec-novedades a, .sec-servicios a {text-decoration: none; color: #858260}
 .sec-novedades a:hover {color: #625f45}
 .sec-novedades h3 a {color: #3c3c3b}
 .sec-novedades h3 a:hover {color: #858260}
 /*.sec-novedades .circle-img:hover {transform: scale(1.02);}
.sec-novedades .circle-img {transition: 0.5s all}
  .link-novedades:hover + h3 a {color: #858260!important}*/


.w50 { width: 230px; margin: 0px auto 30px auto;}
.nov {
  position: relative;
  width: 50%;

}

.nov-img {
  display: block;
  /*width: 100%;
  height: auto;*/
  width: 230px;
  height: 230px;

}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
   width: 230px;
  height: 230px;
  opacity: 0;
  transition: .5s ease;
  background-color: #000;
  border-radius: 50%;

}

.nov:hover .overlay {
  opacity: .6;
}

.text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  font-size: 16px;
  font-style: normal;
}

.nov:hover {transform: scale(1.02);}
.nov {transition: 0.5s all}


/*Footer de qk
footer {border-top: 5px solid #858260; padding: 15px; background:#ededed;}
ul {list-style: none; padding: 0px}
footer ul li p {margin-bottom: 5px; color: #3c3c3b; font-size: 13px}
.links-list li {display: inline-block; margin: 0px 5px;}
.links-list a {color: #3c3c3b; text-decoration: none; text-transform: uppercase;font-size: 13px}
.links-list a:hover {color:#858260}
*/
#footer {background:url(../images/footerbg.png) repeat-x top #e2e2e1; color:#FFF;min-height:155px; font-size:14px; padding-top:33px; color:#3F4042; vertical-align:top}
#footer p {margin-bottom:14px; font-family: SohoGothicStd;}
#footer p:last-child {margin-bottom:0px;}

#footer .footcol {display:inline-block;width:130px; margin-bottom:20px; text-align:left;margin-left:6px;vertical-align:top; }
#footer a {color:#333; text-decoration: none;}
#footer ul {list-style:none; margin:0px; color:#333;}
#footer ul.footer_menu li {font-size:13px; font-family: SohoGothicStd-Medium; text-transform:uppercase;}
#footer ul.footer_menu_second {padding-top:10px;}
#footer ul.footer_menu_second  li {font-size:12px; font-weight:400; margin-bottom:4px; font-family: SohoGothicStd-Light;}
.footright  {float:right; width:500px; min-height:120px; text-align:right;}
#footer .footright ul.footer_menu {border-bottom:1px solid #BDBDBD; padding-bottom:8px;}
#footer .footright ul.footer_menu li { margin-bottom:8px;font-size:12px; display:inline; padding:0 14px;}
#footer .footright li:last-child {text-transform:none;}
.footsocial {margin-top:-10px; padding-bottom:8px;}
.copyright { padding:6px 0;}


/* ============ SUB MENU ============ */
.dropdown-menu {border: none; box-shadow: 0 6px 20px 0 rgba(18,43,70,.4); margin-top: 8px !important; }
.dropdown-item {text-transform: uppercase;font-size: 14px; text-align: center;}
.dropdown-item:hover {color:#858260 !important; background-color: #fff !important;}
.arrow-top {margin-top: 20px;}
.arrow-top:after {
  content: " ";
  position: absolute;
  right: 135px;
  top: -8px;
  border-top: none;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
  border-bottom: 15px solid white;
}
/* ============ agregado SUB MENU ============ */


/*MEDIA SCREENS*/
/* ============ agregado SUB MENU ============ */
/*tablet y mobile*/
@media only screen and (min-width:100px) and (max-width:991px) {
.dropdown-menu {border-radius: .12rem !important; border: none; box-shadow: none; margin: 0px !important; padding-left: 15px;}
.dropdown-item {text-align: left; color:#797a7a !important;}
.arrow-top:after,.arrow-top:after {display: none;}
.dropdown-toggle:focus {outline: none !important;}
  .dropdown-toggle::after { /*quita la flechita hacia abajo*/
    display: none;
    margin-left: inherit !important;
    vertical-align: inherit !important;
    content: "";
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;}

}  

@media all and (min-width: 992px) {
/*desktop*/
  .navbar .nav-item .dropdown-menu{ margin-left: -90px; display:block; opacity: 0;  visibility: hidden; transition:.3s; margin-top:0;  }
  .navbar .nav-item:hover .nav-link{ color: #fff;  }
  .navbar .dropdown-menu.fade-down{ top:80%; transform: rotateX(-75deg); transform-origin: 0% 0%; }
  .navbar .dropdown-menu.fade-up{ top:180%;  }
  .navbar .nav-item:hover .dropdown-menu{ transition: .3s; opacity:1; visibility:visible; top:100%; transform: rotateX(0deg); }
  .dropdown-toggle::after { /*quita la flechita hacia abajo*/
    display: none;
    margin-left: inherit !important;
    vertical-align: inherit !important;
    content: "";
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;}

    .dropdown-item { /*aire*/}
/*.dropdown-menu {min-width: 300px; max-width: 300px;}*/
.dropdown-menu { text-align: center; width: 100%; padding: 15px 15px; min-width: 300px; max-width: 300px; }
}   
/* ============ agregado SUB MENU ============ */


@media screen and (max-width: 1440px) {
  .carousel-caption p {font-size: 18px}
}

@media screen and (max-width: 1024px) {
  .mid { margin:0 auto; position:relative; width:100%; padding:0 6px;}
}


@media screen and (max-width: 1200px) {
	.botonera a {font-size: 13px}
	.circle-img {width: 200px; height: 200px;}
  .nov-img, .w50, .overlay {width: 200px; height: 200px;}
	.div-video img {top: 40%}
	
}


@media screen and (max-width: 991px) {
  .sec-maua {max-height: none !important;}
  .carousel-caption {max-width: 100%;}
  .botonera {display: block;}
	.botonera a {display: block; margin-bottom: 1px}
	.div-video img {top: 30%;}
	.sec-elgrupo img {width: 200px; margin-top: 30px}
}

@media screen and (max-width: 960px) {
  #footer {
    min-height: 130px;
    font-size: 13px;
    padding: 30px 20px;
  }
}

@media screen and (max-width: 767px){
.sec-maua {max-height: none !important;}
.carousel-caption {max-width: 100%;}
.top-bar ul {text-align: center;}
.btn-submit {
	width: 20%;}
	.input-search {
	width: 70%;}

}


@media screen and (max-width: 575px){
.sec-maua {max-height: none !important;}
.carousel-caption {max-width: 100%;}
.carousel-item, .carousel-item img, .carousel-item video {height: 450px}
.carousel-caption p {width: 100%; font-size: 16px}
.carousel-caption a {font-size: 16px}
.circle-img {
    width: 230px;
    height: 230px;
}
.nov-img, .w50, .overlay {width: 230px; height: 230px;}
h1 {font-size: 30px}
h2 {font-size:25px}
.div-video img {
    top: 40%;
}
.sec-numeros {padding-bottom: 0px}
}

@media screen and (max-width: 375px){
	h1 {font-size: 27px}
	.carousel-caption p {font-size: 15px}
	.links-list li {display: block;}
	.col-maua a {font-size: 13px}
	.list-redes li {margin:0px 7px}
	.btn-submit {
	width: 100%;}
	.input-search {
	width: 100%;}
}

@media screen and (max-width: 320px){
	h1 {font-size: 22px}
	.list-redes li {margin:0px 4px}
}