/*
Radioverkko.fi sivuston design (c) Mikko Larinen (Mikkis.fi)

Muutoksia huutolaatikon osuuteen 2018. Älkää rikkoko, kiitos.

*/

@import url(reset.css);
@import url(http://fonts.googleapis.com/css?family=Alfa+Slab+One|Roboto+Condensed:400,700);

body{
	background:url(images/background.png) fixed;
	font-family:"Roboto Condensed";
	font-size:16px;
}

a:hover {
        cursor: pointer;
}

.clear{
	height:0;
	clear:both;
}
h1{
	font-family:"Alfa Slab One";
	font-size:23px;
	padding:10px 0;
}
h2{
	font-family:"Alfa Slab One";
	font-size:18px;
	padding:10px 0;
}
p{
	line-height:25px;
	padding-bottom:10px;
}
#wrapper{
	width:995px;
	margin:30px auto;
}
header{
	background:#254683;
	padding:30px;
	text-align:center;
}
#logo{
	background:url(images/logo.png);
	width:521px;
	height:127px;
	display:inline-block;
}
nav{
	background:#2b5095;
}
#navbar{
    margin:0;
    padding:0;
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#navbar li{
	float:left;
}
#navbar li a{
	display:block;
	padding:50px 10px 14px 10px;
	text-decoration:none;
	color:#fff;
	width:145px;
	text-align:center;
	border-left:1px solid #254683;
	-webkit-transition:0.3s ease-in;
	-moz-transition:0.3s ease-in;
	-o-transition:0.3s ease-in;
}
#navbar li:first-child a{
	border-left:0px;
}
#navbar li a:hover{
	color:#2b5095;
}
#navbar li a.home{background:url(images/icons/home.png) 50% 25% no-repeat;}
#navbar li a.home:hover{background:#e7efff url(images/icons/homeh.png) 50% 25% no-repeat;}
#navbar li a.info{background:url(images/icons/info.png) 50% 25% no-repeat;}
#navbar li a.info:hover{background:#e7efff url(images/icons/infoh.png) 50% 25% no-repeat;}
#navbar li a.calendar{background:url(images/icons/calendar.png) 50% 25% no-repeat;}
#navbar li a.calendar:hover{background:#e7efff url(images/icons/calendarh.png) 50% 25% no-repeat;}
#navbar li a.bcinfo{background:url(images/icons/bcinfo.png) 50% 25% no-repeat;}
#navbar li a.bcinfo:hover{background:#e7efff url(images/icons/bcinfoh.png) 50% 25% no-repeat;}
#navbar li a.recruitment{background:url(images/icons/recruitment.png) 50% 25% no-repeat;}
#navbar li a.recruitment:hover{background:#e7efff url(images/icons/recruitmenth.png) 50% 25% no-repeat;}
#navbar li a.support{background:url(images/icons/support.png) 50% 25% no-repeat;}
#navbar li a.support:hover{background:#e7efff url(images/icons/supporth.png) 50% 25% no-repeat;}
#navbar li a.audio{background:url(images/icons/cassette.png) 50% 25% no-repeat;}
#navbar li a.audio:hover{background:#e7efff url(images/icons/cassetteh.png) 50% 25% no-repeat;}

#content{
	background:#fff;
}
#content a, #messagepopup a{
	color:#000;
	text-decoration:none;
	border-bottom:1px solid #287bd0;
}
#content a:hover, #messagepopup a:hover{
	border-bottom:0;
}
#left{
	width:700px;
	float:left;
	padding:10px 0 15px 15px;
}
#right{
	width:255px;
	float:right;
	margin-left:10px;
	padding:15px 15px 15px 0;
}

#right a:hover {
        cursor: pointer;
}

#message{
	display:inline-block;
	background:#e7efff url(images/icons/message.png) no-repeat right bottom;
	height:160px;
	width:235px;
	padding:15px 0px 0px 15px;
	border-bottom:0 !important;
	margin-bottom:5px;
	-webkit-transition:0.3s ease-in;
	-moz-transition:0.3s ease-in;
	-o-transition:0.3s ease-in;
}
#message:hover{
        cursor: pointer;
	background-color:#d4e2fe;
}
.message1{
	font-family:"Alfa Slab One";
	font-size:23px;
	display:block;
	margin-bottom:20px;
}
.message2{
	font-size:23px;
	display:block;
}
.rightbox{
	background:#e7efff;
	padding:10px 0 5px 10px;
	margin:10px 0;
	width:240px;
}

