/**
* Style for Scanner Results
*/
body {
	font-family: 'Open Sans', sans-serif;
	background: #e1e1e1;
}

h1 { font-size: 28px; }
h2 { font-size: 24px; }
#data h3 { font-size: 20px; font-weight: 700; margin: 20px 0 20px 0; }
#data h4 { font-size: 18px; font-weight: 700; margin: 20px 0 20px 0; }

#progress {
  width: 500px;
  border: 1px solid #aaa;
  height: 10px;
  margin: 20px auto;
}
#progress .bar {
  background-color: #3c9adc;
  height: 10px;
}
#message { font-size: 20px; height: 30px; }

/*================*/

.web-description { text-align: center; font-size: 16px; margin-bottom: 15px; }
.report {
	margin: 30px auto;
	width: 80%;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
}
.report i { font-size: 30px; }

#data { margin-top: 20px; text-align: left; }

.report-details-info {
	font-size: 18px;
}

/* =============== */

#report-input form.domainCheck {
	width: 95%;
	text-align: center;
}
#report-input form.domainCheck .field-wrapper { 
	width: 95%; 
	display: flex;
	position: relative;
	margin: 0 auto;
	border-radius: 50px;
	border: 8px solid rgba(180,178,178,.5)!important;
}
#report-input form.domainCheck .field-wrapper input[type=text] {
	padding-left: 50px;
	color: #2f3943;
	height: 58px;
	background-size: 25px 25px !important;
	padding: 0 0 0 50px;
	width: calc(100% - 220px);
	margin: 0;
	background: #fff url(../images/navsearch.svg) no-repeat 15px 50%;
	font-size: 18px;
	line-height: 20px;
	float: left;
	vertical-align: middle;
	border: none;
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;   		
}
#report-input form.domainCheck .field-wrapper button[type=submit] {
	background-color: #E33B00;
	border-color: #E33B00;
	height: 58px;
	-webkit-box-flex: 0;
	-ms-flex: 0 0 220px;
	flex: 0 0 220px;
	font-size: 19px;
	line-height: 26px;
	margin-top: 0;
	width: auto;
	position: relative;
	padding-left: 18px;
	float: left;
	font-weight: 700;
	display: inline-block;
	color: #fff;
	text-transform: uppercase;
	border-style: solid;
	border-top-right-radius: 50px;
	border-bottom-right-radius: 50px;
	cursor:pointer;		
}
#report-input button[type=submit] .arrow {
	left: -6px;
	top: 22px;
	background: #e33b00 none repeat scroll 0 0;
	content: "";
	display: block;
	height: 12px;
	position: absolute;    
	width: 12px;
	transform: rotate(45deg);
}

#report-input input:focus, #report-input button:focus { outline: none; }

/* top-box Style */
#overview tr, #overview td { border: none; vertical-align: middle; }
#overview .top-box {
	width: 50%;
	height: 170px;
	margin: 0 auto; 
	max-width: 500px;
	border: 4px solid #c1c1c1;		
}
#overview .top-box tbody, #overview .top-box tr {
	background: #fff !important;
}
#overview .top-box #score {
	font-size: 120px; 
	font-weight: 600;
	padding: 0 20px 0 20px;
	text-align: center;
}
#overview .top-box #web-url {
	font-size: 20px;
	font-weight: 400;
}

/* Report Style */
#overview .report-scores, #overview .report-page-details {
	padding-right: 30px;
	width: 49%;
	float: left;
}
@media only screen and (max-width: 1000px) {
	#overview .report-scores, #overview .report-page-details {
		width: 95%;
	}
}
#overview .report-scores h4, #overview .report-page-details h4 { margin: 5px; }
#overview .report-scores .box, #overview .report-page-details .box {
	display: flex;
	height: 99px;
	padding: 0;
	font-size: 14px;
	border: 4px solid #c1c1c1;
	background: linear-gradient(#fff,#f3f3f3);
	text-align: center;
}
#overview .report-score, #overview .report-web-vital {
	display: flex;
	flex: 1;
	flex-direction: column;
	border-right: 1px solid #e0e0e0;
	white-space: nowrap;
}		
#scanMalware, #scanSpam, #scanPhishing, #blacklisted, #googleSpam, #serverStatus { 
	font-size: 48px; 
	font-weight: 700;
	height: 65px;
    padding-top: 16px;
}

