/*
BLUE 			#333333
ORANGE 			#f6921e
GREY 			#eeeeee
LIGHT BLUE 		#18b5af
*/

*{ box-sizing:border-box; font-family:"Open Sans", Arial, sans-serif; }
html{ height:100%; }
html, body{ padding:0; margin:0; }
body{ overflow-y:scroll; position:relative; min-height:100%; font-size:14px; line-height:24px; }
a{ text-decoration:none; color:#18b5af; }
.clear{ clear:both; }
header, article, main, section, nav, aside, footer{ display:block; }
h1,h2,h3,h4,h5,h6{ }
h1{ font-family:"Fjalla One"; font-weight:normal; margin:0; }
h2{ font-family:"Fjalla One"; font-weight:normal; margin:0; font-size:24px; line-height:32px; color:#333333; }
p{ margin:8px 0; }
ul, li{ margin:0; padding:0; list-style:none; }
input[type="text"], textarea{ display:block; }

nav{ padding:8px 0; position:absolute; top:0; left:0; width:100%; background:#333333; }
nav article{ padding-top:0 !important; padding-bottom:0 !important; position:relative; z-index:1; }
nav .t{ width:auto; float:right; }
nav ul, nav li{ margin:0; padding:0; list-style:none; display:inline-block; }
nav li a{ font-size:13px; font-weight:bold; }
nav a{ color:#fff; padding:0 12px; display:inline-block; }
nav .c2a{ margin-left:12px; padding:10px; font-size:13px; }
nav .logo{ position:relative; z-index:5; }
nav .logo a{ float:left; font-family:"Fjalla One"; font-size:24px; line-height:32px; padding:6px 0 6px 50px; }
nav .logo a span{ font-family:"Open Sans"; font-size:14px; font-weight:bold; line-height:1; }
nav .logo-software{float: left;font-family: "Fjalla One";font-size: 24px;line-height: 24px;color: #fff;background: #18b5af;position: absolute;top: -16px; left:0; padding: 26px 5px 12px 5px;}
nav .logo:hover .logo-software{ padding-bottom:18px; }
nav .logo-software::after { content: ""; position: absolute; bottom: -12px; left: 0; border: #18b5af solid; border-bottom-color: transparent !important; border-right-color: transparent !important; border-width: 6px 11px; }
nav .logo-software::before {content: ""; position: absolute; bottom: -12px; right: 0; border: #18b5af solid; border-bottom-color: transparent !important; border-left-color: transparent !important; border-width: 6px 11px; }
nav.fixed{ background:#333333; width:100%; position:fixed; top:0; left:0; z-index:1; }

.hb{ float:right; position:relative; cursor:pointer; display:none; margin-top:11px; z-index:5; }
.hb span{ width:24px; height:4px; background:#ffffff; display:block; }
.hb span:first-of-type{ margin-bottom:10px; }
.hb i{ width:24px; height:4px; background:#ffffff; display:block; position:absolute; top:7px; }

main{ padding-bottom:56px; position:relative; }
article{ width:976px; margin:auto; padding:0 24px; position:relative; }
section{ padding:56px 0; }
aside{ float:right; width:304px; }
.c2a{ background:#e10a0a; color:#fff; font-weight:bold; padding:16px; display:inline-block; cursor:pointer; text-align:center; }
.c2a:hover{ background:#E73A3A; }
.t{ display:table; width:100%; height:100%; }
.tc{ display:table-cell; vertical-align:middle; }
.content{ /* width:520px; */ width:564px; max-width:100%; float:left; padding:24px 0; }
.content img{ width:100%; margin:16px 0; display:block; }
.subnav{ background:#eeeeee; padding:24px; }
.subnav .list{ margin-top:8px; }
a.readmore{ font-weight:bold; }
.list ul{ padding:0; }
.list li{ list-style-type:none; padding-left:16px; position:relative; }
.list li::before{ content:"\2022"; color:#333333; position:absolute; left:0; top:0; font-weight:bold; }

.c2aBottom{ color:#fff; padding:48px 0; background-color:#333333; background-image:url('../img/c2aBottom.jpg'); background-size:cover; background-position:center top; background-repeat:no-repeat; }
.c2aBottom h2{ font-size:32px; color:#fff; }
.c2aBottom .list{ margin:32px 0; }
.c2aBottom .list li::before, .c2aSide .list li::before, .c2aMobile .list li::before{ content:"\f046"; font-family:"FontAwesome"; font-size:20px; color:#fff; }
.c2aBottom .list li, .c2aSide .list li, .c2aMobile .list li{ padding-left:26px; margin-top:8px; }
.c2aBottom .left{ padding:24px 0; float:left; }

.c2aSide{ background:#333333; color:#fff; padding:24px; position:relative; top:0; margin-top:24px; }
.c2aSide h2{ font-size:24px; line-height:32px; color:#fff; }
.c2aSide h3{ font-size:12px; font-weight:bold; }
.c2aSide .list{ font-size:12px; line-height:24px; }
.c2aSide .list li::before{ top:2px;  }
.c2aSide .c2a{ display:block; margin-top:16px; }

.other .content .c2aMobile{ background:#333333; color:#fff; padding:24px; display:none; width:calc(100% + 48px); margin-left:-24px; margin-bottom:24px; }
.other .content .c2aMobile h2{ font-size:24px; line-height:32px; color:#fff; font-family:"Fjalla One"; font-weight:normal; }
.other .content .c2aMobile li{ font-size:12px; }
.other .content .c2aMobile .c2a{ width:100%; }

.counter{ float:right; text-align:center; margin-top:88px; display:none; }
.counter span + span{ margin-left:5px; }
.counter span{ font-family:"Fjalla One"; color:#333333; font-size:32px; line-height:32px; background:#eeeeee; padding:4px 4px 2px 4px; border-radius:3px; margin-bottom:8px; display:inline-block; }

header{ background:#333333; color:#fff; min-height:60px; /* min-height:72px; */ }
header h1{ font-size:72px; line-height:88px; margin:0; }
header h2{ font-family:"Open Sans"; font-size:32px; line-height:56px; font-weight:normal; font-style:italic; margin:0; color:#fff; }
header p{ width:548px; margin:10px 0 24px; }

.home header{ position:relative; }
.home header > div{ background-image:url('../img/home.jpg'); background-size:cover; background-position:bottom center; }
.home header article{ padding-top:148px; padding-bottom:72px; }

.other header{ position:fixed; top:0; left:0; z-index:2; width:100%; }
.other{ padding-top:60px; }
.other .content h1{ color:#333333; font-family: "Fjalla One"; font-weight: normal; margin:0; font-size:32px; line-height:48px; margin-bottom:8px; }
.other .content h2{ color:#333333; /* font-size:16px; line-height:24px; */ font-size:18px; line-height:32px; margin-bottom:4px; font-family:"Open Sans", Arial, sans-serif; font-weight:bold; }
.other .content h2 span{ font-size: 14px; font-weight: normal; line-height:16px; display:block; }
.other .content h3, .other .content strong{ color:#333; font-size:14px; line-height:24px; margin-bottom:0; font-family:"Open Sans", Arial, sans-serif; font-weight:bold; }
.other .content p{ margin:0 0 24px 0; }
.other .content .list{ margin-bottom:24px; }

.other .hero{ background:#333333; }
.other .hero{ background-color:#333333; background-size:cover; background-repeat:no-repeat; background-position:center top; height:calc(100vh - 116px); max-height:750px; position:relative; padding:56px 0; }
.other .hero .tc{ vertical-align:bottom; }
.other .hero h1{ color:#fff; font-family: "Fjalla One"; font-weight: normal; margin: 0; font-size:32px; line-height:48px; }
.other .hero article{ padding:0; }
.other .hero .intro{ width:612px; padding:24px; color:#fff; background:#333; }
.other .hero .list li::before{ color:#fff; }
.other .hero.waarom-erp-wijzer{ background-image:url('../img/waarom-erp-wijzer.jpg'); }
.other .hero.wat-is-erp{ background-image:url('../img/wat-is-erp.jpg'); }
.other .hero.erp-systemen-voor-uw-branche { background-image:url('../img/erp-systemen-voor-uw-branche.jpg'); }
.other .hero.erp-systemen-voor-kleine-bedrijven{ background-image:url('../img/erp-systemen-voor-kleine-bedrijven.jpg'); }
.other .hero.erp-en-crm{ background-image:url('../img/erp-en-crm.jpg'); }
.other .hero.erp-vergelijken{ background-image:url('../img/erp-vergelijken.jpg'); }
.other .hero.meest-gemaakte-fouten-bij-erp-selectie{ background-image:url('../img/meest-gemaakte-fouten-bij-erp-selectie.jpg'); }
.other .hero.de-kosten-van-een-erp-systeem{ background-image:url('../img/de-kosten-van-een-erp-systeem.jpg'); }
.other .hero.erp-systemen-in-de-cloud{ background-image:url('../img/erp-systemen-in-de-cloud.jpg'); }
.other .hero.erp-implementatie{ background-image:url('../img/erp-implementatie.jpg'); }
.other .hero.erp-doelstellingen-formuleren{ background-image:url('../img/erp-doelstellingen-formuleren.jpg'); }
.other .hero.erp-evaluatie{ background-image:url('../img/erp-evaluatie.jpg'); }
.other .hero.eclair{ background-image:url('../img/usecase-eclair.jpg'); }
.other .hero.safe-society{ background-image:url('../img/safe-society.jpg'); }

.other .hero.contact{ padding:0; color:#fff; max-height:none; }
.other .hero.contact article{ padding:0 24px; }
.other .hero.contact .t{ height:calc(100vh - 116px); max-height:none; background-image:url('../img/contact.jpg'); background-size: cover; }
.other .hero.contact .t::before{ content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(51, 51, 51, 0.8); }
.other .hero.contact .tc{ vertical-align:middle; }
.other .hero.contact td{ vertical-align:top; }
.other .hero.contact td:first-of-type{ padding-right:16px; }
.other .hero.contact a{ color:#fff; font-weight:bold; }

.other .hero.grey .t{ background:#eee; max-height:350px; }
.other .hero.grey .t::before{ display:none; }
.other .hero.grey h1, .other .hero.grey p{ color:#333333; }

.testimonials{ background:#eeeeee; padding:48px 0; }
.testimonial{ width:408px; }
.testimonial:nth-of-type(1){ float:left; }
.testimonial:nth-of-type(2){ float:right; }
.testimonial span{ color: #999999; margin-top: 8px; display: inline-block; }
.testimonial p{ color:#333333; font-size:16px; line-height:24px; font-style:italic; margin:0; }
.testimonial p::before{ content:"\f10d"; font-family:"FontAwesome"; font-style:normal; color:#cccccc; font-size:16px; margin-right:4px; }
.testimonial p::after{ content:"\f10e"; font-family:"FontAwesome"; font-style:normal; color:#cccccc; font-size:16px; margin-left:4px; }

footer{ text-align:center; background:#eeeeee; padding:16px 0; color:#333333; font-size:12px; line-height:24px; position:absolute; bottom:0; left:0; width:100%; }
footer a{ color:#333333; }
footer li{ list-style:none; display:inline; }
footer li + li{ margin-left:16px; }

.ontvang-wrap{ position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.75); z-index:7; display:none; }
.ontvang-wrap article{ width:100%; max-width:704px; padding:24px; }
.ontvang-wrap .close{ cursor: pointer; position: absolute; right: 12px; top: 12px; color: #fff; background: #000; font-size: 22px; line-height: 22px; border: 2px solid #fff; border-radius: 100%; width: 28px; height: 28px; padding-left: 1px; text-align: center; font-weight: bold; transform: rotate(45deg); z-index: 10; }
.ontvang{ background:#fff; margin:auto; position:relative; max-height:100%; max-height:100vh; max-height:calc(100vh - 48px); overflow-y:auto; }
.ontvang .list{ padding-top:2px; }
.ontvang .list li::before{ content:"\f046"; font-family:"FontAwesome"; font-size:20px; color:#333333; }
.ontvang .list li{ padding-left:26px; margin-top:8px; color:#333333; margin-left: 3px; }
.ontvang .col{ width:50%; float:left; }
.ontvang .col.left{ padding-right:8px; }
.ontvang .col.right{ padding-left:8px; }
.ontvang .row{ height: 64px; }
.ontvang .grey{ padding:24px; background:#eee; }
.ontvang form{ padding:24px; }
.ontvang label{ position:relative; width:100%; float:left; }
.ontvang label.error, .ontvang label.error span{ color:red; }
.ontvang label.error input[type="text"]{ border:1px solid red; }
.ontvang label span{font-size: 12px; line-height:16px; display: inline-block; position: absolute; top: -9px; left: 5px; padding: 0 4px; background: #fff; color: #888; z-index: 4; white-space: nowrap; }
.ontvang input[type="text"], .ontvang select, .ontvang textarea{ width:100%; padding:9px 0 6px 8px; font-size:14px; display:block; border:1px solid #aaa; }
.ontvang select{ padding-left:6px; }
.ontvang label#male, .ontvang label#female{ cursor:pointer; display: inline-block; margin-top: 8px; width:auto; }
.ontvang #male{ margin-right:10px; }
.ontvang input[type="radio"]{ position:relative; top:1px; margin-left:0; }
.ontvang #firstname{ width:calc(50% - 4px); float:left; }
.ontvang #lastname{ width:calc(50% - 4px); float:right; }
.ontvang #streetname{ width:calc(60% - 4px); float:left; }
.ontvang #housenumber{ width:calc(40% - 4px); float:right; }
.ontvang #zipcode{ width:calc(40% - 4px); float:left; }
.ontvang #city{ width:calc(60% - 4px); float:right; }
.ontvang #users_now{ width:calc(50% - 4px); float:left; }
.ontvang #users_future{ width:calc(50% - 4px); float:right; }
.ontvang .c2a{ padding:8px 16px; margin-top:16px; } 
.ontvang textarea{ resize:vertical; }
.ontvang label.passive span{ top:10px; background:transparent; cursor:text; }
.ontvang label span{ transition:all 0.2s ease; -moz-transition:all 0.2s ease; -ms-transition:all 0.2s ease; -o-transition:all 0.2s ease; -webkit-transition:all 0.2s ease; }

.bedankt{ text-align:center; width:100%; height:100%; height:calc(100vh - 60px); }
.bedankt h1{ margin: 0 0 8px 0; color: #18b5af; font-size: 48px; line-height:60px; }

/* LANGDING PAGE */
.other .hero.landing-page-general{ background-image:url('../img/landingpage.jpg'); max-height:220px; background-position:center center; }
.landing-page.ontvang { padding-top:0; overflow:visible; }
.landing-page.ontvang form{ padding:0; }
.landing-page.ontvang h1{ margin-bottom:24px; }
.landing-page.ontvang .c2aSide{ margin-top:36px; }

/* BOEKEN PAGE */
header.landing-page-boeken{ position:absolute; z-index:5; }
header.landing-page-boeken .book{ position: absolute; right: 24px; top: 16px; }
header.landing-page-boeken .book .twv{ display:table; background:#18b5af; color:#fff; font-weight:bold; text-align:center; border-radius:100%; width:72px; height:72px; font-size:16px; line-height:18px; float:none; position:absolute; bottom:4px; left:-12px; }
header.landing-page-boeken .shadow{ position: absolute; bottom: 25px; left: -6px; width: 100%; height: 1px; background: #737373; box-shadow: 0 0 45px 12px black; opacity: 0.1; transform: rotate(5deg); z-index: -1; }
.other .landing-page-boeken .hero{ background-image:url('../img/landingpage.jpg'); height:380px; background-position:center center; z-index:2; padding-bottom:24px; }
.other .landing-page-boeken .hero::before{ content:""; position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(51, 51, 51, 0.8); animation:none !important; }
.other .landing-page-boeken .hero .intro{ background-color:transparent; }
.other .landing-page-boeken .hero h1{ font-size:48px; line-height:64px; }
.landing-page-boeken .ontvang { padding-top:0; overflow:visible; max-height: none; }
.landing-page-boeken .ontvang form{ padding:0; }
.landing-page-boeken .ontvang h1{ font-size:24px; line-height:32px; margin-bottom:24px; }
.landing-page-boeken .c2aSide{ margin-top:36px; background:#eee; color:#333; }
.landing-page-boeken .c2aSide h2, .landing-page-boeken .c2aSide li::before{ color:#333; }
.other .landing-page-boeken .hero .temporary{ margin-bottom: 8px; display: block; }

/* GDPR */
.blog header{ position:absolute; width:100%; left:0; top:0; background-color:transparent; }
.blog header::before{ content:""; background:#333; position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1; }
.blog header nav{ background-color:transparent; }
.blog .hero{ background:#333; background-image:url('../img/gdpr-header.jpg'); background-size:cover; background-position:center; }
.blog.privacy .hero{ background-image:url('../img/privacy-header.jpg'); }
.blog .hero h1{ color:#fff; font-size:44px; line-height:60px; }
.blog.privacy .hero h1{ font-size:40px; line-height:60px; }
.blog .hero article, .blog .content{ width: auto; max-width: 560px; float: none; margin: auto; padding:0; }
.blog .hero article{ padding: 330px 0 52px 0; }
.blog .content p{ margin:0 0 16px 0; }
.blog .content h2{ font-size: 24px; line-height: 30px; margin: 26px 0 6px 0; }
.blog .content h3{ font-size: 16px; line-height: 24px; font-family: "Open Sans", Arial, sans-serif; font-weight: bold; margin: 0 0 4px 0; color: #333; }
.blog section{ overflow:hidden; }
.blog .content .imageWrap{ position:relative; height:326px; margin: 40px 0; }
.blog .content .imageWrap img{ position: absolute; top:0; left: 50%; transform: translate(-50%); margin:0; width:auto; }
.blog .content ul { margin:0 0 16px 19px; }
.blog .content ul li{ list-style:disc; }
.blog .content .sources{ font-size:13px; border-top:1px solid lightgrey; margin-top:48px; }
.blog .content .source{ font-size: 11px; vertical-align: super; }

/* COOKIE */
.cookie svg .st0{ fill:#18b5af; } /* SET COLOR! */
.cookie{ position:fixed; right:16px; bottom:16px; background:#fff; padding:16px 16px 16px 14px; box-shadow:0px 2px 5px rgba(0,0,0,0.2); border-radius:5px; transition:opacity 200ms, bottom 200ms; -webkit-transition:opacity 200ms, bottom 200ms; -ms-transition:opacity 200ms, bottom 200ms; -o-transition:opacity 200ms, bottom 200ms; -moz-transition:opacity 200ms, bottom 200ms; }
.cookie.hide{ opacity:0; bottom:0; }
.cookie .close{ position: absolute; background: #333; color: #fff; width: 21px; height: 21px; line-height: 21px; font-weight: bold; right: -7px; top: -7px; border-radius: 100%; cursor: pointer; text-align: center; font-size: 20px; box-sizing: content-box; }
.cookie .close::after{ content: ""; width: 100%; height: 100%; border-radius: 100%; border: 2px solid #ffffff; position: absolute; top: -2px; left: -2px; z-index: -1; }
.cookie svg{ display:block !important; width:34px; height:34px; float:left; margin:3px 12px 0 0; }
.cookie .text{ font-size:13px; line-height:1.5; width: 312px; }
.cookie .text a{ font-size:11px; color:#333; }
.cookie .text a span{ text-decoration:underline; }

@media screen and (max-width:1000px){
	article{ width:568px; }
	main{ padding-bottom:80px; }
	
	nav.show .t{ display:table; }
	nav .t{ position:fixed; top:0; left:0; width:100%; height:100%; background:#333333; text-align:center; display:none; z-index:4; }
	nav ul{  }
	nav li{ display:block; font-size:24px; line-height:32px; margin-top:24px; }
	nav li a, nav .c2a{ padding:16px; font-size: 16px; }
	nav .c2a{ margin-left:0; margin-top:12px; }
	.hb{ display:block; }
	
	header h1{ font-size:64px; line-height:88px; }
	header p{ width:100%; }
		
	.other .hero{ padding:40px 0; }
	.other .hero .intro{ width:100%; }
	
	section{ padding:48px 0; }
	aside{ width:100%; }
	.home .content{ padding:0 0 40px 0; }
	.c2aBottom .content{ padding:0; }
	.testimonial{ width:100%; }
	.testimonial:nth-of-type(2){ margin-top:32px; }
		
	.ontvang .list li{ font-size:12px; }
	
	.c2aSide{ position:static; top:0 !important; display:none; }
	.c2aBottom{  background-image:none; }
	.other .content .c2aMobile{ display:block; }
	
	.home header > div::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(51,51,51,0.7); }
	
	/* BOEKEN PAGE */
	header.landing-page-boeken .book{ top:100px; }
	header.landing-page-boeken .book img{ width:200px; }
	header.landing-page-boeken .book .twv{ top:220px; }
	.other .landing-page-boeken .hero{ padding:40px 0 16px 0; height:300px; }
	.other .landing-page-boeken .hero .tc{ vertical-align:bottom; }
	.other .landing-page-boeken .hero h1{ font-size:34px; line-height:45px; }
	.other .landing-page-boeken .hero .intro{ width:340px; }
	
	/* GDPR */
	.blog .hero article{ padding-top:260px; }
	.blog .hero article, .blog .content{ max-width: 520px; }
	
	/* COOKIE MOBILE */
	.cookie{ padding:8px; }
}

@media screen and (max-width:590px){
	article{ width:300px; }
	main{ padding-bottom:256px; }
	
	nav li{ font-size:16px; }
	
	header h1 br{ display:none; }
	
	.home header > div{ background-image:none; }
	.home header article{ padding-top: 112px; padding-bottom: 56px; }	
	header h1{ font-size:40px; line-height:56px; }
	header h2{ font-size:24px; line-height:32px; }
	header p{ width:100%; }
	
	.content{ width:100%; }
	
	.c2aBottom{ padding:16px 0; }
	.c2aBottom h2{ font-size:24px; line-height:32px; }
	.c2aBottom .list{ margin:16px 0; }
	.c2aBottom .list li{ font-size:12px; line-height:24px; }
	.c2aBottom .list li::before{ top:3px; }
	
	footer li{ display:block; text-align:left; line-height:32px; }
	footer li + li{ margin-left:0; }
	
	.ontvang .col.left, .ontvang .col.right{ width:100%; padding:0; float:none; }
	.ontvang-wrap article{ padding:8px; }
		
	.other .hero.t::before{ content:""; position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(51, 51, 51, 0.9); animation:none !important; }
	.other .hero .intro{ background-color:transparent; }
	
	.bedankt{ width:252px; margin:auto; height:100%; margin-top:80px; }
	.bedankt h1{ margin: 0 0 8px 0; font-size:24px; line-height:32px; }
	
	
	/* BOEKEN PAGE */
	header.landing-page-boeken .book{ display:none; }
	.other .landing-page-boeken .hero .intro{ width:100%; }
	.landing-page-boeken .ontvang h1{ font-size:21px; }
	
	/* GDPR */
	.blog .hero h1{ font-size:32px; line-height:48px; }
	.blog .hero article{ padding-top:260px; width:252px; }
	.blog .hero article, .blog .content{ max-width: 520px; }
}
@media screen and (max-width:400px){
/* COOKIE MOBILE */
.cookie{ width:calc(100% - 32px); padding:8px; }
.cookie svg{ width:35px; height:35px; }
.cookie .text{ width:auto; font-size:11px; }
.cookie .text br{ display:none; }
}

/* ANIMATIONS */
@keyframes slide-top-in{ from{ top:-100px; } to{ top:0px; } }
@keyframes slide-top-out{ from{ top:0px; } to{ top:-100px; } }
@keyframes slide-bottom-in{ from{ margin-top:25px; } to{ margin-top:0px; } }
@keyframes slide-bottom-out{ from{ margin-top:0px; } to{ margin-top:25px; } }
@keyframes fade-in{ from{ opacity:0; } to{ opacity:1; } }
@keyframes fade-out{ from{ opacity:1; } to{ opacity:0; } }
@keyframes height-0-100{ from{ height:0; } to{ height:80%; } }

.hb{animation:hb-start 1s;-moz-animation:hb-start 1s;-ms-animation:hb-start 1s;-o-animation:hb-start 1s;-webkit-animation:hb-start 1s}@keyframes hb-start{from{opacity:0}to{opacity:1}}.hb.close span{animation:hb-span-close .2s forwards;-moz-animation:hb-span-close .2s forwards;-o-animation:hb-span-close .2s forwards;-webkit-animation:hb-span-close .2s forwards}@keyframes hb-span-close{from{opacity:1}to{opacity:0}}.hb.close i:first-of-type{animation:hb-i-close-first .2s forwards;-moz-animation:hb-i-close-first .2s forwards;-ms-animation:hb-i-close-first .2s forwards;-o-animation:hb-i-close-first .2s forwards;-webkit-animation:hb-i-close-first .2s forwards}@keyframes hb-i-close-first{from{transform:rotate(0deg)}to{transform:rotate(45deg)}}.hb.close i:last-of-type{animation:hb-i-close-last .2s forwards;-moz-animation:hb-i-close-last .2s forwards;-ms-animation:hb-i-close-last .2s forwards;-o-animation:hb-i-close-last .2s forwards;-webkit-animation:hb-i-close-last .2s forwards}@keyframes hb-i-close-last{from{transform:rotate(0deg)}to{transform:rotate(-45deg)}}.hb.open span{animation:hb-span-open .2s forwards;-moz-animation:hb-span-open .2s forwards;-o-animation:hb-span-open .2s forwards;-webkit-animation:hb-span-open .2s forwards}@keyframes hb-span-open{from{opacity:0}to{opacity:1}}.hb.open i:first-of-type{animation:hb-i-open-first .2s forwards;-moz-animation:hb-i-open-first .2s forwards;-ms-animation:hb-i-open-first .2s forwards;-o-animation:hb-i-open-first .2s forwards;-webkit-animation:hb-i-open-first .2s forwards}@keyframes hb-i-open-first{from{transform:rotate(45deg)}to{transform:rotate(0deg)}}.hb.open i:last-of-type{animation:hb-i-open-last .2s forwards;-moz-animation:hb-i-open-last .2s forwards;-ms-animation:hb-i-open-last .2s forwards;-o-animation:hb-i-open-last .2s forwards;-webkit-animation:hb-i-open-last .2s forwards}@keyframes hb-i-open-last{from{transform:rotate(-45deg)}to{transform:rotate(0deg)}}

nav.fixed{ animation:slide-top-in 0.3s both ease; -moz-animation:slide-top-in 0.3s both ease; -ms-animation:slide-top-in 0.3s both ease;-o-animation:slide-top-in 0.3s both ease; -webkit-animation:slide-top-in 0.3s both ease; }
nav.fixed.out{ animation:slide-top-out 0.3s both ease; -moz-animation:slide-top-out 0.3s both ease; -ms-animation:slide-top-out 0.3s both ease; -o-animation:slide-top-out 0.3s both ease; -webkit-animation:slide-top-out 0.3s both ease; }

.ontvang-wrap{ animation:fade-in 0.2s both;-moz-animation:fade-in 0.2s both;-ms-animation:fade-in 0.2s both;-o-animation:fade-in 0.2s both;-webkit-animation:fade-in 0.2s both; }
.ontvang, .ontvang-wrap .close{ animation:slide-bottom-in 0.3s both;-moz-animation:slide-bottom-in 0.3s both;-ms-animation:slide-bottom-in 0.3s both;-o-animation:slide-bottom-in 0.3s both;-webkit-animation:slide-bottom-in 0.3s both; }
.ontvang-wrap.hide{ animation:fade-out 0.2s both;-moz-animation:fade-out 0.2s both;-ms-animation:fade-out 0.2s both;-webkit-animation:fade-out 0.2s both;-o-animation:fade-out 0.2s both; }
.ontvang-wrap.hide .ontvang, .ontvang-wrap.hide .close{ animation:slide-bottom-out 0.3s both;-moz-animation:slide-bottom-out 0.3s both;-ms-animation:slide-bottom-out 0.3s both;-o-animation:slide-bottom-out 0.3s both;-webkit-animation:slide-bottom-out 0.3s both; }

.c2aSide{ transition:top ease 0.5s;-moz-transition:top ease 0.5s;-ms-transition:top ease 0.5s;-o-transition:top ease 0.5s;-webkit-transition:top ease 0.5s; }

main{ animation:fade-in 0.4s both ease-in;-moz-animation:fade-in 0.25s both ease-in;-ms-animation:fade-in 0.25s both ease-in;-o-animation:fade-in 0.25s both ease-in;-webkit-animation:fade-in 0.25s both ease-in; }
main.out{ animation:fade-out 0.25s both ease-out;-moz-animation:fade-out 0.25s both ease-out;-ms-animation:fade-out 0.25s both ease-out;-o-animation:fade-out 0.25s both ease-out;-webkit-animation:fade-out 0.25s both ease-out; }

nav .logo-software{ transition:padding-bottom 0.2s ease;-moz-transition:padding-bottom 0.2s ease;-ms-transition:padding-bottom 0.2s ease;-o-transition:padding-bottom 0.2s ease;-webkit-transition:padding-bottom 0.2s ease; }

@media screen and (max-width:1000px){ 
nav .t{ animation:fade-in both 0.2s;-moz-animation:fade-in both 0.2s;-ms-animation:fade-in both 0.2s;-o-animation:fade-in both 0.2s;-webkit-animation:fade-in both 0.2s; }
nav li{ animation:fade-in both 0.5s;-moz-animation:fade-in both 0.5s;-ms-animation:fade-in both 0.5s;-o-animation:fade-in both 0.5s;-webkit-animation:fade-in both 0.5s; } 
nav li:nth-of-type(2){ animation-delay:0.1s;-moz-animation-delay:0.1s;-ms-animation-delay:0.1s;-o-animation-delay:0.1s;-webkit-animation-delay:0.1s; }
nav li:nth-of-type(3){ animation-delay:0.2s;-moz-animation-delay:0.2s;-ms-animation-delay:0.2s;-o-animation-delay:0.2s;-webkit-animation-delay:0.2s; }
nav li:nth-of-type(4){ animation-delay:0.3s;-moz-animation-delay:0.3s;-ms-animation-delay:0.3s;-o-animation-delay:0.3s;-webkit-animation-delay:0.3s; }
}
.c2a{ transition:background 0.15s;-moz-transition:background 0.15s;-ms-transition:background 0.15s;-o-transition:background 0.15s;-webkit-transition:background 0.15s; }