footer{
	background:#2b5095;
	padding:15px;
	text-align:center;
	color:#fff;
}

.fixed{
	background:#fffff;
	width:100%;
	border-collapse:collapse;
	margin-bottom:10px;
	font-size:14px;
	table-layout:fixed;
}
tr{
	border-bottom:0;
	line-height:25px;
}
th, td{
	width:200px;
	padding:10px;
	text-align:left;
    border-left:0;
}
th{
	background:#3498ff;
}
.prgtop{
    border-top:0;
    font-size: 10px;
    line-height: 5px;
	background:#ffffff;
	text-align:right;
}
.sep tr, .sep td {
	border:0;
}
.program1 {
	background:#e7efff;
}
.program2 {
	background:#d4e2fe;
}
.program1 small{
	font-size:10px;
}
.program2 small{
    font-size:10px;
}
.time{
	width:30px !important;
	background:#254683;
    text-align:center;
	white-space:nowrap;
	color:#ffffff;
}

#messagefade{
	width:100%;
	height:100%;
	top:0;
	left:0;
	display:none;
	position:fixed;			
	background:url(images/messagefade.png);
	overflow:auto;
}
#messagepopup{
	position:absolute; 
	left:50%;
	top:17%;
	margin-left:-202px;
        min-width:300px;
        background-color:#e7efff;
        height: auto;
}
#messagepopup form{
	padding:10px 30px;
        min-width:300px;
}
#messagepopup form input, #messagepopup form textarea{
	width:100%;
}
#messagetnx {
        visibility: hidden;
        text-align: center;
        height: 0px;
}

#messagetnx h1 {
        font-size: 48px;
}

@keyframes messagefadeout {
    from {opacity: 1.0;}
    to {opacity: 0.0;}
}

.messagefadeout {
    animation-name: messagefadeout;
    animation-duration: 1s;
}

input, textarea {
	font-family:'Roboto Condensed', sans-serif;
	font-size:16px;
}
input[type=submit], input[type=reset]{
	font-size:17px;
}
textarea{
	padding:5px;
	border:1px solid #3673e3;
        border-radius:10px;
}
input[type="text"]{
	width:300px;
	padding:5px;
	border:1px solid #3673e3;
    border-radius:10px;
}
select{
	padding:5px;
    border-radius:10px;
	font-family:'Roboto Condensed', sans-serif;
	font-size:16px;
	border:1px solid #3673e3;
	width:300px;
	margin-bottom:10px;
}
.radioinput, .checkinput{
    display: none;
    -webkit-appearance: none;
    background-color:#fff;
	border:2px solid #3673e3;
    width:100%;
    display:inline-block;
    width:15px;
    height:15px;
}
.radioinput{
    border-radius:10px;
}
.radioinput:checked, .checkinput:checked{
    background-color:#3673e3;
	border:2px solid #fff;
}
.buttoninput{
	background:#254683;
	border:1px solid #254683;
    border-radius:10px;
	padding:5px 10px;
	color:#fff;
	cursor:pointer;
}
.buttoninput:hover{
	background:#3673e3;
	border:1px solid #3673e3;
}
hr{
	color:#d4e2fe;
	background:#d4e2fe;
	border:0;
	height:2px;
}
.background{
	background:#e7efff;
	padding:10px;
}
.background2{
	background:#d4e2fe;
	padding:10px;
}

small{
	font-size:11px;
}
#close{
	cursor:pointer;
}
#Spreadshop{
	margin:15px 65px;
}

.audioli {
    margin: 10px;
}

.audioimg {
    top: 10px; 
    position: relative;
    width: 30px;
    height: 30px;
}

.audioplay {
    display: none;
    margin-top: 5px;
    margin-left: 35px;
    border: none;
    padding: 5px;
}