body, html{background:white; padding:0; margin:0; font-family: 'ProximaNova-Regular', Arial, Helvetica, sans-serif; min-height:100vh; width:100%; display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start;}

@font-face{font-family:'ProximaNova-Bold'; src:url(ProximaNova-Bold.woff) format('woff');}
@font-face{font-family:'ProximaNova-Regular'; src:url(ProximaNova-Regular.woff) format('woff');}
@font-face{font-family:'ProximaNova-Light'; src:url(ProximaNova-Light.woff) format('woff');}

/* HEADER */
header{width:100%; max-width:1200px; border-bottom:3px solid #296495;}
header #headerContent{width:100%; padding:5px; box-sizing:border-box; position:relative; display:flex; justify-content:space-between; align-items:center;}
header #headerContent a{}
header #headerContent a #headerImg{height:40px; width:auto;}
header #headerContent #headerTxt{font-size:16px; line-height:18px; color:#707070;}

/* FOOTER */
footer{background-color:#056699; padding:45px 0; width:100%; align-self:flex-end; display:flex; align-items:center; justify-content:center;}
footer #footerContent{max-width:1000px; width:100%; display:flex; flex-wrap:wrap; justify-content:center; margin:0 80px; font-size:14px; line-height:16px; color:white;}
footer #footerContent a{color:white; text-decoration:none;}
footer #footerContent a:hover{text-decoration:underline;}
footer #footerContent .sep{width:1px; background-color:white; height:10px; margin:0 20px; display:inline-block;}

/* CONTENT */
#wrapper{width:100%; max-width:1200px; margin:20px 0; display:flex; justify-content:flex-start;}
#wrapper #title{font-size:22px; font-weight:bold; background-color: #5e9ebf; color:white; text-align:center; padding:30px 5px; box-sizing:border-box; width:170px; position:fixed; font-family: 'ProximaNova-Regular', Arial, Helvetica, sans-serif;}
#wrapper #rightCol{width:calc(100% - 170px); margin:0 0 0 170px; padding:0 10px 0 30px; color:#333333; font-size:14px;}
#wrapper #rightCol a{text-decoration:underline; color:black;}
h1{color:#296495; font-size:36px; font-family: 'ProximaNova-Light';}
h2{color:#296495; font-size:30px; font-family: 'ProximaNova-Bold';}
.red{color:red;}
.grasBleu{font-weight: bold; color:#296495; font-style: italic;}
.underline{text-decoration: underline;}
.homeGetForm{display:inline-block; width:25%; text-align:center; height:100px; vertical-align:top; display:table-cell; vertical-align:middle;}
.blueBt{background-color:#296495; border-radius: 5px; padding:15px 10px; width:200px; max-width:100%; cursor:pointer; color:white; border: none;}
table{width:100%;}
table, tr, td{border:0; border:1px solid grey; border-bottom:none; margin:0; padding:8px; border-spacing : 0; border-collapse : collapse;}
.noBorder{border:none;}
td{width:70%; vertical-align: top;}
td sup{line-height:0;}
._30{width:30%;}
._70{width:70%;}
.end{border-bottom:1px solid grey;}
.tableTitle{width:30%; color:#006699; font-weight:bold; vertical-align:top;}
.tableTitle2{width:10%; color:#006699; font-weight:bold; vertical-align:middle;}
.tableTitle3{width:20%; color:#006699; font-weight:bold;}


/* FORM */

#rightColForm{width:calc(100% - 240px); margin:0 40px 0 200px; color:#333333; font-size:14px; background-color:#efefef; padding:20px;}
.formCenter{width:80%; text-align:center; margin:40px auto;}
#formBottomText{color:#333; font-size:12px; font-style: italic;}
#formError{width:100%; font-weight: bold; color:red; text-align:center;}
#formEnd{width:100%; font-weight: bold; color:#296495; text-align:center;}
#formExpl{font-size:12px;margin-top: -10px;margin-bottom: 10px;}

@media (max-width:850px) {
    footer{padding:20px 0;}
    footer #footerContent{flex-direction:column; justify-content:center; text-align:center;}
    footer #footerContent .sep{display:none;}
}

@media (max-width:820px) {
    #wrapper #title{font-size:18px; padding:25px 5px; width:120px;}
    #wrapper #rightCol{width:calc(100% - 120px); margin:0 0 0 120px; padding:0 10px 0 20px;}
    #rightColForm{width:calc(100% - 160px); margin:0 20px 0 140px;}
    h1{font-size:30px;}
    h2{font-size:26px;}

    
    .blueBt{font-size:15px;}
    #formBottomText{font-size:20px;}
    table, tbody, tr, td{display:block; width:auto!important;}
    table, tr{border:none; padding:0;}
    .end.tableTitle{border-bottom:none;}
    #footerContent{padding-left:0; text-align:center;}
}

@media (max-width: 600px) {
    h1{font-size:25px;}
    h2{font-size:22px;}
    header #headerContent a #headerImg{height:25px;}
    #wrapper #title{font-size:14px; padding:15px 5px; width:90px;}
    #wrapper #rightCol{width:calc(100% - 90px); margin:0 0 0 90px; padding:0 10px;}
    #rightColForm{width:calc(100% - 110px); margin:0 10px 0 100px;}
    .homeGetForm{display:block; text-align:center; width:100%; }
    .middle{padding:30px 0; height:auto;}
    .blueBt{font-size:15px;}
    td{width:60%;}
    .tableTitle{width:40%;}
    .tableTitle2{width:15%; word-wrap:break-word;}
    .tableTitle3{width:25%; word-wrap:break-word;}
    #formBottomText{font-size:13px;}
    #footerContent{line-height:24px; padding-top:30px;}
}

@media (max-width: 380px) {
    #wrapper #title{font-size:10px; padding:15px 5px; width:70px;}
    #wrapper #rightCol{width:calc(100% - 70px); margin:0 0 0 70px; padding:0 10px;}
    #rightColForm{width:calc(100% - 90px); margin:0 10px 0 80px;}
}