html {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 12px; /* = 1rem */
	background-color: black;
}

body {
	color: #ffffff;
	background-color: #000000;
	margin:0;
	padding: 0;
	background: url('/images/kaaosradiotausta-5.png') no-repeat;
	background-attachment: fixed;
	background-position: top center;
}

a, a:link, a:visited { color: #d5ffff; text-decoration: underline; }
a:hover { color: #ba2424; text-decoration: none; }
p { line-height:1.5rem;}
img {border: none;}

h1, h2, h3, h4, h5, h6 { color: #e6ffff; font-weight: normal; text-decoration:none; }
h1 { font-size: 3rem; margin: 0.5rem 0.5rem 2rem 0.5rem;}
h2 {
	font-size: 2rem;
	margin: 1rem 2rem 1rem 2rem;
	padding: 0;
	text-align: center;
	color: #e4f3ff;
}
h3 { font-size: 2rem; margin: 0.5rem 0 1rem; padding: 0; }
h4 { font-size: 1.5rem; margin: 0.5rem 0 1rem; padding: 0; }
h5 {
	font-size: 1.5rem;
	margin: 0.5rem 0 0.5rem;
	padding: 0;
	text-align: center;
	color: #86cbff;
	/*font-weight: bold;*/
}
h6 { font-size: 1.1rem; margin: 0 0 0.5rem; padding: 0; }

h2.streamtitle {
	font-weight: bolder;
	margin: 0;
}
.center_text {
	text-align: center;
}

#wrapper {
	/*max-width: 1024px;*/
	/*width: 85.3333rem;*/		/*1024px = 85.3333 rem*/
	width: 100rem;
	margin: 0 auto;
	/*background: url(/images/kaaostausta02.png) no-repeat;
	background-attachment:fixed;
	background-position:top center;*/
}
 
#header {
	width: 100%;
	height: 11rem;	/* 20*12 = 240px */
	/*background: url(/images/kaaoslogo_glow.png) no-repeat;*/
	
	background-attachment:fixed;
	background-position:center top;
}

.somebuttons {
	float: left;
	width: 67rem;
	right: 0rem;
	margin-top: 0.7rem;
	margin-left: 0.7rem;
	margin-bottom: 0.7rem;
	overflow: auto;
	background: rgba(0,0,0,0.3);
	padding-top: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	padding-bottom: 1rem;
}

.somebutton {
	padding: 0.05rem;
	width: 3rem;
	height: 3rem;
	margin-left: 2.5rem; 
}

.somebutton:hover {
	box-shadow: 0 0 0.3rem 0.3rem rgba(3, 184, 204, 0.767);
}

audio {
	transition:all 0.1s linear;
	margin-top:0.5rem;
}

audio:hover, audio:focus, audio:active {
	box-shadow: 2px 2px 4px #006773;
}

iframe.kalenteri {
	width: 100%;
	height: 630px;
	border: 0;
	margin-top:1rem;
}

.maincontent {
	border-radius: 0.3rem;
	padding-right: 1rem;
	padding-left: 1rem;
	padding-top: 0.6rem;
	padding-bottom: 0.6rem;
	font-size: 1.2rem;
	border: 0.1rem solid rgba(69, 92, 151, 0.6);
	background: rgba(0,0,0,0.7);
	margin-bottom: 1rem;
}

div.maincontent_wanhat {
	/*margin-bottom:2em;*/
	float: left;
	width: 720px;
	border-radius: 0.3rem;
	padding-right: 1rem;
	padding-left: 1rem;
	padding-top: 0.6rem;
	padding-bottom: 0.6rem;
	font-size: 1.2rem;
	border: 0.1em solid rgba(69, 92, 151, 0.3);
}

div.maincontent_square {
	/*margin-bottom:2em;*/
	margin: 2rem;
	float: left;
	min-width: 30rem;
	min-height: 35rem;
	border-radius: 0.3rem;
	padding-right: 1rem;
	padding-left: 1rem;
	padding-top: 1rem;
	padding-bottom: 0.6rem;
	font-size: 1.2rem;
	border: 0.1em solid rgba(69, 92, 151, 0.3);
	background: rgba(0,0,0,0.3);
}

div.maincontent_image {
	float: left;
	margin-top: 2rem;
	width: 22rem;
}

div.maincontent_text {
	font-size: 1.2rem;
	float: left;
	width: 55rem;
}

.clear { clear: both }
.h10 { height: 10px }
.h1em { height: 1rem; clear: both;}
.h20 { height: 20px }
.h2em { height: 2rem; clear: both;}
.h30 { height: 30px }
.h3em { height: 3rem; clear: both;}
.h40 { height: 40px }
.h4em { height: 4rem; clear: both;}
.h50 { height: 50px }
.h5em { height: 5rem; clear: both;}
.h60 { height: 60px }
.h6em { height: 6rem; clear: both;}
.h80 { height: 80px }
.h8em { height: 8rem; clear: both;}
.h100 {height:100px }
.h10em { height: 10rem; clear: both;}

.no_border {border: 0}

.float_l { float: left; display: block; }
.float_r { float: right; display: block; }

.image_c {
    display: block;
    margin-left: auto;
	margin-right: auto;
	max-width: 100%;
}
.image_wrapper {
	display: inline-block;
	border: 3px solid #35373b;
	margin-bottom: 5px
}
.image_fl {
	float: left;
	margin: 3px 30px 0 30px;
}
.image_fr {
	float: right;
	margin: 3px 30px 0 30px;
}

blockquote { font-style: italic; margin-left: 0.9rem; }
cite { font-weight: bold; color:#ccc }
cite span { color: #ccc }
em { color: #fff; font-weight: 400 }

.tmo_list { margin: 0 0 0 1.5rem; padding: 0rem; list-style: none }
.tmo_list li { color: #d5ffff; margin:0 0 0.5rem; padding: 0.25rem 0rem 0.25rem 1rem; background: url(images/templatmeo_list.jpg) no-repeat scroll 0 1rem }
.tmo_list li a { color: #d5ffff; text-decoration: underline }
.tmo_list li a:hover { color:#339783 ; }

#aikataulu {
	width: 1000px;
	height: 620px;
	border: 0px;
}

div.content_box {
	float:left;
	margin-bottom: 5rem;
	width: 60rem;
}

div.content_box_big {
	float:left;
	margin-bottom: 1.8rem;
	min-width: 40rem;
	max-width: 120rem;
}

div.content_box_small {
    float:left;
    margin-bottom: 5rem;
    max-width: 30rem;
    margin-left: 1rem;
}

/* mediumeja mahtuu kaksi rinnakkain leveysuunnassa */
div.content_box_medium {
    float: left;
    margin-bottom: 5rem;
    max-width: 48rem;
    margin-left: 1rem;
    margin-right: 1rem;

}

.col_w250 { width: 290px }
.col_w290 { width: 290px; }

.box_250 {
	display:block;
	width: 250px;
	height:250px;
}

div.last_box {
	margin: 0;
	margin-top:2rem;
	border: 0 solid black;
}


.netlabel_box {
	width: 100%;
	margin-bottom: 2rem;
	display: block;
	float: left;
}
.netlabel_text_box {
	max-width: 30rem;
	margin: 0;
}

#footer {
	clear: both;
	/*max-width: 80rem;*/
	padding: 5rem 2.2rem 1.8rem;
	text-align: center;
	color: #fff;
	font-size: 1.2rem;
}

#footer a { color: #fff; }

#sivusto {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    border: 0 solid black;
}

img.arrows {
	width: 4rem;
	height: 4rem;
}

img.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
div.center {
	display: block;
	float: none;
	margin-left: auto;
	margin-right: auto;
}

/* FIELDSET */
fieldset {
	padding: 1rem;
	border: 0.1rem solid;
	border-color: rgba(69,92,151,0.3);
	border-radius: 0.3rem;
	display: inline-block;
	background-color: #000000ab;
}

fieldset.user_form {
	border: 0rem;
	padding: 0rem;
	margin: 0rem;
}
fieldset.user_form legend {
	font-size: 1.1rem;
	padding-top: 0.3rem;
	padding-bottom: 0.3rem;
	padding-left:1.2rem;
	border:0;
	/*width: 100%;*/
}
fieldset a.linkbutton  {
    border: 0.1rem solid rgba( 69,92, 151, 0.3);
    margin: 0.5rem;
    padding: 0.2rem 1rem;
    color: white;
	text-decoration: none;
	background-color: #000;
	font-size: 1.5rem;
}

fieldset a.linkbutton:hover {
	border: 0.1rem solid rgba(69,92,151,1);
}

.form_element {
	transition: opacity 0.5s ease-in-out;
	display: block;
}

.flexbox {
	display: flex;
	flex-wrap: wrap;
}

.form_element.half-width {
	width: 50%;
	box-sizing: border-box;
	padding: 0 0.5rem;
	border: 0.1rem solid rgba(69, 92, 151, 0.3);
}

legend {
	color: #627ec6;
	width: 90%;
	font-size: 2rem;
	padding: 0.5rem;
	padding-left: 3rem;
	border:0.1rem solid;
	border-color: rgba(69,92,151,0.3);
	border-radius:0.3rem;
	background-color: #000000ab;
}

label {
	transition: opacity 0.5s ease-in-out;
	display: inline-block;
	vertical-align: middle;
}
/*.form_element textarea {*/
	/*max-width:600px;*/
	/*box-shadow:0px 0px 50px #006773;*/
/*}*/

#maincontentbox {
	float: left;
	margin-bottom: 5rem;
	width: 69rem;
}



.showhidesidebarswitch {
	display: none;
	visibility: hidden;
}



input.form_element, textarea.form_element {
	/*height: 1.2rem;*/
	/*padding-top:0;*/
	/*padding-bottom: 0;*/
	font-size: 1.5rem;
	border: 0.1rem solid rgba(69, 92, 151, 0.3);
	margin-left: auto;
	margin-right: 0.2rem;
	/*float: left;*/
	width: 100%;
	/*display: block;*/
	color: white;
	background-color:black;
}

input.form_element:hover, textarea.form_element:hover {
	border: 0.1rem solid rgba(69,92,151,1);
}

p.form_element {
	float: left;
	/*line-height: 1.2rem;*/
	min-width: 8rem;
	margin: 0 0.4rem 0 0.4rem;
	font-weight: bold;
}

.form_element input.kommentoi_button { 
	float:right;
}
.checkbox-wrapper {
	display: flex;
	align-items: center;
	margin-bottom: 1rem;
}
.form_element input[type="checkbox"] {
	width: auto;
	float: none;
	margin-left: 0;
	margin-right: 0;
}

input.kommentoi_button {
	/*float:right;*/
	background-color:black;
	color: white;
	border: 0.1rem solid rgba(69, 92, 151, 0.3);
}

p.error { color:red; }
p.notice { color: orange;}

#loggedinsign {
	/*position: absolute;*/
	float: right;
	font-weight: bold;
	font-size: 1.2rem;
	line-height: 1.2rem;
	position: relative;
	/*right: 1rem;*/
	/*bottom: 1rem;*/
	animation: blinkanim 4s linear 0s infinite;
	transition-delay: 5s;
	margin: 0;
	z-index: 1;
}
#loggedinsign a {
	text-decoration: none;
}
#loggedinsign a:hover {
	text-decoration: none;
	color: #00c74c;
	animation: blinkanim 1s linear 0s infinite;
}

.smallbutton {
	margin: 0;
	padding: 0;
	line-height: 1.2rem;

}

@keyframes blinkanim {
	10% {opacity: 0; }
	50% {opacity: 0.5; }
	90% {opacity: 0; }
}

@keyframes resizeanim {
	10% {}
	50% {}
	90% {}
}