/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
html {width: 100%;}
 .skip-link.screen-reader-text {display: none;}
 #main {padding: 0 !important;}
 #main .fusion-row {width: 100% !important;max-width: 100% !important;}
    h2 {text-align: center;}
    a {text-decoration: none;}
   
    html.avada-is-100-percent-template #main.width-100 {padding-left: 0 !important;padding-right: 0 !important;}
    .mdd-form-container {margin: auto;}
    .table-user table {width: 100%;}
    .mdd-menu {background-color: #ffffff;color: #09365f;float: left;}
    .mdd-pro-page{
        max-width: 1500px;
        margin: auto !important;
    }
    .mdd-links {list-style: none;display: flex;padding: 0;margin: 0;float: left;}
    .mdd-menu-element {margin: 0px 10px;line-height: 70px;}
    .mdd-menu-element a {color: #09365f;text-decoration: none;text-transform: uppercase;padding: 5px;}
    .mdd-menu-element a:visited {color: #09365f;text-decoration: none;}
    /* Visited link    */
    .mdd-menu-element a:hover {
        text-decoration: none;
        background: #e0e0e0;
        border-radius: 6px;
    }
    /* Mouse over link */
    .mdd_building_bg {display: table;width: 100%;height: auto;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;min-height: 300px;background-repeat: no-repeat;background-position: center bottom;background-image: url(../../uploads/2020/04/bg-batiment.jpg);}
    .mdd_building_bg h1 {color: #09365f;display: table-cell;vertical-align: middle;font-size: 45px;}
    .mdd_building_bg h1 span {font-size: 0.66em;}
    .clear {clear: both;}
    .thead-cell {background-color: rgb(47, 48, 66);text-align: center;color: white;}
    .table-user h1 {font-size: 22px;color: rgb(47, 48, 66);font-weight: bold;line-height: 66px;}
    .table-user table tr {border: 1px solid grey;border-collapse: collapse;}
    ​ .table-user thead {font-size: 16px;line-height: 48px;font-weight: bolder;}
    .table-user-body-tr {height: 40px;}
    .mdd-pro-page .fusion-logo {float: left;padding-left: 0;}
    .mdd_nicename {line-height: 70px;float: right;}
    .filter i {display: none;}
    .filter.selected i {display: inline-block;}
    .filter.selected {font-weight: 900;}


    /*Page formulaire  devis*/

    #formDevisPage h1{
        background-image: url(https://www.polygranit.fr/wp-content/uploads/2020/04/bg-home.jpg);
    color: #ffffff !important;
    text-align: center;
    padding-top: 100px;
    padding-bottom: 100px;
    background-size: cover;
    }
    .choix-piece {margin-top: 50px;text-align: center;}
    .choix-piece span {background: #2f3042;padding: 126px;color: white;margin-top: 0px;display: inline-block;margin-bottom: 15px;transition: 1s all;cursor: pointer;}
    .choix-piece span {margin-bottom: 15px;display: inline-block;font-size: 20px;padding: 0;width: 100%;max-width: 100%;padding-top: 40px;padding-bottom: 40px;}
    .choix-piece .button {display: inline-block;background-color: #0067fc;color: #ffffff;padding: 20px;text-align: center;cursor: pointer;padding-left: 40px;padding-right: 40px;text-decoration: none;transition: all .5s;}
    #recap {box-shadow: 0 2px 12px rgba(0,0,0,.1);padding: 20px;}
    .choix-piece span:hover, .choixMateriau span:hover {transform: scale(1.1);}
    .choixMateriau{
        text-align: center;
    }
    .choix-piece .button:hover{
        background-color: #09365f;
    }
    .choixMateriau span{
        padding:59px;
        color: #ffffff;
        background: #2f3042;
        display: inline-block;
        transition: all 1s;
        cursor: pointer;
    }
    .loaderCenter{
        position: absolute;
        width: 100%;
        height: 100%;
        background: #ffffffa6;
        z-index: 99999;
    }
    .loaderCenter img{
        position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    }
    .loader{position: absolute;width: 100%;height: 100%;left: 50%;top: 50%;transform: translate(-50%, -50%);background: white;opacity: 0.7;text-align: center;display: none;}
    .loader img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
    #recap .title, #recap .dimensionsTitle{
        font-weight: 900 !important;
        color: #09365f;
    
    }
    #recap h2{
        margin-bottom: 30px;
    }
    #recap .price{border: 3px solid #e3e8eb!important;padding: 5px;padding-top: 2px;padding-bottom: 2px;}
    #recap br{
        display: none;
    }
    .totalTitle{
        color: #09365f;
        font-weight: 900;
        margin-top: 0;
        display: inline-block;
        margin-bottom: 0;
    }
    .formContent{
        max-width: 1500px;
        margin: auto;
    }
    #secondStep .planTravail, #secondStep .credence{
        display: flex;
        justify-content: center;
    }
    .actions{
        border-top: 1px solid #e3e8eb;
        padding-top: 20px;
        text-align: center;
        clear: both;
        display: none;
        margin-top: 0px;
    }
    .actions .cancel,  .cancelCurrent{
        background-color: #0067fc;
        padding: 20px;
        padding-left: 30px;
        padding-right: 30px;
        color: #ffffff;
        margin-top: 20px;
        display: block;
        cursor: pointer;
        clear: both;
        text-decoration:none !important;
        text-align: center;
    }
    .actions .cancel:hover{
    background-color:#c1c1c1;
    }
    .cancelCurrent{
        display: none;
        font-size: 12px;
        padding: 9px;
        color: #ffffff !important;
        background-color: #09365f;
        margin-right: 10px;
    }
    .cancelCurrent:hover{
        background-color: #0067fc;
    }

    .beforeSelect .cancelCurrent{
        display: block;
    }

   
#firstStepTitle, #secondStepTitle, #thirdStepTitle, #fourthStepTitle, #fifthStepTitle, #faconnageTitle, #poseTitle, #additionalSalesTitle{
    background-color: #09365f;
    color: #ffffff;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    font-weight: 900;
    display: flex;
    justify-content: space-between;
    font-size: 20px;
    max-height: 110px;
    align-items: baseline;
    padding-top: 0;
}
#secondStepContent, #thirdStepContent, #fourthStepContent, #fifthStepContent, #lastStep{
    margin-top: 50px;
    margin-bottom: 40px;
}
#secondStepContent .planTravail,
#secondStepContent .credence {flex-direction: row;}
#thirdStepContent {
    margin-bottom: 20px;
}
#firstStepTitle a, #secondStepTitle a, #thirdStepTitle a, #fourthStepTitle a, #fifthStepTitle a,#faconnageTitle.beforeSelect a, #poseTitle.beforeSelect a{
    color: #09365f;
    cursor: pointer;
    text-decoration:none;
}
#firstStepTitle a:hover, #secondStepTitle a:hover, #thirdStepTitle a:hover,#fourthStepTitle a:hover, #fifthStepTitle a:hover, #faconnageTitle.beforeSelect a:hover, #poseTitle.beforeSelect a:hover{
    color: #0067fc;
}
.align{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}
#firstStepTitle.beforeSelect, #secondStepTitle.beforeSelect, #thirdStepTitle.beforeSelect, #fourthStepTitle.beforeSelect, #fifthStepTitle.beforeSelect, #faconnageTitle.beforeSelect, #poseTitle.beforeSelect{
    background-color: #e9eaee;
    margin-bottom: 0;
    color: #09365f;
}

