/* Theme Name: Mobiilipohja
Description: Mobiilipohjan teematiedosto
Author: Medialuotsi Oy
Author URI: www.medialuotsi.fi*/


 /* HTML5 Boilerplate */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
@import url(http://fonts.googleapis.com/css?family=Raleway:300,400,600);
html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

a {
    color: #00e;
}

a:visited {
    color: #551a8b;
}

a:hover {
    color: #06e;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */


body {
background: url('img/bg.jpg') top center no-repeat;

font-size: 8pt; }


header { margin-top: -10px;

}
header p {
	text-align: center; 
	color:#fff; 
	font-size: 12pt;
	font-weight: normal; 
	padding-bottom: 5px; padding-top: 5px;
	line-height: 2em;
}

header h1 {
	font-family:'Raleway', sans-serif;
	font-weight: 300; 
	text-transform: none;
	text-align: center;  
	padding: 20px 20px 0px 20px; 
	font-size: 30px; 
	line-height: 1.5em;
	color: #fff;
}

.napit {
	margin-bottom: 20px; 
	margin-left: 0px; 
	min-height: 40px; 
}
#etusivu {
min-height: 100px;
}

.napit p {
	text-align: center; 
	margin-top: 30px; 
	margin-bottom: 0px;
}
.napit a { 	
	font-family:'Raleway', sans-serif;
	color: #333; 
	font-size: 20px;
	padding: 8px; 
	text-decoration: none;

	font-weight: normal;
	text-transform: none;

/*	box-shadow: 0px 2px 4px #252525; */
	display:block;
	margin: 5px 30px 20px 30px;
	tap-highlight-color: rgba(150,0,0,0.1);
	-webkit-tap-highlight-color: rgba(150,0,0,0.1);
	
background: #fff;
	
}
					
#soitanappi { 

 border: 1px solid #106b24; color: #fff;
					background: rgb(159,173,71); /* Old browsers */
					background: -moz-linear-gradient(top, rgba(159,173,71,1) 1%, rgba(142,185,42,1) 50%, rgba(114,170,0,1) 51%, rgba(105,178,41,1) 100%); /* FF3.6+ */
					background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(159,173,71,1)), color-stop(50%,rgba(142,185,42,1)), color-stop(51%,rgba(114,170,0,1)), color-stop(100%,rgba(105,178,41,1))); /* Chrome,Safari4+ */
					background: -webkit-linear-gradient(top, rgba(159,173,71,1) 1%,rgba(142,185,42,1) 50%,rgba(114,170,0,1) 51%,rgba(105,178,41,1) 100%); /* Chrome10+,Safari5.1+ */
					background: -o-linear-gradient(top, rgba(159,173,71,1) 1%,rgba(142,185,42,1) 50%,rgba(114,170,0,1) 51%,rgba(105,178,41,1) 100%); /* Opera 11.10+ */
					background: -ms-linear-gradient(top, rgba(159,173,71,1) 1%,rgba(142,185,42,1) 50%,rgba(114,170,0,1) 51%,rgba(105,178,41,1) 100%); /* IE10+ */
					background: linear-gradient(to bottom, rgba(159,173,71,1) 1%,rgba(142,185,42,1) 50%,rgba(114,170,0,1) 51%,rgba(105,178,41,1) 100%); /* W3C */
					filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9fad47', endColorstr='#69b229',GradientType=0 ); /* IE6-9 */
	text-shadow: 0px 0px 0px #111, 1px 1px 0px #111, 2px 2px 0px #111;
}

 h1 {
	 font-family:'Raleway', sans-serif;
	 font-size: 22px !important;
	 font-weight: 600; 
	 text-transform: none; 
	 color: #333; 
	 margin: 5px 15px 20px 15px;
	 line-height: 1.5em;
 }

  h2 {
	 font-family:'Raleway', sans-serif;
	 font-size: 20px !important;
	 font-weight: 400; 
	 text-transform: none; 
	 color: #333; 
	 margin: 5px 15px 20px 15px; 
	 line-height: 1.5em;
 }

 h3 {
	 font-family:'Raleway', sans-serif;
	 font-size: 18px !important;
	 font-weight: normal; 
	 text-transform: none; 
	 color: #333; 
	 margin: 5px 15px 20px 15px; 
	 line-height: 1.5em;
 }


