@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Sans'), local('NotoSans'), url(NotoSans.woff) format('woff');
}


body, html, h1, h2, h3, h4, h5, h6, p, ul, li, header, footer, main, aside, article {
	display: block;
	padding: 0;
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: 1em;
}
a {
	color: #ededed;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a img {border: none;}
ul, li {
	list-style: none;
}
body {
	background-color: #4a453c;
	color: #ededed;
	font-family: 'Noto Sans', verdana, arial, sans-serif;
	font-size: 9px;
	font-family: 'Open Sans', verdana, arial, sans-serif;
}
#wrapper {
	display: block;
	width: 700px;
	margin: 30px auto 0px;
}
h1 {
	font-size: 2.4em;
	text-transform: uppercase;
	padding: 0px 0px 10px 0px;
	border-bottom: 5px solid #db5f1a;
	margin: 0px 0px 10px 0px;
	letter-spacing: 0.05em;
}
h2 {
	font-size: 4.8em;
	text-transform: uppercase;
	margin: 0px 0px 10px 0px;
}
.unknown_system {
	font-size: 14px;
}
h3 {
	font-size: 2.4em;
	margin: 0px 0px 6px 0px;
}
	.version {
		font-size: 1.4em;
		text-transform: uppercase;
		margin-bottom: 40px;
	}
	h3.large {
		font-size: 3.6em;
	}
h4 {
	font-size: 1.4em;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding-left: 1px;
}
h5 {
	z-index: 50;
	margin-top: 10px;
}
.title {
	font-size: 1.8em;
	font-weight: lighter;
	margin: 20px 0px 0px 0px;
	display: block;
	float: left;
	clear: both;
}
.inactive {
	display: none;
}
header {
	height: 110px;
	background-color: #2c2e2f;
}
	header div {
		width: 700px;
		margin: 0px auto 0px;
	}
	header img {
		position: relative;
		top: 40px;
	}

ul {

}

li {
	display: block;
	float: left;
	background-color: #5b5446;
	padding: 13px;
	margin: 10px 10px 0px 0px;
	max-width: 380px;
}
ul#results, ul#results_services {
	clear: both;
	padding-top: 3px;
} 
ul.results li:hover, ul.results li.active {
	background-color: #736a58;
	background-color: #2C2E2F;
	cursor: pointer;
	position: relative;
}
ul.results li.active {
	z-index: 10;
}
ul.results li div {
	display: none;
}
ul.results li.active a {
	display: block;
}
li.wide {
	max-width: 400px;
}
ul.results li.active.wide div {
	width: 400px;
}
ul.results li.active div  {
	display: block;
	width: 380px;
	margin: 10px 0px 10px 0px;
	position: absolute;
	background-color: #2C2E2F;
	border-color: #4A453C;
	outline: 10px solid #4A453C;
	padding: 60px 13px 20px 13px;
	left: 0px;
	top: -10px;
	cursor: auto;
	overflow: hidden;
}
ul.results li a  {
	margin: 10px 0px 10px 0px;
	font-size: 1.4em;
	color: #DB5F1A;
	line-height: 1.2em;
	word-wrap: break-word;
}
ul.results li p {
	line-height: 1.6em;
	font-size: 1.4em;
}
ul.results li.active h3, ul.results li.active h4  {
	position: relative;
	z-index: 9;
}
	.analytics h4 {
		color: #4cdb1a;
	}
	.marketing h4 {
		color: #9DC9AD;
	}	
	.social_media h4 {
		color: #1ad9db;
	}	
	.framework h4 {
		color: #B69A77;
	}	
	.cdn h4 {
		color: #b1beff;
	}		
	.technology h4, .teknologi h4 {
		color: #B69A77;
	}	
	.systems h4 {
		color: #E97939;
	}
	.extension h4 {
		color: #E97939;
	}	
	.customer_service h4,.kundeservice h4 {
		/*color: #55E4AB;*/
		color: #EE7575;
	}
	.testing h4 {
		color: #f7a4ff;
	}
	.ad_networks h4 {
		color: #dbd41a;
	}
	.payment_systems h4 {
	    color: #F3DDAE;
	}

