body
{
    font-family:'Raleway';
    max-width: 100%;
}
a,a:hover
{
    color:inherit;
    text-decoration:none;
}
.container
{
    padding:0 60px;
}
#Menu
{
    position:fixed;
    height:100%;
    width:60px;
    text-align:center;
    background-color:#1f1f4f;
    padding:40px 0;
    z-index: 1111;
}
#Slider
{
    height:100%;
    background-size: cover;
    background-position: center;
}
#Slider .container
{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    text-align:center;
    height:100%;
    color:white;
}
#Slider .container .caption
{
    display:flex;
    flex-direction:column;
    justify-content:space-around;
    align-items:center;
    height:100%;
    padding: 70px 0;
}
#Slider .container p 
{
    width:70%;
    margin: 0 auto;
}
#Slider .container h1 
{
    font-family:'Lora';
    font-size:45px;
    letter-spacing:5px;
    /* margin-bottom:40px; */
    margin-top: 45px;
}
#logo 
{
    /* margin-bottom: 12%; */
}
#Slider .container p 
{
    font-size:22px;
    line-height:35px;
}
#Slider hr 
{
    width:40px;
    height:3px;
    background-color:white;
    border:none;
    display:block;
    margin-top:100px;
}
#Slider .container > a img 
{
    position:absolute;
    bottom: 60px;
    left: calc(50% - 13px);
}
h2
{
    font-family:'Lora';
    font-size:35px;
    letter-spacing:3px;
    color:#272727;
    font-weight:normal;
    margin-bottom:40px;
    width:fit-content;
    margin:auto;
    position:relative;
}
h2:before
{
    content:'';
    position:absolute;
    width:45px;
    height:2px;
    top:50%;
    background-color:#1f1f4f;
    left:-70px;
}
h2:after
{
    content:'';
    position:absolute;
    width:45px;
    height:2px;
    top:50%;
    background-color:#1f1f4f;
    right:-70px;
}
#Areas
{
    min-height:100%;
    display:flex;
    align-items:center;
    text-align:center;
}
#Boxs
{
    display:flex;
    justify-content:space-between;
}
#Areas h2 
{
    margin-bottom:50px;
}
#Areas img 
{
    display:block;
    margin:auto;
}
#Areas
{
    font-size:18px;
    color:#646464;
    padding: 70px 0;
}
#Boxs
{
    margin-top:100px;
}
#Boxs b 
{
    font-family:'Lora';
    font-weight:normal;
    font-size:26px;
    letter-spacing:4px;
    margin-bottom:15px;
    display:block;
}
#Boxs .ico 
{
    height:150px;
    display:flex;
    justify-content:center;
    align-items:center;
}

