@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');
/* RESET */
*{
	padding:0;
	margin:0;
	border:none;
}

/* MAIN STYLES */
Body{
	font-family:'IBM Plex Sans',sans-serif;
	font-weight:400;
	font-size:14px;
	line-height:22px;
	color:#333;
	background:url('images/bg.jpg') repeat-x #fff;
	-webkit-font-smoothing: antialiased;
}

a:link{
	color:#256783;
	text-decoration:none;
	border-bottom:1px solid #256783;
}
a:visited{
	color:#256783;
	text-decoration:none;
	border-bottom:1px solid #256783;
}
a:hover{
	color:#d72a2a;
	text-decoration:none;
	border-bottom:none;
}

a:active{
	color:#d72a2a;
	text-decoration:none;
}
a img{
	border:0;
}

h1{
	font-size:32px;
	font-weight:bold;
	padding:15px 0;
	line-height: 1.3;
}


h2{
	font-size:24px;
	font-weight:bold;
	padding:15px 0;
	line-height: 1.5;
}
h3{
	font-size:20px;
	font-weight:bold;
	padding:10px 0;
	line-height: 1.5;
}
h4{
	font-size:18px;
	font-weight:normal;
	padding:10px 0;
	line-height: 1.5;
}

.small{
	font-size:12px;
}
.grey{
	color:#828282;
}

.offerform th, .offerform td {
	background-color: #ececec;
	padding: 8px;
	border: none;
}
.purchase {
	border-spacing: 4px;
}

.purchase th:first-child {
	width: 66%;
}
.purchase th {
	font-size: large;
	font-weight: bold;
	padding: 10px;
}

.purchase td {
	padding: 10px;
}
.purchase .tblheading {
	background-color: #e0f0FF;
}
.purchase .tblrow {
	background-color: #F8F8F8;
}


.head{
	width:939px;
	padding: 20px 30px 0 30px;
	margin:0 auto;
	position:relative;
	background:url('images/header_bg.jpg') no-repeat;
}
	.head .navi{
		text-align:right;
	}
	.head ul{
		display:block;
		list-style:none;
	}
	.head .logotype{
		position:absolute;
		top:70px;
		left:30px;
		border:none;
		transition: all .2s ease-in-out;
	}
	.head .logotype:hover {
		transform: scale(1.05);
	}
.head .dropdown {
	text-decoration: none;
	position: relative;
	display: inline-block;
	margin-top: 94px;
}
.head .dropbtn {
	background: url(images/globe.svg) no-repeat center;
	background-size: contain;
	width: 36px;
	height: 36px;
	cursor: pointer;
	padding: 0;
}
.head .dropdown-content {
	display: none;
	position: absolute;
	margin-left: -30px;
	background-color: #cbc9c4;
	border-radius: 5px;
	min-width: 50px;
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
	z-index: 1;
	text-align: left;
}
.head .dropdown-content a {
	padding: 5px 20px 5px 20px !important;
	display: block;
	border-bottom:none;
}