#overview .color-grade- { 
	background: rgb(126,126,125);
	background: -moz-linear-gradient(126deg, rgba(126,126,125,1) 0%, rgba(205,204,199,1) 90%);
	background: -webkit-linear-gradient(126deg, rgba(126,126,125,1) 0%, rgba(205,204,199,1) 90%);
	background: linear-gradient(126deg, rgba(126,126,125,1) 0%, rgba(205,204,199,1) 90%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7e7e7d",endColorstr="#cdccc7",GradientType=1);	
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
#overview .color-grade-A { 
	background: rgb(20,78,6);
	background: -moz-linear-gradient(126deg, rgb(20,78,6) 0%, rgb(37,214,105) 90%);
	background: -webkit-linear-gradient(126deg, rgb(20,78,6) 0%, rgb(37,214,105) 90%);
	background: linear-gradient(126deg, rgb(20,78,6) 0%, rgb(37,214,105) 90%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#144e06",endColorstr="#25d669",GradientType=1);	
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;			
}
#overview .color-grade-B { 
	background: rgb(43,201,64);
	background: -webkit-linear-gradient(126deg, rgba(43,201,64,1) 0%, rgba(2,255,133,0.7511379551820728) 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;			
}
#overview .color-grade-C { 
	background: rgb(166,176,46);
	background: -webkit-linear-gradient(126deg, rgba(166,176,46,1) 0%, rgba(211,255,2,0.7511379551820728) 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;			
}
#overview .color-grade-D { 
	background: rgb(238,160,13);
	background: -webkit-linear-gradient(126deg, rgba(238,160,13,1) 0%, rgba(255,197,2,1) 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;			
}
#overview .color-grade-E { 
	background: rgb(212,104,16);
	background: -webkit-linear-gradient(126deg, rgba(212,104,16,1) 0%, rgba(255,91,2,1) 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;			
}
#overview .color-grade-F { 
	background: rgb(129,26,26);
	background: -webkit-linear-gradient(126deg, rgba(129,26,26,1) 0%, rgba(255,0,0,1) 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;			
}

/* Details Table */
#details {
	table-layout: fixed;
	width: 95%;
	border-collapse: collapse;
}
#details thead, #details thead .rules-name {
	font-size: 14px;
	color: #a1a1a1;
	font-weight: 600;
}

#details thead th { padding-left: 12px; border: none; vertical-align: bottom; }
#details tbody { border: 4px solid #c1c1c1; }
#details tr, #details td { border: none; vertical-align: middle; }
#details .rules-name {
	font-weight: 400;
	font-size: 16px;
	height: 56px;
}

.main_color table, #details thead tr, #details th { background: transparent !important; }
#details .rules-row:nth-child(4n+1) { background: #f1f1f1; }		
#details .rules-row:nth-child(2n+2) { background: #fff; }
#details .rules-row:nth-child(4n+3) { background: #e3e3e3; }
#details td {
	padding: 6px;
	border: none;
}
#details .rules-impact {
	width: 100px;
	text-align: center;
}
#scanMalwareDetails, #scanSpamDetails, #scanPhishingDetails, #blacklistedDetails, #googleSpamDetails, #serverStatusDetails {
	width: 100px;
	text-align: center;
	color: #fff; 
	font-size: 24px; 
	font-weight: 600;
}
#details .color-grade- {
	background: rgb(126,126,125);
	background: linear-gradient(126deg, rgba(126,126,125,1) 0%, rgba(205,204,199,1) 90%);
}		
#details .color-grade-A {
	background: rgb(20,78,6);
	background: -webkit-linear-gradient(126deg, rgb(20,78,6) 0%, rgb(37,214,105) 90%);
}
#details .color-grade-B {
	background: rgb(43,201,64);
	background: linear-gradient(126deg, rgba(43,201,64,1) 0%, rgba(2,255,133,0.7511379551820728) 90%);
}
#details .color-grade-C {
	background: rgb(166,176,46);
	background: linear-gradient(126deg, rgba(166,176,46,1) 0%, rgba(211,255,2,0.7511379551820728) 90%);
}
#details .color-grade-D {
	background: rgb(238,160,13);
	background: linear-gradient(126deg, rgba(238,160,13,1) 0%, rgba(255,197,2,1) 90%);
}
#details .color-grade-E {
	background: rgb(212,104,16);
	background: linear-gradient(126deg, rgba(212,104,16,1) 0%, rgba(255,91,2,1) 90%);
}
#details .color-grade-F {
	background: rgb(129,26,26);
	background: linear-gradient(126deg, rgba(129,26,26,1) 0%, rgba(255,0,0,1) 90%);
}
#details .rules-expand { width: 52px; }
#details .rules-row:nth-child(4n+1) td.rules-expand { background: #ededed; }		
#details .rules-row:nth-child(4n+3) td.rules-expand { background: #e0e0e0; }
#details tr.rules-row:hover { background: #d4d4d4; }
#details i { color: #a1a1a1; }
#details tr.rules-row.rules-details:hover { background: #fff; }

#details .rules-details td { padding: 0; }
.rules-details td div, .rules-details td p { font-size: 15px; }
#details .report-desc { padding: 20px 20px 20px 32px; }

.b-status { margin-left: 40px; margin-bottom: 20px; }
.offline, #oldSoftware { color: #E33B00; font-weight: 600; display: flex; align-items: center; margin-bottom: 20px; }
.offline i,  #oldSoftware i { font-size: 30px; color: #E33B00; margin-right: 12px; }
.report-desc h4 { display: flex; align-items: center; }
#details .report-desc h4 i { color: #E33B00; }
#details .report-desc h4 i.orange { color: rgb(255,91,2); }
#web-status div { display: flex; align-items: center; font-size: 20px; font-weight: 600; }
#web-status div i { margin-right: 12px; font-size: 34px; } 
#web-status div i.icon-ok-circled { color: rgb(37,214,105); }
#web-status div i.icon-exclamation { color: #E33B00; }
#web-status div i.icon-attention { color: rgb(255,91,2); }

@media only screen and (max-width: 768px) { 
	.report {
    	margin: 20px auto;
    	width: 100%;
    }
}