/*
Theme Name: Omniup
Agency URL: http://omniup.com
Version: 1.0
Author: Soufiane BOUDIR


CSS STRUCTURE:

1. SITE STRUCTURE and TYPOGRAPHY
2. CONTENT
3. FORMS
4. COMMON
5. MEDIA QUERIES

/*============================================================================================*/
/* 1.  SITE STRUCTURE and TYPOGRAPHY */
/*============================================================================================*/
body {
    background:#fff;
    font:13px/20px 'Open Sans', Arial, sans-serif;
    color: #333;
    -webkit-font-smoothing: antialiased !important;
}
/** Typography **/
h1,
h2,
h3,
h3,
h4,
h5,
h6 {
    margin: 0 0 10px 0;
    font-family: inherit;
    font-weight: bold;
    line-height: 20px;
    color: inherit;
    text-rendering: optimizelegibility;
    font-family: 'Open Sans', Arial, sans-serif;
}
.ui-widget-header{
    background:#2ecc71 !important;
}
.title-VAB{
    float: left;
    margin-right: 5px;
    width:100px;
}
.title-table{
    color: #377e9a;
    font-size: 20px;
}
.title-big1{
    float: left;
}
.title-big2{
    float: right;
}
#myModalLabel{
    color: #377e9a;
}
.align-right{
    border: 1px solid #377e9a;
    float: left;
    padding: 10px 40px 20px;
    text-align: right;
    width: 50%;
}
div.smart{
    margin-top:25px;
}
.parag-elements{
    border: 3px solid #38c2d5;
    font-weight: 600;
    padding: 10px;
    text-align: left;
    border-radius: 10px;
}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    border-top: 1px solid #0dc0d4;
    color: #7f8c8d;
    font-weight: 900;
    text-align: center;
}
.item.first{
    background-color: #f3f3f3;
    border-top: 1px solid #e7e7e7;
}
.h-ciblage, h5.account{
    /*    color: #377e9a;*/
    color: #666;
    font-size: 14px;
    font-weight: 900;
    /*    margin-bottom: 21px;*/
    margin-top: 6px;
    text-align: left;
}
h5.account{
    text-align: center;
    color: #377e9a;    
}
.some-margin{
    border-bottom: 1px solid #377e9a;
    margin: 10px auto 0;
    max-width: 620px;

    padding-bottom: 12px;
}
#videos, #banners, #videos-notarget, #banners-notarget,#redir,#redir-notarget,.oa-cnt{float: right; margin-right:10px;}
.bdr{
    border-right: 1px solid #377e9a;
}
#cpv, #cpv_nt{
    display: block;
    text-align:right;
    margin-right: 5px;
}
.some-margin2{
    margin: 20px auto 0;
    max-width: 620px;
    padding-bottom: 12px;
}

.phrase-center {
    color: #377e9a;
    font-size: 18px;
    font-weight: bold;
    margin-top: 14px;
    margin-bottom: 5px;
    text-align: center;
}
.some-margin div{
    padding-left: 0px;
    padding-right: 0px;
}
.results {
    border: 1px solid #0dc0d4;
    display: block;
    margin: 0 auto;
    max-width: 600px;
    padding: 10px;
}
.title-bdg{
    color: #377e9a;
    font-size: 14px;
    font-weight: bold;
}
.title-margin{
    display: block;
}
#videos, #banners, #videos-notarget, #banners-notarget,#redir,#redir-notarget{
    background-color: #38c2d5;

    color: #fff;
    font-weight: bolder;
    padding: 0 10px;
    font-size: 20px;
}
#oa_ttl,#oa_ttl_notarget{
    background-color: #2ecc71;

    color: #fff;
    font-weight: bolder;
    padding: 3px 10px;
    font-size: 20px;
}

#account, #budget {
    color: #377e9a;
    font-weight: bolder;
}

.logo{
    display: block;
    margin: 0 auto;
    width: 190px;
}
.logo img{
    width: 100%;
}
.wizard-header {
    text-align: center !important;
    color: #377e9a;
    font-weight: bold !important;
}
h1,h2 {
    text-transform:uppercase;
    font-weight:800;
    text-align:center;
}
.main-title {
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
    color:#fff;
}
.main-title h1{
    font-size:35px;
    line-height:40px;
    margin-top: 23px;
}
.main-title p {
    font-size:24px;
    font-weight:300;

    text-align:center;
}
h2 {
    font-size: 32px;
    line-height:30px;
    margin-bottom:45px;
    color: #377e9a;
}
h2 span{
    font-size: 24px;
    font-weight:300;
    text-transform:none;
    display:block;
}
footer h3 {
    color: #fff !important;
    font-weight: bold !important;
}
.title_pages {
    color: #2189db;
    font-size: 42px;
    font-weight: 300;
    text-align:center;
    line-height:32px;
    margin-bottom:45px;

}
h3 span {
    font-size: 21px;
    font-weight:600;
    display:block;
}
.step h3 {
    text-transform:none;
    font-size:14px;
    line-height:26px;
    font-weight:600;
    margin-bottom:25px;
    text-align:left;
}
.box h3 {
    color: #377e9a;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 5px;
    text-transform: uppercase;
}
footer h3 {
    text-transform:none;
    font-weight:400;
    text-align:left;
    font-size:22px;
    margin-bottom:10px;
}
.question_box h3 {
    font-size:18px;
    text-align:left;
    line-height:22px;
    margin-bottom:10px;
}