.head .dropdown-content a:hover {background-color: #ddd;}

.head .dropdown.open .dropdown-content {display: block;}

@media (hover: hover) {
	.head .dropdown:hover .dropdown-content {display: block;}
}

.nav-toggle {
	display: none;
}

	.menu{
		padding:15px 0 0 0;
		margin-top: 2px;
	}
	
	.menu li{
		display:inline-block;
		padding:2px 5px;
		border-radius: 5px; /* CSS3 */
		font-weight: bold;
		transition: all 0.3s;
	}
	.menu li:hover,.menu li.active{
		background-color:#cbc9c4;
		transition: all 0.3s;
	}
	.menu li:hover a,.menu li.active a{
		border:none;
		color:#1a3d4c;
	}
	
	.head .promo{
		padding:70px 0 10px 0;
		margin-top: 21px;
	}
	.head .promo a{
		text-decoration: none;
	}
		.head .promo li{
			display:inline-block;
			height:130px;
			vertical-align:top;
		}
			.head .promo li.arrow{
				width:50px;
				height:100px;
				background:url('images/fast-forward.svg') left 66px no-repeat;
                background-size: 30px;
			}
			.head .promo li.item{
				padding:0 0 0 126px;
				width:147px;
				transition: all 0.2s ease-in-out;
			}
			.head .promo li.item:hover{
				padding: 0 6px 0 120px;
				transition: all 0.2s ease-in-out;
			}
			.head .promo li.benefits{
                background:url('images/icon-benefit.svg') left bottom 10px no-repeat;
                background-size: 100px;
			}
			.head .promo li.download{
				background:url('images/icon-download.svg') left bottom no-repeat;
                background-size: 100px;
			}
    		.head .promo li.license{
				background:url('images/icon-order.svg') left bottom no-repeat;
                background-size: 100px;
			}
			.head .promo li h3{
				padding:10px 0 10px 0;
                font-size: 20px;
                font-weight: 800;
			}

.content{
	width:939px;
	padding:0 30px;
	margin:0 auto;
	font-size: 18px;
	line-height:29px;
	background:url('images/shadow.jpg') top center no-repeat;
}
	.content .main{
		vertical-align:top;
		display:inline-block;
		width:600px;
	}
	.content .sub{
		width:200px;
		vertical-align:top;
		display:inline-block;
		padding:0 30px;
		font-size: 16px;
		line-height: 1.5;
	}

	.content .sub .block{
		text-align: left;
	}
	.content .sub .block.centered{
		text-align: center;
	}

		.content .block{
			padding:10px 0 10px 0;
			text-align:justify;
		}
		.content .block img{
			clear:right;
			float:left;
			padding:10px 0 15px 0;
			max-width: 100%;
		}
		.content .block ul{
			list-style-type:square;
			list-style-position:inside;
		}
		.content .block ul.spaced li{
		  padding-bottom:14px;
		}
		.content .block ol.spaced li{
		  padding-top:16px;
		}
.content ul.spaced li{
	padding-bottom:14px;
}
.content ol.spaced li{
	padding-top:16px;
}
		.content .block ul.bigList {
			list-style: none !important;
			font-size: large;
		}
		.content .block ul.bigList li:before {
			content: "\2714\0020";
		}
		.content .block p {
			padding:0 0 10px 0;
		}

		.content .block-colored {
		  background-color: #E3E3E3;
	      padding:10px 10px;
		  text-align:justify;
			color: black;
		}


.footer{
	background:url('images/bg.jpg') 0 -410px repeat-x #fff;
	height:200px;
	margin:50px 0 0 0;
}
	.footer .box{
		background:url('images/shadow.jpg') top center no-repeat;
		width:939px;
		padding:0 30px;
		margin:0 auto;
		text-align:right;
		position:relative;
	}
	.footer .bolide{
		position:absolute;
		top:10px;
		left:30px;
		border:none;
	}

.myButton {
	-moz-box-shadow:inset 0 1px 0 0 #fff6af;
	-webkit-box-shadow:inset 0 1px 0 0 #fff6af;
	box-shadow:inset 0 1px 0 0 #fff6af;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #ffab23));
	background:-moz-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-webkit-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-o-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-ms-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffab23',GradientType=0);
	background-color:#ffec64;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #ffaa22 !important;
	display:inline-block;
	cursor:pointer;
	color:#333333 !important;
	font-family: Arial, serif !important;
	font-size:20px !important;
	font-weight:bold !important;
	padding:6px 24px;
	text-decoration:none !important;
	text-shadow:0 1px 0 #ffee66 !important;
	white-space: normal;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23), color-stop(1, #ffec64));
	background:-moz-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-webkit-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-o-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-ms-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:linear-gradient(to bottom, #ffab23 5%, #ffec64 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', endColorstr='#ffec64',GradientType=0);
	background-color:#ffab23;
}

.breadcrumbs {
	margin-top: 10px;
	text-align: left;
	line-height: 1;
}
.breadcrumbs .breadcrumbs-list[itemscope]:not([itemprop]) a {
	font-size: 14px;
	text-decoration: none;
	text-decoration-color: transparent;
	transition: text-decoration-color 0.2s;
}
.breadcrumbs .breadcrumbs-list[itemscope] > [itemprop=itemListElement]::after {
	content: "›";
	font-size: 14px;
}
.breadcrumbs .breadcrumbs-list[itemscope]:not([itemprop]) > span:last-of-type {
	font-size: 14px;
	font-weight: bold;
	color: #555555;
}
::placeholder { /* Most modern browsers support this now. */
    color:    #E3E3E3;
}

.centered, .content .block.centered {
	text-align: center;
}

@media screen and (max-width: 60em) {
	body {
		width:100%;
		font-size: 14pt;
		background-position-y: -170px;
	}
	.head {
		width: 98%;
		margin: auto;
		padding: 0;
		background: none;
		position: static;
	}
	.head .logotype{
		width: 98%;
		top:0;
		left:2px;
		position: unset;
		display: block;
	}
	.head .navi {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		gap: 8px;
		padding: 8px 0;
	}

	.head .dropdown {
		font-size: 10pt;
		margin-top: 0;
		padding: 0;
		order: 2;
	}

	.head .dropdown-content {
		right: 0;
		left: auto;
		margin-left: 0;
	}

	.nav-toggle {
		display: inline-flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		width: 44px;
		height: 44px;
		padding: 10px;
		background: #cbc9c4;
		border: none;
		border-radius: 5px;
		cursor: pointer;
		order: 1;
	}

	.nav-toggle span {
		display: block;
		height: 3px;
		background: #1a3d4c;
		border-radius: 2px;
	}

	.head .navi .menu {
		display: none;
		flex: 1 1 100%;
		order: 3;
		font-size: 10pt;
		margin-top: 0;
		margin-bottom: 0;
		background: #f5f5f5;
		border-radius: 5px;
		padding: 4px 0;
	}

	.head .navi.nav-open .menu {
		display: block;
	}

	.head .navi .menu li {
		display: block;
		padding: 10px 14px;
		border-bottom: 1px solid #e0e0e0;
	}

	.head .navi .menu li:last-child {
		border-bottom: none;
	}
	.content {
		width: 98%;
		padding: 0;
	}
	.content .main{
		width: 98%;
	}
	.content .sub {
		width: 98%;
		padding: 0;
		margin: auto;
		border-top: 6px solid #256783;
	}
	.head .promo {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 8px;
		padding: 12px 0;
		margin-top: 8px;
	}

	.head .promo li.arrow {
		display: none;
	}

	.head .promo li.item {
		flex: 1 1 30%;
		min-width: 90px;
		height: auto;
		padding: 8px 4px 8px 52px;
		background-size: 44px !important;
		background-position: left center !important;
		box-sizing: border-box;
	}

	.head .promo li.item:hover {
		padding: 8px 4px 8px 52px;
	}

	.head .promo li h3 {
		font-size: 13px;
		padding: 0 0 4px;
	}

	.head .promo li.item div {
		display: none;
	}

	.head .promo li.item div:last-child {
		display: block;
		font-size: 11px;
	}
	.content .block img {
		float:none;
	}
	h1{
		font-size: 22pt;
	}
	h2 {
		font-size: 16pt;
	}
	.content .block img{
			padding:2px 10px 10px 2px;
			height: auto;
			max-width:98%;
	}
	img {
		max-width: 98%;
	}
	.myButton {
			font-size:26px !important;
			max-width: 98%;
	}
	.footer .box {
		width: 98%;
		padding: 0;
	}
	.footer .box p {
		font-size: 10pt;
	}
	.footer .bolide {
		position: static;
		float: left;
	}
	.myButton {
		font-size: 16pt !important;
	}

}

/* Cookie consent banner */
.cookie-consent {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10000;
	background: #2a2a2a;
	color: #f5f5f5;
	padding: 14px 16px;
	box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.25);
	font-size: 14px;
	line-height: 1.45;
}

.cookie-consent__inner {
	max-width: 939px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.cookie-consent__text {
	flex: 1 1 280px;
	margin: 0;
}

.cookie-consent__text a {
	color: #7ec8e3;
	border-bottom-color: #7ec8e3;
}

.cookie-consent__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.cookie-consent__btn {
	cursor: pointer;
	font-family: inherit;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 18px;
	border-radius: 5px;
	border: none;
}

.cookie-consent__btn--accept {
	background: linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
	color: #333;
}

.cookie-consent__btn--reject {
	background: transparent;
	color: #ccc;
	border: 1px solid #666;
}

@media screen and (max-width: 60em) {
	.cookie-consent__inner {
		flex-direction: column;
		align-items: stretch;
	}

	.cookie-consent__actions {
		justify-content: stretch;
	}

	.cookie-consent__btn {
		flex: 1 1 auto;
	}
}
