/*fonts 
font-family: 'Source Sans Pro', sans-serif;
font-family: 'Noto Sans', sans-serif;
font-family: 'News Cycle', sans-serif;
font-family: 'Rammetto One', cursive;
font-family: 'Exo', sans-serif;
font-family: 'Days One', sans-serif;
font-family: 'Archivo Narrow', sans-serif;
font-family: 'Bowlby One', cursive;
font-family: 'Raleway', sans-serif;
font-family: 'Merriweather', serif;
*/


html,
body {

   margin:0;
   padding:0;
   height:100%;
   background-color: #141414 ;
}
body{
	background-image: url(main_bg_1.jpg);
	background-size: cover;
}
.container{
/*font: 'News Cycle', sans-serif;*/
 font: 'Open Sans', sans-serif, 'Arial'
  overflow:auto;
	padding-bottom: 110px;  /* must be same height as the footer */
}
.headerlogo{

	width:50%;
	left:0px;

	clear:none;
	}
.headerlogo
{
  	
		
}		
.headerlogo img{
right:0px;
clear:none;
float: right;
}
#debug
{
	margin-top: 50px;
	background-color: #20b2aa;
	font-weight: bold;
	width:100%;
	z-index: 10;
	position:absolute;
	
}
.wrapper {
  	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -4em;
}
.header,.header1,.header2,.header3,.header4,.header5 {
	background-image: url(header_bg.png);
	background-size: 100px 100px;
	width:100%;
	height:78px;   /* +9 for shadow 93  84  */
	position: absolute;
	left:0px;
	z-index:0;	
}
.header1 {
	height:59px;
	background-image: url(header_bg-1.png);
	
}
.header2 {
height:51px;
background-image: url(header_bg-2.png);
	
}
.header3 {
	height:45px;
background-image: url(header_bg-3.png);
}
.header4 {
	height:42px;
background-image: url(header_bg-4.png);
}
.header5 {
	height:37px;
background-image: url(header_bg-5.png);
}

.menu,.menu1,.menu2,.menu3,.menu4,.menu5{
	text-shadow: 1px 1px 3px #000000;
   /*height:84px;*/
	position:absolute;
	width: 50%;
	left:50%;
   font-family: 'PT Sans', sans-serif;
   font-weight: 700;
   font-size:1em;
   line-height:78px;
   
   }
.menu1{
	line-height:54px;  /*65-9px;*/
}   
.menu2{
	line-height:50px;  /*59-9px*/
}   
.menu3{
	line-height:43px;
}   
.menu4{
	line-height:40px;
}   
.menu5{
	line-height:37px;
}      
  


   
#menucontainer{
	
	display: inline-block;
	height:100%;
	clear:none;
	}
#menucontainer ul{
	list-style: none;
 padding: 0;
 margin: 0;
 height:100%;
 /*border: medium; 
 border-style: dashed; border-color: #ff4500; */
}
#menucontainer ul li
 {
 float: left;
 display: block;
 height:100%;
 
 /*margin: 0 0.15em;*/
 }

.menu ul li a {
cursor:auto;
padding:10px;
text-decoration:  none;
color: #d3d3d3;
-o-transition:color .5s;
-ms-transition:color .5s;
-moz-transition:color .5s;
-webkit-transition:color .5s;
/* ...and now for the proper property */
transition:color .5s;
}

.menu ul li#activemenu a{
	color:#282828;
	-o-transition:color .5s;
-ms-transition:color .5s;
-moz-transition:color .5s;
-webkit-transition:color .5s;
/* ...and now for the proper property */
transition:color .5s;
}


.menu ul li a:hover,.menu ul li#activemenu a:hover{
	color: #ff4500;
}

li#activemenu{
	background-image: url(menuactive_bg.png);
	height: 124px;
	/*background-size: 100px 1237px;*/
	background-repeat: no-repeat;
	background-position:center; 
}


.mobilemenu{
	font-size:0.7em;
	text-shadow: 1px 1px 1px #000000;
	
}

.isomenu{	
font-size:2em;
}

.main{

	width:100%;
	top:0px;
	left:0px;
	padding-top:20px;
   font-family: 'Open Sans', sans-serif,'Arial';
	color:white;
}
.textarea{
	width:100%;
	margin-top: 20px;
	left:0px;
	background-color: #c82614;
	font-size: 1em;	
	}


.imagebox {
	background-color: black;
	width: 100%;
	height:750px;
	max-width:100%;
	

}
h1{
	color: #ff9900;
font-size: 1em;
font-weight: 700;
text-transform: uppercase;
}



/* ============================ jquery tab definitions ====================  */
.ui-widget-content{
font-family:  'PT Sans', sans-serif,'News Cycle', "Trebuchet MS", "Tahoma", "Verdana", "Arial";
font-size: 1em;
background:none;
border: none;
}  
.ui-widget-header {
background-image: none;
background-color: inherit;
border: none;

}
/*
font-family: 'Source Sans Pro', sans-serif;
font-family: 'Noto Sans', sans-serif;
font-family: 'Rammetto One', cursive;
font-family: 'Exo', sans-serif;
font-family: 'Days One', sans-serif;
font-family: 'Archivo Narrow', sans-serif;
font-family: 'Bowlby One', cursive;
font-family: 'Raleway', sans-serif; */



.tabs li a{
	color: gray;
-o-transition:color .5s;
-ms-transition:color .5s;
-moz-transition:color .5s;
-webkit-transition:color .5s;
/* ...and now for the proper property */
transition:color .5s;
}
div#tabs ul.tabs li a:hoover{	
	color: #ff4500;
}

