/* --------------------------------------- */
/* EUROFLEET Startpage css */
/* --------------------------------------- */


#header .branding-text 
{
	position:absolute;
	bottom:0px;
}

#main h1 { float:none; }

#header .branding-text a {
    position: relative;
    font-size: 0.8em;
    color: #fff;
    left: 425px;
    bottom: 10px;
	}

#header .branding-text a:after {
	display: inline-block;
    content: "";
    background: url(/grfx/home-go.png) no-repeat top;
    width: 12px;
    height: 10px;
    background-size: 12px 10px;
    vertical-align: middle;
    margin-left: 5px;
}


/* CONTENT */
@supports (display: grid) {

	#main .wrapper {
		display: block;
	}
}		
#dashboard {
	position: relative;
	background: url(/grfx/collage.jpg) no-repeat center top;
	background-size: auto 600px;
	height: 600px;
	}

#dashboard li {
	position: absolute;
	background-color: #2699fb;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.7);

	display: inline-block;
	font-weight: 400;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: .25rem;	
	}

#dashboard li a					{ color: #fff; text-decoration: none; display: block; }


#oe1							{ top: 36px; left: 10%; }
#oe2							{ top: 190px; left: 5%; }
#oe3							{ top: 90px; right: 15%; }
#oe6							{ top: 252px; right: 5%; }
#oe7							{ top: 362px; left: 8%; }
#oe8							{ top: 430px; right: 7%; }

/* --------------------------------------- */
/* mediaqueries css */
/* --------------------------------------- */
@media only screen and (max-width: 800px) {

	#header .branding-text 		{ font-size: 1em; }	

	#dashboard					{ background-size: contain; height: 500px; }
	
}	

@media only screen and (max-width: 640px) {

	#header .branding-logo {
		background-position: center 0px;
		width: 100%;
		height: 184px;
		}

	#header .branding-text 		{ display: none; }	

}	

@media only screen and (max-width: 480px) {

	#dashboard li 				{ position: relative; margin-bottom: 18px; }	

	#oe1						{ top: auto; left: auto; }
	#oe2						{ top: auto; left: auto; }
	#oe3						{ top: auto; right: auto; }
	#oe6						{ top: auto; right: auto; }

}