@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,800); /* Anything but headings and ingress */

html { font-size: 62.5%; overflow-y: auto; }

body {
	background: #F0F0F0;
	margin: 0;
	font-size: 13px;
	font-family: 'Open Sans', Helvetica, Arial, Verdana, Tahoma, sans-serif;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: normal; }

.block_font_style { font-size: 16px; font-size: 1.6rem; word-wrap: break-word; }
.block_font_style h1 { font-size: 36px; font-size: 3.6rem; }
.block_font_style h2 { font-size: 24px; font-size: 2.4rem; }

a { color: #0088d6; text-decoration: none; }
a:hover { color: #00aff0; }
a img { border:none; }

.white { color: #fff; }
.red { color: #ee3e3e; }
.blue, .question { color: #0088d6; }
.green { color: #8bd033; }
.gray { color: #8e8e8e; }
.lightgray { color: #d9d9d9; }
.darkgray { color: #595959; }
.purple { color: #c233d7; }
.orange { color: #FF9012; }

.bg_blue { background-color: #00A6F5; }
.bg_green { background-color: #B8E77C; }
.bg_white { background-color: #fff; }

.question { font-weight: bold; cursor: pointer; font-family: Arial; }

.size8 { font-size: 8px; }.size9 { font-size: 9px; }
.size10 { font-size: 10px; }.size11 { font-size: 11px; }.size12 { font-size: 12px; }.size13 { font-size: 13px; }.size14 { font-size: 14px; }.size15 { font-size: 15px; }.size16 { font-size: 16px; }.size17 { font-size: 17px; }.size18 { font-size: 18px; }.size19 { font-size: 19px; }
.size20 { font-size: 20px; }.size21 { font-size: 21px; }.size22 { font-size: 22px; }.size23 { font-size: 23px; }.size24 { font-size: 24px; }.size25 { font-size: 25px; }.size26 { font-size: 26px; }.size27{ font-size: 27px; }.size28 { font-size: 28px; }.size29 { font-size: 29px; }
.size30 { font-size: 30px; }.size32 { font-size: 32px; }.size36{ font-size: 36px; }

.trans50 { filter: alpha(opacity=50); -moz-opacity:0.5; opacity: 0.5; }
.trans30 { filter: alpha(opacity=40); -moz-opacity:0.4; opacity: 0.4; }
.trans30 { filter: alpha(opacity=30); -moz-opacity:0.3; opacity: 0.3; }
.trans20 { filter: alpha(opacity=20); -moz-opacity:0.2; opacity: 0.2; }

.bold { font-weight: bold; }
.underline { text-decoration: underline; }
.hide_this { display: none; }
.hidden { display: none !important; }

.left { float: left; }
.right { float: right; }
.center { display: inline-block; margin:0 auto; }
.clear { clear: both; }

.pointer { cursor: pointer; }



.box {
	background-color: #fff;
	padding: 10px;
}
.box .box-header {
	padding: 10px;
	text-align: center;
	font-size: 20px;
}

/* Input ------------------------------------------------------ */


input[type="text"], input[type="password"], select {
    background-color: #fff;
	outline: medium none;
    border: 1px solid #CCCCCC;
	border-radius: 4px 4px 4px 4px; -webkit-border-radius: 4px 4px 4px 4px; -moz-border-radius: 4px 4px 4px 4px;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05) inset, 0 1px 0 #FFFFFF; -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05) inset, 0 1px 0 #FFFFFF; -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05) inset, 0 1px 0 #FFFFFF;
    color: #575757;
    padding: 6px;
    resize: none;
}

.sapi-dash-box {
    padding: 40px;
    background-color: #fff;
}

/* Table ------------------------------------------------------ */
.sapi-table {
	width: 100%;
}
.sapi-table .row-header td {
	font-weight: bold;
	box-sizing: border-box;
	padding: 10px;
	border-right: 1px #eee solid;
	background-color: #5f5f5f;
	color: #fff;
	text-align: center;
}
.sapi-table tr:not(.row-header) td {
	position: relative;
	border-top: 0px #fff solid;
	border-right: 1px #eee solid;
	border-left: 0px #fff solid;
	border-bottom: 1px #eee solid;
}
.sapi-table tr:not(.row-header) td input,
.sapi-table tr:not(.row-header) td select {
	padding: 10px;
	border: none;
	border-radius: 0;
	box-shadow: none;
	background-color: transparent;
}
.sapi-table tr:not(.row-header) td:not(.error) input:focus,
.sapi-table tr:not(.row-header) td:not(.error) select:focus {
	webkit-box-shadow: 0px 0px 0px 1px #5f5f5f;
	-moz-box-shadow: 0px 0px 0px 1px #5f5f5f;
	box-shadow: 0px 0px 0px 1px #5f5f5f;
}
.sapi-table tr:not(.row-header) td .none-editable {
	padding: 10px;
	border: none;
	box-shadow: none;
}
.sapi-table tr:not(.row-header) td:first-child {
	border-left: 1px #eee solid;
}
.sapi-table tr:not(.row-header):hover td {
	background-color: #f9f9f9;
}

.sapi-table td.td-center {
	text-align: center;
}
.sapi-table td.error {
	border: 1px #f73e3e solid !important;
	background-color: #fff3f3 !important;
}
.sapi-table td .errorMessage {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 100%;
	box-sizing: border-box;
	padding: 5px 10px;
	background-color: #f73e3e;
	color: #fff;
	font-style: italic;
	z-index: 9999;
}


/* Loader */
.sapi-loader {
	position: fixed;
	top: calc(50% - 80px);
	left: calc(50% - 80px);
	height: 160px;
	width: 160px;
	box-sizing: border-box;
	border: 14px solid rgba(0,0,0,0.1);
	border-top-color: #14a3e8;
	border-radius: 9999px;
	-o-border-radius: 9999px;
	-ms-border-radius: 9999px;
	-webkit-border-radius: 9999px;
	-moz-border-radius: 9999px;
	animation: sapi-loader-rotate 800ms ease infinite;
	-o-animation: sapi-loader-rotate 800ms ease infinite;
	-ms-animation: sapi-loader-rotate 800ms ease infinite;
	-webkit-animation: sapi-loader-rotate 800ms ease infinite;
	-moz-animation: sapi-loader-rotate 800ms ease infinite;
}
	@keyframes sapi-loader-rotate {
		100% { transform: rotate(360deg); }
	}
	@-webkit-keyframes sapi-loader-rotate {
		100% { -webkit-transform: rotate(360deg); }
	}