

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
@font-face {
    font-family: 'BrownStd';
    src: url('../fonts/BrownStd-Bold.woff2') format('woff2'),
        url('../fonts/BrownStd-Bold.woff') format('woff'),
        url('../fonts/BrownStd-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'BrownStd';
    src: url('../fonts/BrownStd-Regular.woff2') format('woff2'),
        url('../fonts/BrownStd-Regular.woff') format('woff'),
        url('../fonts/BrownStd-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Garamond Premiere Pro';
    src: url('../fonts/GaramondPremrPro.woff2') format('woff2'),
        url('../fonts/GaramondPremrPro.woff') format('woff'),
        url('../fonts/GaramondPremrPro.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Garamond Premiere Pro';
    src: url('../fonts/GaramondPremrPro-Bd.woff2') format('woff2'),
        url('../fonts/GaramondPremrPro-Bd.woff') format('woff'),
        url('../fonts/GaramondPremrPro-Bd.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}


body,html {
  font-family: 'BrownStd';
    padding-top: 0px;
    padding-bottom: 0px;
    width: 100%;

}
html{scroll-behavior: smooth;}

h1{font-family: 'Garamond Premiere Pro';}



.jumbotron h1{color:#fff; text-transform: uppercase; font-size: 4em; padding-left: 10px; margin-bottom: 0;}

.jumbotron .subtitulo{color: #fff; padding-left: 10px; margin-top: 15px; margin-bottom: 15px; font-size: 1.7em;}

.jumbotron {
    padding: 100px 0;
    margin-bottom: 0px;
    background-image: url(../assets/images/header.jpg);
    background-size: cover;
}


.cinto{padding: 20px; background-color: #1d1d1b; text-align: center; text-transform: uppercase; color: #edd799; font-size: 30px; letter-spacing: 2px;}

.bloque-desarollo{min-height: 300px;}

.colu-1{ background-color: #fff;}
.z2{z-index: 2;}
.nopaddingleft{padding-left: 0px;}
.nopaddingright{padding-right: 0px;}
.colu-1 img{width: 110%; -webkit-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15);
box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15); }
.colu-2-alt img{width: 110%; margin-left:-10%; -webkit-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15);
box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15); }
.colu-2-alt{background-color: #f9f5e7;}
.colu-2{background-color: #f9f5e7; padding:5% 5% 5% 10%; }
.colu-1-alt{padding:5% 7% 5% 5%; }

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
  flex-wrap: wrap;
}

.ds-vertical-align {
display: flex;
flex-direction: column;
justify-content: center;
}

.logo_cont{padding:40px 0;}
.logo_cont img{max-width: 130px;}

.info h1{font-size: 1.6em; margin: 10px 0 0 0;}
.info h2{font-size: 1.2em; margin: 10px 0 0 0;}
.info {font-size: 1.2em;}
.info ul{padding: 40px 20px 40px 20px;}
.info li{margin-bottom: 5px; list-style-image:url(../assets/images/bullet_12.png);}


.bot_contacto button{width: 250px; text-transform: uppercase; background-color:#edd799; -webkit-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15); margin-bottom:10px;
-moz-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15);
box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15); padding:6px 12px; border:none; color: #000; font-size: 18px; }

.info button:hover{background-color: #b2a072;}

.row .i4ewOd-pzNkMb-haAclf {
    background-color: #000 !important;);
    display: none !important;
}


.nosho{display: none;}
.forma input, .forma select{margin:10px; padding: 5px; border:none; text-transform: uppercase;}
.forma select{ height: 30px; }
.forma{width: 45%;}
.forma .half{width: 44%; }
.forma .full{width: 93%;}

.botonenv {width: 150px; text-transform: uppercase; background-color:#edd799; -webkit-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15); -moz-box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15);
box-shadow: 5px 5px 8px 0px rgba(0,0,0,0.15); padding:10px 14px; border:none; color: #000; font-size: 18px; }




.row:before, .row:after {display: none !important;}


.foot{padding: 20px 0; background-color: #000 !important; text-align: center; }

.foot img{width: 150px; cursor: pointer;}

.mata1{
  width: 200px;
  right: 0;
  margin-right: -50px;
  position: absolute; 
  z-index: 10;
  animation-duration: 30s !important;
  animation-iteration-count: infinite;
}

.mata2{
  width: 150px;
  left: 38%;
  top: 56%;
  margin-right: -50px;
  position: absolute; 
  z-index: 0;
  animation-duration: 30s !important;
  animation-iteration-count: infinite;
}

.mata3{
  width: 200px;
  right: 0;
  top: 50px;
  margin-right: -80px;
  animation-delay: 3s;
  position: absolute; 
  z-index: 10;
  animation-duration: 30s !important;
  animation-iteration-count: infinite;
}


section{position: relative; overflow: hidden;}


.direcciones{padding-bottom: 20px;}
.direcciones h4{margin-bottom: 0;}


.modal-dialog {
    width: 60%; 
}
.modal-body{ padding: 0px;}

.modal-dialog button.close {

    -webkit-appearance: none;
    position: absolute;
    right: 5px;
    opacity: 1;
  font-size: 30px;
    padding: 0 5px; z-index: 10;
  }



/* Smartphones in portrait mode (0-479px) */
@media only screen and ( max-width: 479px ) {
  .modal-dialog {
    width: 95%; 
    margin:100px auto !important;
}
.modal-body{ padding: 0px;}
    /* your css goes here */
    .colu-2-alt img, .colu-1 img{width: 100%; padding: 0px;}
    .colu-2-alt img{ margin-left:0; }
    .nopaddingright, .nopaddingleft{padding-right: 0; padding-left: 0;}

    .forma .half{width: 96%; }
    .forma{width: 100%; text-align:  center;}
   .botonenv {float: none; margin:20px !important;}
   .jumbotron{background-position: -750px;}
   .info{text-align: center;}
   .info li{list-style: none;}
   .colu-2{background-color: #f9f5e7; padding:5% 5% 5% 5%; }
.colu-1-alt{padding:5% 5% 5% 5%; }
.info button{margin:5px; auto;}

.colu-1, .colu-2-alt{padding: 0 0 0 0 !important;}

.colu-2, .colu-1-alt{padding: 60px}
.logo_cont{padding:20px 0 40px 0;}

.reversa{display: flex; flex-direction:column-reverse;}

.jumbotron h1{font-size: 3em; }

.mata1{top:50%; z-index: 1; width: 150px;}
.mata2{top:50%; z-index: 1; width: 150px; left: 90%;}
.mata3{top:50%; z-index: 1; width: 150px;}
}