h4 {
    font-size: 18px;
    ine-height:22px;
}

h5 {
    font-size: 14px;
    line-height:14px;
}
footer h5 {
    color:#555; 
}
h6 {
    font-size: 12px;
}
p {
    font-weight: 100;
    margin: 0 0 20px 0;
    font-size: 17px;
}
/** Lists **/
ul,
ol {
    padding: 0;
    margin: 0 0 30px 0;
    list-style:none;
}
ul ul,
ul ol,
ol ol,
ol ul {
    margin-bottom: 0;
}
li {
    line-height: 23px;
}
hr {
    margin: 30px 0;
    border: 0;
    border-top: 1px solid #dfdfdf;
}

/** Links color **/
a {
    color: #2189db;
    text-decoration: none;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
a:hover,
a:focus {
    color: #444;
    text-decoration: none;
}

/** Buttons **/
.button_medium {
    border:none;
    background:#282828;
    color:#fff;
    padding:7px 20px;
    text-decoration:none; 
    transition: background .5s ease; 
    -moz-transition: background .5s ease; 
    -webkit-transition: background .5s ease; 
    -o-transition: background .5s ease; 
    display:inline-block;
    cursor:pointer;
    font-weight:600;
    text-transform:uppercase;
    outline:none;
}

a.button_medium:hover, .button_medium:hover {background:#377e9a; color:#fff;}

.button_medium_2 {
    border:none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border:2px solid  #377e9a;
    color:#377e9a;
    padding:7px 20px;
    text-decoration:none; 
    transition: background .5s ease; 
    -moz-transition: background .5s ease; 
    -webkit-transition: background .5s ease; 
    -o-transition: background .5s ease; 
    display:inline-block;
    cursor:pointer;
    font-weight:600;
    text-transform:uppercase;
    outline:none;
    background:#fff;
}
a.button_medium_2:hover {background:#377e9a; color:#fff; border:2px solid  #377e9a;}


/** Wizard Buttons **/
.backward, .forward {
    border:none;
    color:#fff;
    padding:7px 20px;
    text-decoration:none; 
    transition: background .5s ease; 
    -moz-transition: background .5s ease; 
    -webkit-transition: background .5s ease; 
    -o-transition: background .5s ease; 
    display:inline-block;
    cursor:pointer;
    font-weight:600;
    text-transform:uppercase;
    outline:none;
    background:#38c2d5;
    position:relative;
} 

.backward {padding:7px 20px 7px 30px;} 

button[disabled].backward, button[disabled].forward {
    border:none;
    background:#ccc;
    outline:none;
}

.backward:before {
    content: "\f053"; 
    font-family: FontAwesome;
    text-decoration: inherit;
    position: absolute;
    font-weight:normal;
    top: 8px;
    left: 20px;
    text-transform:none;
    font-size:9px
} 

.forward {padding:7px 30px 7px 20px;}  
.forward:before {
    content: "\f054"; 
    font-family: FontAwesome;
    text-decoration: inherit;
    position: absolute;
    font-weight:normal;
    top: 8px;
    right: 20px;
    text-transform:none;
    font-size:9px
} 

.backward:hover, .forward:hover {background:#377e9a; color:#fff;}


/** Header ==================== **/
#top-area {
    /*background: #fff url("../img/bg.jpg") repeat-x scroll center top;*/
    background-color:white;
    height: 126px;
}
header {
    position: fixed;
    padding-bottom: 13px;
    padding-top: 10px;
    z-index: 998;
    width:100%;
    background-color: #252525;
    /*background:url(../img/line_header.png) repeat-x left bottom;*/
}
#logo a{
    text-indent:-99999px;
    background: url(../img/logo.png) no-repeat 0 0;
    display:block;
    height:32px;
    width:151px;
}

#top-nav ul{ margin:0; padding:0; margin-top:8px;  margin-right:-10px; font-weight:700; text-transform:uppercase;}
#top-nav ul a { color:white; text-decoration:none;font-weight: 400}
#top-nav ul a:hover, #top-nav ul a#active{ color:#b2b2b2;}
#top-nav ul li {float:left; padding-left:10px; margin-right:10px }
#top-nav ul li:first-child{ background:none;}
#top-nav ul li a#purchase { color: #fff200;}
#top-nav ul li a#purchase:hover { color:#323232;}

/* Button Responsive Menu*/
.btn-responsive-menu{
    display: none;float: right;
    padding:5px;
    cursor:pointer;
    margin:  0px 20px 0 0;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background:#333;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}
.bar {
    display: block; 
    width:18px;
    height:2px; 
    margin:5px; 
    background:#fff; 
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}
.show{
    display:block!important
}

#main { 
    padding-bottom:60px; 
}



/** Footer ==================== **/
footer {
    width:100%;
    padding:30px 0 0 0;
    color:#fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}
footer a{
    color: #377e9a;
}
#footer_2 {
    width:100%;
    background:#f2f2f2;
}
#footer_2 a {
    color:#888;
}
#footer_2 a:hover {
    color:#fff;
}
ul#footer-nav {
    color:#fff;
    margin: 25px 0 10px 0;
}
ul#footer-nav li:first-child {
    /*margin-right:30px;*/
}
ul#footer-nav li {
    display:inline-block;
    zoom:1;
    /*margin-right:10px;*/
}
#copy {
    padding:15px 0;
    background-color:#f8f8f8;
    font-size:11px;
    text-align:center;
}
#contact {
    background:url(../img/contact_map.png) no-repeat 90% 90px;
}