#firstStepTitle.beforeSelect p span, #secondStepTitle.beforeSelect p span, #thirdStepTitle.beforeSelect p span, #fourthStepTitle.beforeSelect p span, #fifthStepTitle.beforeSelect p span, #faconnageTitle.beforeSelect p span, #poseTitle.beforeSelect p span  {
    opacity: 0.5;
}
#thirdStep .validate, #fourthStep .validate, #fifthStep .validate, #lastStep .newStep, .nextStep, .addBtn, .nextBtn, .nextPoseBtn, .acceptBtn, .refuseBtn, .validateForm, .acceptSendBtn, .refuseSendBtn, .thankYou a, .validateTVA, .endEdit, #save, .nextposeEndEdit{
    display: block;
    background: #0067fc;
    padding: 20px;
    text-align: center;
    color: #ffffff !important;
    font-weight: 600;
    margin-top: 40px;
    cursor: pointer;
    text-decoration:none;
    border: 1px solid #0067fc;
}
#thirdStep .validate:hover, #fourthStep .validate:hover, #fifthStep .validate:hover, #lastStep .newStep:hover, .nextStep:hover, .addBtn:hover, .nextBtn:hover, .nextPoseBtn:hover, .acceptBtn:hover, .refuseBtn:hover, .validateForm:hover, .acceptSendBtn:hover, .refuseSendBtn:hover, .thankYou a:hover, .validateTVA:hover, .endEdit:hover, #save:hover, .nextposeEndEdit:hover{
    background: #ffffff;
    color: #0067fc !important;
    text-decoration:none;
}
.validateForm{
    width: 100%;
}
#thirdStep{
    clear: both;
}
#main .noUi-marker.noUi-marker-horizontal.noUi-marker-normal {
    display: none;
}
#main .noUi-target {
    background: #09365f;
    border-radius: 4px;
    border: 1px solid #09365f;
    box-shadow: inset 0 1px 1px #888888, 0 3px 6px -5px #888;
}
#main .noUi-horizontal {
    height: 0px;
}
#main .noUi-handle:before, .noUi-handle:after{
    display: none !important;
}
#main .noUi-horizontal .noUi-handle {
    width: 34px;
    height: 28px;
    right: -17px;
    top: -15px;
    border: 0;
    background-color: #09365f;
    box-shadow: 0 0 black;
    border-radius: 50%;
}
#main .noUi-horizontal .noUi-handle:focus {
    outline: 0;
    box-shadow: 0 0 6px 1px #09365f;
}
.post-content .formContent p{
    margin: 0;
}
#fourthStepContent select{
    width: 80%;
    height: 61px;
    margin-left: 10%;
    margin-right: 10%;
}
#fourthStepContent .validate, #fifthStepContent .validate {margin-right: 10%;}
.clearfix{clear: both;}
#thirdStep .validate{
    margin-top: 70px;
}
#recap p{margin-bottom: 5px;}
#choixFaconnage, #choixTva {margin-top: 50px;width: 100%;}
#choixPose, #firstChoixPose {margin-top: 10px;width: 100%;}
#choixFaconnage option, #choixPose option, #firstChoixPose option, #choixTva option{font-size: 18px;padding-top: 10px;padding-bottom: 10px;}
.fa-trash-alt{
    color: #09365f;
    cursor: pointer;
}
.optionName.first .fa-trash-alt{
    display: none;
}
.errorMsg{
    display: none;
    color: red;
}
.pieceActions{
    display: flex;
    position: absolute;
    align-items: center;
    /*right: 30px;*/
    display: none;
}
.pieceActions img{
    max-width: 12px;
    max-height: 12px;
    margin-right: 10px;
}
.stepNumber {
    display: inline-block;
    font-family: Poppins;
    font-size: 40px;
    margin-left: 25px;
}
.stepNumberPoint{
    font-size: 50px;
    margin-right:30px;
}

