/* Element properties when window width is less than 850 px */

@import url("http://fast.fonts.net/lt/1.css?apiType=css&c=8168a2b5-369e-49a4-82ca-4bd32bbd8dfc&fontids=694103,694409");
@font-face{
font-family:"DIN_1451 W02 Engschrift";
src:url("Fonts/694103/42a75d77-1570-4aed-95a6-b25e5fbd40a2.eot?#iefix");
src:url("Fonts/694103/42a75d77-1570-4aed-95a6-b25e5fbd40a2.eot?#iefix") format("eot"),url("Fonts/694103/b3efb043-2f04-4fbe-b0f8-aa01595d30bb.woff2") format("woff2"),url("Fonts/694103/0d19a47c-0518-4ca2-bb5a-27b3c4a86ab8.woff") format("woff"),url("Fonts/694103/660e75b9-80fe-4905-9eda-92085178a97f.ttf") format("truetype"),url("Fonts/694103/8b8653d0-c004-4d20-92c4-246717628dd2.svg#8b8653d0-c004-4d20-92c4-246717628dd2") format("svg");
}

@font-face{
font-family:"DIN Next W02 Light";
src:url("Fonts/694409/48e5a0e1-2d56-46e5-8fc4-3d6d5c973cbf.eot?#iefix");
src:url("Fonts/694409/48e5a0e1-2d56-46e5-8fc4-3d6d5c973cbf.eot?#iefix") format("eot"),url("Fonts/694409/074b86ea-3c33-4b3e-90da-76f8e2e20b6b.woff2") format("woff2"),url("Fonts/694409/07d62b21-8d7a-4c36-be86-d32ab1089972.woff") format("woff"),url("Fonts/694409/c0050890-bbed-44b9-94df-2611d72dbb06.ttf") format("truetype"),url("Fonts/694409/9f774d17-c03a-418e-a375-34f3beecbc7a.svg#9f774d17-c03a-418e-a375-34f3beecbc7a") format("svg");
}

body {
	font: 14px 'DIN_1451 W02 Engschrift';
	font: 14px 'Lucida Sans', 'trebuchet MS', Arial, Helvetica;
	font: 14px 'DIN Next W02 Light';
}

@media only screen and (max-width: 1200px) {
	div.body 		{ width: 96% !important; }
	div.menu 		{ width: 100% !important; }
	div.header-logo { width: 100% !important; }
	div.body 		{ width: 100% !important; }
	div.footer 		{ display: none !important; }
	div.network-banner-ad { display: none !important; }
}

@media only screen and (max-width: 850px) {
	div.hide-on-mob { display: none !important; }
	div.menu-ticker { display: none !important; }
	div.menu-item.twitter { display: none !important; }
	div.menu-item 	{ width: 50px !important; }
	div.host-info-box { width: 99% !important; }


	div.pie-chart {
		float: none !important;
		width: 100% !important;
	}
	div.left-col { width: calc(100% - 30px) !important; }
}

@media only screen and (max-width: 800px) {
	div.navigation-btn {
		height: 120px !important;
		width: 120px !important;
	   	padding: 5px !important;
	   	margin: 20px !important;
	   	margin-top: 5px !important;
	}
	div.navigation-btn i { font-size: 70px !important; padding: 10px !important;}
	div.navigation-btn em { font-size: 16px !important; }
	div.navigation-btn div { display: none !important; }
	div.main-nav-btn { width: 360px !important; }
}	

@media only screen and (max-height: 640px) {
	div.candlestick-chart-wrapper { height: calc(100vh - 100px) !important; }
	div.page-header {display: none !important; }
	div.header-text {display: none !important; }
	div.footer 		{ display: none !important; }
	div.pulse-card {
		float: none !important;
		width: 100% !important;
		padding: 10px !important;
		padding-top: 5px !important;
		margin-top: 0px !important;
		border: none !important;
		box-shadow: none !important;
		height: 20px !important;
		background-color: #505c78;
		color: #ffffff;
	}
	div.menu-item.twitter { display: none !important; }
	span.pulse-divider { display: inline !important; }
	div.header-logo { display: none !important; }
	div.header { height: 42px !important; }

	div.pulse-card div {
		float: left !important;
		font-size: 120% !important;
	}

	div.pulse-card span {
		display: inline !important;
		font-size: 80% !important;
	}


}