/*============================================================================================*/
/* 2.  CONTENT */
/*============================================================================================*/

/** Form area ============================= **/
.container{
    width: 95%;
    text-align: center; 
    margin-top: 10px;
}
.myline{
    background-color: rgb(224, 226, 231);
    height: 1px;
    width: 90%;
    margin: 0 auto; 
    margin-bottom: 15px; 
    margin-top: 15px
}
#top-wizard, #top-wizard-2 {
    background-color: #f3f3f3;
    border-bottom: 1px solid #e7e7e7;
    font-size: 11px;
    padding: 20px;
    position: relative;
    text-align: left;
}
.shadow {
    width:100%;
    height:6px;
    position:absolute;
    left:0;
    bottom:-6px;
    background:url(../img/shadow_top_form.png) no-repeat center top;
}
.ui-widget { }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {}
.ui-widget-content { background: #fff; color: #222222; }
.ui-widget-content a { color: #222222; }
.ui-widget-header {background: #f68e56; }
.ui-widget-header a { color: #222222; }
.ui-progressbar { height:2em; text-align: left; }
.ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; }

#survey_container {
    background-color:#fff;
    box-shadow: 0 0 5px #777;
    margin-top:-285px;
    margin-bottom:60px;
    z-index:9;
    position:relative;
}
.ie8 #survey_container {
    background-color:#fff;
    border:1px solid #ddd;
    margin-top:-285px;
    margin-bottom:60px;
    z-index:9;
    position:relative;
}
.oa-text-center{text-align:center;}
.item.new-sec{

    margin-top:6px;
}
#top-wizard-2{padding-bottom: 9px !important;}
#middle-wizard {
    padding: 50px 25px 35px 25px;
    min-height: 341px;
}
#bottom-wizard {
    text-align:center;
    padding:15px 120px;
    border-top:1px solid #e7e7e7;
    background-color:#f3f3f3;
}
/*#complete{
        text-align:center;
        padding: 0 45px 35px 45px;
}*/

#complete h3{
    text-align:center;
    margin-bottom:40px
}
#complete i {
    color:#cacaca;
    margin: 0 0 10px 0;
    font-size:160px;
    padding:0;
}
#complete button{
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size:18px;
    border:2px solid  #8dc63f;
    color:#8dc63f;
    padding:15px 35px;
    text-decoration:none; 
    transition: background .5s ease; 
    -moz-transition: background .5s ease; 
    -webkit-transition: background .5s ease; 
    -o-transition: background .5s ease; 
    display:inline-block;
    cursor:pointer;
    font-weight:600;
    text-transform:uppercase;
    outline:none;
    background:#fff;
}
#complete button:hover{background:#377e9a; color:#fff; border:2px solid  #377e9a;}

/** Featuers and Question boxes ============================= **/
.box {text-align:center;}

