@font-face { font-family: 'Stolzl'; src: url(../fonts/Stolzl-Regular.woff2) format('woff2'), url(../fonts/Stolzl-Regular.woff) format('woff'); font-weight: normal; font-display: swap }
@font-face { font-family: 'Stolzl'; src: url(../fonts/Stolzl-Medium.woff2) format('woff2'), url(../fonts/Stolzl-Medium.woff) format('woff'); font-weight: bold; font-display: swap }
html,
body { height: 100% }
body { margin: 0; font-family: 'Stolzl', Arial; overflow: hidden; background-color: #003366; color: #FFF }
* { box-sizing: border-box }
ul { margin: 0; padding: 0; list-style: none }
a { outline: 0; cursor: pointer; text-decoration: none }
a:focus { outline: none }
input,
select,
textarea { font-family: 'Stolzl', Arial; font-weight: normal }
:-moz-focusring {
 outline: 0
}
textarea { resize: none }
.noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none }
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale }
.main { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 500px }
.main h1 { font-size: 36px }
.main textarea { border-radius: 6px; border: 0; padding: 20px; font-size: 17px; min-height: 170px; width: 100%; margin: 20px 0 20px 0 }
.main .duree { display: block; padding: 10px 15px; font-size: 14px; text-align: left; line-height: 20px; margin-bottom: 10px; background-color: rgba(0,0,0,0.2); border-radius: 8px }
.main .duree .datepicker { display: inline-block; border-radius: 5px; border: 0; height: 30px; padding: 0 8px; width: 100px; font-size: 14px; text-align: center }
.main a { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.4px; background-color: transparent; background-image: linear-gradient(200deg, #28acdf 0%, #0a5184 100%); border-radius: 100px 100px 100px 100px; padding: 15px 30px 15px 30px; border: 1px solid #003366; transition: 0.15s ease-in }
.main a:hover { border-color: #FFF }
.main .duree .email { display: none }
.main .duree .email input { display: block; width: 100%; border-radius: 5px; border: 0; height: 30px; padding: 0 8px; margin: 10px 0 0px 0 }
.main .duree .email textarea { font-size: 14px; margin: 10px 0 5px 0 }
.container { display: inline-block; vertical-align: middle; position: relative; padding-left: 28px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin-right: 10px }
.container input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
.container .checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; background-color: #FFF; border-radius: 50%; }
.container:hover input ~ .checkmark { background-color: #ccc; }
.container input:checked ~ .checkmark { background-color: #46bfee; }
.container .checkmark:after { content: ""; position: absolute; display: none; }
.container input:checked ~ .checkmark:after { display: block; }
.container .checkmark:after { top: 6px; left: 6px; width: 8px; height: 8px; border-radius: 50%; background: white; }
.container2 { display: inline-block; vertical-align: middle; position: relative; padding-left: 28px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none }
.container2 input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
.container2 .checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; background-color: #FFF; border-radius: 4px }
.container2:hover input ~ .checkmark { background-color: #ccc; }
.container2 input:checked ~ .checkmark { background-color: #46bfee; }
.container2 .checkmark:after { content: ""; position: absolute; display: none; }
.container2 input:checked ~ .checkmark:after { display: block; }
.container2 .checkmark:after { left: 6px; top: 2px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
/* DATEPICKER */
.datepicker-container { color: #000; background-color: #fff; direction: ltr; font-size: 14px; font-weight: normal; left: 0; line-height: 30px; position: fixed; -webkit-tap-highlight-color: transparent; top: 0; -ms-touch-action: none; touch-action: none; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 260px; z-index: -1; border-radius: 12px }
.datepicker-dropdown { box-shadow: 1px 1px 8px 0px rgba(0,0,0,0.1); box-sizing: content-box; position: absolute; z-index: 1 }
.datepicker-inline { position: static }
.datepicker-top-left,
.datepicker-top-right { border-top-color: #FFF }
.datepicker-top-left:after,
.datepicker-top-left:before,
.datepicker-top-right:after,
.datepicker-top-right:before { border-top: 0; left: 10px; top: -5px }
.datepicker-top-left:before,
.datepicker-top-right:before { border-bottom-color: #FFF }
.datepicker-top-left:after,
.datepicker-top-right:after { border-bottom-color: #fff; top: -4px }
.datepicker-bottom-left,
.datepicker-bottom-right { border-bottom-color: #FFF }
.datepicker-bottom-left:after,
.datepicker-bottom-left:before,
.datepicker-bottom-right:after,
.datepicker-bottom-right:before { border-bottom: 0; bottom: -5px; left: 10px }
.datepicker-bottom-left:before,
.datepicker-bottom-right:before { border-top-color: #FFF }
.datepicker-bottom-left:after,
.datepicker-bottom-right:after { border-top-color: #fff; bottom: -4px }
.datepicker-bottom-right:after,
.datepicker-bottom-right:before,
.datepicker-top-right:after,
.datepicker-top-right:before { left: auto; right: 10px }
.datepicker-panel>ul { margin: 0; padding: 10px; width: 100% }
.datepicker-panel>ul:after,
.datepicker-panel>ul:before { content: " "; display: table }
.datepicker-panel>ul:after { clear: both }
.datepicker-panel>ul>li { background-color: #fff; cursor: pointer; float: left; height: 30px; list-style: none; margin: 0; padding: 0; text-align: center; width: calc(100% / 7) }
.datepicker-panel>ul>li:hover { background-color: #eff2fb; color: #003366 }
.datepicker-panel>ul>li.muted,
.datepicker-panel>ul>li.muted:hover { color: #999 }
.datepicker-panel>ul>li.highlighted { background-color: #eff2fb; color: #003366 }
.datepicker-panel>ul>li.highlighted:hover { background-color: #eff2fb; color: #003366 }
.datepicker-panel>ul>li.picked,
.datepicker-panel>ul>li.picked:hover { color: #003366 }
.datepicker-panel>ul>li.disabled,
.datepicker-panel>ul>li.disabled:hover { background-color: #fff; color: #ccc; cursor: default }
.datepicker-panel>ul>li.disabled.highlighted,
.datepicker-panel>ul>li.disabled:hover.highlighted { background-color: #eff2fb; color: #003366 }
.datepicker-panel>ul>li[data-view="month next"],
.datepicker-panel>ul>li[data-view="month prev"],
.datepicker-panel>ul>li[data-view="year next"],
.datepicker-panel>ul>li[data-view="year prev"],
.datepicker-panel>ul>li[data-view="years next"],
.datepicker-panel>ul>li[data-view="years prev"],
.datepicker-panel>ul>li[data-view=next] { font-size: 18px }
.datepicker-panel>ul>li[data-view="month current"],
.datepicker-panel>ul>li[data-view="year current"],
.datepicker-panel>ul>li[data-view="years current"] { width: 165px }
.datepicker-panel>ul[data-view=months]>li,
.datepicker-panel>ul[data-view=years]>li { height: 52.5px; line-height: 52.5px; width: 52.5px }
.datepicker-panel>ul[data-view=week]>li,
.datepicker-panel>ul[data-view=week]>li:hover { background-color: #fff; cursor: default }
.datepicker-hide { display: none }