.hidden { 
  position: absolute; 
  overflow: hidden; 
  clip: rect(0 0 0 0); 
  height: 1px; width: 1px; 
  margin: -1px; padding: 0; border: 0; 
}

div.body {
	width: calc(1200px - 20px);
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	padding-top: 0px;
	overflow: auto;
}

div.para {
	text-align: left;
	overflow: auto;
	margin-bottom: 10px;
}

div.data-row {
	padding-top: 5px;
	height: 25px;
	border-bottom: 1px solid #ffffff;
}


div.data-row-param {
	padding: 5px;
	float: left;
	font-weight: bold;
	width: 200px;
}

div.host-info-box {
	width: 32%;
	height: 300px;
	float: left;
	margin: 0.5%;
	background-color: #e5e5e5;
}

div.data-row-value {
	float: left;
}

div.candlestick-chart-wrapper {
	position: relative;
	height: calc(100vh - 350px);
	width: 100%;
}

div.candlestick-chart {
	position: absolute;
	width: 100%;
	height: 100%;
}

div.box {
	overflow: auto;
	border: 1px solid #999;
	height: 500px;
}

div.fancy-box {
	background-color: #606c88;
	border: 5px solid #303c58;
	color: #fff;
	border-radius: 5px;
	margin-bottom: 10px;
	border-sizing: border-box;
}

div.box-header {
	font: 180%;
	height: 30px;
	line-height: 35px;
	padding-left: 10px;
	color: #fff;
	font-weight: bold;
	background: #606c88;
	border-bottom: 2px solid #ff920a;
}

div.box-body {
	text-align: left;
	overflow: auto;
	padding: 10px;
}

div.pie-chart-wrapper {
	text-align: center;
}

div.pie-chart {
	float: left;
	text-align: center;
	width: 50%;
}

div.header {
	background-color: #303c58;
	width: 100%;
	height: 85px;
}

div.header-logo {
	width: calc(1200px - 20px);
	margin-left: auto;
	margin-right: auto;
	font-weight: bold;
	color: #ffffff;
	font-size: 150%;
	height: 30px;
	padding-top: 10px;
	border-bottom: 3px solid #ff920a;
}
div.header-logo a {
	color: #ffffff;
	text-decoration: none;
}

div.menu {
	width: calc(1200px - 20px);
	margin-left: auto;
	margin-right: auto;
}

div.menu-item {
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    float: left;
	height: 35px;
	width: 80px;
	text-align: center;
	font-weight: normal;
	padding-top: 12px;
	color: #fff;
	background-color: #303c58;
	margin-left:10px;
	margin-right:10px;
	box-sizing: border-box;
}

div.menu-item:hover {
	border-bottom: 2px solid #ffffff;
}

div.menu-ticker {
	float: right;
	text-align: right;
	width: 300px;
}
div.menu-ticker:hover {
	border-bottom: none;
}

div.menu-divider {
	float: left;
	height: 20px;
	margin-top: 11px;
	border-left: 1px solid #555555;	
	box-sizing: border-box;
}

div.menu-item a {
	text-decoration: none;
}

div.page-header {
	font-size: 30px;
	font-weight: bold;
	padding-top: 10px;
	padding-bottom: 10px;
}

div.page-header-2 {
	font-size: 24px;
	font-weight: bold;
	padding-bottom: 10px;
}

div.page-header-3 {
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 5px;
}


div.nav-buttons {
	float: none;
	width: 100%;
	line-height:40px;
}

div.nav-buttons button {
}

div.nav-buttons button i {
	padding-right: 10px;
}


div.header-text {
	font-size: 130%;
	line-height: 140%;
	margin-bottom: 15px;
}

img.shadow-box {
	margin: 10px;
	border: 1px solid #444;
	box-shadow: 0px 0px 10px #999;
}

div.left-col {
	width: 550px;
	padding: 15px;
	float: left;
}

div.right-col {
	width: 550px;
	padding: 15px;
	float: right;
}

span.left {
	float: left;
}
span.right {
	float: right;
}

/* Images */
img:hover {
	opacity: .9;
}

