/*
*
*  Golden Grid System (1.01)	<http://goldengridsystem.com/>
*  by Joni Korpi 				<http://jonikorpi.com/>
*  licensed under MIT			<http://opensource.org/licenses/mit-license.php>
*	
*/
/*
*
*  Margin, padding, and border resets
*  except for form elements
*
*/
body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
th,
td,
article,
aside,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: 'Roboto', sans-serif;
}
/*
*
*  Consistency fixes
*  adopted from http://necolas.github.com/normalize.css/
*
*/
html {
	height: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body {
	height: 100%;
	min-height: 100%;
	font-size: 100%;
	
	background: #002B45 url(https://www.maptun.com/img/bg-2023.webp);
	background-repeat: repeat;
	background-size: 30%;
	
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
audio,
canvas,
video {
	display: block;
}
sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sup {
	top: -0.5em;
}
sub {
	bottom: -0.25em;
}
pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}
li {
	line-height: normal;
	margin-left:20px;
	padding-top:0px;
	list-style-type: square;
}
ul.menu li, ul.menusub li
{
	margin-left:0px;
	padding-top:0px;
	list-style-type: none;
}
b, strong {
	font-weight: bold;
}
abbr[title] {
	border-bottom: 1px dotted;
}
input,
textarea,
button,
select {
	margin: 0;
	font-size: 100%;
	line-height: normal;
	vertical-align: baseline;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	cursor: pointer;
	-webkit-appearance: button;
}
input[type="checkbox"], input[type="radio"] {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
textarea {
	overflow: auto;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*
*
*  Simple fluid media
*
*/
figure {
	position: relative;
}
figure img,
figure object,
figure embed,
figure video {
	max-width: 100%;
	display: block;
}
img {
	border: 0;
	-ms-interpolation-mode: bicubic;
	max-width: 100%;
	height: auto;
	width: auto;
}
/*
*
*	Zoomable baseline grid
*	type size presets
*
*/
body {
	/* 16px / 24px */
	font-size: 1em;
	line-height: 1.5em;
	background-color:#ececec;
}
.small {
	/* 13px / 18px */
	font-size: 0.8125em;
	line-height: 1.3846153846153846em;
}
.normal, h3 {
	/* 16px / 24px */
	font-size: 1.5em;
	/*
	line-height: 1.5em;
	*/
	line-height: normal;
	color:#333333;
	margin:0px;
	font-weight:normal;
	/* 24 */
	margin: 1.0em 0 0.5em;
	letter-spacing: -0.02em;
}
.large, h2, h1 {
	/* 26 / 36px */
	font-size: 1.425em;
	line-height: normal;
}
.huge {
	/* 42px / 48px */
	font-size: 2.625em;
	line-height: 1.1428571428571428em;
}
.massive {
	/* 68px / 72px */
	font-size: 4.25em;
	line-height: 1.0588235294117647em;
}
.gigantic {
	/* 110px / 120px */
	font-size: 6.875em;
	line-height: 1.0909090909090908em;
}
/*
*
*  	-column grid active
*  ----------------------------------------
*  Margin   | #  1   2   3   4   |   Margin
*  5.55555% | %  25  50  75  100 | 5.55555%
*
*/
header, .oneway, .twoway, .threeway, .fourway {
	margin: 0 3.555555555555555%;
}
h1, h2 {
	margin: 0.9230769230769231em 0 0.3em;
}
h2 {
	font-weight: normal;
}
/*
*  Simple elastic gutters
*  Note: box-sizing will not work in IE6-7
*/
.wrapper, .wrapper-double {
	/*
	padding: 0.5em 0.5em;
	*/
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.fourway .wrapper, .wrapper-double {
	width: 100%;
}
/*
*
*  Fixes for IE6-8
*  http://jonikorpi.com/leaving-old-IE-behind/
*
*/
.ie body {
	width: 40em;
	margin: 0 auto;
	font-size: 1.0625em;
}
.ie h1 {
	/* 42px / 48px */
	font-size: 2.625em;
	line-height: 1.1428571428571428em;
	margin: 1.1428571428571428em 0 0.5714285714285714em;
}
.container {
	width:100%;
	float:left;
}
/*
.box-content {
	width:100%;
	float:left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	min-height:240px;
	background-color:#f5f5f5;
	border:1px solid #cccccc;
	padding: 0 0.75em;
	margin-top:1.5em;
	text-align:center;
	cursor:pointer;
}
.box-content-small {
	width:100%;
	float:left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color:#f7f7f7;
	border:1px solid #dddddd;
	padding: 0.25em 0.75em;
	margin-top: 1.5em;
}
.box-content-small-50 {
	width:100%;
	float:left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-top:8px;
	margin-bottom:8px;
}*/

.box-content {
	width:100%;
	float:left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	min-height:255px;
	background-color:#fcfcfc;
	background-color:#f7f7f7;
	/*
	padding: 0 0.75em;
	*/
	padding:8px;
	margin-top:1.5em;
	text-align:left;
	cursor:pointer;
	border:1px solid #dddddd;
	border-radius:0px;
}

.box-content img{
	margin:0px;
}

.fourway .wrapper .box-content {
	text-align:center;
}
.fourway .wrapper-double .box-content {
	text-align:center;
	padding:0px;
	
}
.box-content-small {
	width:100%;
	float:left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border:1px solid #dddddd;
	padding: 0.25em 0.75em;
	margin-top: 1.5em;
}
.box-content-small-center {
	width:100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-top: 1.5em;
	text-align:center;
}
.box-content-small-50 {
	width:100%;
	float:left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-top:8px;
	margin-bottom:8px;
}
a  {
	color:#002b45;
	text-decoration:none;
}
a:hover  {
	color:#dc0303;
}
a img {
	margin-top:4px;
	margin-left:4px;
	opacity:0.9;
}
a img:hover {
	opacity:1.0;
}

#div-search {
	float:left;
	margin-top:10px;
	width:100%;
}

#topmenu {
	float:left;
}

div#menu {
	float:left;
	width:100%;
	/*
	background-color:#3d3d3c;
	*/	 
	 margin-top:0px;
	
	display:table;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#menu-icon {
	float:left;
	margin-top:1px;
	margin-left:10px;
	cursor:pointer;
	position:absolute;
	left:20px;
	top:20px;
}
#menu-icon div {
	width: 32px;
    height: 5px;
    background-color: #ffffff;
    margin: 6px 0;
}

