@font-face {font-family: weblysleek; src: url("fonts/weblysleek.ttf");}
@font-face {font-family: weblysleekbold; src: url("fonts/weblysleekbold.ttf");}

.farrer {color: red !important;}
.closer {color: green !important;}
.button {appearance:button; -moz-appearance:button; /* Firefox */ -webkit-appearance:button; /* Safari and Chrome */}

body {padding:0px; margin:0px;}
h1 {font-family: weblysleek; font-size: 36pt;}
form {padding: 0px; margin: 0px;}

#title {margin: 0px 0px 0px 0px; padding: 10px 10px 10px 10px; background-image: url("images/back.png"); background-repeat: no-repeat; background-color: #ffffff; background-position: left bottom; text-shadow:0px 0px 7px #000000; font-family: weblysleekbold; font-size: 28px; color: #FFFFFF; }

#information {margin: 0px; padding: 10px 5px 10px 5px; background: linear-gradient(to bottom, #444444 0%, #000000 100%);}
#information table.information {width: 100%; margin: 0px 0px 0px 0px; padding: 0px;}
#information table.information tr td {font-family: weblysleek; font-size: 20px; color: #FFFFFF;}
#information table.information tr td.icon {width: 35px; vertical-align: top;}
#information table.information tr td.icon img {width: 32px;}
#information table.information tr td.text {font-family: weblysleek; font-size: 20px; color: #FFFFFF;}

/*#notification {position: absolute; bottom: 0px; left: 0px; width: 100%; margin: 0px; padding: 10px 5px 10px 5px; background: linear-gradient(to bottom, #888888 0%, #222222 100%);}*/
#notification {margin: 0px; padding: 10px 5px 10px 5px; background: linear-gradient(to bottom, #888888 0%, #222222 100%);}
#notification table.notification {width: 100%; margin: 0px 0px 0px 0px; padding: 0px;}
#notification table.notification tr td {font-family: weblysleekbold; font-size: 20px; color: #FFFFFF;}
#notification table.notification tr td.icon {width: 35px; vertical-align: top;}
#notification table.notification tr td.icon img {width: 32px;}
#notification table.notification tr td.text {font-family: weblysleekbold; font-size: 20px; color: #FFFFFF;}

#content {text-align: left; font-family: weblysleek; font-size: 20px; color: silver; background: linear-gradient(to bottom, #D4D4D4 0%, #E8E8E8 5%, #FFFFFF 50%);}
#content .distance {margin: 0px 0px 0px 0px; padding: 0px 5px 0px 5px; background-color: transparent; text-align: left; font-family: weblysleek; font-size: 80px; color: black;}
#content .comment {margin: -5px 0px 0px 0px; padding: 0px 5px 10px 5px; background-color: transparent; text-align: left; font-family: weblysleek; font-size: 16px; color: black; }

#hint {margin: 0px; padding: 10px 5px 10px 5px;}
#hint table.hint {width: 100%; margin: 0px 0px 0px 0px; padding: 0px;}
#hint table.hint tr td {font-family: weblysleek; font-size: 20px; color: black;}
#hint table.hint tr td.icon {width: 35px; vertical-align: top;}
#hint table.hint tr td.icon img {width: 32px;}
#hint table.hint tr td.text {font-family: weblysleek; font-size: 20px; color: black;}

#address {margin: 0px; padding: 10px 5px 10px 5px; background: linear-gradient(to bottom, #E8E8E8 0%, #FFFFFF 50%); }
#address table.address {width: 100%; margin: 0px 0px 0px 0px; padding: 0px;}
#address table.address tr td {font-family: weblysleek; font-size: 20px; color: black;}
#address table.address tr td.icon {width: 35px; vertical-align: top;}
#address table.address tr td.icon img {width: 32px;}
#address table.address tr td.text {font-family: weblysleek; font-size: 20px; color: black;}

/*#progression {margin: 0px; padding: 10px 5px 10px 5px; border-width: 0px 0px 0px 0px; border-style: dashed; border-color: gray; background: linear-gradient(to bottom, #E8E8E8 0%, #FFFFFF 50%); }*/
#progression {margin: 0px; padding: 10px 5px 0px 5px; border-width: 0px 0px 0px 0px; border-style: dashed; border-color: gray; background: linear-gradient(to bottom, #E8E8E8 0%, #FFFFFF 50%); }
#progression table.progression {width: 100%; margin: 0px 0px 0px 0px; padding: 0px;}
#progression table.progression tr td {font-family: weblysleek; font-size: 20px; color: black;}
#progression table.progression tr td.icon {width: 35px;}
#progression table.progression tr td.icon img {width: 32px;}
#progression table.progression tr td.type {width: 75px; font-family: weblysleekbold; font-size: 20px; color: black;}
#progression table.progression tr td.timestamp {text-align: right; font-family: weblysleek; font-size: 20px; color: black;}

/*#input {margin: 0px; padding: 10px 5px 10px 5px; border-width: 0px 0px 0px 0px; border-style: dashed; border-color: gray; background: linear-gradient(to bottom, #E8E8E8 0%, #FFFFFF 50%);}*/
#input {margin: 0px; padding: 0px 5px 10px 5px; border-width: 0px 0px 0px 0px; border-style: dashed; border-color: gray;}
#input table.input {width: 100%; margin: 0px 0px 0px 0px; padding: 0px;}
#input table.input tr td {font-family: weblysleek; font-size: 20px; color: #000000;}
#input table.input tr td.icon {width: 35px;}
#input table.input tr td.icon img {width: 32px;}
#input table.input tr td.type {width: 75px; font-family: weblysleekbold; font-size: 20px;}
#input table.input tr td.field {text-align: right; font-family: weblysleek; font-size: 20px;}
#input table.input tr td.field form input.finishcode {width: 125px;}
#input table.input tr td.timestamp {text-align: right; font-family: weblysleek; font-size: 20px;}

#stats {margin: 0px; padding: 10px 5px 10px 5px; border-width: 0px 0px 0px 0px; border-style: dashed; border-color: gray; background: linear-gradient(to bottom, #E8E8E8 0%, #FFFFFF 50%); }
#stats #graph {width: 100px; margin-left: auto; margin-right: auto; font-family: weblysleekbold; font-size: 20px; color: #000000;}

#message .message {margin: 0px; padding: 10px 5px 10px 5px; border-width: 1px; background-color: transparent; font-family: weblysleek; font-size: 28px; color: black; text-align: center;}
#message .message input {font-family: weblysleek; font-size: 28px; color: black;}
#message .message input.code {width: 250px;}
#button {text-align: center;}

#table {margin: 0px 0px 0px 0px; padding: 5px 10px 10px 5px;}
#table table {width:100%; border-collapse: collapse;border-width: 0px;}
#table table tr td {font-family: weblysleek; font-size: 24px; color: black;}