.editText{
    opacity: 1 !important;
}
.edit img{
    vertical-align: baseline;
    margin-right: 10px;
}

.adressForm form input, #fifthStepContent input{
    border: 3px solid #e3e8eb;
}

.totalTTC .totalTitle{
    margin-top: 0;
}

#options .title{
    padding-left: 0;
}
#recap #options li {margin-bottom: 40px;}

.optionPose {
    padding-top: 15px;
}

.optionFaconnage img.modifFaconnage,
.optionPose img.modifPose,
#ventesAdditionnelles img.modifVentesAdditionnelles {
    /* position: absolute; */
    cursor: pointer;
    /*right: 24px;*/
    /*margin-top: -19px;*/
    float: right;
    margin-top: -20px;
}
#ventesAdditionnelles #ventesAdditionnellesItems li {
	margin-bottom: 40px;
}
#faconnage .listOptionFaconn {
    border-bottom: 1px solid #d2d2d2;padding: 4px;
}
#faconnage .listOptionFaconn label {
    max-width: 80%;
    max-width: calc( 100% - 85px );
}
#fifthStepContent .validate{
    display: inline-block;
    width: auto;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 12px;
    padding-bottom: 12px;
    float: right;
}

.validateBtn{
    display: inline-block;
    width: auto;
    text-align: center;
    padding-left: 50px !important;
    padding-right: 50px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    margin-bottom: 40px;
    float: right;
}