ul.menu {
	float:left;
	width:100%;
	list-style-type: none;
    margin: auto;
    padding: 0;
    overflow: hidden;
    display:none;
	text-align:center;
}
ul.menu li{
	float:none;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-top:4px;
	display:inline-block;
}

ul.menu li a:link, ul.menu li a:visited {
    display: block;
    /*
	width: 120px;
	*/
    font-weight: normal;
    color: #FFFFFF;
    text-align: center;
	text-decoration: none;
	font-size: 1em;
	
	font-family: 'Roboto', sans-serif;
	
	/*
	width:100%;
	*/
	padding:14px;
	padding-left:6px;
	padding-right:6px;
	
	color:#f7f7f7;
	
}

ul.menu li a:hover, ul.menu li a:active {
    
}

div.menusub {
	float:left;
	
	/*
	width:240px;
	background-color:#999999;
	*/
	width:100%;
	
	/*
	display:none;
	*/
}

ul.menusub {
	list-style-type: none;
	margin: auto;
    padding: 0;
	float:left;
	text-align:center;
	overflow: hidden;
	width:100%;
}
ul.menusub li{
	float:none;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-top:4px;
	display:inline-block;
}

ul.menusub li a:link, ul.menusub li a:visited {
    display: block;
    /*
	width: 120px;
	*/
    color: #FFFFFF;
    background-color: #000000;
    text-align: center;
    text-decoration: none;
	/*
    text-transform: uppercase;
	*/
	font-family: 'Roboto', sans-serif;
	padding:12px;
	padding-left:10px;
	padding-right:10px;
	
}

ul.menusub li a:hover, ul.menusub li a:active {
	
}

#social-icons {
	float:left;
	margin-top:10px;
}

article {
	-webkit-columns: 2 300px;
    -moz-columns: 2 300px;
	columns: 2 300px;
	-webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    column-gap: 2em;
	-webkit-column-rule: 1px dotted #ddd;
    -moz-column-rule: 1px dotted #ddd;
    column-rule: 1px dotted #ddd;
}

h2, h3 { 
	-webkit-column-span: all; 
    column-span: all; 
}


.head-left {
	float:left;
	width:100%;
	margin-top:4px; 
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}
.head-right {
	float:right;
	width:100%;
	margin-top:4px; 
	padding:20px;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	text-align:right;
}

.navigation-bar-shadow{
	position: relative;
	float:left;
	width:100%;
	height:10px;
	margin-bottom:0px;
	background:url('https://www.maptunparts.eu/img/bg-navigation-bar-shadow.png');
	border-top:0px solid #666666;
	background-repeat:repeat-x;
	text-align:center;
}

.main-wrapper-container {
	float:left;
	width:100%;
	text-align:center;
	margin:0 auto;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}