.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
color: #1c94c4;
}
.ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited
{
	color:#d03a00;
}


.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited
{
color: #d3d3d3;	
}





li#tab1, li#tab2,li#tab3{
font: 0.8em 'Open Sans', sans-serif,'Arial';
font-weight: 900;
border:none;
text-transform: uppercase;
}
li#tab1{

background-color: #ecb91d;
background-color: rgba(215,166, 15, 0.3);
background-color: rgba(169,25,0, 0.3);
-o-transition:color 2s;
-ms-transition:color 2s;
-moz-transition:color 2s;
-webkit-transition:color 2s;
transition:background-color 2s;
}
li#tab1.ui-state-focus{	
background-color: #d7a60f; 
background-color: rgba(236,185, 29, 0.7);
background-color: rgba(255,39, 0, 0.7);
-o-transition:color 2s;
-ms-transition:color 2s;
-moz-transition:color 2s;
-webkit-transition:color 2s;
transition:background-color 2s;
}  /**/



li#tab2{

background-color: #ff8c00; 
/*background-color: rgba(255,140,0, 0.3);*/
background-color: rgba(187,32,0, 0.3);
-o-transition:color 2s;
-ms-transition:color 2s;
-moz-transition:color 2s;
-webkit-transition:color 2s;
transition:background-color 2s;}

li#tab2.ui-state-focus{	background-color: orange; 
/*background-color: rgba(255,165,0, 0.7);*/
background-color: rgba(228,42,0, 0.7);
-o-transition:color 2s;
-ms-transition:color 2s;
-moz-transition:color 2s;
-webkit-transition:color 2s;
transition:background-color 2s;}


ul.tabs li.ui-state-active,ul.tabs li.ui-tabs-selected, ul.tabs li.ui-tabs-focus{
background-image: none; }
ul.tabs li.ui-tabs-active a, ul.tabs li.ui-tabs-selected a, ul.tabs li{
background-image: none; }

div#tabs-1 { background-color: #d7a60f;
background-color: rgba(236,185, 29, 0.7);
background-color: rgba(255,39, 0, 0.7);
-o-transition:background-color 2s;
-ms-transition:background-color 2s;
-moz-transition:background-color 2s;
-webkit-transition:background-color 2s;
transition:background-color 2s;
box-shadow: 0px 0px 15px 5px black;
 }
div#tabs-2 { background-color: orange;
background-color: rgba(255,165,0, 0.7);
background-color: rgba(228,42,0, 0.7);
-o-transition:background-color 2s;
-ms-transition:background-color 2s;
-moz-transition:background-color 2s;
-webkit-transition:background-color 2s;
transition:background-color 2s;
box-shadow: 0px 0px 15px 5px black;
 }


/*   kuvat */

.banner { position: relative; overflow: auto; height:300px; padding-top:100px; }
    .banner li { list-style: none; }
        .banner ul li { float: left; }

        
/* Sähköpostilomake */
.textarea
{
	background-color:rgba(255,0,0,0.5);
}

.textarea article form { 
width: 60.71%;
}

form,article,input,textarea{

	
	border: medium, black;
	font-size: 100%;
	font-weight: 400;
	line-height: 1;
	margin: 0px 0px 0px 0px;
	outline: medium none currentColor;
	padding: 0px;
	text-align: left;
	text-decoration: none;
}

.textarea article aside
{
  width: 28.57%;
}

.textarea article aside, .textarea article form { 
box-sizing: border-box;
display: inline-block;
vertical-align: top;
}

.textarea article form input[type="submit"] { 
background-color: #6FBE9D;
display: block;
float: right;
font-family: "flamaregular", "Arial", sans-serif;
padding-bottom: 10px;
padding-left: 30px;
padding-right: 30px;
padding-top: 10px;
cursor: pointer;
}

.textarea article form textarea { 
background-color: white;
display: block;
font-family: "flamaregular", "Arial", sans-serif;
height: 150px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
width: 97%;
}





.textarea article form input[type="text"], .textarea article form input[type="email"] { 
background-color: white;
display: block;
font-family: "flamaregular", "Arial", sans-serif;
padding: 10px;
width: 97%;
}
.textarea article form input[type="text"], .textarea article form input[type="email"], .textarea article form textarea { 
margin-bottom: 1.79%;
}    


.typedialog{
	width:80%;
	margin-left:auto;
 margin-right:auto;
 clear:none;
}

.typedialog .images{
	position:relative;
  height:300px;
  width:450px;
  margin:0 auto;
  display:inline-block;
}    
.typedialog .images img{
 
  position:absolute;
  left:0;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;  
}  

.typedialog .images img.top:hover {
  opacity:0;
}
        
#footer, .push {
height: 4em;
clear:both;
}   
.menupush {
height: 1px;
clear:both;
}        

#footer{
	
background-image: url(footer_bg.png);
}       







 
/*#footer {
   position:relative;
   bottom:0;
   width:100%;
   margin-top: 0px; negative value of footer height 
   height:60px;    Height of the footer 
   background-color: blue;
   clear:both;
      
}*/

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

/* IMPORTANT

You also need to include this conditional style in the <head> of your HTML file to feed this style to IE 6 and lower and 8 and higher.

<!--[if !IE 7]>
	<style type="text/css">
		#wrap {display:table;height:100%}
	</style>
<![endif]-->

*/