.addBtn{
    padding-left: 50px !important;
    padding-right: 50px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.configuration .step{
    clear: both;
}

#fifthStepContent .validate span, .validateBtn span{
    vertical-align: middle;
    margin-right: 9px;
}
#fifthStepContent .validate img, .validateBtn img{
    vertical-align: middle;
    transition: all .5s;
}
#fifthStepContent .validate .hover, .validateBtn .hover{
    opacity: 0;
    position: relative;
    left: -16px;
}

#fifthStepContent .validate:hover .hover, .validateBtn:hover .hover{
    opacity: 1;
}
#fifthStepContent .validate:hover .noHover, .validateBtn:hover .noHover{
    opacity: 0;
}
#recap h2{
    border-bottom: 1px solid #e9eaee;
    padding-bottom: 20px;
    text-transform: uppercase;
}
#pieces, #options, #ventesAdditionnelles {
    border-bottom: 1px solid #e9eaee;
    padding-bottom: 20px;
}

#options, #ventesAdditionnelles {
    padding-top: 20px;
}

.Total.alignright{
    clear: both;
    float: none;
    width: 100%;
    margin: 0;
    text-align: center;
    display: block;
    padding-top: 20px;
    padding-bottom: 10px;
}

#options ul{
    padding-left: 20px;
}

#pose .firstGroup,
#pose .secondGroup {
    margin-top: 50px;
}

#firstStepContent{
    max-width: 80%;
    margin: auto;
    margin-top: 50px;
}

#secondStepContent .choixMateriau:first-child span {
    padding-left: 41px;
    padding-right: 42px;
}
#secondStepContent .choixMateriau {
    min-width: 160px;
}
.flexContent{
    justify-content: space-between;
    align-items: baseline;
}

.flexContent a{
    align-items: center;
    justify-content: center;
}

.endEdit{
    display: none;
}

.pieceActions img, .pieceActions a{
    cursor: pointer;
}

.Total{
    font-size: 18px;
    font-weight: 600;
}

.optionName .name, .finition, .Materiau, .epaisseur{
    letter-spacing: 0;
}

.epSelector{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: wrap;
}

.epSelector a{
    display: block;
    background: #0067fc;
    padding: 20px 90px;
    text-align: center;
    color: #ffffff;
    font-weight: 600;
    cursor: pointer;
    display: block;
    text-decoration: none;
    border: 1px solid #0067fc;
    color: #ffffff !important;
    margin-bottom: 20px;
}

.epSelector a:hover{
    background: #ffffff;
    color: #0067fc !important;
    text-decoration:none;
}

#fourthStep select option{
    font-size: 17px;
    padding: 30px !important;
    min-height: 30px;
}

#pieceVizualizer{
    background: #2f3042;
    width: 70%;
    margin: auto;
    height: 200px;
    margin-top: 70px;
    display: none;
}