.results.sidebar li {
	text-align: left;
	background-color: transparent;
	padding: 0;
	margin: 0;
}
.results.sidebar li:hover {
	background-color: transparent;
	cursor: inherit;
}
.results.sidebar li h3 {
	margin: 0px 0px 3px 0px;
}
.results.sidebar li h4 {
	color: #b5ac9c;
	margin: 0px 0px 30px 0px;
	line-height: 1.5em;
}
.results.sidebar li.two-col h3 {
	float: left;
	display: block;
}
.results.sidebar li.two-col h4 {
	float: left;
	display: block;
	width: 110px;
	margin: 0px 0px 30px 10px;
}
main {
	width: 700px;
	float: left;
	margin: 0px 0px 0px 0px;
}
aside {
	width: 200px;
	float: right;
}


/* - - - FORM - - - */
section {
	float: none;
	clear: both;
	padding-top: 10px;
}
form {
	width 100%;
	background-color: #2c2e2f;
	padding: 30px;
	margin: 80px 0px 100px 0px;
}
label {
	display: block;
	font-size: 1.6em;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0px 0px 10px 0px;

}
input {
	height: 40px;
	width: 420px;
	border: none;
	margin-right: 10px;
	padding-left: 10px;
	font-size: 1.8em;
}
input.inactive {
	font-family: verdana, sans-serif;
	font-style: italic;
	color: #4a453c;
	font-size: 1.4em;
	display: inline;
}
button {
	display: inline;
	border: none;
	width: 205px;
	height: 40px;
	background-color: #db5f1a;
	font-size: 1.4em;
	margin: 0px 0px 5px 0px;
	color: inherit;
	text-transform: uppercase;
	cursor: pointer;
	letter-spacing: 0.1em;
}



footer {
	display: block;
	clear: both;
	float: none;
	width: 100%;
	text-align: center;
	padding: 20px 0px 40px 0px;
	background-color: #2c2e2f;
	color: #90897b;
	font-size: 1.4em;

}
footer p {
	margin: 0px 0px 10px 0px;
}
footer a {
	color: inherit;
}


/* 
	Sticky footer
	http://www.cssstickyfooter.com
*/
html, body {height: 100%;}

#wrapper {min-height: 100%;}

main {
/*	overflow:auto;
*/	padding-bottom: 40px;}  /* must be same height as the footer */

footer {position: relative;
	margin-top: -40px; /* negative value of footer height */
	height: 40px;
	clear:both;} 

/* - - - LOADING - - - */
#loader {
	display: block;
	/*position: absolute;*/
	z-index: 999;
	top: 0px;
	left: 0px;
	width: 100%;
	/*height: 100%;*/
	text-align: center;
	background-color: #ededed;
	/*padding-top: 100px;*/
	padding-top: 0px;
	padding-bottom: 20px;
	height: 140px;
	position: relative;
	overflow: hidden;
	transition-property: height;
	transition-duration: 0.5s;
	transition-timing-function: linear;
	/* Safari */
	-webkit-transition-property:height;
	-webkit-transition-duration:0.5s;
	-webkit-transition-timing-function:linear;
}
#loader p {
	color: #4a453c;
	margin: 0px 0px 10px 0px;
	font-size: 2.0em;
}
#loader.inactive, #footer.inactive {
	//display: none;
	height:0px;
	overflow: hidden;
	padding: 0px;
}
#wrapper.inactive {display: none;}




/* - - - FRONT PAGE - - - */
.front_page h1 {
	border: none;
	line-height: 1.2em;
	margin: 0px;
    font-size: 2.5em;
    margin-top: 20px;
}
.front_page h2 {
	font-size: 1.8em;
	text-transform: none;
}
.front_page form {
	margin: 0px 0px 100px 0px;	
}
.block {
	background-color: #2C2E2F;
	padding: 30px;
	width: 300px;
	float: left;
	clear: none;
}
.block.first {
		margin-right: 10px;
}
.block p {
	font-size: 1.5em;
	line-height: 1.5em;
	color: #EDEDED;
}
.block h5 {
	font-size: 2.5em;
	margin: 0px 0px 10px 0px;
	color: #E97939;

}
/* - - - DEBUG - - - */