.box span {
    font-size:100px;
    color:#1ab9a7;
    font-weight:800;
    display:block;
    margin:40px 0 43px 0 ;
}
.question_box {
    padding-left:40px;
    position:relative;
    margin-bottom:30px;
}
.question_box:before {
    content: "\f059"; 
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    font-size: 30px;
    position: absolute;
    color:#999;
    top: 5px;
    left: 0;
}
/* Team */
.thumbnail{
    border: none;
    border-radius: 0px;
    box-shadow: none;
    display: block;
    line-height: 0px;
    -moz-border-radius: 0px;
    -moz-box-shadow: none;
    -moz-transition: all 0.2s ease-in-out;
    o-transition: all 0.2s ease-in-out;
    padding: 0px;
    transition: all 0.2s ease-in-out;
    -webkit-border-radius: 0px;
    -webkit-box-shadow: none;
    -webkit-transition: all 0.2s ease-in-out;
}
.caption {background: #f2f2f2;}
.transit-to-top {
    height: 60px;
    overflow: hidden;
    width: 100%;
    cursor:pointer;
}
.transit-to-top h4 {
    text-align:center;
    moz-transition: all 0.3s ease-in-out;
    o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    margin:20px 0 0 0;
    padding:0;
}
.thumbnail:hover h4{margin-top: -40px;}
.p-title {
    display: block;
    height: 40px;
}
.widget_nav_menu {	
    min-height:100%;
    height:100%;
    text-align:center;	
}
.project-item-image-container {
    border: none;
    cursor: pointer;
    height: 100%;
    position: relative;
    width: 100%;
}
.project-item-image-container:hover, .project-item :hover .project-item-image-container {
    filter: alpha(opacity=100);
    -moz-transition: background-color 0.2s ease-out, color 0.1s ease-out;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    opacity: 1;
    -o-transition: background-color 0.2s ease-out, color 0.1s ease-out;
    transition: background-color 0.2s ease-out, color 0.1s ease-out;
    -webkit-transition: background-color 0.2s ease-out, color 0.1s ease-out;
}
.project-item-image-container > img {width: 100%!important;}
.phone-info {
    display: inline-block;
    margin: 5px 0px 0 0;
    width: 100%;
    text-align:center;
}
ul.social-bookmarks.team {float:none; margin:0; padding:0; margin:auto; display:inline-block;}

/* Carousel */
#owl-demo .item{
    margin: 3px;
}
#owl-demo .item img{
    display: block;
    width: 100%;
    height: auto;
}

/*============================================================================================*/
/* 3.  FORMS */
/*============================================================================================*/
.form-control::-moz-placeholder { color: #999; opacity:1;}
.form-control::-webkit-input-placeholder {color: #999;}

input.form-control, select.form-control, textarea.form-control {
    background:none;
    background-color:#fbfbfb;
    border:2px solid #d5d5d5;
    border-radius: 0;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    color: #999;
    height:44px;
    font-size:16px;
    font-weight:400;
    margin-bottom:25px;
    font-family: 'Open Sans', Arial, sans-serif;
    line-height: 1.428571429;
    padding: 6px 12px;
}
input.form-control:focus, select.form-control:focus, textarea.form-control:focus  {
    border-color:none;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    color:#555;
}

/** Drop down select: ex Country select ==================== **/
.styled-select select {
    background: transparent;
    width:107%;
    padding: 5px;
    padding-left:15px;
    border: 0;
    border-radius: 0;
    height: 41px;
    margin:0;
    font-weight:400;
    -moz-appearance: window;
    -webkit-appearance: none;
    cursor: pointer;
}
.styled-select {
    width: 100%;
    overflow:hidden;
    height: 44px;
    background: #fbfbfb url(../img/down_arrow_select.png) no-repeat  98% center ;
    border:2px solid #d5d5d5;
    margin-bottom:-5px;
} 

.styled-select select::-ms-expand, .styled-select-2 select::-ms-expand {
    display: none;
}

/** Floated inputs: ex the gender radio ==================== **/   
ul.floated {
    padding:0;
    margin:0 0 0 0;
}   
ul.floated li {
    float:left;
    margin:0; padding:0;
    width:30%;
} 
label.label_gender {padding-left:50px; line-height:42px;}

ul.floated li#age {
    width:100px;
    margin-right:55px;
} 

ul.data-list li {position:relative; } 

ul.data-list-2 li {
    display: block;
    float: left;
    height: 42px;
    margin-bottom: 15px;
    position: relative;
    width: 220px;
}

ul.data-list-2 li label {
    float:left;
    margin-left:60px;
    font-size:18px;
    font-weight:400;
    margin-top:9px;
    line-height:22px;
}  

ul.data-list#terms  {
    font-weight:400;
    line-height:22px;
    margin:0;
    padding:0;
    text-align:center;
}  