/* Footer */
div.footer {
	width: calc(1200px - 20px);
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	padding-top: 10px;
	font-size: 90%;
	height: 60px;
}
div.footer a {
	text-decoration: none;
	color: #333;
}
div.footer a:hover {
	text-decoration: none;
	border-bottom: 2px solid black;
}
div.footer span {
	line-height: 30px;
	padding-right: 30px;
}
div.copyright {
	font-size: 60%;
	text-transform: uppercase;
	float: right;
	padding-top: 12px;
}

div.code {
	background-color: #fdfdfd;
	background-color: #444;
	color: #ff920a;
   	border-radius: 3px;
	font-family: monospace, sans-serif;
	font-size: 90%;
	padding: 10px;
	display: inline-block;
}

div.news-date {
	font-weight: bold;
	font-size: 70%;
}

div.locale {
	float:left;
	width:20%;
}

div.navigation-btn {
	float: left;
	height: 170px;
	width: 150px;
   	border-radius: 3px;
   	border: 1px solid black;
   	padding: 5px;
   	margin: 10px;
   	margin-bottom: 20px;
   	text-align: center;
	background-color:#fbfbfb;
	background: #606c88;
	background: linear-gradient(to bottom, #606c88 0%,#3f4c6b 100%);
	color: white;
}

div.navigation-btn:hover {
	background: #3f4c6b;
}

div.navigation-btn i {
   	font-size: 66px;
   	color: #ff920a;
   	padding: 20px;
   	padding-bottom: 10px;
   	display: inline-block;
}
div.navigation-btn em {
   	font-size: 22px;
   	font-style: normal;
}
div.navigation-btn div {
   	font-size: 12px;
   	color: #eee;
}

button {
   	border-radius: 3px;
   	border: none;
   	box-shadow: 0 1px 2px rgba(0,0,0,0.2) inset, 0 -1px 0 rgba(0,0,0,0.05) inset;
   	transition: all 0.2s linear;
   	color: #222222;
   	height: 30px;
   	padding-left: 10px;
   	padding-right: 10px;
   	-webkit-color: #999999;
   	-moz-color: #999999;
}

button i {
	padding-right: 5px;
}

/* Faucet transactions lists */
div #transactionbp {
	float:left;
	width: calc(100% - 10px);
	padding: 5px;
	border-bottom: 1px solid #eee;
	overflow: auto;
}
div #transactionbp:hover {
	background-color:#fbfbfb;
}
div #txheaderbp {
	border-bottom:1px solid #999;
	margin-bottom:10px;
	overflow: auto;
}
div.faucet-tx-amount {
	float: left;
	width: 200px;
}
div.faucet-tx-timestamp {
	float: left;
	width: 300px;
}
div.faucet-tx-id {
	float: left;
	width: calc(100% - 505px);
	text-align: left;
}

small {
	font-size: xx-small;
}

div.maplegend {
	padding: 6px 8px;
	background: rgba(255,255,255,0.8);
	box-shadow: 0 0 15px rgba(0,0,0,0.2);
	border-radius: 5px;
}

div.maplegend i {
	width: 18px;
	height: 18px;
	float: left;
	margin-right: 8px;
}

div.main-banner-ad {
	text-align: center;
	width: 100%;
	height: 150px;
	border: 0px;
	margin-top: 270px;
	margin-bottom: 80px;
}

div.network-banner-ad {
	float: right;
	padding: 0px;
	width: 470px;
	height: 150px;
	border: 0px;
	margin-top: 16px;
	margin-right: 10px;
}

div.pulse-card {
	float: right;
	padding: 15px;
	width: 260px;
	font-size: 100%;
	height: 118px;
	line-height: 25px;
	border: 1px solid #888;
	margin-top: 16px;
	margin-right: 0px;
}

div.pulse-card span {
	display: block;
	font-size: 90%;
}

div.pulse-card i {
	font-size: 150%;
	margin-top: -2px;
}

div.pulse-card div {
	float: right;
	font-size: 180%;
	color: #ff920a;
	padding-right: 10px;
}
span.pulse-divider {
	color: #777777;
	display: none !important;;
}

ul li {
	padding-top: 5px;
}

ol li {
	padding-top: 5px;
}