input[type="number"]{
    border: 1px solid #d2d2d2;
    font-size: 13px;
    color: #747474;
    padding: 8px 15px;
    margin-right: 1%;
    width: 100%;
    box-sizing: border-box;
}

.nextBtn.pose.validateBtn, .nextBtn.faconnage.validateBtn{
    float: right;
}

.paragraphClient{
    margin-bottom: 30px !important;
}

#optionFaconnageItems .optionRemove, #optionPoseItems .optionRemove {position: absolute;/*right: 22px;*/}
#optionFaconnageItems .name {
    letter-spacing: 0;
    max-width: 93%;
    max-width: calc( 100% - 25px);
}
.modal .avertissement {
    font-weight: 900;
    text-align: center;
    font-size: 16px;
    margin-bottom: 5px;
}

.modal .modal-description {
    text-align: center;
    margin-bottom: 0;
}
.modal-footer {
    border: 0;
    margin-top: 0;
    padding-top: 0;
}
.thankYou #pdfActions {display: none;}

.header-cu-logo {
    position: absolute;
    left: 15px;
}
.header-cu-link {
    min-width: 320px;
    min-height: 70px;
}
.header-cu-link .mdd-links {
    position: absolute;
    left: calc(50% - 185px);
}
.header-cu-pro {
    position: absolute;
    right: 15px;
}
@media screen and (max-width: 1410px) {
    #fifthStepContent .planTravail .align,
    #fifthStepContent .credence .align {
        display: block;
        margin-left: 10%;
        margin-right: 10%;
    }
}
@media screen and (max-width: 1200px) {
    h1 {margin-top: 50px; margin-bottom: 50px;}
}
@media screen and (max-width: 996px) {
    .fusion-logo-link img {max-height: 50px;}
    .header-cu-link {min-height: 50px;}
    .header-cu-link .mdd-links .mdd-menu-element, .header-cu-pro {line-height: 52px;}
}
@media screen and (max-width: 800px) {
    .choix-piece.credence {margin-top: 0;}
}
@media screen and (max-width: 780px) {
    .header-cu-link {min-height: 100px;}
    .header-cu-link .mdd-links {top: 53px}    
}
@media screen and (max-width: 660px) {
    #firstStepTitle,
    #secondStepTitle,
    #thirdStepTitle,
    #fourthStepTitle,
    #fifthStepTitle {
        display: block;
        max-height: 200px;
    }
    #firstStepTitle p:first-child,
    #secondStepTitle p:first-child,
    #thirdStepTitle p:first-child,
    #fourthStepTitle p:first-child,
    #fifthStepTitle p:first-child {
        min-width: 100%;
        font-size: 15px;
    }
    #firstStepTitle .editText,
    #secondStepTitle .editText,
    #thirdStepTitle .editText,
    #fourthStepTitle .editText,
    #fifthStepTitle.editText {
        font-size: 15px;
    }
    
}
@media screen and (max-width: 580px) {
    #secondStepContent .planTravail,
    #secondStepContent .credence {flex-direction: column;}
}
@media screen and (max-width: 380px) {
    .header-cu-link .mdd-links {left: calc(50% - 167px);}
    .header-cu-link .mdd-links .mdd-menu-element {margin: 0px 4px;}  
    #firstStepTitle p .stepNumber,
    #secondStepTitle p .stepNumber,
    #thirdStepTitle p .stepNumber,
    #fourthStepTitle p .stepNumber,
    #fifthStepTitle p .stepNumber {margin-left: 0px;font-size: 30px;}
    #firstStepTitle p .stepNumberPoint,
    #secondStepTitle p .stepNumberPoint,
    #thirdStepTitle p .stepNumberPoint,
    #fourthStepTitle p .stepNumberPoint,
    #fifthStepTitle p .stepNumberPoint {margin-right: 0px;}
}
@media screen and (max-width: 380px) {
    .header-cu-link .mdd-links {left: calc(50% - 143px);}
    .header-cu-link .mdd-links .mdd-menu-element a {font-size: 12px;}
}