@font-face {
    font-family: BebasNeueBook;
    src: url(/fonts/bebasneuebook.ttf);
}

html { height: 100%; }

body {
	background-image: url(/img/bg.png);
	margin: 0 0 0 0;
	font-family: Righteous;
	min-width: 800px;
	color: #DCDCDC;
	height: 100%;
}

a { color: #4698f5; }

h1 {
    font-size: 20pt;
    -webkit-margin-before: 0.37em;
    -webkit-margin-after: 0.37em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;
}

.links { width:100%; }

.links td {
	padding-left: 16px;
	font-size: 16pt;
}

#adminbar {
	width: 100%;
	height: 24px;
	background-color: #CDDBF0;
}

.header {
	width: 100%;
	height: 48px;
	margin: 0;
	padding: 0;
	background-color: #000;
    transition: all 0.3s ease-in-out;
}

.header:hover {
	box-shadow: 0px 0px 12px 2px rgba(0,0,0,1);
    transition: all 0.3s ease-in-out;
}

.hleft {
	width: 30%;
	height: 100%;
	float: left;
	text-align: center;
}

#logo  {
	background: url(/img/chip.png) no-repeat;
	background-size: 40px auto;
	background-position: 5px 4px;
	font-size: 27pt;
	padding: 2px 0 0 48px;
	width: 192px;
	margin-left: auto;
	font-weight: bold;
}

#logo a{
	color: #fff;
	text-decoration: none;
}

.menu_el {
    position: relative;
	font-size: 24pt;
    padding: 4px 8px 0 8px;
	border-bottom: 4px transparent solid;
	text-decoration: none;
    text-align: center;
    float: left;
    transition: all 0.3s ease-in-out;
}

.menu_el:hover {
	border-bottom-color: #4698f5;
    transition: all 0.3s ease-in-out;
}

.current { border-bottom-color: #fff; }

.link {
	color: #fff;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
	text-decoration: none;
}

.link:hover {
    color:#4698f5;
    transition: all 0.3s ease-in-out;
}

.hmiddle {
	width: 70%;
	height: 100%;
	float: left;
}

.middle {
	width: 1200px;
	margin-left: auto; margin-right: auto;
	display: table;
	padding-top: 10px; padding-bottom: 48px;
}

.content {
	width: 970px;
	float: left;
	padding: 10px 10px 10px 10px;
	background-color: rgba(0, 0, 0, 0.4);
	font-size: 18pt;
}

.side { width: 200px; float: right; }

@media screen and (max-width: 1049px){
	.middle { width: 800px; }
	.content { width: 570px; }
}
@media screen and (min-width: 1050px) and (max-width: 1279px){
	.middle { width: 1000px; }
	.content { width: 770px; }
}

.block {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    background-color: rgba(0, 0, 0, 0.4);
    text-align: center;
    padding: 5px 0px 5px 0px;
	font-size: 14pt;
	
}
.block table { width: 100%; }

footer {
    position: absolute;
    bottom: 0;
    text-align: right;
    padding-top: 10px!important;
    height: 32px!important;
}

footer span {
    font-size: 14pt;
    padding-right: 24px;
}

.active { color: #69AA54; }
.inactive { color: red; }

.cor-server { text-align: center; }

#timer {
    background: url(/img/foto.jpg) no-repeat;
	background-size: 100% auto;
    font-family: BebasNeueBook;
}
#timer canvas {
    position: relative;
    left: -64px;
    top: 7px;
}
#hournum {
    position: relative;
    top: -52px;
    left: 54px;
    font-size: 56pt;
}
#hourtext {
    position: relative;
    top: -20px;
    font-size: 20pt;
    left: 19px;
}