@import 'https://fonts.googleapis.com/css?family=Alegreya+Sans';
@import 'https://fonts.googleapis.com/css?family=Abril+Fatface';
@import https://fonts.googleapis.com/css?family=Antic+Didone"
@import 'https://fonts.googleapis.com/css?family=Lato';



* {
margin:0
padding:0

}

body
{
    background: #f5f5f5;
    color: #f5f5f5;
    font-family:'Alegreya', sans-serif;
    max-width: 1200px;
    margin: 0 auto;
}

.image {
        padding-top:86px;
        position: relative;
        margin-bottom: 2px;
        width: 100%;
        height: 484px;
        color: #639248;
        background: url('img/bob_banner3.jpg') no-repeat;
        background-size: 1200px 484px;
    }


.image2 {
        padding-top:86px;
        position: relative;
        margin-bottom: 2px;
        width: 100%;
        height: 484px;
        color: #639248;
        background: url('img/bob_banner3.jpg') no-repeat;
        background-size: 1200px 484px;
    }



.textbox {
padding-top: 20px;
font-family: font-family: 'Lato', sans-serif;
padding-bottom: 40px;


 
}

a {
    color: #fff;
}

a:link {color: #57ffb7;
}

a:visited {
    color:#57ffb7;
}


h1
{
    padding-top: 750px;
  font-family: font-family: 'Lato', sans-serif;
    font-size:230%;
     font-weight:100;
    padding:4%;
    color: #fff;
    text-align: center;
    line-height: 170%;
   background-color: #0e2601; 
  
    
    
  
}

h2
{
    font-size:180%;
    font-weight:400;
    padding:1%;
    color: #000;
    text-align: center;
    
}


p
{
     font-family: font-family: 'Lato', sans-serif;
    Color:#000;
    font-size: 110%;
    line-height: 120%;
    padding: 2%;
 

    
       
}








h3
{
    font-family: font-family: 'Lato', sans-serif;
    font-size: 200%;
    line-height: 205%;
    padding: 3%;
    font-weight: 100;
    color: #000;
    text-align: center;
      
}

h4
{
    font-family: font-family: 'Lato', sans-serif;
    font-size: 280%;
    line-height: 100%;
    padding: 2%;
    font-weight: bold;
    text-align: center;
    
      
}

h5
{
   color: #000;
    font-size: 110%;
    padding: 2%;
    
    

}


header
{
 background-color:#639248;
 width:100%;
 height:96px;
    
}

#header-inner{
    max-width: 1200px;
    margin: 0 auto;
    
}



#logo{
    margin: 20px;
    float:left;
    width: 200px;
    height: 60px;
    background: url(img/bob.png) no-repeat center;
    
}

/*--Start navigation--*/
 
nav {
    float: right;
    padding: 25px 20px 0 0;
}

#menu-icon {
 display:hidden;
 width:40px;
 height:40px;
 background:url(img/nav.png) center;
}

a:hover#menu-icon
{
    border-radius: 4px 4px 0 0;
    
}

ul
{
    list-style-type: none;
    
}

nav ul li
{
    font-family: 'Alegreya Sans', sans-serif;
    font-size: 150%;
    display: inline-block;
    float: left;
    padding: 10px;
}

nav ul li a {
    color: #fff;
    text-decoration: none;
}

nav ul li a:hover {
    color:#C3D7DF;
}

.current {
    color:#fff;
}

/*<--End Navigation--*/

.banner {
    width:100%;
    background-color:#fff;
    ;
}

.banner-inner {
    max-width: 1100px;
    margin: 0 auto;
}



.inner-wrapper {
    float:left;
    width:100%;
    background-color:#fff;
  
}

article {
    float:left;
    margin: 0 auto;
    width:50%;
    height: auto;
    background-color:#fff;
    
}

#S{
    background-color: #fff;
}

#tablet {
background-color:#fff;
}

#tablet2 {
background-color:#fff;
}


#tablet2white {
background-color:#fff;
}

aside {
    float: right;
    margin: 0 auto;
    width: 50%;
    height: auto;
}    

#S {
    background-color:#fff;
    
}

#ref {
    background-color: #fff;
    
}