.main-wrapper {
	width:100%;
	text-align:center;
	max-width:1450px;
	margin:0 auto;
	margin-bottom:16px;
	padding:12px;
	padding-top:0px;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	cursor:default;
	z-index:100;
}
.center-container {
	float:left;
	/*
	width:45%;
	*/
	width:100%;
	margin:0 auto;
	margin-bottom:16px;
	padding:12px;
	/*
	border:1px solid #dddddd;
	*/
	background-color:#ffffff;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	cursor:default;
	display:block;
	z-index:100
}
.center-container-two {
	float:left;
	width:100%;
	margin:0 auto;
	margin-bottom:16px;
	padding:12px;
	background-color:#ffffff;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	cursor:default;
	z-index:100;
}
.center-container-two-trans {
	float:left;
	width:100%;
	margin:0 auto;
	margin-bottom:16px;
	padding:12px;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	cursor:default;
	z-index:100;
}
.center-container-three {
	float:left;
	width:100%;
	margin:0 auto;
	margin-bottom:16px;
	padding:12px;
	border:1px solid #dddddd;
	border-radius: 4px;	
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	cursor:default;
	z-index:100;
}
.center-container-four {
	float:left;
	width:100%;
	margin:0 auto;
	margin-bottom:16px;
	padding:12px;
	border:1px solid #dddddd;
	border-radius: 4px;	
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
	cursor:default;
	z-index:100;
}

#reviews{
	display:none; 
	background-color:#ffffff;
	margin-top:0px; 
	width:100%;
	max-width:955px;
	float:left;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}

.flags{
	position:absolute;
	top:30px;
	right:3%;
}
@media screen and (min-width: 30em) {
	.flags{
		right:15%;
	}
}
/* @media screen and (min-width: 320px) */
@media screen and (min-width: 30em) {
	.fourway .wrapper {
		float: left;
		width: 50%;
	}
}