/** Quantity incrementer input==================== **/   
.qty-buttons{ position:relative; width:100px; height:40px;  }
input.qty { width:70px; }
input.qtyminus, input.qtyplus, input.qtyplus:focus  { position:absolute; width:35px; height:23px; border: 2px solid #d5d5d5; outline:none; cursor:pointer;border-radius: 0;-webkit-appearance: none;-webkit-border-radius: 0;-moz-border-radius: 0;-webkit-box-shadow: none;box-shadow: none;-webkit-transition: none; }
input.qtyplus { background:#fff url(../img/plus.png) no-repeat center center; right:0; top:0; text-indent:-9999px;  }
input.qtyminus { background:#fff url(../img/minus.png) no-repeat center center; right:0; top:21px;  text-indent:-9999px; }
.qty-buttons span { position:absolute; top:10px; display:block; width:220px; left:120px; font-weight:bold;}

/** Errors validation styles and position ==================== **/   

/** Common style**/   
label.error{
    font-size:11px;
    position: absolute;
    top:-28px;
    right:-15px;
    z-index:99;
    height:25px;
    line-height:25px;
    background-color:#e34f4f;
    color:#fff;
    font-weight:normal;
    padding:0 6px;
} 
label.error:after {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 0 6px 6px 0;
    border-color: transparent #e34f4f;
    display: block;
    width: 0;
    z-index: 1;
    bottom: -6px;
    left: 20%;
} 

.styled-select label.error{overflow:visible;}

ul.floated li#age label.error {right:-15px;} 

ul.floated li label.error{right:-50px;} 

ul.data-list#terms li label.error {
    left:45%;
    display:inline-block;
    width:80px;
} 

/** Error styles for survey questions**/   
ul.data-list-2 li label.error {
    font-size:11px;
    position: absolute;
    top:-30px;
    right:-10px;
    margin:0;
    z-index:99;
    height:25px;
    line-height:25px;
    background-color:#e34f4f;
    color:#fff;
    font-weight:normal;
    padding:0 6px;
}  
/** Update version 1.6**/     
input#website {display: none; }
/*============================================================================================*/
/* 4.  COMMON */
/*============================================================================================*/
/* twitter feed*/
.tweets-next, .tweets-prev{
    display: inline-block;
    font-size: 28px;
    color: #FFF;
    margin-top:10px;
}
.tweets-prev {margin-right:10px;}
.tweet_avatar {float:left;}
.tweet_time {display:block;margin-bottom:5px;}
.tweet-control {margin-bottom:30px;}

/* scroll to top */
#toTop {width:100px;background:#111;text-align:center;padding:5px;position:fixed; bottom:10px;right:10px;cursor:pointer; display:none;color:#fff;font-size:11px; z-index:999;}
/* spacing */
.add_top_30 {margin-top:30px;}
.add_top_15 {margin-top:15px;}
.add_bottom_30 {margin-bottom:30px; }
.add_bottom_15 {margin-bottom:15px; }
.divider {width:100%; background:url(../img/divider.png) no-repeat center top; height:10px; margin: 30px 0;}

/* modal */
.modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 6px;
    outline: none;
    -webkit-box-shadow: 0 3px 9px c;
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    background-clip: padding-box;
}
.modal-header {
    min-height: 16.428571429px;
    padding: 15px;
    border-bottom: 1px solid #ddd;
}
.modal-footer {
    padding: 19px 20px 20px;
    margin-top: 15px;
    text-align: right;
    border-top: 1px solid #ddd;
}
.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #555;
    text-shadow: 0 1px 0 #000;
    opacity: 0.2;
    filter: alpha(opacity=20);
}
.close:hover,
.close:focus {
    color: #333;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.7;
    filter: alpha(opacity=70);
}

.wizard_xhr{

    background-color: #fff;
    box-shadow: 0 0 5px #777;
    margin-top: -285px;
    margin-bottom: 60px;
    z-index: 9;
    position: relative;

}

.wizard_xhr .items .item {
    display: block;
    padding: 7px 0px 7px 10px;
    color: #333;
    font-size: 13px;
    font-weight: 600;
    border-top: 1px solid #e6e8e9;
}

.wizard_xhr .items .item.last {   
    border-bottom: 2px solid #e6e8e9;
}

.wizard_xhr .items .item.first {    
    border: none;
}

.wizard_xhr .items .item span{  
    font-size: 12px !important;  
}

.wizard_xhr .items .item h5{

    font-size: 12px;

}
.fancybox-close {
    top: 0 !important;  
    right: 0 !important;  
}
.wizard_xhr .items {
    margin-top: 15px;
}

/*perso style*/
.pp1 .btn{
    margin-bottom: 20px!important; 
    margin-top: 13px!important}
.avantages li, .avantages p{
    text-align: left;
    font-size: 14px;
}
.arrowclique{
    color: #377e9a!important;
    font-size: 23px!important
}
.clique_txt{
    font-size: 20px;
    width: 400px;
    line-height: 600px;
}
html,body{
    height: 100%;
    font-size: 15px !important;
}
.cont_row {width: 80%;margin: 0 auto;}
.cont_row .row{
    margin: 0 auto;

}
.space{margin-top: 5px; margin-bottom: 5px; width: 100%; height: 10px}