#Steksti {
    background-color:#fff;

      
}
  

  

#Mteksti  {
    background-color:#fff;
   

    
}
  
.hand-mobile {
	background-color:#fff;
	}

#mobile {
	background-color:#fff;
	}

#Lteksti {
 background-color:#fff;
}


#desktop {
 background-color:#fff;
}



.inner-wrapper-2 
{
    float:left;
    width:100%;

    
}

.inner-wrapper-3 
{
    float:left;
    width:100%;
    background-color:#fff;
    }
    
.inner-wrapper-3hinnasto 
{
    float:left;
    width:100%;
    background-color:#fff;
    }  
    
.one-third
{
 width: 32.8%;
 float:left;
 text-align: center;
    }

#sisaltaa {
    background-color:##f5f5f5;
    border: double;
    }
    
#eisisalla{
    background-color:#f5f5f5;
    border: double;
    }
    
#yleisesti{
    background-color:#f5f5f5;
    border: double;
    }
    
#smiley{
    background-color:#AADCD2;
    padding:0 0 1%;
    clear:both;
    }
 /*---start footer--*/
 
 .social {
    list-style-type: none;
    text-align:center;
        }

.social li {
    display:inline;
    }
    
.social i {
font-size: 460%;
margin: 1%;
padding: 4%;
color: #008000;
text-align: center;

 }
 
 
.social i:hover {
color:#4c4c4c;
 }
 
footer.second {

    background-color: #abab9a;
    height: 85px;
    text-align: center;
    padding:2%; 
 
    
    
 }
 
 footer.second p {
    text-align: center;

 }






#wrapper {
    max-width: 1200px;
    margin: 0 auto;
}

img {
   display: block;
   max-width: 100%;
   height:auto;
   width:auto;
   margin-bottom: -4px;
    
}
.one-third {
    width: 29%;
    float:left;
    margin:2%;
}

.img:hover {
    opacity: .8;
    
}

@media screen and (max-width:768px) {
 
 .one-third {
    width:48%;
    margin:1%;
 }
    
    
}

@media screen and (max-width:480px) {
    
    
    footer.second {

    background-color: #abab9a;
    height: 115px;
    text-align: center;
    padding:2%; 
 
    
    
 }
 
 .one-third {
    width:98%;
    margin:1%;
 }
   
  
.textbox {
padding-top: 5px;
font-family: font-family: 'Lato', sans-serif;
padding-bottom: 5px;


 
}

h1
{
    padding-top: 750px;
  font-family: font-family: 'Lato', sans-serif;
    font-size:160%;
     font-weight:100;
    padding:4%;
    color: #fff;
    text-align: center;
    line-height: 170%;
   background-color: #0e2601; 
  
    
    
  
}

   
   h2
{
    font-size:140%;
    padding: 2%;
    padding-top: 1px;
    line-height: 125%;
   
}
  h3
{
    font-size: 165%;
    padding: 3%;
      line-height: 160%;
     
}

  h4
{
    font-size: 200%;
    padding: 4%;
    line-height: 160%;
  
   
   
}

p
{
    font-size: 103%;
    padding: 4%;
       
}
header
{
 position: absolute;
    
}
#logo {
    margin: 15px 0 20px -3px;
    background: url(img/bob.png) no-repeat center;

}
#menu-icon {
 display:inline-block;
}

nav ul, nav:active ul {
    display:none;
    z-index:1000;
    position:absolute;
    padding: 20px;
    background:#0e2601; 
    right: 20px;
    top: 68px;
    border: 1px solid #fff;
    border-radius: 2px 0 2px 2px;
    width:50%;
}

nav:hover ul {
    display: block;
}

nav li {
   text-align: center;
   width: 100%;
   padding: 10px 0;
}

.banner {
    padding-top:86px;
    background-color:#fff;
   
}



.one-fourth {
    float:left;
    width:100%;
    }

.one-fourth i {
   font-size: 350%;
   padding: 4% 0 1% 0;
}

article {
    width:100%;

}

aside {
    width: 100%;
}

  .social i {
    font-size: 300%;
margin: 1%;
padding: 5%;
}
 
  h5
{
   color: #fff;
  
    
    

} 
   
   
    
    
}