.content {
/*	box-shadow: 0px 5px 4px #353535;  
	background: url('img/whitebg2.png');  */
	margin: 5px; 
	padding: 5px;
	background: rgba(255,255,255,0.8)
}
 .content p {
 margin: 0px 0px 0px 0px; 
 padding: 0px 15px 10px 15px; 
 font-size: 15.5px;
 line-height: 1.6;
 color: #333;
 }
 
.takaisin a { 
	font-family: 'Yanone Kaffeesatz', sans-serif; 
	text-decoration: none; 
	font-size: 16pt; 
	color: #fff; 
	margin: -10px 15px 15px 15px; 
	background: #ef4b3e;  
	padding: 5px; 
	display:block;
	border-radius:5px; 
	-moz-border-radius: 5px;
}

ul {
	margin-bottom: 15px; font-size: 15px; color:#333;
}
.soitto {
	margin: 0px 15px 0px 15px; 
	background: #546b79; 
	text-align: center; 
	font-size: 16pt; 
	border-radius:5px;
	-moz-border-radius: 5px;
}

.soitto p {
	font-family: 'Yanone Kaffeesatz', sans-serif;
	padding: 5px; 
	color: #fff;
}

.soitto a {
	font-family: 'Yanone Kaffeesatz', sans-serif; 
	text-decoration: none;  
	color: #fff; 
	text-transform: uppercase; 
	font-size: 22pt; 
}

hr {
	margin: 35px 15px 0px 15px; 
	border-top: 1px solid #959595;
}

footer {
background: #333;
padding-top: 10px;
}

footer p {
	font-size: 9pt; 
	text-align: center; 
	margin-top: 10px; 
	color: #e6e6e6;
	padding-top: 5px;
}

footer a, .content a {
	color: #6E87BB;
	text-decoration: none;
}
	
.empty {
	height: 0px;
}
/* -------------------- STICKY FOOTER -------------------- */

* {
	margin: 0;
}

html, body {
	height: 100%;
}

.wrapper {
	min-height: 100%; 
	height: auto !important;
	height: 100%;
	margin: 0 auto -180px; 
}

footer, .push {
	height: 180px;
}

.push { margin-top: 20px; }

/* ==========================================================================
   Helper classes
   ========================================================================== */



.nocallout {
    -webkit-touch-callout: none;
}

.pressed {
    background-color: rgba(0, 0, 0, 0.7);
}



textarea[contenteditable] {
    -webkit-appearance: none;
}

.gifhidden {
    position: absolute;
    left: -100%;
}

.ir {
    background-color: transparent;
    background-repeat: no-repeat;
    border: 0;
    direction: ltr;
    display: block;
    overflow: hidden;
    text-align: left;
    text-indent: -999em;
}

.ir br {
    display: none;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

@media only screen and (min-width: 420px) {

header p {text-align: center; }

.napit {
	width: 420px; 
	margin: 0px auto;
}
.napit p {
	margin-bottom: 30px; 
	padding-bottom: 40px;
}
.napit a { 
	display: inline-block;
	margin: 5px;
	width: 40%;
}


/*@media all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2) {
body {background: url('img/grid.png'); }	

header {
	background:  #fff;
	height: 80px;
}

header h1 {
	font-family:'Contrail One', cursive; 
	font-weight: normal; 
	text-align: center;  
	padding-top: 15px;
}

footer {
	background: #ffffcb;  
	border-top: 2px solid #546b79;
}
footer p {
	font-size: 9pt; 
	text-align: center; 
	margin-top: 10px;
}*/
	
/* -------------------- STICKY FOOTER -------------------- */

* { margin: 0; }
			
html, body { height: 100%; }

.wrapper {
	min-height: 100%; 
	height: auto !important;
	height: 100%;
	/*margin: 0 auto -80px;*/
}
	
}