/*font*/
@import url('../../../fonts.googleapis.com/css2bf58.css?family=Lato:wght@300;400;500;700&display=swap');

/*reset*/
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font-display: optional;font-family:'Lato',sans-serif;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}

/*container*/
.container{padding:0px 35px;margin:0 auto;box-sizing:border-box;}

/*main*/
.a11y{top:0;position:absolute;width:100%;z-index:-1;}
.a11y .a11y-list{position:relative;display:block;list-style:none;margin:0 auto;}
.a11y .a11y-list .a11y-item a{position:absolute;display:inline-block;z-index:30;padding:.5em 1em;background:#f4f4f4;transform:translateY(-100%);color:#003c69;}

/*header*/
header{width:100%;display:-ms-flexbox;display:block;-ms-flex-direction:column;flex-direction:column;box-sizing:border-box;position:relative;position:-webkit-sticky;position:fixed;top:-1px;z-index:9;box-shadow:0 0 160px 0 rgb(0 0 0 / 10%); background:#fff;}
header h1{text-indent:-4000px; display:block; overflow:hidden;}
header .wrapper{width:100%;display:block; position:relative; z-index:9;}
header .container{display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-pack:justify;justify-content:space-between;}
header a.logo{display:flex;position:relative;overflow:hidden;}
header a.logo figure.logo{box-sizing:border-box;padding:25px 0px;margin:0px 50px 0 0;float:left;-ms-flex-order:2;order:2;display:flex;align-items:center;justify-content:center;}
header a.logo figure.logo img{filter: none;}
header a.logo figure.logo figcaption{position:absolute;display:inline-block;z-index:30;padding:.5em 1em;background:#f4f4f4;top:-100%;color:#003c69;}
header a.logo figure.logo img.mobile{display:none;}

header nav.page-nav ul.meta li:first-child{padding-left:0;}
header nav.page-nav ul.meta li a{width:auto;transition:.2s;font-size:14px;line-height:20px;position:relative;}
header nav.page-nav ul.meta li sup{display:inline-block; transform:translateY(-6px); font-size: 10px; line-height:14px; font-weight:600; padding:2px 8px 0; margin:0 0 0 5px; border-radius:10px;background:#e4f4f8;}
header nav.page-nav ul.meta li.contrast button:hover{background:url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='adjust' class='svg-inline--fa fa-adjust fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23578da2' d='M8 256c0 136.966 111.033 248 248 248s248-111.034 248-248S392.966 8 256 8 8 119.033 8 256zm248 184V72c101.705 0 184 82.311 184 184 0 101.705-82.311 184-184 184z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}
    
header nav.page-nav ul.main li:first-child{padding-left:0;}
header nav.page-nav ul.main li a{font-size:19px; line-height:30px; position:relative; transition:.2s;}
body:not(.a11y){color:#fff;}
body:not(.a11y) header nav.page-nav ul.main li a:hover:before{width:100%}
body:not(.a11y) header:not(.spot) nav.page-nav ul.meta li a:hover{color:#578da2;}
body:not(.a11y) header:not(.spot) nav.page-nav ul.main li a:hover{color:#578da2;}
body:not(.a11y) header:not(.spot) nav.page-nav ul.main li a{color:#0c3e52;}
header nav.page-nav ul.main li a::before{content:"";width:0;height:2px;transition:.2s;left:0;bottom:-5px; background:#578da2; position:absolute;}

header.spot nav.page-nav ul.main li a{color:#fff;}
header.spot nav.page-nav ul.meta li a{color:#fff;}
header.spot nav.page-nav ul.main li a::before{background:#fff;}
header.spot nav.page-nav ul.meta li a::before{background:#fff;}
header.spot{box-shadow:none; background:none;}
header.spot a.logo figure.logo img{filter: brightness(0) invert(1);}
header.spot nav.page-nav ul.meta li sup{background:none;}
header.spot nav.controls button.search{width:15px; height:15px; color:#0c3e52; text-indent:-9999px; position:relative; background: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='search' class='svg-inline--fa fa-search fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ffffff' d='M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}

header nav.controls{padding:0 0 0 20px; margin:25px 0; border-left:1px solid #e8e8e8; -ms-flex-order: 4; order:4; display:-ms-flexbox; display:flex; -ms-flex-align: center; align-items: center;}
header nav.controls button.search{width:15px; height:15px; color:#0c3e52; text-indent:-9999px; position:relative; background: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='search' class='svg-inline--fa fa-search fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230c3e52' d='M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}
header nav.controls button.menu{width:15px; height:15px; display:none; color:#0c3e52; text-indent:-9999px; margin:0px 0px 0px 25px; position:relative; background: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='bars' class='svg-inline--fa fa-bars fa-w-14' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%230c3e52' d='M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}

/*aside*/
header aside{transform:translateY(-232px); height:auto; overflow:hidden; box-shadow:inset 0 0 10px 0 rgb(0 0 0 / 10%); background:#f6faff;}
header aside.open{transform:translateY(0%);}
header aside .container{padding:25px;}
header aside form{width:100%; display:flex;}
header aside form label.search-label{order:2; align-items:center; justify-content:center; float:left; color:#0c3e52; line-height:35px;}
header aside form input.search-input{order:3; display:-ms-flexbox; -ms-flex-order:3; float:left; flex:1;-ms-flex:1; padding:0px 10px; color:#0c3e52; margin:0px 35px 0px; background: none; border: none; line-height: 35px; font-size: 20px; border-bottom: 2px solid #008ec4;}
header aside form input.search-input::-webkit-search-cancel-button{position:relative;-webkit-appearance:none;height:15px;width:15px;background:url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='times' class='svg-inline--fa fa-times fa-w-11' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='%230c3e52' d='M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}
header aside form input.search-input:focus{outline: 2px dotted #000; outline-width: 2px; outline-style: dotted; outline-color: #000; box-shadow: 0 0 0 2px #fff;}
header aside form button.search-button{position:relative; max-width:100px; order:4; -ms-flex-order:3; flex:1; -ms-flex:1; float:left; background: #008ec4; border-radius: 3px; text-align: left; padding: 0px 0px 0px 20px; font-weight: bold; color: #fff; font-size: 16px;}
header aside form button.search-button:after{content:""; width:15px; height:15px; display:block; position:absolute; top:11px; right:15px; background: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='search' class='svg-inline--fa fa-search fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ffffff' d='M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}

main{padding:145px 0px 0px 0px;}
main.spot{padding:0px 0px 0px 0px;}

.spots{width:100%; height:450px; margin:0px; display:block; position:relative;}
.spots .wrapper{width:100%; height:450px; display:block;}
.spots:before{content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(21,21,21,.7);}

/*article*/
article:not(.splash){}
.spot-splash{width:100%; height:450px; display:block; overflow:hidden; position:relative; margin: -20px 0px 0px 0px;}
.spot-splash .slogan{width:100%; position:absolute; top:45%;}
.spot-splash .slogan h1{font-size:36px; line-height: 1.4em; color: #fff; margin:0 0 15px 0;}
.spot-splash .slogan p{font-size:20px; line-height: 1.4em; color: #fff;}
article .hero .items{width:50%; height:100%; float:left; position:relative;}

/*article section*/
article section .intro h2{font-size:30px; line-height:48px; font-weight:600; color:#0c3e52;}
article section .intro h2.center{text-align:center;}
article section .intro p{text-align:center; width:600px; margin:auto; font-size:18px; line-height:1.6em; color:#0c3e52;}

article section .breadcrumbs{display:block;}
article section .breadcrumbs ul{width:100%; margin:0px !important;}
article section .breadcrumbs ul li{display:inline-block;}
article section .breadcrumbs ul li a{width:auto; height:25px; display:inline-block; line-height:25px; margin:0px 0px 15px 0px; padding:0px 10px; font-size:12px; border-radius:20px; font-weight:600; color:#008ec4; background:#e4f4f8;}
article section .hidden{display:none;}
article section.content{width:100%; max-width:900px; margin:auto; padding:90px 35px 30px; box-sizing:border-box;}
article section.content h1{font-size:30px; line-height:48px; margin:0px 0px 15px 0px; font-weight:600; color:#0c3e52;}
article section.content h2{font-size:30px; line-height:48px; margin:0px 0px 15px 0px; font-weight:600; color:#0c3e52;}
article section.content h3{font-size:26px; line-height:36px; margin:0px 0px 10px 0px; font-weight:600; color:#0c3e52;}
article section.content h4{font-size:18px; line-height:32px; margin:0px 0px 0px 0px; font-weight:600; color:#0c3e52;}
article section.content h2.center{text-align:center;}
article section.content h1.center{text-align:center;}
article section.content p{margin:0px 0px 35px 0px; font-size:18px; line-height:1.6em; color:#0c3e52;}
article section.content p.formatted{margin:0px 0px 35px 0px; font-size:18px; line-height:1.6em; font-weight:bold; color:#0c3e52; padding:15px 25px; border-radius:10px; background:#f6f8fb;}
article section.content p small{font-size:16px;}
article section.content ul, article section.content ol{list-style:initial; margin:0px 0px 35px 20px;}
article section.content li{font-size:18px; line-height:1.6em; color:#0c3e52;}
article section.content table *{font-size:18px; line-height:1.6em; color:#0c3e52}

/* whitepapers formulier */
article section.content .whitepapers{}
article section.content .whitepapers p {margin: 0px 0px 20px 0px; }
article section.content .whitepapers p.error { color: red; }
article section.content .whitepapers .inputbox { position: relative; width: auto; height: 70px; margin-bottom: 20px; }
article section.content .whitepapers .inputbox:first-child { margin-top:20px;  }
article section.content .whitepapers .inputbox label { height: 20px; line-height: 20px; color: #0c3e52; display:block; margin:0px 0px 10px 0px;}
article section.content .whitepapers .inputbox.error label { color: red; }
article section.content .whitepapers .inputbox label span.required { color:red; }
article section.content .whitepapers .inputbox input { width:100%; height:35px; line-height:35px; display:block; border-radius:7px; border:1px solid #ccc; padding:0px 15px; box-sizing:border-box;}
article section.content .whitepapers .inputbox.error input { border: 2px solid red; }
article section.content .whitepapers .inputbox.checkbox { height: 20px; }
article section.content .whitepapers .inputbox input[type="checkbox"] { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
article section.content .whitepapers .inputbox label.checklabel { cursor:pointer; height: 20px; line-height:20px; margin: 0px 0px 0px 30px; }
article section.content .whitepapers .inputbox span.checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; background-color: #eee; }
article section.content .whitepapers .inputbox .checklabel:hover input ~ .checkmark { background-color: #ccc; }
article section.content .whitepapers .inputbox .checklabel input:checked ~ .checkmark { background-color: #0487B5; }
article section.content .whitepapers .inputbox span.checkmark:after { content: ""; position: absolute; display: none; }
article section.content .whitepapers .inputbox .checklabel input:checked ~ .checkmark:after { display: block; }
article section.content .whitepapers .inputbox .checklabel .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); }
article section.content .whitepapers .inputbox:last-child { margin-bottom: 10px; }
article section.content .whitepapers .inputbox [type="submit"] { width:350px; max-width:100%; margin: 35px 0px 0px 0px; height:45px; line-height:45px; padding:0px 20px; text-align:center; border-radius:40px; border:2px solid rgba(4,135,181,1); font-weight:bold; font-size:18px; background:#fff; color:rgba(4,135,181,1); font-weight:bold; transition:.2s;}
article section.content .whitepapers .inputbox [type="submit"]:hover { color:#fff; transition:.2s; background:rgba(4,135,181,1);}
article section.content .box-list{list-style:none; margin:0px;}
article section.content .box-list li{margin:0px 0px 35px 0px; padding:0px 35px;}
article section.content .box-list li h3{width:100%; height:45px; display:block; border-radius:10px; line-height:45px; font-size:16px; padding:0px 35px 0px 5px; margin:0px -35px 25px; box-shadow:0 10px 20px 0 rgb(0 0 0 / 10%); background:#fff;}
article section.content .box-list li h3:before{content:''; width:30px; height:10px; transition:.2s; margin-left:0px; display:inline-block; background:url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='chevron-right' class='svg-inline--fa fa-chevron-right fa-w-10' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23008ec4' d='M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z'%3E%3C/path%3E%3C/svg%3E") no-repeat center center;}

article section.content.half{width:50%; float:left; box-sizing:border-box;}
article section.form{width:50%; float:left; box-sizing:border-box;}
article section.form form input{width:100%; height:35px; line-height:35px; display:block; border-radius:7px; border:1px solid #ccc; padding:0px 15px; box-sizing:border-box;}
article section.form form textarea{width:100%; height:150px; line-height:35px; display:block; border-radius:7px; border:1px solid #ccc; padding:0px 15px; box-sizing:border-box;}
article section.form form label{font-size:14px; font-weight:bold;}
article section.form form p{margin:0px 0px 15px;}
article section.form form input[type="submit"]{height:45px; line-height:45px; cursor:pointer; padding:0px 20px; text-align:center; border-radius:40px; border:2px solid rgba(4,135,181,1); font-weight:bold; font-size:18px; background:#fff; color:rgba(4,135,181,1); font-weight:bold; transition:.2s;}
article section.form form input[type="submit"]:hover{color:#fff; transition:.2s; background:rgba(4,135,181,1);}
/* form code veld */
article section.form form input.code,
article section.content .whitepapers .inputbox input.code {width:88%; float:right; display:inline-block;}
article section.form form label,
article section.content .whitepapers .inputbox label.code {line-height:35px;}


/* bestellijst formulier */
article section.content .orderlist{}
article section.content .orderlist p {margin: 0px 0px 20px 0px; }
article section.content .orderlist p.error { color: red; }
article section.content .orderlist .inputbox { position: relative; width: auto; height: 70px; margin-bottom: 20px; }
article section.content .orderlist .inputbox:first-child { margin-top:20px;  }
article section.content .orderlist .inputbox label { height: 20px; line-height: 20px; color: #0c3e52; display:block; margin:0px 0px 10px 0px;}
article section.content .orderlist .inputbox.error label { color: red; }
article section.content .orderlist .inputbox label span.required { color:red; }
article section.content .orderlist .inputbox input { width:100%; height:35px; line-height:35px; display:block; border-radius:7px; border:1px solid #ccc; padding:0px 15px; box-sizing:border-box;}
article section.content .orderlist .inputbox.error input { border: 2px solid red; }
article section.content .orderlist .inputbox.checkbox { height: 20px; }
article section.content .orderlist .inputbox input[type="checkbox"] { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; }
article section.content .orderlist .inputbox label.checklabel { cursor:pointer; height: 20px; line-height:20px; margin: 0px 0px 0px 30px; }
article section.content .orderlist .inputbox label small { font-size: 14px;font-style: italic;; }
article section.content .orderlist .inputbox span.checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; background-color: #eee; }
article section.content .orderlist .inputbox .checklabel:hover input ~ .checkmark { background-color: #ccc; }
article section.content .orderlist .inputbox .checklabel input:checked ~ .checkmark { background-color: #0487B5; }
article section.content .orderlist .inputbox span.checkmark:after { content: ""; position: absolute; display: none; }
article section.content .orderlist .inputbox .checklabel input:checked ~ .checkmark:after { display: block; }
article section.content .orderlist .inputbox .checklabel .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); }
article section.content .orderlist .inputbox:last-child { margin-bottom: 10px; }
article section.content .orderlist .inputbox [type="submit"] { width:350px; max-width:100%; margin: 35px 0px 0px 0px; height:45px; line-height:45px; padding:0px 20px; text-align:center; border-radius:40px; border:2px solid rgba(4,135,181,1); font-weight:bold; font-size:18px; background:#fff; color:rgba(4,135,181,1); font-weight:bold; transition:.2s;}
article section.content .orderlist .inputbox [type="submit"]:hover { color:#fff; transition:.2s; background:rgba(4,135,181,1);}

/*blog*/
article .box.icon{width:100%; padding:35px; display:table; border-radius: 30px; margin:0px 0px 35px 0px; box-shadow: 0 10px 20px 0 rgb(0 0 0 / 10%); background: #fff;}
article .box.icon .icon{width:25%; display:table-cell; height:100%; vertical-align:middle; margin:0px 35px 0px 0px;}
article .box.icon .icon svg{width:30%; margin:auto; display:block; color:#008ec4;}
article .box.icon .content{display: table-cell; vertical-align: middle;}
article .box.icon .content ul{margin:0px 0px 0 20px;}

/*cookie*/
div.cookie{ width: 500px; position:fixed; left:20px; bottom:20px; transform: scale(1); transition: .2s; transform: scale(1); align-items: center; justify-content: center; float: left; border-radius: 30px; box-shadow: 0 10px 20px 0 rgb(0 0 0 / 10%); background: #fff; }
div.cookie div.text{ padding:15px; font-size: 13px; line-height: 1.2em; color: #0c3e52; }
div.cookie p.button{display:inline-block; margin:15px 0px 0px 0px;}
div.cookie p.button .btn{float:left; height:25px; cursor:pointer; line-height:25px; padding:0px 10px; text-align:center; border-radius:40px; border:2px solid rgba(4,135,181,1); font-weight:bold; font-size:13px; background:#fff; color:rgba(4,135,181,1); font-weight:bold; transition:.2s;}
div.cookie p.button .btn:hover{color:#fff; transition:.2s; background:rgba(4,135,181,1);}

/*documenten*/
article section.content .documents { width:100%; }
article section.content .documents-half { width:50%; float:left; margin:0px 0px 35px 0px; }
article section.content .documents-half span { font-size: 18px; line-height: 1.6em; color: #0c3e52; }

/*desktop*/
@media only screen and (min-width: 1061px) {
    header, header .wrapper{height:145px;}
    header nav.page-nav{width:auto;float:left;box-sizing:border-box;padding:25px 25px 40px 0px;-ms-flex:1;flex:1;-ms-flex-order:3;order:3;}
    header nav.page-nav ul.meta{width:auto;float:right;box-sizing:border-box;padding:10px 0px;}
    header nav.page-nav ul.meta li{padding:0px 20px;display:inline-block;}
    header nav.page-nav ul.main{width:auto; float:right; box-sizing:border-box; padding:10px 0 0; display: -ms-flexbox;display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; -ms-flex-align: end; align-items: flex-end;-ms-flex-pack: end; justify-content: flex-end;}
    header nav.page-nav ul.main li{width:auto; padding:0 20px; box-sizing: border-box; float:left;}
    header nav.page-nav ul.meta li.contrast button{width:15px; height:15px; color:#0c3e52; text-indent:-9999px; position:relative; background:url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='adjust' class='svg-inline--fa fa-adjust fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230c3e52' d='M8 256c0 136.966 111.033 248 248 248s248-111.034 248-248S392.966 8 256 8 8 119.033 8 256zm248 184V72c101.705 0 184 82.311 184 184 0 101.705-82.311 184-184 184z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}
    header.spot nav.page-nav ul.meta li.contrast button{color:#fff; background:url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='adjust' class='svg-inline--fa fa-adjust fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ffffff' d='M8 256c0 136.966 111.033 248 248 248s248-111.034 248-248S392.966 8 256 8 8 119.033 8 256zm248 184V72c101.705 0 184 82.311 184 184 0 101.705-82.311 184-184 184z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}
}

/*mobile*/
@media only screen and (max-width: 1060px) {
    header, header .wrapper{height:102px;}
    header nav.page-nav{width:100%; height:auto; display:table; overflow:hidden; float:none; clear:both; padding:35px; position:absolute; left:0; top:0px; height:auto; display:block; background:#fff; transform:translate(0, -100%); box-shadow: 0 10px 20px 0 rgb(0 0 0 / 10%);}
    header nav.page-nav.open{transform:translate(0, 0%); transition:.2s;}
    header nav.page-nav ul.meta{width:100%; height:auto; float:none; display:table-footer-group;}
    header nav.page-nav ul.meta li{width:100%; height:auto; display:block; float:none; padding:0px; margin:0px 0px 10px;}
    header nav.page-nav ul.main{width:100%; height:auto; float:none; display:table-header-group;}
    header nav.page-nav ul.main li{width:100%; height:auto; display:block; float:none; padding:0px; margin:0px 0px 10px;}
    header nav.page-nav ul.meta li.contrast button{width:auto; height:15px; text-indent:0px; padding:0px 0px 0px 25px; color:#0c3e52; position:relative; background:url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='adjust' class='svg-inline--fa fa-adjust fa-w-16' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230c3e52' d='M8 256c0 136.966 111.033 248 248 248s248-111.034 248-248S392.966 8 256 8 8 119.033 8 256zm248 184V72c101.705 0 184 82.311 184 184 0 101.705-82.311 184-184 184z'%3E%3C/path%3E%3C/svg%3E") no-repeat;}

    header nav.controls{border:none;}
    header nav.controls button.search,
    header nav.controls button.menu{width:25px; height:25px; display:block;}
}
/*desktop*/
@media only screen and (min-width: 931px) {
    .container{max-width:1280px;width:100%;}

    header figure.logo{width:328px;}
    header figure.logo a{width:328px;}

    main article .hero{padding:120px 0;}
    main article .hero .slogan{width:50%;}
}
/*mobile*/
@media only screen and (max-width: 930px) {
    .container{width:100%;}
    .container .container{padding:0px;}
    header figure.logo{max-width:100%;}
    header a.logo{width:50%; height:102px;}
    header a.logo img{width:100%; max-width:100%!important;}
    header a.logo figcaption{top:-100px;}
    header a.logo figure.logo img.mobile{width:100%; display:block;}
    header a.logo figure.logo img:not(.mobile){display:none;}

    main article .hero{padding:0px;}
    main article .hero .slogan{width:100%;}
    main article .hero .items{display:none;}

    .spot-content .spots{height:200px !important; min-height:200px !important}
    .spot-content .spots .wrapper{height:200px !important; min-height:200px !important}
    
    header.spot nav.controls button.menu{background: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='bars' class='svg-inline--fa fa-bars fa-w-14' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23ffffff' d='M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z'%3E%3C/path%3E%3C/svg%3E") no-repeat 50%;}
    body:not(.a11y) header nav.page-nav ul.meta li a:hover{color:#578da2!important;}
    body:not(.a11y) header nav.page-nav ul.main li a:hover{color:#578da2!important;}
    body:not(.a11y) header nav.page-nav ul.main li a{color:#0c3e52!important;}
    header nav.page-nav ul.meta li a{color:#578da2 !important;}
    header nav.page-nav ul.main li a::before{content:"";background:#578da2 !important; position:absolute;}
    header.spot nav.page-nav ul.meta li sup{background:#e4f4f8 !important;}

    header aside{transform:translateY(-500px);}
    header aside form{display:block;}
    header aside form label.search-label{order:none; width:100%;}
    header aside form input.search-input{float:none; width:100%; margin:0px;}
    header aside form button.search-button{width:100%; max-width:100%;}
    header aside form button.search-button{width:100%; height:35px; display:block; margin:35px 0px 0px 0px;}
    header.spot nav.controls button.search{width:25px !important; height:25px !important;}
    
    article section.content .box-list li h3{height:auto; line-height:26px; position:relative; padding:10px 35px 10px 35px;}
    article section.content .box-list li h3:before{position:absolute; left:5px; top:18px;}

    .spot-splash{height:auto;}
    .spot-splash .slogan h1{font-size:28px;}
    .spot-splash .slogan{top:50%; transform:translateY(-50%)}
    .spots{min-height:450px;}
    article section.topicals .topicals-list li.topical-object h3{width:70%!important}
    article section.topicals .topicals-list li.topical-object .header{height:auto !important;}
    article .section-wrapper{background:none !important;}
    footer .closing-wrapper{background:none !important; }
    div.cookie{ width: 300px; }

    /*blog*/
    article .box.icon{display:block; box-sizing:border-box;}
    article .box.icon .icon{width:100%; display:block;}
    article .box.icon .icon{width:65px; display:block; margin:0px auto 35px auto}
    article .box.icon .icon svg{width:65px; display:block;}
    article .box.icon .content{width:100%; display:block;}
  }