ul.explorer-timerange-btngroup {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

ul.explorer-timerange-btngroup li {
	float:left;
}

ul.explorer-timerange-btngroup li button {
	width: 40px;
	height: 28px;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: none;
	margin: 1px;
	box-shadow: none;
	color: #666;
	background-color: #e5e5e5;
}

ul.explorer-timerange-btngroup li button:hover {
	background-color: #d5d5d5;
	color: #333;
}

ul.explorer-timerange-btngroup li button:active {
	background-color: #ff920a;
}

input[type=submit] {
    	border-radius: 3px;
    	border: none;
	margin:2px;
    	box-shadow: 0 1px 2px rgba(0,0,0,0.2) inset, 0 -1px 0 rgba(0,0,0,0.05) inset;
    	transition: all 0.2s linear;
    	font-size: 100%;
    	color: #222222;
    	height: 30px;
    	padding-left: 10px;
    	padding-right: 10px;
    	-webkit-color: #999999;
    	-moz-color: #999999;
}

#map {
	height: 500px;
}
#country-list td {
	font-size: 0.8em;
	font-weight: normal;
	font-family: Helvetica, Arial, sans-serif;
}


/* OLD CSS BELOW */


input[type=text],input[type=password],input[type=number] {
    	border-radius: 3px;
    	border: none;
	margin:2px;
    	box-shadow: 0 1px 2px rgba(0,0,0,0.2) inset, 0 -1px 0 rgba(0,0,0,0.05) inset;
    	font-size: 100%;
    	color: #222222;
    	height: 30px;
    	padding-left: 5px;
    	padding-right: 5px;
    	-webkit-color: #999999;
    	-moz-color: #999999;
	font-family:"DIN Next W02 Light";	
}

input[type=text]:focus, input[type=password]:focus{
	box-shadow: 0 1px 0 #2392F3 inset, 0 -1px 0 #2392F3 inset, 1px 0 0 #2392F3 inset, -1px 0 0 #2392F3 inset, 0 0 4px rgba(35,146,243,0.5);
	outline: none;
}

select {
	font-family:"DIN Next W02 Light";
    	border-radius: 3px;
    	border: none;
	margin:2px;
    	box-shadow: 0 1px 2px rgba(0,0,0,0.2) inset, 0 -1px 0 rgba(0,0,0,0.05) inset;
    	font-size: 100%;
	background: #fff;
    	color: #222222;
    	height: 35px;
    	padding-left: 10px;
    	-webkit-color: #999999;
    	-moz-color: #999999;
}

select:focus {
	box-shadow: 0 1px 0 #2392F3 inset, 0 -1px 0 #2392F3 inset, 1px 0 0 #2392F3 inset, -1px 0 0 #2392F3 inset, 0 0 4px rgba(35,146,243,0.5);
	outline: none;
}

i.red {
	color: red;
}

i.green {
	color: lightgreen;
}

/* DIVs for errors and warnings */
.info, .success, .warning, .error, .validation, .lp {
	border: 0px solid;
	box-sizing: border-box;
	margin: 10px 0px;
	padding:15px 10px 15px 50px;
	background-repeat: no-repeat;
	background-position: 10px center;
}
.info {
	color: #00529B;
	border-left: 10px solid #9bc3d6;
	background-color: #BDE5F8;
	background-image: url('../images/knob_info.png');
}
.lp {
	color: #00529B;
	background-color: #BDE5F8;
	background-image: url('../images/lp_required.png');
}
.success {
	color: #4F8A10;
	background-color: #DFF2BF;
	background-image:url('../images/knob_success.png');
}
.warning {
	color: #9F6000;
	background-color: #FEEFB3;
	background-image: url('../images/knob_warning.png');
}
.error {
	color: #D8000C;
	background-color: #FFBABA;
	background-image: url(../images/knob_error.png);
}

a:hover {
  color: red;
  position: relative;
}

/* Tool tip handler for A */
a[tooltip]:hover:after {
  	content: attr(tooltip);
  	padding: 4px 8px;
  	color: rgba(255,255,255,1);
	text-align:center;
  	position: absolute;
  	left: 20px;
  	top: -5px;
	width: 500px;
  	z-index: 99;
	line-height: 22px;
	font-size:100%;
  	border-radius: 5px;
  	background: rgba(0,0,0,0.8);
}

a.leftshift[tooltip]:hover:after {
  	top: -10px;
  	left: -510px;
}

input.number {
	text-align: right;
	width: 100px;
}
