/* @group base *//*------------------------------------------------------------------------------- */

*
{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html 
{ 
	overflow-y: scroll; 
	-webkit-font-smoothing: antialiased;
}

body
{
	font: 87.5%/1.8em normal;
	font-weight: 300;
	font-family: Open Sans, Arial, sans-serif;
	color: #004067;
	background: #e5f6fb;
}

html, body, { height: 100%; }

a 
{
	outline: none;
	color: #32b400;
	cursor: pointer;
	text-decoration: underline;
	transition: color 0.3s, background-color 0.3s;
}

a:hover { color: #248200; }

a img 
{ 
	border: none; 
	display: block;
}

img 
{ 
	border: 0; 
	max-width: 100%;
	height: auto;
}

hr
{
	background: #666;
	height: 1px;
	border: 0;
	outline: none;
	margin: 50px 0 40px;
}

.unknownrisk { background: #9b9a9b; }
.unknownrisk span { display: none; }
.unknownrisk:before { content: "?"; }

.high { background: #f3615e; }
.medium { background: #f68a1d; }

.low
{ 
	background: #9dd779; 
	color: #004d7c; 
}

/* @end */
/* @group typography *//*------------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6
{ 
	line-height: 1.3em; 
	padding: 0.3em 0;
	font-weight: 300;
}

h1 { font-size: 2.5em; }
h2 { font-size: 2.2em; }
h3 { font-size: 1.9em; }
h4 { font-size: 1.6em; }
h5 { font-size: 1.3em; }
h6 { font-size: 1em; font-weight: 700; }

h1>span, h2>span, h3>span, h4>span, h5>span, h6>span
{ color: #54c6e6; }

p, main ul, main ol { padding: 0.4em 0; }

main li
{
	list-style-position: outside;
	margin-left: 1.2em;
}

.disclaimer { color: #4A4A4A; }

#about-disclaimer { margin-top: 45px;}

/* Able to draw dashed lines in graphs */
.dashed {
	stroke-dasharray: 2;
}

/* @end */
/* @group forms *//*------------------------------------------------------------------------------- */

::-webkit-input-placeholder { color: #6a6a6a !important; opacity: 1; font-weight: 300 !important; }
::-moz-placeholder          { color: #6a6a6a !important; opacity: 1; font-weight: 300 !important; }
:-ms-input-placeholder      { color: #6a6a6a !important; opacity: 1; font-weight: 300 !important; }
input.placeholder           { color: #6a6a6a !important; opacity: 1; font-weight: 300 !important; }

input,
textarea,
button,
.btn
{
	font-family: Open Sans, Arial, sans-serif;
	font-size: 1em;
	line-height: 1.5em;
	border-radius: 7px;
	padding: 8px 14px;
	transition: all 0.7s;
	display: inline-block;
	margin-right: 16px;
	vertical-align: top;
	transition-property: color, background, box-shadow, border-color;
}

input:focus,
textarea:focus,
button:focus
{ outline: none; }

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="url"],
textarea
{
	font-weight: 300;
	border: 2px solid #bfbfbf;	
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="url"]:focus
{
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.3);
	border-top-color: #dedede;
}

textarea
{
	border-radius: 0;
	resize: none;
	width: 100%;
	height: 110px;
	overflow: auto;
}

button,
.btn
{
	font-weight: 600;
	background: #41a42a;
	color: #FFF;
	border: 2px solid #FFF;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 2px 3px rgba(0,0,0,0.3);
}

button.inverse,
.btn.inverse
{ 
	background: #004573; 
	color: #9cd679;
	border-color: #9cd679;
	margin-top: 13px;
	margin-bottom: 13px;
}

button:hover,
.btn:hover
{ 
	background: #368e22; 
	box-shadow: 0 2px 3px rgba(0,0,0,0.1);
}

button.inverse:hover,
.btn.inverse:hover
{ background: #01395e; }

button:active,
.btn:active
{ top: 1px; }

button [class^="icon-"]:before, 
.button [class*=" icon-"]:before
{ margin-left: 10px; }

textarea ~ .btn,
textarea ~ button
{
	border-radius: 0 0 2px 2px;
	box-shadow: none;
	display: block;
	width: 100%;
	border-color: #31aa08;
	color: #31aa08;
	background: #FFF;
}

textarea ~ .btn:hover,
textarea ~ button:hover
{ background: #FFF; }

/* Remove button padding in FF */
button::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner
{
	padding: 0 !important;
	border: 0 none !important;
 }

/* @end */
/* @group icons *//*------------------------------------------------------------------------------- */

@font-face 
{
	font-family: fontawesome;
	src: url(/National_Library/oe_/https://www.magereport.com/static/fonts/fontawesome.woff) format('woff');
}

[class^="icon-"]:before, 
[class*=" icon-"]:before
{
	font-family: fontawesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-github:before 		{ content: "\f09b"; }
.icon-google:before 		{ content: "\f1a0"; }
.icon-linkedin:before 		{ content: "\f0e1"; }
.icon-refresh:before 		{ content: "\f021"; }
.icon-trash:before 			{ content: "\f1f8"; }
.icon-share:before 			{ content: "\f064"; }
.icon-download:before 		{ content: "\f019"; }
.icon-list:before			{ content: "\f0ca"; }
.icon-bell:before			{ content: "\f0f3"; }
.icon-bell-slash:before		{ content: "\f1f6"; }
.icon-exclamation:before	{ content: "\f071"; }
.icon-report:before			{ content: "\f016"; }
.icon-byte:before			{ content: url('/National_Library/oe_/https://www.magereport.com/static/images/byte-avatar.png'); }

/* @end */
/* @group layout *//*------------------------------------------------------------------------------- */

header { padding: 16px; }

main
{
	display: table;
	table-layout: fixed;
	width: 100%;
}

main > .sidebar,
main > .content
{
	position: relative;
	display: block;
	float: left;
	width: 75%;
	padding: 16px;
}

main > .sidebar
{
	width: 25%;
	font-weight: 400;
	position: relative;
	overflow: hidden;
}

.sidebar > a.toggler { display: none; }

.sidebar .rescan-all-button { cursor: pointer; }

main > .sidebar,
main > .sidebar a
{ color: #FFF; }

main > .sidebar:before,
main > .sidebar:after
{
	content: "";
	position: fixed;
	left: 0;
	top: 0;
	width: 25%;
	height: 100%;
	background: #003b67;
	display: block;
	z-index: -1;
}

main > .sidebar:after
{
	position: absolute;
	width: 16px;
	height: 100%;
	left: 100%;
	margin-left: -16px;
	top: 0;
	background: linear-gradient(to left, rgba(0,64,103,0.5) 0%, rgba(0,64,103,0) 100%);
	z-index: 1;
}

main > .content
{
	padding: 16px 60px;
}

main.splash
{
	background: #003e67;
	color: #FFF;
	margin: 0 auto;
	width: 960px;
	padding: 0 80px 40px 80px;
}

main.splash:before
{
	content: "";
	position: fixed;
	left: 0;
	top: 0;
	background: #003e67;
	width: 100%;
	height: 100%;
	z-index: -1;
}

main.splash.static-page
{
	padding: 40px 0 40px;
}

/* @end */
/* @group header *//*------------------------------------------------------------------------------- */

header
{
	background: #002447;
	position: relative;
	height: 80px;
	display: table;
	width: 100%;
	font-weight: 400;
	z-index: 1;
}

header a
{
	color: #FFF;
	text-decoration: none;
	cursor: pointer;
}

header a:hover { color: #9addef; }

header .branding, 
header nav,
header span.branding span.branding
{ 
	display: table-cell; 
	vertical-align: middle;
}

header .branding a:first-child { margin-right: 60px; }

header span.branding span.branding, header span.branding a {
 float: left;
}

header nav { text-align: right; }

nav ul { list-style: none; }

nav > ul > li 
{
	display: inline-block; 
	position: relative;
	vertical-align: top;
	margin-right: 15px;
}

nav > ul > li:last-child { margin-right: 0; }

nav .toggler
{
	border: 5px solid transparent;
	display: block;
	float: right;
	margin: 10px 10px 0 10px;
	border-top-color: #FFF;
}

nav li:hover > .toggler,
nav.wide-screen li:hover > a > .toggler
{
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	border-top-color: #9addef;
	margin-top: 5px;
}

nav ul ul
{
	position: absolute;
	right: -16px;
	top: 100%;
	display: none;
	background: #002447;
	padding: 16px;
	transition: 0.3s;
}

nav ul li:hover > ul
{ display: block; }

nav ul ul a
{
	display: block;
	white-space: nowrap;
	text-align: left;
}

/* @end */
/* @group branding *//*------------------------------------------------------------------------------- */

.branding { font-size: 1.6em; }

main .branding
{
	width: 100%;
	text-align: center;
	display: block;
	padding: 10px 0;
}

.branding a
{
    color: white;
    text-decoration: none;
}

.branding small 
{ 
	font-size: 0.6em;
	font-weight: 300;
	display: inline-block;
	vertical-align: middle;
	margin: 0 0.4em;
}

.branding .hypernode,
.branding .byte
{
	text-indent: -999em;
	display: inline-block;
	vertical-align: middle;
}

.branding .hypernode
{
	background: url(/National_Library/oe_/https://www.magereport.com/static/images/css/hypernode.png) no-repeat;
	width: 164px;
	height: 16px;
	background-size: 164px 16px;
}

.branding .byte
{
	background: url(/National_Library/oe_/https://www.magereport.com/static/images/css/byte.png) no-repeat;
	width: 58px;
	height: 30px;
	background-size: 58px 30px;
}

/* @end */

/* @branding-plus *//*----------------------------------------------------------------------------------- */
div.branding-plus{
	display: inline-block;
	-webkit-box-sizing: border-box;
 	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background: #002447;
	border: 2px dashed #54c6e6;
	border-radius: 3px;
	overflow: hidden;
	padding: 15px 20px 20px;
	margin: 20px 0 30px 30px;
	font-size: 0.80em;
	font-weight: bold;
	text-align: center;
	float:right;
}
div.branding-plus a { text-decoration: none; } 

div.branding-plus img.badge { margin-top: 10px; }
/* @end */

/* @group social media *//*------------------------------------------------------------------------------- */

ul.social-login { list-style: none; }
ul.social-login li { margin: 0; }

ul.social-login a
{
	border-radius: 3px;
	padding: 6px 19px;
	display: block;
	color: rgba(255,255,255,0.9);
	font-weight: 700;
	border: 1px solid;
	margin: 10px 0 0 0;
	text-decoration: none;
	text-align: left;
}

ul.social-login a > span
{
	display: inline-block;
	padding-right: 10px;
}

ul.social-login .github
{
	border-color: #211f1f;
	box-shadow: inset 0 1px 0 #545353;
	background: #404040;
	background: linear-gradient(to bottom, #404040 0%, #211c1c 100%);
}

ul.social-login .github:hover
{ background: linear-gradient(to bottom, #404040 50%, #211c1c 100%); }

ul.social-login .google
{
	border-color: #b3370f;
	box-shadow: inset 0 1px 0 #d9765b;
	background: #d94a1f;
	background: linear-gradient(to bottom, #d94a1f 0%, #ba3101 100%);
}

ul.social-login .google:hover
{ background: linear-gradient(to bottom, #d94a1f 50%, #ba3101 100%); }

ul.social-login .linkedin
{
	border-color: #005781;
	box-shadow: inset 0 1px 0 #0180bd;
	background: #404040;
	background: linear-gradient(to bottom, #0279b4 0%, #00547e 100%);
}

ul.social-login .linkedin:hover
{ background: linear-gradient(to bottom, #0279b4 50%, #00547e 100%); }

ul.social-login .byte
{
	border-color: #467fc0;
	box-shadow: inset 0 1px 0 #5ba4de;
	background: #404040;
	background: linear-gradient(to bottom, #68bbe6 0%, #4e8ed5 100%);
}

ul.social-login .byte:hover
{ background: linear-gradient(to bottom, #68bbe6 50%, #4e8ed5 100%); }

/* @end */
/* @group lightbox *//*------------------------------------------------------------------------------- */

.lightbox
{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,37,72,0.2);
	text-align: center;
	z-index: 99;
	display: table;
	-webkit-animation: fadeIn 0.3s forwards;
	animation: fadeIn 0.3s forwards;
}

.lightbox > div
{
	display: table-cell;
	vertical-align: middle;
}

.lightbox div.container
{
	display: inline-block;
	position: relative;
	max-width: 400px;
	box-shadow: 0 0 5px rgba(0,58,105,0.2);
	background: #FFF;
	padding: 50px;
	text-align: center;
}

.lightbox .close
{
	width: 46px;
	height: 46px;
	background: #002447;
	border: 2px solid #FFF;
	position: absolute;
	right: -23px;
	top: -23px;
	display: block;
	border-radius: 100px;
	box-shadow: 0 0 5px rgba(0,58,105,0.2);
	transition: 0.3s; 
}

.lightbox .close:hover
{ box-shadow: 0 0 5px rgba(0,58,105,0.7); }

.lightbox .close:before,
.lightbox .close:after
{
	content: "";
	width: 3px;
	height: 26px;
	background: #FFF;
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -13px -13px 0 0;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.lightbox .close:after
{
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.lightbox ul.social-login
{ margin: 20px 32px; }

@-webkit-keyframes fadeIn
{
	from 	{ opacity: 0; }
	to		{ opacity: 1; }
}

@keyframes fadeIn
{
	from 	{ opacity: 0; }
	to		{ opacity: 1; }
}

/* @end */
/* @group loading *//*------------------------------------------------------------------------------- */

/* loading animation, credits to http://lea.verou.me/2013/11/cleanest-css-spinner-ever/ */

.loading
{
	position: relative;
	color: transparent;
}

.loading .spinner
{
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 1;
	display: inline-block;
	width: 5em;
	height: 5em;
	margin: -2.5em 0 0 -2.5em;
	font-size: 4px;
	text-indent: -999em;
	overflow: hidden;
	-webkit-animation: spin 0.7s infinite steps(8);
	animation: spin 0.7s infinite steps(8);
}

.list-scan-results .loading .spinner
{
	left: 95%;
}

.loading  .spinner:before,
.loading  .spinner:after,
.loading  .spinner > span:before,
.loading  .spinner > span:after 
{
	content: "";
	position: absolute;
	top: 0;
	left: 2.25em;
	width: 0.5em;
	height: 1.5em;
	border-radius: 0.2em;
	background: #003e67;
	box-shadow: 0 3.5em #003e67;
	-webkit-transform-origin: 50% 2.5em;
	transform-origin: 50% 2.5em;
}

.loading  .spinner:before { background: #DDD; }

.loading  .spinner:after 
{
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	background: #BBB;
}

.loading  .spinner > span:before 
{
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	background: #666;
}

.loading  .spinner > span:after 
{
	-webkit-transform: rotate(-135deg);
	transform: rotate(-135deg);
	background: #555;
}

@-webkit-keyframes spin { to { -webkit-transform: rotate(1turn); } }

@keyframes spin { to { transform: rotate(1turn); } }

/* @end */
/* @group splash page *//*------------------------------------------------------------------------------- */

main.splash
{ 
	font-size: 1.2em; 
	line-height: 1.8;
	color: #DCF2F8;
}

.splash hr { background: #FFF; }

.splash form 
{ 
	text-align: center; 
	margin: 0 -80px;
	font-size: 0.9em;
}

.splash form h1 { padding: 50px 220px; }

.splash form input.shopurl { border-color: #FFF; }

/* @end */
/* @group scan form *//*------------------------------------------------------------------------------- */

.results-header input.shopurl { width: 260px; }

.results-header {
	background: #FFF;
	width: 100%;
	display: block;
	border-bottom: 16px solid #e5f6fb;
	padding: 16px 60px;
	margin: -16px -61px 0 -60px;
	box-sizing: content-box;
	position: relative;
}

.results-header:after
{
	content: "";
	position: absolute;
	left: 0;
	bottom: -16px;
	height: 15px;
	width: 100%;
	background: linear-gradient(to bottom, rgba(0,168,219,0.05) 0%, rgba(0,168,219,0) 100%)
}

.content .results-header .dashboard > div:last-child { float:right;}

.content .results-header .dashboard > div input { vertical-align: baseline; }

.content .results-header .dashboard > div ul.actions { font-weight: 700; }

.content .results-header .dashboard .status h4,
.content .results-header .dashboard .status h4 > span
{
color:#004067;
}

div.sidebar form.scan-form button,
.content .results-header .dashboard > div:last-child button
{
	margin-right: 0;
	border-top: 2px solid #41a42a;
	border-right: 2px solid #41a42a;
	border-bottom: 2px solid #41a42a;
	border-left: none;
	border-radius: 0 7px 7px 0;
	box-shadow: none; 
}

div.sidebar form.scan-form input.shopurl,
.content .results-header .dashboard > div:last-child input.shopurl
{
	margin-right: 0;
	border-top: 2px solid #bfbfbf;
	border-right: none;
	border-bottom: 2px solid #bfbfbf;
	border-left: 2px solid #bfbfbf;
	border-radius: 7px 0 0 7px;
	box-shadow: none; 
}
.results-header .dashboard h4
{
	text-transform: none;
	padding: 12px 0 11px 0;
}

/* @end */
/* @group scan results *//*------------------------------------------------------------------------------- */

ul.scan-list
{ 
	position:relative;
	list-style: none; 
	margin: 10px -16px;
	font-weight: 600;
	z-index: 2;
}

ul.scan-list li 
{ 
	margin-left: 0; 
	display: block;
	padding: 5px 16px;
	position: relative;
	padding-right: 35px;
	white-space: nowrap;
	transition: background 0.3s;
}
div.sidebar form.scan-form
{
	position: relative;
	background: none;
	border-bottom: none;
	margin-top: 12px;
	margin-bottom: 24px;
}
div.sidebar form.scan-form input.shopurl {width:80%;}
div.sidebar form.scan-form button {width:20%;}


ul.scan-list a.icon-refresh.rescanAll { z-index: 2; }

ul.scan-list .scanned-shops-list
{
	background: #002447;
	padding: 10px 0;
	/* calculate scaned-shops-list max-height to make sure content of sidebar is always visible.
	When more items are added to the sidebar, their heights should be subtrackted here aswell. (use a script?)
	100vh	= total viewport (browserwindow) height
	80px	= total height of: <header>
	99px	= total height of: <div.scan-form> block (enter shop URL | ADD)
	46px	= total height of: "reports" <li.checklist-button>
	46px	= total height of: "alerts" <li.alerting-button>
	204px	= total height of: <div.blurb>
	*/
	max-height: -o-calc(100vh - 80px - 99px - 46px - 46px - 204px ); /* opera */
	max-height: -webkit-calc(100vh - 80px - 99px - 46px - 46px - 204px ); /* google, safari */
	max-height: -moz-calc(100vh - 80px - 99px - 46px - 46px - 204px ); /* firefox */
	/* to make sure that scaned-shops-list will always display at least 5 shops */
	min-height: 185px;
	overflow-y: auto;
}

ul.scan-list .scanned-shops-list::-webkit-scrollbar {
    width: 15px;
}
 
ul.scan-list .scanned-shops-list::-webkit-scrollbar-track {
    background: none;
}
 
ul.scan-list .scanned-shops-list::-webkit-scrollbar-thumb {
    background-color: #1e7ebc;
    border: 5px solid transparent;
    border-radius: 9px;
    background-clip: content-box;
}

ul.scan-list li.selected,
ul.scan-list li:hover
{ background: #1e7ebc; }

ul.scan-list a 
{ text-decoration: none; }

ul.scan-list a:hover { text-decoration: underline; }

ul.scan-list .count
{
	padding: 0 3px;
	min-width: 2.5em;
	text-align: center;
	display: inline-block;
	margin-right: 10px;
	border-radius: 100px;
	font-weight: 700;
	background: none;
}
ul.scan-list .count.high { color: #f3615e; }
ul.scan-list .count.medium { color: #f68a1d; }
ul.scan-list .count.low { color: #9dd779; }
ul.scan-list .count.unknownrisk { color: #9b9a9b; }

ul.scan-list a.icon-refresh,
ul.scan-list a.icon-trash
{
	position: absolute;
	right: 20px;
	top: 50%;
	margin-top: -0.8em;
	text-decoration: none;
}

ul.scan-list li.main-item span[class^="icon-"]
{
	margin-left: 10px;
	margin-right: 20px;
}

ul.scan-list .count.loading ~ a { opacity: 0.3; }

ul.scan-list > li.main-item
{
	border-top: 1px solid #002447;
	text-transform: uppercase;
	padding: 10px 16px;
}

ul.scan-list > li.main-item:last-of-type
{
	border-bottom: 1px solid #002447;
}
/* @end */
/* @group subscribe + blurb *//*------------------------------------------------------------------------------- */

div.subscribe,
div.blurb
{
	margin: 34px;
}

div.subscribe {
	background: #012747;
	padding: 16px;
    border-radius: 5px;
    border: dashed #1e7fbc 1px;
}

div.subscribe ul:not(.social-login) li {
    list-style-image: url('/National_Library/oe_/https://www.magereport.com/static/images/checkmark.png');
    margin-left: 25px;
    font-size: 1.3em;
    font-weight: 300;
    line-height: 2em;
}

div.subscribe .btn
{
	display: block;
	margin: 15px 0;
    text-align: center;
}

div.blurb
{
	text-align: center;
}

/* @end */
/* @group dashboard *//*------------------------------------------------------------------------------- */

.dashboard
{
	text-transform: uppercase;
	display: table;
	width: 100%;
	/*margin-top: 15px;*/
	margin: 6px 0 9px;
}

/* response time warning */
.dashboard div.status-bar { width: 100%;}
.dashboard div.status
{
	float: left;
	margin-right: 10px;
}

.dashboard div.status-message { overflow: hidden; }
.dashboard div.status-message
{
	background: none;
	border: dashed 1px #f3615e;
	width: 100%;
	margin-top: 25px;
}
.dashboard div.status-message p
{
	width: 100%;
	padding: 14px;
	text-transform: none;
	font-weight: 500;
}
.dashboard div.status-message p:before
{
	font-family: fontawesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	cursor: pointer;
	margin-right: 10px;
	color: #f3615e;
	content: "\f071";
}
@media screen and (max-width: 1354px)
{
	.dashboard.distribution div.status
	{
		float: none;
		margin-bottom: 25px;
	}
}
/* end response time warning */

.dashboard > div { display: inline-block; }

.dashboard > div ul.actions { font-weight: 700; }

.distribution.dashboard > div.rescanAll,
.dashboard > div.rescanSite
{
	float: right;
}
.distribution.dashboard > div.rescanAll ul.actions a,
.dashboard > div.rescanSite ul.actions a
{
	padding-right: 0;
}
.dashboard > div.rescanSite ul.actions a { line-height: 45px; }


.dashboard .status h4
{
	display: inline-block;
}
.scan-results .dashboard .status h4:not(.risk-level) *,
.status-bar .dashboard .status h4:not(.risk-level) *
{
	line-height: 45px;
}

.dashboard .status h4.risk-level
{
	position:relative;
	background: #004573;
	color: #FFF;
	padding: 3px;
	display: inline-block;
	text-align: center;
	font-size: 15px;
}
.dashboard .status.sitename h4 { padding: 0;}
.dashboard .status h4.risk-level > span,
.status-bar .dashboard .status h4.risk-level > span
{
	width:100%;
	display:block;
	padding: 0px 3px;
	color: #FFF;
	font-weight: bold;
	line-height: 22px;
	vertical-align: middle;
	text-transform: uppercase;
}

.dashboard .status h4.risk-level span.loading
{
	background: #9b9a9b;
	display: inline-block;
	padding: 0;
	width: 100%;
	height: 50px;
	position: absolute;
	left:0;
	top:0;
}

.dashboard .status h4 span.low { color: #004d7c; }

.dashboard .status h4:last-child
{ 
	text-transform: none;
}

.dashboard ul.actions 
{ 
	list-style: none; 
	white-space: nowrap; 
}

.dashboard ul.actions li 
{ 
	display: inline-block; 
	margin: 0;
}

.dashboard ul.actions a
{
	text-decoration: none;
	border-left: 1px solid #74cce8;
	padding: 8px 12px;
	display: block;	
}

.dashboard .rescanSite ul.actions,
.dashboard .rescanSite ul.actions a
{
	padding: 0;
}

.dashboard ul.actions li:first-child a { border: 0; }

.dashboard ul.actions a > span:before
{ padding-right: 7px; }

/* @end */

/* @group overview-checks *//*---------------------------------------------------------------------------- */
.overview-checks .dashboard h4
{
	text-transform: none;
	padding: 12px 0 11px 0;
}

.overview-checks .scan-results .list-scan-results { margin-top: 15px; }

.overview-checks .scan-results .list-scan-results dl,
.overview-checks .scan-results .list-scan-results article
{
	width: 100%;
}

.overview-checks .scan-results .list-scan-results dl dt { width: 40%; }

.overview-checks .scan-results .list-scan-results dl dd:first-of-type
{
	text-align: left;
	width: 50%;
}

.overview-checks .scan-results .list-scan-results dl dd:last-of-type { width: 10%; }

.overview-checks .scan-results .list-scan-results article dl dt,
.overview-checks .scan-results .list-scan-results article dl dd:first-of-type
{
	font-weight: 300;
}

.overview-checks .scan-results .list-scan-results article:not(.show) dl dt,
.overview-checks .scan-results .list-scan-results article:not(.show) dl dd:first-of-type
{
	color: #004d7c !important;
}

.overview-checks .scan-results .list-scan-results article .article-content .action br { display:none; }

.overview-checks .scan-results .list-scan-results article .article-content .action p:before
{
	font-family: fontawesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: "\f071";
	margin-right: 10px;
}

.overview-checks .scan-results .list-scan-results article .article-content .action p { font-weight: 700; }

.overview-checks .scan-results .list-scan-results article .article-content .action p a
{
	font-weight: 300;
	margin-left: 10px;
}
.overview-checks .scan-results .list-scan-results article.medium .article-content .action p { color: #f68a1d; }

.overview-checks .scan-results .list-scan-results article.high .article-content .action p { color: #f26463; }

.overview-checks .scan-results .list-scan-results article.show div.article-content div.description
{
	border: 1px dashed #9b9a9b;
	margin: 20px;
	padding-bottom: 0;
}
/* @end */

/* @group scan results *//*------------------------------------------------------------------------------- */

.scan-results
{
   	padding: 0 0 20px 0;
	position: relative;
}

.scan-results.two-columns
{
	left: -10px;
	direction: rtl;
}

.scan-results.two-columns * { direction: ltr; }
.scan-results.two-columns > article
{
	position: relative;
	left: 20px;
}

.two-columns
{
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 40px;
   	-moz-column-gap: 40px;
   	column-gap: 40px;
}

.scan-results article
{
	background: #FFF;
	padding: 0;
	margin: 20px 10px 0;
	box-shadow: 0 2px 10px rgba(0,58,105,0.2);
	display: inline-block;
	width: 100%;
   	overflow: hidden;
	page-break-inside: avoid;
	break-inside: avoid-column;
	-webkit-column-break-inside: avoid;
	-webkit-backface-visibility: hidden;
}
.scan-results article form
{
	display: inline-block;
	width: 100%;
	padding: 0 20px 20px;
}

.scan-results article textarea
{ border-bottom: 0; }

.scan-results dl
{
	display: table;
	width: 100%;
	font-weight: 700;
	margin-left: 0px;
	padding: 5px 20px;
	box-sizing: border-box;
}

.scan-results article > dl:first-child
{
	background: #9b9a9b;
	color: #FFF;
}

.scan-results dl:nth-child(2)
{ margin-bottom: 10px; }

.scan-results dl dt { padding-right: 1em; }

.scan-results dl dt,
.scan-results dl dd
{ display: table-cell; }

.scan-results dl dd
{ text-align: right; }

.scan-results article h6:first-child
{ padding: 1.5em 0; }

.scan-results .notice
{
	border: 1px dashed;
	padding: 5px 20px;
}
.scan-results article .article-content div p,
.scan-results article .article-content div.notice
{
    margin: 0 20px;
}
.scan-results article .article-content div.notice
{
	margin-bottom: 10px;
}
.scan-results article .article-content div.label
{
	margin-top: 5px;
}

.scan-results .loading .notice { visibility: hidden; }

.scan-results .high > dl:first-child 	{ background: #f26463; }
.scan-results .medium > dl:first-child 	{ background: #f68a1d; }
.scan-results .low > dl:first-child 	{ background: #64b740; }
.scan-results .unknown > dl:first-child { background: #9b9a9b; }

.scan-results article div.article-content > dl dd, /*dl:nth-child(2) dd,*/
.scan-results .notice			
{ color: #4A4A4A; }

.scan-results .high div.article-content > dl dd, /*dl:nth-child(2) dd,*/
.scan-results .high .notice
{ color: #EC4B4B; }

.scan-results .medium div.article-content > dl dd, /*dl:nth-child(2) dd,*/
.scan-results .medium .notice	
{ color: #F36F2B; }

.scan-results .low div.article-content > dl dd, /*dl:nth-child(2) dd,*/
.scan-results .low .notice		
{ color: #64b740; }

/* @end */

/* @distribution progress bar *//*----------------------------------------------------------------- */
.distribution {
	margin-bottom: 15px;
	vertical-align: middle;
}

.distribution.dashboard div.status-bar { width: 90%;}
.distribution.dashboard .status { margin-right: 20px;}
.distribution .status h4 span { color: #004067;}

.distribution .bar {
	margin-top:20px;
	overflow: hidden;
	height:16px;
	border-radius: 4px;
	background: #c0e6f5;
}

.distribution .bar > span {
	height:20px;
	float:left;
}

.distribution .bar > span {
	-webkit-transition: width 0.3s;
    transition: width 0.3s;
}

.distribution.dashboard .rescanAll {float: right;}
.distribution.dashboard ul.actions a { padding: 8px 0 8px 12px;}

/* @end */


/* @group error *//*------------------------------------------------------------------------------- */

div.error
{ 
	text-align: center; 
	padding: 100px 0;
}

div.error .icon-exclamation
{
	font-size: 60px;
	color: #54c6e6;
}

div.error button
{
	margin: 0 0 20px 0;
}

/* @end */

/* @sneakpreview *//*--------------------------------------------------------------------------------------- */
.sneakPreview { text-align: center; }

.sneakPreview h3
{
	color: #36a6da;
	margin: 30px 20px 20px;
}
.sneakPreview p { margin: 0 20px; }

.sneakPreview button { margin: 20px 20px; }

.sneakPreview button a
{
	color: #fff;
	text-decoration: none;
	margin: 0 30px;
}

.sneakPreview div.screenshot { margin: 20px 20px 30px; }

.sneakPreview div.screenshot img
{
	width: 100%;
	box-shadow: 0 5px 20px rgba(0,58,105,0.4);
}
/* @end */

/* @top navigation *//*------------------------------------------------------------------------------------- */

nav.menu:focus {
	border: 0;
	outline : 0;
}

nav.menu .menu_button {
	display: none;
	cursor: pointer;
}
/* @end*/

/* @hypernode check results colums *//*------------------------------------------------------------------ */
.scan-results .left-column,
.scan-results .right-column
{
	width:50%;
	float: left;
}
.scan-results .left-column { padding-right: 20px; }
.scan-results .right-column { padding-left: 20px; }

.scan-results .left-column article,
.scan-results .right-column article
{
	margin: 20px 0 0;
}
/* @end */

/* @group larger screens *//*------------------------------------------------------------------------------- */

@media screen and (min-width: 1600px)
{
	header { z-index: 2; }
	
	main > .content,
	main > .sidebar
	{
		display: block;
		float: left;
		position: relative;
	}
	
	main > .sidebar 
	{ 
		z-index: 1; 
		overflow: visible;
	}
	
	main > .sidebar,
	main > .sidebar:before 
	{ width: 400px; }
	
	main > .sidebar:after
	{ left: 400px; }

	main > .content
	{
		position: absolute;
		padding-left: 460px;
		float: none;
		width: 100%;
	}
	
	.dashboard,
	.scan-results,
	div.error
	{
		width: 960px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.content .results-header button { text-indent: 0; }
}

/* @end */
/* @group smaller screens *//*------------------------------------------------------------------------------- */
@media screen and (max-width: 1354px)
{
	.distribution.dashboard { position: relative; }

	.distribution.dashboard div.rescanAll
	{
		position: absolute;
		right:0;
		top: 0;
		margin-top: 0;
		z-index: 2;
	}

	.distribution.dashboard div.status-bar { width:  100%; }

	.distribution.dashboard .status-bar .status { display: inline-block; }

	.distribution.dashboard .status-bar .status h4 { padding-top: 0; }

	.distribution.dashboard ul.actions a { padding: 0; }

	.distribution.dashboard .status-bar .status,
	.distribution.dashboard .status-bar .bar
	{
		margin: 0;
	}
}
@media screen and (max-width: 1492px)
{
	main > .content { padding: 16px 20px; }

    .sneakpreview-premium
    {
    	margin: 0 -20px -16px -20px;
    }
	
	main > .sidebar,
	main > .sidebar:before 
	{ width: 30%;}	
	
	main > .content { width: 70%; }	
	
	div.subscribe, div.blurb
	{
		margin-left: 0;
		margin-right: 16px;
	}
	
	.content .results-header
	{
		padding: 16px 20px;
		margin: -16px -20px 0;
	}
	
	.results-header input.shopurl { width: 250px; }
}

@media screen and (max-width: 1074px)
{
	header .branding a:first-child { margin-right: 30px; }
	
	main > .sidebar,
	main > .sidebar:before 
	{ width: 40%; }	
	
	main > .content { width: 60%; }
	
	main.splash 
	{ 
		width: 92%; 
		padding-left: 0;
		padding-right: 0;
	}
	
	.splash form { margin: 0; }
	
	.splash form h1 
	{ 
		padding-right: 100px; 
		padding-left: 100px;
	}
	
	.scan-results 
	{
		-webkit-column-count: 1;
	    -moz-column-count: 1;
	    column-count: 1;
	}

	.overview-checks .scan-results
	{
		-webkit-column-count: auto;
	    -moz-column-count: auto;
	    column-count: auto;
	}

	.scan-results .left-column,
	.scan-results .right-column
	{
		width: 100%;
		float: none;
		padding: 0;
	}

	.dashboard > div.rescanSite {
	    float: left;
	    width: 100%;
	}
}

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

	nav.menu .menu_button {
		display: block;
		cursor: pointer;
		color: white;
	}
	nav.menu > ul {
		opacity: 0;
		height: 0;
	}

	nav.menu > ul {
		background-color: #002447;
		position: absolute;
		left: 0px;
		display: block;
		width: 100%;
		text-align: center;
		padding-top: 20px;
		padding-bottom: 20px;
	}

	nav.menu > ul >  li {
		display: inline-block;
		position: relative;
		vertical-align: top;
		margin-right: 15px;
	}

	nav.menu >  ul > li:last-child { margin-right: 0; }

	nav.menu:focus > ul {
		opacity: 1;
		height: auto;
	}

	nav.menu:focus .menu_button > .toggler
	{
		transform: rotate(180deg);
		-webkit-transform: rotate(180deg);
		border-top-color: #9addef;
		margin-top: 5px;
	}

	main > .sidebar:after { z-index: 0; }
}

@media screen and (max-width: 808px)
{
	.splash form h1 
	{ 
		padding-right: 0; 
		padding-left: 0;
	}
	
	header
	{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 2;
	}
	
	main, main.splash, main.splash.static-page { padding-top: 80px; }
	
	header .branding a:first-child 
	{ 
		margin-right: 10px; 
		margin-left: 40px;
	}
	
	.branding a.hypernode
	{
		width: 82px;
		height: 8px;
		background-size: 82px 8px;
	}
	
	.branding a.byte
	{
		width: 29px;
		height: 15px;
		background-size: 29px 15px;
	}
	
	.branding small { font-size: 0.5em; }
	
	main,
	main > .sidebar, 
	main > .content
	{ display: block; }
	
	main { overflow: hidden; }
	
	main > .content 
	{ 
		position: relative; 
		left: 0;
	}
	
	main > .sidebar:before
	{ display: none; }
	
	main > .sidebar
	{
		position: fixed;
		left: -80%;
		bottom: 0;
		top: 80px;
		width: 80%;
		overflow: visible;
		background: #003b67;
		z-index: 3;
	}
	
	main > .sidebar.active 
	{ 
		left: 0; 
		overflow: auto;
	}
	
	main > .sidebar.active + .content { left: 80%; }
	
	main > .sidebar,
	main > .content
	{ transition: left 0.2s ease-in-out; }
	
	.sidebar > a.toggler,
	.sidebar.active + .content:before
	{
		position: fixed;
		left: 15px;
		top: 20px;
		color: #FFF;
		padding: 5px;
		text-decoration: none;
		display: block;
		font-size: 20px;
		transition: 0s;
		z-index: 2;
	}
	
	.sidebar.active > a.toggler { opacity: 0; }
	
	main > .sidebar.active:before { display: none; }
	
	.sidebar.active + .content:before
	{
		content: "\f0ca";
		font-family: fontawesome;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		line-height: 1;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		margin-top: 3px;
	}
	
	main > .content { width: 100%; }
}

@media screen and (max-width: 600px)
{
	header 
	{ 
		padding: 2px 2%; 
		height: 40px;
	}
	
	.headerLogo {
		display:none;
	}

	.sidebar > a.toggler,
	.sidebar.active + .content:before
	{ 
		font-size: 15px; 
		top: 3px;
	}
	
	.sidebar.active + .content:before
	{ margin-top: 5px; }
	
	main, main.splash { padding-top: 40px; }
	
	header .branding a.hypernode, 
	header .branding a.byte,
	header .branding small
	{ display: none; }
	
	header .branding a:first-child 
	{
		display: block; 
		font-size: 0.7em;
		margin-bottom: -3px;
		margin-left: 35px;
	}
	
	nav ul ul { padding-top: 3px; }
	
	main > .sidebar { top: 40px; }
	
	main > .sidebar.active:before { height: 35px; }
		
	.results-header input.shopurl
	{
		margin-bottom: 10px;
	}
}

@media screen and (max-width: 450px)
{
	.distribution.dashboard div.rescanAll
	{
		width:100%;
		position: relative;
	}
}

/* @end */

.flashmessage {
    background-color: #41a42a;
    position: relative;
    color: white;
    z-index: 2;
    text-align: center;
    font-weight: 700;
    padding: 5px;
    border-bottom: solid 1px white;
}

/* @magento-quote *//*------------------------------------------------------------------------------- */

div.magento-quote
{
	width: 85%;
	margin: 30px auto 20px;
	font-size: 0.9em;
	font-weight: bold;
	overflow: hidden;
}

div.magento-quote div { float: left; }

div.magento-image { width:15%; }

div.magento-caption
{
	width:85%;
	padding: 0 0 0 20px;
}

div.magento-image img
{
	width: 100px;
	margin-right: 10px;
}

div.magento-quote p { padding: 0; }

div.magento-quote p span 
{
	color: #54c6e6;
	font-size: 0.87em;
}

div.clear { clear: both; }

/* @end */

/* @counter-container *//*------------------------------------------------------------------------------- */

div.counter-container
{
	width: 100%;
	background: #002447;
	border: 2px dashed #54c6e6;
	border-radius: 3px;
	overflow: hidden;
	padding: 20px 0;
	margin: 40px 0;
}

div.counter-container > div
{
	-webkit-box-sizing: border-box;
 	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 50%;
	float: left;
	font-size: 0.80em;
	font-weight: bold;
	text-align: center;
}

div.counter-container .branding
{
	font-size: 1em;
	padding: 0 0 10px 0;
}

div.counter-container img.badge { margin-top: 15px; }

div.counter-container a { text-decoration: none; }

div.counter-container > div:first-child { border-right: solid 1px #54c6e6; }

div.counter-container > div:last-child { color: #54c6e6; }

div.counter-container > div:first-child  p { padding: 0; }

div.counter-container div.shops-counter 
{ 
	display: inline-block; 
	margin-top: 10px; 
}

div.counter-container div.shops-counter p 
{ 
	position:absolute;
	z-index: 2;
	letter-spacing: 1.9em;
	margin-left:14px;
}

div.counter-container div.shops-counter div.digit {
	float:left;
	background: #004067;
	border-radius: 7px;
	width: 30px;
	height: 30px;
	margin-left: 3px;
}

@media screen and (max-width: 521px)
{
	div.counter-container {
		padding:20px 5px;
	}
	div.counter-container > div
	{
		float:none;
		width:100%;
	}
	div.counter-container > div:first-child
	{
		border-bottom: solid 1px #54c6e6;
		border-right: none;
	}
	div.counter-container img.badge {
		margin-bottom: 10px;
	}
}

@media screen and (max-width: 281px)
{
	div.counter-container div.shops-counter p
	{
		letter-spacing: 1.15em;
		margin-left:9px;
		padding : 0;
	}
	div.counter-container div.shops-counter div.digit
	{
		border-radius: 3px;
		width: 20px;
		height: 20px;
		margin-left: 3px;
	}
}
/* @end */
div.dark-blue-background { background: #002447; padding-top: 40px; }

main.splash.transparent { background: none;}

p.light-blue { color: #54c6e6; }

/* @list-scan-results *//*------------------------------------------------------------------------------- */

.scan-results div.list-scan-results
{
	position:relative;
	background:#fff;
	margin-top: 20px;
	box-shadow: 0 2px 10px rgba(0,58,105,0.2);
    width: 100%;
}

.scan-results div.list-scan-results > dl
{
	position: relative;
	margin-bottom: 6px;
	padding-bottom: 10px;
	padding-top: 10px;
	color: #fff;
}

.scan-results div.list-scan-results article
{
    margin: 0;
    box-shadow: none;
}

div.list-scan-results article:not(.show) dl dt,
div.list-scan-results article:not(.show) dl dd,
div.list-scan-results article.show dl dt,
div.list-scan-results article.show dl dd
{
	line-height: 1;
}

div.list-scan-results article > dl
{
	cursor: pointer;
}

div.list-scan-results article:not(.show) div.article-content
{
	max-height: 0;
	transition: all 0.2s ease-in-out;
	overflow: hidden;
	padding-bottom: 0px;
	padding-top: 0;
}

div.list-scan-results article.show div.article-content
{
	max-height: 1000px;
	transition: all 0.2s ease-in-out;
	overflow: visible;
	padding-top: 6px;
}

div.list-scan-results article.show div.article-content  div:last-of-type:not(.notice):not(.label):not(.description) { padding-bottom: 20px; }
div.list-scan-results article.show div.article-content  div.notice:last-of-type { margin-bottom: 20px; }
div.list-scan-results article.show div.article-content  div.chart:last-of-type { padding-bottom: 0; }
div.list-scan-results article.show div.article-content  div.chart .face { padding: 0 20px; }

div.list-scan-results article:not(.show)
{
	border: solid 2px transparent;
	transition: all 0.2s ease-in-out;
}

div.list-scan-results article.show
{
	border: solid 2px #2da2d9;
	transition: all 0.2s ease-in-out;
	overflow: visible;
}

.scan-results div.list-scan-results article.show > dl
{
	background: #2da2d9;
	transition: all 0.2s ease-in-out;
}

.scan-results div.list-scan-results article.show > dl
{
	color: #fff;
	transition: all 0.2s ease-in-out;
}

.scan-results div.list-scan-results article:not(.show) > dl,
.scan-results div.list-scan-results article:not(.show) div.article-content > dl,
.scan-results div.list-scan-results article.show div.article-content > dl
{
	background: none;
	transition: all 0.2s ease-in-out;
}

.scan-results div.list-scan-results article:not(.show) > dl dt,
.scan-results div.list-scan-results article:not(.show) div.article-content > dl dt,
.scan-results div.list-scan-results article.show div.article-content > dl dt
{
	color: #004d7c;
	transition: all 0.2s ease-in-out;
}

.scan-results div.list-scan-results article.high:not(.show) > dl dd,
.scan-results div.list-scan-results article.high:not(.show) div.article-content > dl dd,
.scan-results div.list-scan-results article.high.show div.article-content > dl dd
{
	color: #f26463;
	transition: all 0.2s ease-in-out;
}

.scan-results div.list-scan-results article.medium:not(.show) > dl dd,
.scan-results div.list-scan-results article.medium:not(.show) div.article-content > dl dd,
.scan-results div.list-scan-results article.medium.show div.article-content > dl dd
{
	color: #f68a1d;
	transition: all 0.2s ease-in-out;
}

.scan-results div.list-scan-results article.low:not(.show) > dl dd,
.scan-results div.list-scan-results article.low:not(.show) div.article-content > dl dd,
.scan-results div.list-scan-results article.low.show div.article-content > dl dd
{
	color: #64b740;
	transition: all 0.2s ease-in-out;
}

.scan-results div.list-scan-results article.unknown:not(.show) > dl dd,
.scan-results div.list-scan-results article.unknown:not(.show) div.article-content > dl dd,
.scan-results div.list-scan-results article.unknown.show div.article-content > dl dd
{
	color: #9b9a9b;
	transition: all 0.2s ease-in-out;
}

div.list-scan-results article:not(.show) dl:first-child dt:before,
div.list-scan-results article.show dl:first-child dt:before
{
	font-family: fontawesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	cursor: pointer;
	margin-right: 10px;
}

div.list-scan-results article:not(.show) > dl dt:before
{
	content : "\f0da";
}

div.list-scan-results article.show > dl dt:before
{
	content : "\f0d7";
}

/* end */

/* @flip chart animation *//*---------------------------------------------------------------------------- */
div.list-scan-results.charts dl
{
	background: #9B9A9B;
}

div.chart div.article-content .face.back a
{
	color: #fff;
	text-decoration: underline;
}

div.charts div.chart .title-bar
{
	padding:20px 0 0 0;
}

div.chart .title-bar
{
	position: relative;
	text-align: center;
	font-weight: 700;
	transition: all 0.3s ease-in-out;
}

div.chart.animated .title-bar
{
	color: #FFF;
  	background-color: #2da2d9;
  	transition: all 0.3s ease-in-out;
}

.animate-button
{
	position:absolute;
	right: 0;
	margin-right: 10px;
	height:40px;
	width:40px;
	cursor:pointer;
	display: inline-block;
}

div.chart div.article-content
{
	position: relative;
}
div.charts div.chart div.article-content svg { margin-bottom: 10px;}
div.chart div.article-content .face
{
	width: 100%;
	height: 100%;
	padding: 0 20px;
}

div.chart div.article-content .face.front
{
	opacity: 1;
	transition: all 0.3s ease-in-out;
	z-index:1;
}

.charts div.chart div.article-content .face.front
{
	border-bottom: 1px solid #9B9A9B;
}

div.chart div.article-content .face.back
{
	position: absolute;
	top: 0;
	left: 0;
	box-sizing: border-box;
	color: #FFF;
	background-color: #2da2d9;
	opacity: 0;
	transition: all 0.3s ease-in-out;
	z-index:-1;
}

.charts div.chart div.article-content .face.back
{
	border-bottom: 1px solid #fff;
}
.charts div.chart:last-of-type div.article-content .face.back,
.charts div.chart:last-of-type div.article-content .face.front
{
	border: none;
}

div.chart.animated div.article-content .face.back
{
	opacity: 1;
	transition: all 0.3s ease-in-out;
	z-index:1;
}

div.chart.animated div.article-content .face.front
{
	opacity: 0;
	transition: all 0.3s ease-in-out;
	z-index:0;
}

div.animate-button:after
{
	font-family: fontawesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	position: relative;
	cursor: pointer;
}

div.animate-button:after
{
	content : "\f05a";
}

div.animated div.animate-button:after
{
	content : "\f00d";
}
/* end */

/* @check labels *//*------------------------------------------------------------------------------------ */
div.article-content div.label
{
	background: #f1f1f1;
	font-size: 0.85em;
	color: #9b9a9b;
}
div.article-content div.label p a
{
	color: #9b9a9b;
	text-decoration: none;
}
div.article-content div.label p a:hover
{
	color: #004d7c;
	text-decoration: underline;
}
div.article-content div.label p:before
{
	font-family: fontawesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	cursor: pointer;
	margin-right: 10px;
	content: "\f132";
	color: #64b740;
}
/* end */

/* @table of contents *//*------------------------------------------------------------------------------- */
#table-of-contents a
{
 color: rgba(255,255,255,0.8);
 text-decoration: none;
 font-weight: bold;
}
/* end */

/* @twitterfeed *//*------------------------------------------------------------------------------------- */
div.about-content,
div.about-twitter-timeline
{
	float: left;
}

div.about-content
{
	width: 70%;
	padding-right: 20px;
}

div.about-twitter-timeline
{
	width: 30%;

}

div.about-twitter-timeline div.branding-plus
{
	float:none;
	width:100%;
	margin:20px 0 40px;
	padding: 13px 13px;
}

div.about-twitter-timeline > img
{
	width: 80%;
    padding: 20px 0;
}
div.clear { clear: both; }

@media screen and (max-width: 808px)
{
	main.splash.twitterfeed
	{
		padding: 80px 0 0;
	}
}

@media screen and (max-width: 700px)
{
	div.about-content,
	div.about-twitter-timeline
	{
		width: 100%;
		padding:0;
	}
}

@media screen and (max-width: 600px)
{
	main.splash.twitterfeed
	{
		padding: 40px 0 0;
	}
}
/* end */

/* @agencies table *//*---------------------------------------------------------------------------------- */
table#agencies
{
	text-align: left;
	width: 100%;
	margin: 40px 0;
	border-spacing: 0;
}

table#agencies tr:nth-child(even)
{
	background: #002447;
}

table#agencies th,
table#agencies td
{
	padding: 2px 10px;
}

table#agencies tr td:last-child:before
{
	font-family: fontawesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	cursor: pointer;
	margin-right: 10px;
	content: "\f045";
}
/* end */

/* all-checks-fixed *//*---------------------------------------------------------------------------------- */

.all-checks-fixed {
	text-align: center;
	padding: 50px 0;
}
.all-checks-fixed h3 span {
	color: #4384AB;
}

.all-checks-fixed img {
	border: 5px solid white;
	box-shadow: 0 0 5px rgba(0,58,105,0.2);

}
/* end */

/* @alerting page *//*----------------------------------------------------------------------------------- */
.alerting-page div:not(.results-header),
.alerting-page form
{
	text-align: center;
}

.alerting-page .icon-bell,
.alerting-page .icon-bell-slash,
.alerting-page div:not(.results-header) h4
{
	color: #54c6e6;
}
.alerting-page .icon-bell { color: #9dd779; }

.alerting-page .icon-bell-slash { color: #f3615e; }

.alerting-page .icon-bell,
.alerting-page .icon-bell-slash
{
	margin-top: 150px;
	font-size:70px;
}

.alerting-page form { margin-top: 20px; }
/* end */

/* for the new parner badge */
.partner-badge-sidebar
{
	text-align: center;
}
.partner-badge-sidebar div
{
	display: inline-block;
	background: url(/National_Library/oe_/https://www.magereport.com/static/images/partnerbadge-round.png) no-repeat;
	width: 164px;
	height: 164px;
	background-size: 164px 164px;
}
/* end partnerbadge */