#Boxs hr 
{
    width:25px;
    height:2px;
    display:block;
    border:none;
    background-color:#1f1f4f;
}
#Nosotros
{
    min-height:100%;
    display:flex;
    align-items:center;
    color:white;
    position:relative;
    text-align:center;
    background-size:cover;
    background-position:center;
    padding: 70px 0;
}
#Nosotros:before{
    background-color:#1f1f4fab;
    z-index:1;
    position:absolute;
    width:100%;
    height:100%;
    content:'';
}
#Nosotros * 
{
    position:relative;
    z-index:2;
}
#Nosotros h2 
{
    color:white;
    margin-bottom:40px;
}
#Nosotros h2:before,#Nosotros h2:after
{
    background-color:white;
}
#Nosotros .texto
{
    font-family:'Lora';
    text-transform:uppercase;
    letter-spacing:3px;
    font-size:24px;
    padding:0 20px;
    line-height:40px;
    margin-bottom:80px;
}
#Nosotros .flex > div 
{
    width:48%;
    text-align:justify;
    font-size:20px;
    line-height:35px;
}
#Nosotros .flex
{
    justify-content:space-between;
    align-items:center;
}
#Clientes
{
    min-height:100%;
    display:flex;
    align-items:center;
    width: 100%;
    padding-bottom: 50px;
}
#Clientes .flex > div:first-child
{
    width:30%;
    border-left:4px solid #1f1f4f;
    font-family:'Lora';
    padding:30px;
}
#Clientes .flex > div:last-child
{
    width:60%;
    min-width: 600px;
}
#Clientes .flex
{
    justify-content:space-between;
    align-items: center;
    width: 100%;
}
#Clientes .flex > div:first-child span 
{
    font-size:24px;
    letter-spacing:1px;
    display:block;
}
#Clientes .flex > div:first-child b 
{
    font-size:40px;
    font-weight:normal;
    letter-spacing:2px;
    margin-top:-5px;
    display:block;
}
#Clientes .item 
{
    /* display:flex; */
    justify-content:space-between;
    align-items:center;
}
#Clientes .item.active
{
    display:flex;
}
#Clientes .item > div:first-child
{
    width:30%;
    background-size:cover;
    height:200px;
    background-position:center;
}
#Clientes .item > div:last-child
{
    width:63%;
    background-size:cover;
    color:#646464;
    background-position:center;
    font-size:20px;

}
#Clientes .item > div:last-child span 
{
    font-weight:Bold;
    font-family:'Lora';
    font-size:16px;
    color:#1f1f4f;
}
#Clientes .item > div:last-child b 
{
    font-weight:normal;
    display:block;
    font-family:'Raleway';

}
.owl-theme .owl-controls .owl-buttons div
{
    background-color:transparent!important;
    opacity:1!important;

}
.owl-pagination
{
    display:none;
}
.owl-buttons
{
    margin-top:30px;
}
#Actualidad
{
    background-image:url(../img/bgActualidad.png);
    background-color:#f3f3f3;
    min-height:100%;
    display:flex;
    align-items:center;
    padding: 70px 0;
}
.blog
{
    display:flex;
    justify-content:space-between;
}
.blog li 
{
    width:49%;
    display:flex;
    justify-content:space-between;
    margin-bottom: 20px;
}
#Actualidad h2 
{
    margin-bottom:60px;
}
.blog li > div:first-child
{
    width:40%;
    height:300px;
}
.blog li > div:last-child
{
    width:55%;
    text-align:justify;
    font-size:16px;
    color:#666;
    line-height:26px;
}
.blog h4
{
    font-family:'Lora';
    font-size:24px;
    color:#666;
    font-weight:normal;
    margin-bottom:0;
}
.blog .fecha
{
    font-style:italic;
    display:block;
    padding:20px 0;
    font-size:15px;
    color:#666;
}
.blog li > div:last-child button
{
    display:block;
    width:100%;
    background-color:transparent;
    border:none;
    border-bottom:6px solid #1f1f4f;
    color:#1f1f4f;
    text-align:left;
    font-weight:bold;
    padding:20px 0px;
}
#Actualidad .todas
{
    font-family:'Lora';
    letter-spacing:2px;
    font-size:16px;
    color:#666;
    text-align:center;
    padding-top:40px;
}
#SContacto
{
    min-height:100%;
    color:white;
    display:flex;
    align-items:center;
    background-size:cover;
    background-position:center;
    padding: 70px 0;
}
#SContacto h2
{
    color:white;
}
#SContacto h2:before,#SContacto h2:after
{
    background-color:white;
}
#SContacto .texto
{
    padding:60px;
    text-align:center;
    font-size:20px;
    width:80%;
    margin:auto;
}
#SContacto form input,#SContacto form textarea
{
    border:1px solid white;
    background-color:transparent;
    padding:10px 20px;
    font-family:'Lora';
    font-size:16px;
    margin:10px 0;
}
#SContacto form *::placeholder
{
    color:white;
    text-transform:uppercase;
}
#SContacto form input
{
    width:32%;
}
#SContacto form 
{
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    width:90%!important;
    margin:auto;
}
#SContacto form textarea
{
    width:100%;
}
form *:focus
{
    outline:none;
}
#SContacto form input[type="submit"]
{
    width:fit-content;
    margin:10px auto;
}
footer
{
    padding:100px 0;
    text-align:Center;
}
footer span 
{
    display:block;
    font-family:'Lora';
}
footer .rrss
{
    padding:30px 0;
    margin-bottom:30px;
}
footer span.direccion
{
    color:#1f1f4f;
    font-size:22px;
    font-weight:bold;
}
footer span.telefono
{
    color:#666;
    font-size:30px;
    margin:20px 0;
}
footer span.email
{
    font-size:18px;
    color:#666;
}
.modal-content
{
    /* min-width:900px; */
    padding:40px;
}
.modal-dialog
{
    min-width:900px;
    /* height:100%; */
}
.modal-content ul li 
{
    width:45%;
    position:relative;
    
    padding:10px 0;
    padding-left:40px;
}
.modal-content ul 
{
    display:flex;
    flex-wrap:wrap;
    text-align:left;
    justify-content:space-between;
    list-style: none;
    padding-left: 0;
}
.modal-content ul li:before
{
    content:'';
    position:absolute;
    width:26px;
    background-repeat:no-repeat;
    height:30px;
    left:0;
    background-image:url(../img/tick.png);
}
.blog .modal h2 
{
    font-size:25px;
    letter-spacing:1px;
}
.blog .modal 
{
    text-align:center;
}
#MenuAb
{
    position:fixed;
    height:100%;
    width:25%;
    background-color:#1f1f4f;
    z-index:100;
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-left:-25%;
    transition:0.5s;
    z-index: 222222;
}
#MenuAb.abierto
{
    margin-left:0;
}
#MenuAb > a 
{
    position:absolute;
    top:20px;
    right:20px;
}
#MenuAb
{
    font-family:'Lora';
    font-size:20px;
}
#MenuAb li 
{
    padding:15px 0;
}
.nuevas
{
    width:100%;
    display: none;
}
.navbar-nav > li > a
{
  padding:0;
  background-color:transparent!important;
  cursor: pointer;
  text-align: center;
  position: relative;
}
.flechas
{
    position: relative;
    bottom:0;
    width: 100%;
    display: flex;
    justify-content: center;
}
.flechas img 
{
    /* width:20px; */
    /* height: 20px; */
}
.carousel
{
    position:relative;
}
.carousel-control
{top: 50px;opacity: 1;text-shadow: none;background-image: none!important;position: relative;width: 35px;}
/* Responsive */
@media (max-width: 768px) {
    #Boxs
    {
        flex-wrap:wrap;
        margin-top: 30px;
    }
    #Boxs > div 
    {
        width:100%;
    }
    .flex
    {
      flex-direction:column;
    }
    #Clientes .flex > div:last-child,#Clientes .flex > div:first-child
    {
        width:100%;
    }
    #Menu 
    {
        width:100%;
        height: 54px;
        padding: 0;
        position: fixed;
        top: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 10000;
    }
    #Slider .container h1
    {
        font-size:25px;
        letter-spacing:2px;
    }
    #logo{
        margin-bottom:20px;
    }
    #Slider .container p
    {
        font-size:16px;
        line-height:22px;
    }
    #Slider hr
    {
        margin-top:40px;
    }
    h2 
    {
        font-size:24px;
        letter-spacing:2px;
    }
    h2:before
    {
        left:-30px;
        width:20px;
    }
    h2:after
    {
        right:-30px;
        width:20px;
    }
    #Areas 
    {
        padding:70px 0;
    }
    #Nosotros
    {
        padding:70px 0;
    }
    #Nosotros .texto
    {
        font-size:16px;
        letter-spacing:1px;
        line-height:24px;
        margin-bottom: 30px;
    }
    #Nosotros .flex > div
    {
        width:100%;
        font-size:14px;
        line-height:20px;
    }
    #Clientes .flex > div:first-child
    {
        margin-bottom:30px;
    }
    #Actualidad
    {
        padding:70px 0;
    }
    .blog li
    {
        width:100%;
        flex-direction: column;
        padding:30px 0;
    }
    .blog li > div:first-child,.blog li > div:last-child
    {
        width:100%;
    }
    #Actualidad h2
    {
        margin-bottom:20px;
    }
    .modal-dialog
    {
        width: 90%;
        min-width: 97%;
        top: 10%;
        position: fixed;
    }
    #Clientes .container
    {
        width:100%;
    }
    #Clientes .item
    {
        flex-direction:column;
    }
    #Clientes .item > div:first-child
    {
        width:50%;
    }
    #Clientes .item > div:last-child
    {
        width:100%;
        text-align:center;
        margin-top:30px;
    }
    #SContacto{
        padding:70px 0;
    }
    #SContacto .texto
    {
        padding:60px 0;
        font-size:18px;
    }
    #SContacto form input
    {
        width:100%;
    }
    #MenuAb
    {
        width:90%;
        margin-left: -90%;
    }
    .modal-content ul li
    {
        width:100%;
    }
    #Clientes .item 
    {
        flex-direction:column;
        justify-content:center;
    }
    #Clientes .flex > div:last-child
    {
        min-width:initial;
    }
    .modal-content ul
    {
        font-size:13px;
    }
    .modal-content ul li:before
    {
        height:18px;
        background-size:contain;
    }
    .modal-content ul li
    {
        padding:5px 30px;
    }
    .modal-content ul p 
    {
        margin-bottom:0;
    }
    #Areas h2
    {
        font-size:18px;
        margin-bottom:20px;
    }
    .modal-dialog
    {
        overflow-y:scroll;
        height: 80%;
    }

}
button.close
{
    z-index:11111;
    position:relative;
    top: -30px;
    right: -30px;
}