.form-group{width: 60%; margin: 0 auto; margin-bottom: 20px}
.txt_center{text-align: center}
.ctr{margin: 0 auto!important; text-align: center;}
.panel-body{text-align: center}
.panel-body p{text-align: center}
.panel-body ul li{text-align: left}
.footer{margin-top: 20px; clear: both; position: relative!important}
.m0{margin: 0px!important}
.vertical-center{
    min-height: 100%;  
    min-height: 70vh; 
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex; 

    /* Align the bootstrap's container vertically */
    -webkit-box-align : center;
    -webkit-align-items : center;
    -moz-box-align : center;
    -ms-flex-align : center;
    align-items : center;

    /* In legacy web browsers such as Firefox 9
       we need to specify the width of the flex container */
    width: 100%;

    /* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsers
       hence the bootstrap's container won't be aligned to the center anymore.
    
       Therefore, we should use the following declarations to get it centered again */
    -webkit-box-pack : center;
    -moz-box-pack : center;
    -ms-flex-pack : center;
    -webkit-justify-content : center;
    justify-content : center;
}

.top_space{margin-top: 30px}
.para_mockup{
    font-size: 23px;
    line-height: 30px;
}

h5{text-transform: uppercase; margin-top: 20px}

.index #footer{position: absolute; bottom: 0}
a{
    display: inline-block}

i{
    vertical-align: middle;
    font-size: 13px;
}

