@font-face {
    font-family:'fira_sansregular';
    src: url('../fontface/firasans-regular.eot');
    src: url('../fontface/firasans-regular.eot?#iefix') format('embedded-opentype'),
         url('../fontface/firasans-regular.woff2') format('woff2'),
         url('../fontface/firasans-regular.woff') format('woff'),
         url('../fontface/firasans-regular.ttf') format('truetype'),
         url('../fontface/firasans-regular.svg#fira_sansregular') format('svg');
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family:'fira_sansmedium';
    src: url('../fontface/firasans-medium.eot');
    src: url('../fontface/firasans-medium.eot?#iefix') format('embedded-opentype'),
         url('../fontface/firasans-medium.woff2') format('woff2'),
         url('../fontface/firasans-medium.woff') format('woff'),
         url('../fontface/firasans-medium.ttf') format('truetype'),
         url('../fontface/firasans-medium.svg#fira_sansmedium') format('svg');
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family:'fira_sansbold';
    src: url('../fontface/firasans-bold.eot');
    src: url('../fontface/firasans-bold.eot?#iefix') format('embedded-opentype'),
         url('../fontface/firasans-bold.woff2') format('woff2'),
         url('../fontface/firasans-bold.woff') format('woff'),
         url('../fontface/firasans-bold.ttf') format('truetype'),
         url('../fontface/firasans-bold.svg#fira_sansbold') format('svg');
    font-weight:normal;
    font-style:normal;
}

html {
    height:100%;
}

* {
    font-smooth:always;
    -webkit-font-smoothing:antialiased;
    font-smoothing:antialiased;
    margin:0;
    padding:0;
    box-sizing:border-box;
    transition:all 150ms linear;
    -webkit-transition:all 150ms linear;
    -moz-transition:all 150ms linear;
    -o-transition:all 150ms linear;
    -ms-transition:all 150ms linear;
}

body {
    min-width:320px; 
    font-family:'fira_sansmedium', Arial, Helvetica, sans-serif;
    font-size:16px;
    line-height:20px;
    color:#FFF;
    background:#140721;
}

img {
    margin:0;
    padding:0;
    border:none;
}

a {
    text-decoration:none;
    outline:none;
    color:#FFF;
}

h1, h2, h3, h4 {
    margin:0;
    padding:0;
    border:0;
    font:inherit;
    font-size:100%;
    font-weight:normal;
    vertical-align:baseline;
}

p {
    margin:0;
    padding:0;
}

.contenedor {
    position:relative;
}

.clear {
    clear:both;
}

header {
    position:absolute;
    width:100%;
    padding-top:160px;
    z-index:1;
}

.centrador {
    width:100%;
    max-width:1600px;
    text-align:center;
    margin:auto;
    padding:0 40px;
}

.logo {
    float:left;
    width:280px;
}

.slogan {
    float:right;
    font-family:'fira_sansbold', Arial, Helvetica, sans-serif;
    font-size:28px;
    line-height:30px;
    text-align:left;
    color:#FFF;
    /*color:#000;*/
    margin-top:11px;
    margin-right:24%;
}

.slogan span {
    display:block;
}

footer {
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:100px;
    background:#140721;
    z-index:2;
}

footer .centrador {
    max-width:1920px;
    padding:27px 40px 0;
}

.left {
    float:left;
}

.right {
    float:right;
}

.btn {
    display:inline-block;
    font-size:0;
    margin-right:60px;
}

.cl {
    display:inline-block;
}

.right .btn.sobre {
    margin-right:0;
}

.boton {
    display:inline-block;
    font-family:'fira_sansmedium', Arial, Helvetica, sans-serif;
    font-size:20px;
    text-decoration:none;
    color:#FFF;
}

.ico {
    display:inline-block;
    margin-right:5px;
    margin-bottom:-8px;
    border:none;
    background-size:contain;
    background-repeat:no-repeat;
}

.btn.tel .ico {
    width:30px;
    height:30px;
    margin-right:10px;
    background-image:url('../imgs/ico-tel_1.svg');
}

.btn.pin .ico {
    width:30px;
    height:30px;
    margin-right:9px;
    background-image:url('../imgs/ico-pin_1.svg');
}

.btn.sobre .ico {
    width:28px;
    height:28px;
    margin-right:9px;
    margin-bottom:-6px;
    background-image:url('../imgs/ico-sobre_1.svg');
}

.btn.tel:hover .ico {
    background-image:url('../imgs/ico-tel_2.svg');
}

.btn.pin:hover .ico {
    background-image:url('../imgs/ico-pin_2.svg');
}

.btn.sobre:hover .ico {
    background-image:url('../imgs/ico-sobre_2.svg');
}

.btn:hover .boton {
    color:#EC3524;
}


/*/// PORTADA ///*/

.ClipPortada {
    position:relative;
    max-width:1920px;
    margin:-100px auto 0;
    overflow:hidden;
}

.s_container {
    width:100%;
    overflow:hidden;
}

.s_foto_fondo {
    position:absolute;
    width:100%;
    background-image:url('../imgs/desktop.jpg');
    background-size:cover;
    background-position:right bottom;
    z-index:0;
}

.thumb {
    display:none;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    border:none;
}


/*/// Queries ///*/

@media screen and (max-width:1690px) {
    header { padding-top:140px; }
    .centrador { padding:0 50px; }
    .logo { width:260px; }
    .slogan { margin-top:6px; margin-right:26.5%; }
}

@media screen and (max-width:1390px) {
    .slogan { margin-right:34.5%; }
}

@media screen and (max-width:1270px) {
    .logo { width:240px; }
    .slogan { font-size:25px; line-height:26px; /*color:#000;*/ margin-right:30%; }
}

@media screen and (max-width:1023px) {
    header { position:relative; padding-top:0; margin:auto; }
    .centrador { padding:20px 20px; }
    .logo { display:block; float:none; width:220px; margin:40px auto 0; }
    .slogan { float:none; font-family:'fira_sansregular', Arial, Helvetica, sans-serif; font-size:20px; line-height:25px; text-align:center; margin:15px auto 45px; }
    .slogan span { display:inline-block; }
    .ClipPortada { display:none; }
    .thumb { display:block; }
    footer { position:relative; }
    footer .centrador { padding:27px 20px 0; }
}

@media screen and (max-width:767px) {
    .logo { width:180px; margin:30px auto 0; }
    .slogan { font-size:17px; margin:15px auto; } 
    .left { float:none; }
    .right { float:none; padding-bottom:40px; }
    .btn { margin-right:0; margin-bottom:28px; }
    .cl { display:block; }
    .btn.tel .ico { width:26px; height:26px; margin-right:10px; }
    .btn.pin .ico { width:29px; height:29px; margin-right:8px; margin-bottom:-7px; }
    .btn.sobre .ico { width:26px; height:26px; margin-right:12px; }
    footer { padding-top:18px; }
}

@media screen and (max-width:359px) {
    .logo { width:150px; }
    .slogan { font-size:16px; }
    .boton { font-size:18px; }
}