/*		body {background-color: #323330;color: #ccc;}
		span {display: block;font-family: monospace;padding: 5px 10px;}
*/		.value {display: block;font-family: monospace;padding: 5px 10px; border: none; background-color: transparent;color: inherit; width: 100%;}
		.error {
			background-color: #D52E2E;
			color: #DFDCDC;
			font-size: 1.3em;
			line-height: 1.2em;
			padding: 10px;		
		}
		.error h1 {border:none;}
		.warning {color: #ff6666;}
		.notice {background-color: transparent; color: #ffff88;}
		.notice:before {content:"█ ";}
		.success {background-color: transparent; color: #91E091;}
		.success:before {content:"█ ";}
		.debug-var {background-color: transparent;color: #CE6389;padding: 5px;}
		.debug-var em {color: #8C7CA0;}
		.debug-var strong {color: #ccc; border-bottom: 1px solid #807880;min-width: 10px;display: inline-block;}
		.debug-var span {color: #E6B4C6;display: inline;}
		.longstring, .object div {height: 15px;overflow: hidden; width: 500px;}
		.longstring:hover, .object div:hover {height: 100%;overflow: scroll;background-color: #ffff88;float: left;color: #333;padding: 5px;}
/*		h6 {font-size: 1em;margin: 1em 0px 0px 0px;background-color: #F1F1F1;padding: 5px 10px; color: #333;}
		h3 {background-color: #9f9; color: #333;}
		h2 {background-color: #B33535; color: #efefef; padding: 5px 3px;}
*/




/**
	Loading animation
*/


.spinner2 {
  margin: 20px auto 20px;
  width: 80px;
  height: 80px;
  text-align: center;
  font-size: 10px;
}

.spinner2 > div {
  background-color: #DB5F1A;
  height: 100%;
  width: 6px;
  display: inline-block;
  
  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
  animation: stretchdelay 1.2s infinite ease-in-out;
}

.spinner2 .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner2 .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner2 .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner2 .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
  0%, 40%, 100% { transform: scaleY(0.4) }  
  20% { transform: scaleY(1.0)  }
}


#loader {
    background-color: #2C2E2F;
    height: 110px;
}
#loader p {
    color: inherit;
}
.spinner2 {
    margin-top: 0px;
    margin-bottom: 10px;
}

h5.title {
    font-size: 2.0em;
    font-weight: normal;
    /* font-family: arial; */
    background-color: #4A453C;
    padding: 0px 10px;
    margin: 0px 0px 0px 30px;
    position: relative;
    top: -10px;
    z-index: 1;
}
#site_title {
    /* padding-bottom: 60px; */
    /* margin-bottom: -34px; */
    border: none;
    /* text-transform: lowercase; */
    font-size: 3.5em;
    /* background-color: #DDDDDD; */
    color: #C25D25;
    padding: 10px;
    font-family: "Source Sans Pro Extralight",helvetica,arial, sans-serif;
    /* font-weight: 100; */
    /* text-align: center; */
}
.title_container {
    border-bottom: 2px solid #DB5F1A;
    clear: both;
    padding-top: 30px;
}
ul#results {
    /* margin-bottom: 50px; */
}
#site_title a {
    color: inherit;
}
#site_title a {
    font-family: 'Open Sans', sans-serif;  color: #EDEDED;
}

button {
    width: 190px;
    float: right;
}
label {
    margin-bottom: 20px;
}


#errors.notice {
    color: #CFCCAA;
    font-size: 1.5em;
    font-style: italic;
}
#errors.critical {
	color: #F1F1F1;
	font-size: 2em;
	font-style: normal;
	background-color: #6B0E0E;
	padding: 20px 15px;
	font-family: arial,verdana,sans-serif;
	line-height: 1em;
}



/*footer strong {
	font-weight: normal;
}*/
footer a:hover {
	color: #DB5F1A;
}


#new_result {
	height: 5px;
	background-color: #659B65;
	display: none;
}