/* @media screen and (min-width: 640px) */
@media screen and (min-width: 40em) {
	body {
		/* Zoom baseline grid to 17/16 = 1.0625 */
		font-size: 1.0625em;
	}
	h1 {
		/* 42px / 48px */
		font-size: 2.425em;
		line-height: 1.1428571428571428em;
		margin: 0.5714285714285714em 0 0.2857142857142857em;
	}
	#social-icons {
		float:right;
		margin-top:0px;
	}
	.box-content-small-50 {
		width:50%;
		margin-top:0px;
		margin-bottom:0px;
	}
	.center-container-four {
		width:48%;
		margin-right:8px;
	}

}
/*
*
*  Eight-column grid active
*  ----------------------------------------------------------------------
*  Margin   | #  1     2     3     4     5     6     7     8   |   Margin
*  5.55555% | %  12.5  25.0  37.5  50.0  62.5  75.0  87.5  100 | 5.55555%
*	
*
*/
/* @media screen and (min-width: 720px) */
@media screen and (min-width: 45em) {
	body {
		/* Reset baseline grid to 16/16 = 1 */
		font-size: 1em;
	}
	.oneway .wrapper {
		float: left;
		width: 100%;
	}
	.twoway .wrapper {
		float: left;
		width: 50%;
	}
	.threeway .wrapper {
		float: left;
		width: 33.33333333%;
	}
	
	#topmenu {
		float:right;
		margin-right:140px
	}
	#social-icons {
		float:left;
		margin-top:10px;
	}
	div.head-left {
		width:50%;
		margin-top:20px; 
		margin-bottom:20px;
	}	
	div.head-right {
		width:50%;
		text-align:right;
		margin-top:16px; 	
	}
}
/* @media screen and (min-width: 888px) */
@media screen and (min-width: 55.5em) {
	body {
		/* Zoom baseline grid to 17/16 = 1.0625 */
		font-size: 1.0625em;
	}
}
/* @media screen and (min-width: 984px) */
@media screen and (min-width: 61.5em) {
	body {
		/* Reset baseline grid to 16/16 = 1.0 */
		font-size: 1em;
	}
	header, .oneway, .twoway, .threeway, .fourway {
		margin: 0 4.666666666666664%;
	}
	.threeway .wrapper {
		float: left;
		width: 33.33333333%;
	}
	.fourway .wrapper {
		float: left;
		width: 25%;
	}
	.fourway .wrapper-double {
		float: left;
		width: 50%;
	}
	.center-container-four {
		width:32%;
		margin-right:8px;
	}
	
	ul.menu{
		display:inline;
	}
	ul.menu li, ul.menusub li{
		width:auto;
		margin-top:0px;
		background-color: transparent;
	}
	ul.menu li a:hover, ul.menu li a:active {
	
	}
	#menu-icon {
		display:none;
	}
	
	ul.menu li a:link, ul.menu li a:visited {
		background-color:transparent;
		padding-left:10px;
		padding-right:10px;
	}

	ul.menusub li{
		width:auto;
	}

	ul.menusub li a:link, ul.menusub li a:visited {
		padding-top:8px;
	}
	
}
/* @media screen and (min-width: 1200px) */
@media screen and (min-width: 75em) {
	body {
		/* Zoom baseline grid to 17/16 = 1.0625 */
		font-size: 1.0625em;
	}
	#div-search {
		float:right;
		margin-top:0px;
		width:auto;
	}
	.center-container-two {
		width:49%;
		margin-left:4px;
		margin-right:4px;
	}
	.center-container-two-trans {
		width:49%;
		margin-left:4px;
		margin-right:4px;
	}
	.center-container-three {
		width:33%;
		margin-left:4px;
		margin-right:4px;
	}
	.center-container-four {
		width:24.2%;
		margin-right:8px;
	}
	
}
/* @media screen and (min-width: 1392px) */
@media screen and (min-width: 87em) {
	body {
		/* Reset baseline grid to 16/16 = 1.0 */
		font-size: 1em;
	}
	header, .oneway, .twoway, .threeway, .fourway {
		/*
		margin: 0 27.77777777777778%;
		*/
		margin: 0 10.666666666666664%;
	}
	#social-icons {
		float:right;
		margin-top:0px;
	}
	ul.menu li a:link, ul.menu li a:visited {
		padding-left:20px;
		padding-right:20px;
	}
	#reviews{
		display:none; 
		background-color:#ffffff;
		margin-top:0px; 
		float:right; 
		position:absolute; 
		right:20px; 
		width:100%; 
		max-width:330px; 
		-webkit-box-sizing: border-box; 
		-moz-box-sizing: border-box; 
		box-sizing: border-box;
	}
	
}
/* @media screen and (min-width: 1680px) */
@media screen and (min-width: 105em) {
	body {
		/* Zoom baseline grid to 17/16 = 1.0625 */
		font-size: 1.0625em;
	}
	ul.menu li a:link, ul.menu li a:visited {
		padding-left:12px;
		padding-right:12px;
	}
}
/*
*
*  Sixteen-column grid active
*  ----------------------------------------------------------------------------------------------------------------------
*  Margin   | #  1     2     3     4     5     6     7     8     9     10    11    12    13    14    15    16  |   Margin
*  5.55555% | %  6.25  12.5  18.75 25.0  31.25 37.5  43.75 50.0  56.25 62.5  68.75 75.0  81.25 87.5  93.75 100 | 5.55555%
*	
*
*/
/* @media screen and (min-width: 1872px) */
@media screen and (min-width: 117em) {
	header, .oneway, .twoway, .threeway, .fourway {
		margin: 0 2.555555555555555%;
	}
	header .wrapper {
		width: 37.5%;
		margin-left: 25%;
	}
	.oneway .wrapper {
		width: 75%;
	}
	.oneway .wrapper:first-child {
		margin-left: 12.5%;
	}
	.twoway .wrapper {
		width: 37.5%;
	}
	.twoway .wrapper:first-child {
		margin-left: 12.5%;
	}
	.threeway .wrapper {
		width: 33.33333333%;
	}
	.fourway .wrapper {
		width: 25%;
	}
	.fourway .wrapper-double {
		width: 50%;
	}
	.fourway .wrapper:first-child, .fourway .wrapper-double:first-child {
		
	}
	
	.fourway .wrapper-container .wrapper {
		width: 25%;
	}	
	.fourway .wrapper-container {
		float:left;
		width: 75%;
		margin-left: 12.5%;
	}
	.fourway .wrapper-container .wrapper:first-child {
		margin-left: 0%;
	}	
}
/* @media screen and (min-width: 2080px) */
@media screen and (min-width: 130em) {
	body {
		/* Zoom baseline grid to 18/16 = 1.125 */
		font-size: 1.125em;
		max-width: 160em;
	}
}

.blue {
	background-color:#0882ab;
	border-radius: 6px;
	color:#ffffff;
	padding:10px;
	width:220px;
	margin-top:6px;
	cursor:pointer;
	border:0px;
	text-transform: uppercase;
	font-size:14px
}

.wrapper-content{
	float:left;
	width: 100%;
	padding:20px;
	background-color:#ffffff;
	height:100%;
}
