/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */

html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ==========================================================================
   Author's custom styles
   ========================================================================== */
.content {width:960px; margin: auto}
form textarea, form input{box-sizing: border-box; -moz-box-sizing: border-box;}
input, textarea {width: 100%; border: solid 1px #020202; padding: 10px; margin-top: 15px}
a {text-decoration: none;}
a, a:hover, a:active, a:focus {outline:0;}
nav ul {margin: 0; padding: 0; list-style: none;}
nav ul li {display: inline-block;}
img {width: auto; height: auto}
input[type='checkbox'] {display: inline-block; width: inherit;}
input[type='radio'] {display: inline-block; width: inherit;}
h1, h2, h3, h4, h5, h6 { color: #6D6E70}
/*
* {
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;}
*/

body {font-family: 'Open Sans', sans-serif; background: url(../img/iacsa-bg.jpg) right bottom no-repeat; color: #939597; overflow-x: hidden;}
nav {background: #000; height: 45px; border-bottom: solid 2px #fff; text-align: right;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
nav a {margin: 0 20px; height: 35px; padding-top: 10px; display: inline-block; color: #fff; vertical-align: middle; border-bottom: solid 2px #fff;}
nav a:hover {border-bottom: solid 2px #ED1C24; font-weight: bold; }
.logo {margin-left: 40px;}
.opt {float: right; margin: 30px 40px 0 0; display: none;}
.opt a {color: #000}
.lang {margin-right: 5px; padding-right: 10px; border-right: solid 1px #ED1C24}

footer {background: #000; color: #fff; text-align: center; padding: 20px 0; margin-top: 40px; border-top:  solid 2px #ED1C24; font-size: 0.8em}
footer a {color: #fff}
footer p {margin: 0; margin-bottom: 10px}
footer img {margin-right: 5px}

#slider {position: relative; border-bottom: solid 2px #ED1C24}
#slider img {width: 100%}
#slider .frase {background: rgba(193, 38, 45, 0.7); color: #fff; position: absolute; margin-left: -40px; padding: 20px 60px 20px 200px; top: 50%; margin-top: -80px;
-moz-transform: skewX(20deg);
-webkit-transform: skewX(20deg);
-o-transform: skewX(20deg);
-ms-transform: skewX(20deg);
transform: skewX(20deg);
}
#slider .frase h1 {font-size: 1.5em; margin: 0; text-transform: uppercase; color: #fff; font-weight: normal;
-moz-transform: skewX(-20deg);
-webkit-transform: skewX(-20deg);
-o-transform: skewX(-20deg);
-ms-transform: skewX(-20deg);
transform: skewX(-20deg);

}
.line2 {padding-left: 80px}
.last-line {display: block; text-align: right; font-size: 0.6em}

.contacto-slider {}
#slider.contacto-slider .line2 {padding-left: 150px}
#slider.contacto-slider .last-line {margin-right: -60px;}
#slider.contacto-slider .frase h1 {
-moz-transform: skewX(20deg);
-webkit-transform: skewX(20deg);
-o-transform: skewX(20deg);
-ms-transform: skewX(20deg);
transform: skewX(20deg);
}
#slider.contacto-slider .frase {margin-left: auto; padding: 20px 200px 20px 60px; right: -30px;
-moz-transform: skewX(-20deg);
-webkit-transform: skewX(-20deg);
-o-transform: skewX(-20deg);
-ms-transform: skewX(-20deg);
transform: skewX(-20deg);
}

#last {margin: 50px 0; text-align: center;}

#last .property {display: block; float: left; position: relative; width: 24.25%; margin: 0 0.5% 20px 0.5%; text-align: center; overflow: hidden;}
#last .property:nth-child(4n+1) {margin-left: 0}
#last .property:nth-child(4n+4) {margin-right: 0}
.property *{
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
.property img {width: 100%}
.property .info {position: absolute; background: rgba(109, 110, 112, 0.8); color: #fff; top: 0; height: 100%; width: 100%;  text-align: center; font-weight: bold; font-size: 0.8em; margin-top:100% }
.property:hover .info {margin-top: 0}
.property h3 {background: rgba(237, 28, 36, 0.8); margin-top: 15px; padding: 10px 0; font-weight: bold; color: #fff}
.property ul {margin: 0; padding: 0 20px; list-style: none; margin-bottom: 10px}
.more {display: inline-block; padding: 8px 20px; background: rgba(0, 0, 0, 0.6);}
.property > a {position: absolute; top: 0; height: 100%; width: 100%; display: block;}
.property a {color: #fff}

#propiedades .property {display: block; float: left; position: relative; width: 33%; margin-bottom: 5px; text-align: center; overflow: hidden;}
#propiedades .property:nth-child(3n+1) {margin-left: 0}
#propiedades .property:nth-child(3n+2) {margin:0 0.5% 5px 0.5%}
#propiedades .property:nth-child(3n+3) {margin-right: 0}
#propiedades .property h3 {margin-top: 50px}
#propiedades h2 {font-size: 3em}
#propiedades.related h2 {font-size: 2em}
#propiedades.related .more-property {background: #000}

.related-post {width: 32%; display: block; float: left; position: relative;}
.related-post:nth-child(2) {margin: 0 2%}
.related-post span {background: rgba(109, 110, 112, 0.8); padding: 5px 0; width: 100%; text-align: center; position: absolute; bottom: 0; left: 0;}
.related-post img {width: 100%}
.related-post a {color: #fff}

.more-property {background: #ED1C24; color: #fff; font-weight: bold; font-size: 0.8em; padding: 5px; float: right;}

#us {text-align: justify;}
#us img {display: block; padding: 40px 100px; margin-right: 60px; border-right: solid 1px #ED1C24; float: left;}
#us h2 {padding-top: 40px;}

#contacto {margin: 40px 0;}
/*#contacto input {width: 33%; float: left; vertical-align: text-top; display: block; margin: 0}
#contacto input:nth-child(2) {margin: 0 0.5%}
#contacto textarea {height: 215px;}
#contacto input[type='submit'] {background: #ED1C24; border: none; float: right; width: auto; font-size: 0.8em: font-weight:bold; color: #fff; padding: 5px 30px; margin-top: 15px}
*/
#contacto nf-field {width: 33%; float: left; vertical-align: text-top; display: block; margin: 0}
#contacto nf-field:nth-child(2) {margin: 0 0.5%}
#contacto nf-field:nth-child(4) {width: 100%}
#contacto nf-field:nth-child(5) {width: 100%}
#contacto textarea {height: 215px;}
#contacto #nf-field-16 {background: #ED1C24; border: none; float: right; width: auto; font-size: 0.8em: font-weight:bold; color: #fff; padding: 5px 30px; margin-top: 15px}
#contacto .nf-before-form-content, #contacto .nf-form-title {display: none;}

.propiedades-slider {}
#slider.propiedades-slider .line2 {padding-left: 150px}
#slider.propiedades-slider .frase h1 {
-moz-transform: skewX(20deg);
-webkit-transform: skewX(20deg);
-o-transform: skewX(20deg);
-ms-transform: skewX(20deg);
transform: skewX(20deg);
}
#slider.propiedades-slider .frase {margin-left: auto; padding: 20px 100px 20px 60px; right: -30px;
-moz-transform: skewX(-20deg);
-webkit-transform: skewX(-20deg);
-o-transform: skewX(-20deg);
-ms-transform: skewX(-20deg);
transform: skewX(-20deg);
}


.fleft {float: left; width: 48%;}
.fright {float: right; width: 48%}
.fright ul li a {color: #939597}
#propiedad .fleft img {width: 100%; max-width: 500px;}
#propiedad {margin: 40px 0}

#propiedad .fleft #slider-prod-thumb img {width: 98%}
#slider-prod-thumb {margin: 5px 0}

#propiedad iframe {width: 100%!important}


.pagination {
clear:both;
padding:20px 0;
position:relative;
font-size:11px;
line-height:13px;
text-align: center;
margin: 40px auto;
}
 
.pagination span, .pagination a {
display:inline-block;
margin: 2px 2px 2px 0;
padding:11px 14px 10px;
text-decoration:none;
width:auto;
color:#fff;
background: #00494f;
}
 
.pagination a:hover{
color:#fff;
background: #666;
}
 
.pagination .current{
padding:11px 14px 10px;
background: #666;
color:#fff;
}

/* .nf-after-form-content nf-section .nf-form-errors nf-errors nf-section .nf-error-msg */

#nf-field-14-container, .nf-after-form-content {display: block; clear: both;}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 35em) {

}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

}

@media only screen and (max-width: 1200px) {

}

@media only screen and (max-width: 960px) {
    .content {width: 720px}
    #us img {padding: 40px 80px;}
    .property ul {padding: 0 15px}
    #propiedades .property h3 {margin-top: 25px;}


}

@media only screen and (max-width: 720px) {
    .content {width: 560px}
    #us img {padding: 105px 50px; width: 125px;}
    #last .property {width: 49%}
    .fleft, .fright {float: none; width: 100%; margin-bottom: 20px}
    .property ul {padding: 0 10px; font-size: 0.8em;}
    .more {font-size: 0.8em;}

}

@media only screen and (max-width: 560px) {
    .content {width: 90%}
    .logo {width: 90%; margin: 20px auto; display: block; text-align: center;}
    .logo img {max-width: 100%}
    nav ul li {display: block;}
    nav ul li a {display: block; text-align: center; border: solid 1px #fff; padding: 10px 0; margin-bottom: 10px; height: auto}
    nav ul li a:hover { border: solid 1px #fff;}
    nav {height: auto; padding: 20px 0 10px 0;}
    #slider .frase h1 {font-size: 1em}
    #last .property, #last .property:nth-child(4n+1), #last .property:nth-child(4n+4), .property, #propiedades .property, #propiedades .property:nth-child(3n+1), #propiedades .property:nth-child(3n+2), #propiedades .property:nth-child(3n+3) {float: none; width: 320px; max-width: 100%; margin: 10px auto}
    .property .info {position: relative; margin-top: 0; padding-bottom: 10px}
    .property h3, #propiedades .property h3 {margin-top: 0}
    #us img {padding: 0; width: auto; max-width: 100%; margin: auto; float: none; border: none;}
    #contacto nf-field {width: 100%; float: none;}
    #contacto nf-field:nth-child(2) {margin: 0}
    .more, .property ul  {font-size: 1em;}
    #slider .frase, #slider.propiedades-slider .frase, #slider.contacto-slider .frase {position: absolute; margin-left: -0; padding: 20px 5%; top: auto; bottom: 0; margin-top: -auto; right: auto;
    -moz-transform: skewX(0deg);
    -webkit-transform: skewX(0deg);
    -o-transform: skewX(0deg);
    -ms-transform: skewX(0deg);
    transform: skewX(0deg);
    width: 90%;
    }
    #slider .frase h1, #slider.propiedades-slider .frase h1, #slider.contacto-slider .frase h1 {font-size: 1em; text-align: center;
    -moz-transform: skewX(0deg);
    -webkit-transform: skewX(0deg);
    -o-transform: skewX(0deg);
    -ms-transform: skewX(0deg);
    transform: skewX(0deg);
    }
    .line2, #slider.propiedades-slider .line2, #slider.contacto-slider .line2 {padding-left: 0}
    .last-line {text-align: center;}
    #slider.contacto-slider .last-line {margin-right: auto}
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}