@import url('https://fonts.googleapis.com/css?family=Lato:400,700');
html{
    font-size: 62.5%;
}
body,
button,
header .navbar-default .navbar-nav > li > a,
.iq-amazing-tab .nav.nav-tabs li a span,
.iq-pricing .price-title h1,
.iq-team .iq-team-info span,
.iq-breadcrumb-title .title span,
.iq-error .big-text,
.iq-coming .big-text{ font-family: 'Lato', sans-serif;}
body{
    overflow-x: hidden;
    position: relative;
    color: #333333;
}
body#web-design{
    background: url(../images/web_design/agence-highlight-web-design-background.jpg) no-repeat top center / cover;
}
body#portfolio-web{
    background: url(../images/web_design/agence-highlight-web-design-background.jpg) no-repeat top center / cover;
}
body#portfolio-pictures{
    background: url(../images/bg/background-audiovisuel.jpg) no-repeat top center / cover;
}
#smoke{
    position: absolute;
    top: -468px;
    height: 468px;
    width:100%;
    background: url('../images/bg/background-fumee.png') no-repeat center bottom / contain;

}
#index{
    background: url(../images/bg/home-background-general-complet.jpg) #1c1c1c no-repeat center top / cover;
}
header .navbar-default .navbar-nav > li > a {
    font-size: 17px;
}
.contact-form .section-field input { position: relative; width: 100%; margin-bottom: 10px; border-radius: 4px; padding-left: 20px; height: 48px; line-height: 48px; clear: both; color: #b6b6b6; border: 1px solid #e1e1e1; }
.contact-form .section-field.textarea textarea { width: 100%; float: left; color: #b6b6b6; border: 1px solid #e1e1e1; border-radius: 4px; padding: 15px 0 0 20px; resize: none;  margin-bottom: 10px;}
.contact-form #submit{
    float: right;
    margin-top: 0;
}
.contact-form #recaptcha{
    float: left;
    overflow: hidden;
    margin-bottom: 10px;
}
.contact-form #recaptcha iframe{
    position: relative;
    height: auto;
}

footer h4{
    font-size: 18px;
}
footer p{
    font-size: 16px;
    line-height: 20px;
}
.footer-info, .footer-content p{
    text-align: center;
}
.footer-info iframe{
    height: 571px;
}
.info-share{
    text-align: center;
}
#rc-anchor-alert, .rc-anchor-alert{
    bottom: initial !important;
}
#contactform .error{
    box-shadow: red 0px 0px 3px 3px;
    border-radius: 5px;
}
#formmessage { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 99; font-weight: bold;}
#formmessage.alert{height: 100%;border: none; border-radius: 0;color: white;
                   text-align: center;}
#formmessage.alert-danger{
    background: rgba(130,22,22,0.9);
}
#formmessage.alert-success{
    background: rgba(0,0,0,0.9);
}
#formmessage p{
    text-align: center;
}
#formmessage #dismiss{
    background: #fff;
    color: #000;

    margin: auto;
    border: none;
    border-radius: 5px;
    text-transform: uppercase;
    font-weight: 600;
}
.flex-row-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.flex-column-center{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.flex-column-between{
    display: flex;
    flex-direction: column;
    justify-content: center;

}
.scroll-panel,
.window-height{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Lato", sans-serif;
}
h1{
    font-weight: bold;
    line-height: initial;
}
h2{
    line-height: 45px;
    margin-bottom: 20px;
}
p{
    margin-bottom: 40px;
    line-height: 32px;
    text-align: justify;
}
.d-none{
}
.p-rel{
    position: relative;
}
.p-abs{
    position: absolute;
    top: 0;
}
.iq-banner{
    overflow:initial;
}
.iq-ml-150 { margin-left: 150px !important; }
.iq-mt-190 { margin-top: 190px !important; }

.right-0{
    right: 0;
}

.iq-objects #logo-ai{
    position: absolute;
    bottom: 10%;
    right: 0;
    left: initial;
    top: initial;
}
.iq-objects #logo-dw{
    position: absolute;
    bottom: 0;
    right: 10%;
    left: initial;
    top: initial;

}
.iq-objects #logo-id{
    position: absolute;
    bottom: 10%;
    left: 20%;
    top: initial;

}
.iq-objects #logo-ps{
    position: absolute;
    bottom: 20%;
    left: 0;
    top: initial;

}
.iq-objects #lens{
    right: 15%;
    top: 120%;
}
.iq-objects #objectif{
    right: 5%;
    top: 130%;
}
.iq-objects #casque{
    top: 100%;
}
.iq-objects #prolyte{
    top: 100%;
    right: 0;
}
#luminaire{
    position: absolute;
    top:100%;
    right: 86%;
}
#stylet{
    position: absolute;
    top: 100%;
    right: 0%
}
#regie h1{
    font-size: 40px;
}
#regie h2{
    font-size: 20px;
}
.grid-item{
    padding: 15px;
}
.grid-item-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}
.cookie-consent{
    background: rgba(0,0,0,0.8);
    position: fixed;
    bottom: 0;
    z-index: 9;
    width: 100%;
    color: white;
}
.cookie-consent p{
    font-size: 16px;

}
.cookie-consent .btn{
    background: white;
    color: black;
    font-family: 'Lato', sans-serif;
}
.mfp-iframe:after{
    background: url('../images/play.png') no-repeat center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 48px;
    height: 48px;
    content: '';
}
@media(max-width:767px){
    body#references{
        /*background-image: none;*/
    }
    .container{
        width: 100%;
    }
    .col-xs-img-responsive{
        max-width: 100%;
        height: auto;
    }
    .col-xs-height-auto{
        height: auto !important;
    }
}
@media(min-width:768px){
    h1{
        font-size: 79px;
    }
    h2{
        font-size: 36px;

    }

    #regie h1{
        font-size: 75px;
    }
    #regie h2{
        font-size: 34px;
    }
    #portfolio-web h1,
    #portfolio-pictures h1{
        font-size: 70px;
        margin-bottom: 20px;
        line-height: initial;
    }
    #portfolio-web h2,
    #portfolio-pictures h2{
        font-size: 33px;
        line-height: initial;
    }
    p{
        font-size:23px;

    }
    .grid-item-content {
        /*width: 292px;*/
        height: 135px;
        overflow: hidden;
    }

    .grid-item-content--height2 { height: 300px; }
    .portrait{
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        max-width: initial;
        height: 100%;
        left: 50%;
        transform: translateX(-50%);
    }
}
@media(min-width:992px){
    .col-md-ml-100{
        margin-left: 100px !important;
    }
    .col-md-mt-100{
        margin-top: 100px !important;
    }
    .col-md-mt-190{
        margin-top: 190px !important;
    }
    .col-md-color-pink{
        color: #f7ddcf;
    }
}