@charset "utf-8";

/* === Fonts === */

/* latin */
@font-face {
  font-family: 'Tangerine';
  font-style: normal;
  font-weight: 400;
  src: local('Tangerine Regular'), local('Tangerine-Regular'), url(https://fonts.gstatic.com/s/tangerine/v8/HGfsyCL5WASpHOFnouG-RFtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v13/UyBMtLsHKBKXelqf4x7VRQ.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v13/1YwB1sO8YE1Lyjf12WNiUA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* === Template === */
:root {
    --bg-y-pos: -24px;
    --bg-y-height: -128px;
    --bg-y-height2: -81px;
}
* {
	margin:0;
	padding:0;
}
html,body {
	height: 100%;
}
body {
	font-family: 'Lato', sans-serif;
	font-size: 2em;
	color:#FFF;
	font-weight: bold;
    background: #000000;
}
p {
    margin-bottom: 10px;
}
strong, b {
    font-weight: bold;
}
div {
	padding-left:20px;
	padding-right:20px;
	padding-top:5px;
	padding-bottom:5px;
}
a, a:visited {
	text-decoration: none;
}
.divider {
	background-image: url("img/back.jpg");
    background-position-x: center;
	text-align:center;
	height: 83px/*calc(-1 * var(--bg-y-height2))*/;
	padding-top:40px;
	cursor:pointer;
}
#header {
	background-image: url("img/back.jpg");
    justify-content: center;
    background-position-x: center;
    background-position-y: var(--bg-y-pos);
	font-size:1.5em;
	}
.wrapper {
	text-decoration:none;
    text-align:center;
    padding-top:20px;
    padding-bottom:20px;
}
.divider a {
	background: #000000;
  	vertical-align: middle;
	padding: 8px;
	cursor:pointer;
	border-bottom: thick solid;
}
.divider:hover a{
	color: #FFF;
}
.content {
    background: #FFFFFF;
	color: #000000;
	text-align:right;
	font-weight:100;
}
.content a, .content a:visited {
    color: #0059B3;
}
#nav {
    width: 100%;
	z-index:50;
	color: #FFF;
	padding-left: 20px;
    top: 0;
	position: fixed;
	line-height: 40px;
	float: left;
	width:auto;
    cursor:pointer;
    background: #000000;
}
/*Define the keyframe animation and name it blink*/
@keyframes blink{
  0%{ color:#50BDDE; }
  80%{ color:#FFFFFF; }
}
/*Add compatibility prefix*/
@-webkit-keyframes blink {
    0% { color:#50BDDE; }
    80% { color:#FFFFFF; }
}
@-moz-keyframes blink {
    0% { color:#50BDDE; }
    80% { color:#FFFFFF; }
}
@-ms-keyframes blink {
    0% { color:#50BDDE; }
    80% { color:#FFFFFF; }
}
@-o-keyframes blink {
    0% { color:#50BDDE; }
    80% { color:#FFFFFF; }
}
/*Define blink class, I want to add the class at pageload and remove it after 10 seconds*/
.blink{
    animation: blink 1s linear infinite;
    /*Other browser compatibility prefixes*/
    -webkit-animation: blink 1s linear infinite;
    -moz-animation: blink 1s linear infinite;
    -ms-animation: blink 1s linear infinite;
    -o-animation: blink 1s linear infinite;
}