#top-nav{
    width: 770px;
    float: none;
    margin: 0 auto;
    padding-left: 0; 
    padding-right: 0;
    padding-top: 10px
}
#footer-nav{text-shadow: none;}
#footer-nav li{color:#666!important}
b{font-weight: 600!important}
.btn_omniup{
    font-size: 16px;
    line-height: 2.00625;
    font-weight: 500;
    letter-spacing: normal;
    background-color: #2189db;
    background: -webkit-linear-gradient(#42a1ec, #0070c9);
    background: linear-gradient(#42a1ec, #0070c9);
    border: 1px solid #07c;
    border-radius: 4px;
    color: white;
    cursor: pointer;
    display: inline-block;
    padding: 0 15px;
    text-align: center;
    text-shadow: 0 1px 1px rgba(28, 115, 184, 0.64);
    white-space: nowrap;
    margin-bottom: 20px !important; 
    margin-top: 13px !important}
.btn_popup{
    font-size: 16px;
    line-height: 2.00625;
    font-weight: 500;
    letter-spacing: normal;
    color: white!important;
    background-color: #2189db;
    background: -webkit-linear-gradient(#42a1ec, #0070c9);
    background: linear-gradient(#42a1ec, #0070c9);
    border: 1px solid #07c;
    border-radius: 4px;
    color: white;
    cursor: pointer;
    display: inline-block;
    padding: 0 15px;
    text-align: center;
    text-shadow: 0 1px 1px rgba(28, 115, 184, 0.64);
    white-space: nowrap;
    margin-bottom: 20px !important; 
    margin-top: 13px !important
}
.demandedevis .sa-confirm-button-container{width: 100%;}
.btn_omniup:hover, .btn_popup:hover{
    color:white!important;
    background-color: #3392de;
    background: -webkit-linear-gradient(#51a9ee, #147bcd);
    background: linear-gradient(#51a9ee, #147bcd);
    border-color: #1482d0;
    text-decoration: none;
}
.jdd_cont p{text-align: left!important}
.title_welcome{
    font-weight: 100;
    line-height: 34px;
    color: #333;
}
.title_popup{
    color: #2189db;
    font-size: 35px;
    font-weight: 600;
    text-align: center;
    line-height: 32px;
    margin-bottom: 45px;
}
.demandedevis .text-muted{
    display: block;
    font-weight: 300;
    font-size: 1.4rem;
    color: #333;
}
.img-responsive{background-size: contain;}
.cnd_gnrl{margin-bottom: 0px}
.cnd_gnrl input{margin-right: 7px}
.cnd_gnrl label{margin-top: 7px; float: none!important; margin: 0 auto;font-size: 110%;line-height: 16px}
.cnd_gnrl   p{font-size: 65%;line-height: 13px;margin-bottom: 0px}
.text-info, .arrowclique{color: #2189db!important;}
/*============================================================================================*/
/* 5.  MEDIA QUERIES */
/*============================================================================================*/
@media (min-width: 250px) and (max-width: 350px) {
    .vertical-center{
        min-height: 30vh !important;      
    }

}
@media (min-width: 350px) and (max-width: 450px) {
    .vertical-center{
        min-height: 40vh !important;      
    }

}

@media (min-width: 450px) and (max-width: 585px) {
    .vertical-center{
        min-height: 45vh !important;      
    }

}

@media (min-width: 585px) and (max-width: 690px) {
    .vertical-center{
        min-height: 55vh !important;      
    }
}
@media (min-width: 690px) and (max-width: 714px) {
    .vertical-center{
        min-height: 85vh !important;      
    }

}
@media (min-width: 714px) and (max-width: 768px) {
    .vertical-center{
        min-height: 45vh !important;      
    }
}

@media (min-width: 768px) and (max-width: 800px) {
    .vertical-center{
        min-height: 85vh !important;      
    }
}
@media (min-width: 800px) and (max-width: 900px) {
    .vertical-center{
        min-height: 75vh !important;      
    }

}
@media (min-width: 900px) and (max-width: 1100px) {
    .vertical-center{
        min-height: 45vh !important;   
    }

}

@media (min-width: 768px) and (max-width: 1200px) {
    #middle-wizard {padding: 40px 60px 35px 60px;}
    .wizard_xhr{margin-bottom: 300px;}
    .step h3{font-size: 12px;}
    .step h5{font-size: 14px;}
    .item h5{font-size: 11px !important;}
    #terms strong{font-size: 12px;}

}

@media (min-width: 990px) and (max-width: 3700px) {
    .container{width: 70%}
    #footer-nav{text-align: left!important}

}

@media (min-width: 768px) and (max-width: 979px) {

    #middle-wizard {padding: 40px 60px 35px 60px;}
    #contact { background:none;}
    #footer_2 {text-align:center;}
    #contact { background:none;}
    ul.social-bookmarks {
        padding: 0;
        list-style-type: none;
        float:none;
        display:inline-block;
    }
    .step h3{font-size: 12px;}
    .step h5{font-size: 14px;}
    #terms strong{font-size: 12px;}
    .item h5{font-size: 11px !important;}
    .form-group{width: 80%!important;}
    .para_mockup{
        font-size: 15px!important;
        line-height: 16px!important;
    }
}
@media all and (orientation:landscape){
    .img-responsive{background-size: contain!important;}
}
@media all and (orientation:portrait){
    .img-responsive{background-size: cover!important;}
}
/* From tablet portrait to mobile */
@media (max-width: 767px) {
    .title_pages {
        margin-bottom:20px!important;
    }
    .cont_nav{
        display: inline-block;
        margin: 0 auto;
        position: relative;
        top: 10px
    }
    .btn-responsive-menu{margin: 0!important}
    header{padding-bottom: 25px!important;}
    #top-nav{width: 100%!important}

    .phrase-center {
        color: #377e9a;
        font-size: 16px;
        font-weight: bold;
        margin-top: 14px;
        text-align: center;
    }
    .title-bdg{
        color: #377e9a;
        font-size: 16px;
        font-weight: bold;
    }
    .title-big2{
        float: none;
    }
    .align-right{
        text-align: center;
    }
    .title-big1{
        float: none;
    }
    .bdr{
        border: none;
        border-bottom: 1px solid #377e9a;
        padding-bottom:12px;
    }

    #top-wizard, #top-wizard-2 {
        font-size: 11px;
        /*    text-align: center;*/
    }

    #top-nav		{width:100%;float:left;}
    #top-nav			{display:none;}
    #top-nav ul	{float: none; padding: 20px 0px 0px 0; margin:0; } 
    #top-nav ul li 	{float: none; border-bottom: 1px solid rgba(255, 255, 255, 0.3); font-size:14px; padding:0; margin:0;}
    #top-nav ul li:last-child{ border-bottom:none;}
    #top-nav ul li a	{ display:block; padding:5px;}
    #top-nav ul a#active{ color:#323232; background-color:#ddd;}

    .btn-responsive-menu{display:block;}	

    .main-title h1{font-size:32px;line-height:30px;}
    .main-title p {font-size:16px;}

    h2, h3 {font-size: 26px;line-height:26px;margin-bottom:30px;}
    h2 span, h3 span{font-size: 16px; line-height:18px}

    #top-wizard, #top-wizard-2 {padding:15px 6s0px;}
    #middle-wizard {padding: 20px 30px 20px 30px;}

    ul.floated li#age {margin-bottom:-10px; } 

    ul.floated li {
        float:none;
        margin:0; padding:0;
        width:50%;
        padding-bottom:10px;
    }

    #footer_2 {text-align:center;}
    #contact { background:none;}

    ul.social-bookmarks {
        padding: 0;
        list-style-type: none;
        float:none;
        display:inline-block;
    }
    .logo {
        display: block;
        margin: 0 auto;
        width: 150px!important;
    }
    .main-title h1 {
        margin-top: 12px;
    }
    #survey_container {
        background-color: #fff;
        box-shadow: 0 0 5px #777;
        margin-bottom: 60px;
        margin-top: -351px;
        position: relative;
        z-index: 9;
    }
    .form-group{
        width: 80%!important;
    }
    .para_mockup{
        font-size: 15px!important;
        line-height: 16px!important;
    }
    .title_pages{
        font-size: 20px!important;
    }
}	

/* Mobile Landscape */
@media (max-width: 480px) {

    .logo{
        width: 120px!important;
    }

    input.form-control, select.form-control, textarea.form-control{
        font-size: 11px;
    } 

    .wizard_xhr{margin-bottom: 300px;} 
    .step h3{font-size: 12px;}
    .step h5{font-size: 14px;}
    #terms strong{font-size: 12px;}
    .item h5{font-size: 11px !important;}
    .align-right{
        border: 1px solid #377e9a;
        float: left;
        padding: 5px 10px 10px;
        text-align: right;
        width: 100%;
    }

    .bdr{
        border: none;
        border-bottom: 1px solid #377e9a;
        padding-bottom:12px;
    }
    .step h3 {
        text-align: center;
        font-size:11px;
    }
    #survey_container {
        background-color: #fff;
        box-shadow: 0 0 5px #777;
        margin-bottom: 60px;
        margin-top: -313px;
        position: relative;
        z-index: 9;
    }

    .main-title h1{font-size:24px;line-height:26px; margin-top:30px;}
    .main-title p {font-size:14px; line-height:16px; }

    #top-nav ul	{
        float: none; 
        padding: 30px 0 0 0!important;
        margin:0; } 
    #top-wizard, #top-wizard-2 {padding:20px;}
    #bottom-wizard {padding:15px 30px;}
    .backward, .forward, button[disabled].backward, button[disabled].forward  {
        text-indent:-9999px;
        width:50px;
        padding:0;
        height:40px;
    } 
    .backward:before, .forward:before, button[disabled].backward:before, button[disabled].forward:before {
        text-indent:0;
        top:12px;
        font-size:16px;
    } 

    .qty-buttons span { top:10px; display:block; width:100px; left:120px; font-weight:bold; line-height:12px;}

    /*#complete{padding: 0 25px 15px 25px;}*/
    #complete h3{ font-size:18px; margin-bottom:20px}
    #complete i {font-size:80px;padding:0;}
    .main-title h1{font-size:20px;}
    .main-title p{font-size:12px;}
    .wizard_xhr{margin-bottom: 320px;margin-top: -330px;}
    ul.data-list-2 li label{font-size:12px}

    .results table.table > tbody > tr > td, .table > tfoot > tr > td {
        border-top: 1px solid #0dc0d4;
        color: #7f8c8d;
        font-weight: 400;
        text-align: left;
        font-size: 12px;
    }
    .results table.table > tbody > tr > td{
        display:block;
    }

    .results table.table > tbody > tr > td.res_lbl{
        color: #0dc0d4;
        font-weight:bold;
    }

    ul.data-list-2 li label{margin-top: 0;}
    #middle-wizard{min-height:0px;}

    .arrowclique{
        color: #377e9a!important;
        font-size: 23px!important
    }
    .cont_clique_txt{padding: 0px!important}
    .clique_txt{
        font-size: 15px;
        width: 100%;
        line-height: 470px;
    }

    .cont_row {
        width: 100%;
    }


    .form-group{width: 95%!important;}
    .title_pages{
        font-size: 24px!important;
    }
    #toTop{
        bottom: 50px!important;
        right: 0px!important;
    }
    .title_pages{
        font-size: 20px!important;
    }

}

/* Mobile Portrait */
@media only screen and (max-width: 320px) {
    #footer{position: relative!important}
    .results table.table > tbody > tr > td, .table > tfoot > tr > td {
        border-top: 1px solid #0dc0d4;
        color: #7f8c8d;
        font-weight: 400;
        text-align: left;
        font-size: 12px;
    }

    .results table.table > tbody > tr > td.res_lbl{
        color: #0dc0d4;
        font-weight:bold;
    }

    .results table.table > tbody > tr > td{
        display:block;
    }


    input.form-control, select.form-control, textarea.form-control{
        font-size: 11px;
    } 

    .bdr{
        border: none;
        border-bottom: 1px solid #377e9a;
        padding-bottom:12px;
    }

    ul.data-list-2 li {
        width: 100%;
    }

    .main-title h1{font-size:20px;}
    .main-title p{font-size:12px;}

    #survey_container {margin-top:-312px;margin-bottom:30px;}
    #top-nav ul	{float: none; padding:20px 0 0 0!important; margin:0; } 
    ul#footer-nav li {display:block;margin-right:0;}
    ul#footer-nav li:first-child {margin-right:0;}
    .step h3 {font-size:11px;line-height:22px; margin-bottom:20px}
    #complete h3{ font-size:18px; margin-bottom:20px}
    .wizard_xhr{margin-bottom: 320px;margin-top: -330px;}
    .step h3{font-size: 12px;}
    .step h5{font-size: 14px;}
    #terms strong{font-size: 9px;}
    .item h5{font-size: 11px !important;}
    ul.data-list-2 li label{font-size:12px}
    ul.data-list-2 li label{margin-top: 0;}
    #middle-wizard{min-height:0px;}
    .form-group{width: 95%!important;}
    .title_pages{font-size: 20px!important}

}