/*-----------------------------------------------------------------------------------*/
    /*	Perusmenot 
/*-----------------------------------------------------------------------------------*/

body {
    background: #fff;
    padding: 0;
	margin: 0em;
	}
 
/*-----------------------------------------------------------------------------------*/
    /*	Etukuva 
/*-----------------------------------------------------------------------------------*/

.esittely {
	height: 100%;
	width:100%;
    overflow:hidden;
	}

.border-musta {
	border-bottom:#fff solid 1px;
	}

.bg-big {
	background: url('images/etukuva.jpg');
    background-size: cover;
	height: 100%;
	width:100%;
    }
	
.bg-big2 {
	background: url('images/etu-tausta2.jpg');
    background-size: cover;
	height: 100%;
	width:100%;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-animation: leaves 40s ease-in-out infinite alternate;
    animation: leaves 40s ease-in-out infinite alternate;
	}
	
.slogan {
    position:absolute;
	top: 25%;
    right: 0%;
    bottom: 0%;
    left: 0%;
    margin: auto;
    max-width: 100%;
	}
	
.slogan img {
	display:block;
	margin:0 auto;
	max-width:100%;
	padding-bottom:20px;
	}


.esittely h1 {
	font-family: 'Sunflower', sans-serif;
	text-transform:uppercase;
	font-size:4em;
	font-weight:100;
	line-height:1;
	padding-bottom:20px;
	text-align:center;
	color:#fff;
	text-shadow: 1px 1px #000;
	}
	
.esittely p {
	font-family: 'Barlow Condensed', sans-serif;
	text-align:center;
	font-weight: 600;
	font-size:2em;
	line-height:1;
	padding:10px;
	margin-top:20px;
	text-shadow: 1px 1px #000;
	}
	
.line {
	width:25%;
	color:#fff;
	}

.slogan img {
	display: block;
	margin: auto;
	max-width: 100%;
	}

.nappi {
    position: relative;
    display: inline-block;
    color: #FFF !important;
    text-decoration: none;
	text-align:center;
    padding: 1.2em 2.5em;
    background-color: #E2930B;
    cursor: pointer;
    transition: background-color 0.35s ease-in-out 0s;
	margin-top:5px;
	max-width:100%;
	font-family: 'Rajdhani', sans-serif;
    font-weight: 100;
	font-size:1.5em;
	}

.nappi:hover {
    text-decoration:underline;
	background-color: #EF9D0D;
	}


.link A:link {background-color:#437689;padding:15px;color:#fff;text-decoration:none;}
.link A:visited {background-color:#437689;padding:15px;color:#fff;text-decoration:none;}
.link A:active {background-color:#437689;padding:15px;color:#fff;text-decoration:none;}
.link A:hover {background-color:#437689;padding:15px;color:#fff;text-decoration:underline;}

.link2 A:link {color:#000;text-decoration:none;}
.link2 A:visited {color:#000;text-decoration:none;}
.link2 A:active {color:#000;text-decoration:none;}
.link2 A:hover {color:#000;text-decoration:underline;}

.linkki A:link {color:#fff;text-decoration:none;}
.linkki A:visited {color:#fff;text-decoration:none;}
.linkki A:active {color:#fff;text-decoration:none;}
.linkki A:hover {color:#fff;text-decoration:underline;}

.merkki{
	background-image: url("images/mobiili.png");
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 50px; 
	padding-top:10px;
	height:45px;
	display:block;
	}

.top {
	padding-top:55px;
	}

/*-----------------------------------------------------------------------------------*/
    /*	Palvelut
/*-----------------------------------------------------------------------------------*/

.palvelut {	
	padding:130px 0px;
	background: #fff;
	text-align:left;
	}
	
.palvelut img {
	max-width:100%;
	margin:0 auto;
	display:block;
	}

.palvelut h1 {
	font-family: 'Sunflower', sans-serif;
    font-weight: 100;
	font-size:3em;
	line-height:1.3;
	color:#383838;
	padding-left:55px;
	padding-bottom:10px;
	}
	
.palvelut h2{
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:2.2em;
	line-height:1.3;
	color:#8CC63F;
	padding-top:0px;
	padding-bottom:25px;
	padding-left:55px;
	}
	
	
.palvelut p {
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:1.3em;
	line-height:1.2;
	color:#383838;
	padding-top:10px;
	margin-bottom:10px;
	padding-left:55px;
	}

	
.link3 A:link {color:#000;text-decoration:none;}
.link3 A:visited {color:#000;text-decoration:none;}
.link3 A:active {color:#000;text-decoration:none;}
.link3 A:hover {color:#000;text-decoration:underline;}

/*-----------------------------------------------------------------------------------*/
    /*	valikuva1
/*-----------------------------------------------------------------------------------*/

.valikuva1 h1 {
	font-family: 'Sunflower', sans-serif;
	font-size:3em;
	font-weight:100;
	line-height:1;
	text-align:left;
	padding-top:200px;
	padding-left:100px;
	color:#fff;
	text-transform:uppercase;
	margin-bottom:20px;
	}
	
.valikuva1 p {
	font-family: 'Barlow Condensed', sans-serif;
	font-size:2em;
	font-weight:100;
	line-height:1.5;
	text-align:left;
	padding-top:10px;
	padding-left:100px;
	}
	
.margbot {
	margin-bottom:40px;
	}
	
.pihatausta {
	font-family: 'Barlow Condensed', sans-serif;
	font-size:1em;
	color:#fff;
	background-color:#8CC63F;
	padding:20px;
	border-radius:10px;
	}
	
.pihatausta:hover {
	background-color:#72AA27;
	cursor:pointer;
	}

/*-----------------------------------------------------------------------------------*/
    /*	valikuva2
/*-----------------------------------------------------------------------------------*/

.valikuva2 h1 {
	font-family: 'Sunflower', sans-serif;
	font-size:3em;
	font-weight:100;
	line-height:1;
	text-align:center;
	padding-top:200px;
	color:#fff;
	text-transform:uppercase;
	text-decoration:underline;
	margin-bottom:20px;
	}
	
.valikuva2 p {
	font-family: 'Barlow Condensed', sans-serif;
	font-size:2.5em;
	font-weight:100;
	line-height:1.5;
	text-align:center;
	padding-top:10px;
	}
	
/*-----------------------------------------------------------------------------------*/
    /*	palvelukuvaukset
/*-----------------------------------------------------------------------------------*/

.palvelukuvaukset {	
	padding:130px 20px;
	background: #F8F8F8;
	text-align:left;
	border-bottom:1px solid #E4E4E4;
	}
	
.palvelukuvaukset img {
	max-width:100%;
	margin:0 auto;
	display:block;
	padding-bottom:20px;
	}

.palvelukuvaukset h1 {
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:2.5em;
	line-height:1.3;
	color:#fff;
	background-color:#8CC63F;
	padding-top:20px;
	padding-bottom:25px;
	text-align:center;
	}
	
.palvelukuvaukset p{
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:1.2em;
	line-height:1.5;
	color:#4E4E4E;
	padding:10px;
	
	}

.bottommarg50 {
	padding-bottom:25px;
	}
	
.sisalto {
	background-color:#fff; 
	border:1px solid #E4E4E4;
	border-radius:10px;
}

/*-----------------------------------------------------------------------------------*/
    /*	Galleria
/*-----------------------------------------------------------------------------------*/

.galleria {
	padding:80px 10px;
	max-width: 100% !important;
	background-color:#fff;
	}
	
.galleria h1 {
	font-family: 'Barlow Condensed', sans-serif;
	text-transform:uppercase;
	text-align:center;
	font-size:3.5em;
	font-weight:100;
	line-height:1;
	padding-bottom:25px;
	padding-top:5px;
	color:#000;
	}


.popup-gallery { width: 100%; overflow: hidden; margin-top:40px;}
.popup-gallery a { float: left; display: inline; width: 25%; display: block;}
.popup-gallery img { width: 100%; max-width: 100%; height: auto; padding:5px;} 
.popup-gallery a:hover img { opacity:.8; filter:alpha(opacity=30);} 

/*-----------------------------------------------------------------------------------*/
    /*	Footer
/*-----------------------------------------------------------------------------------*/

.footer {
	padding:100px 30px;
	margin:0em;
	background-color:#F8F8F8; 
	border-top:1px solid #E4E4E4;
    text-align:left;
	}

.footer h1 {
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:2em;
	line-height:1;
	padding-bottom:30px;
	color:#000;
	
	}
	
.footer h2 {
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:1.5em;
	line-height:1;
	padding-bottom:30px;
	color:#000;
	}
	
.footer p {
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:1.2em;
	line-height:1.3;
	color:#4E4E4E;
	}
	
.bg-footer {
	background-color:#383838;
	color:#fff;
	padding:40px;
	text-align:center;
	}
	
.top50 {
	margin-top:40px;
	}

/*-----------------------------------------------------------------------------------*/
    /*	copyright
/*-----------------------------------------------------------------------------------*/

.copyright {
	padding:20px 0 ;
	background-color:#fff;
	margin:1em;
	border-top:1px solid #E4E4E4;
	text-align:center;
	}

.copyright p {
	font-family: 'Barlow Condensed', sans-serif;
    font-weight: 100;
	font-size:1.3em;
	line-height:1;
	padding:20px;
	color:#000;
	}

/*-----------------------------------------------------------------------------------*/
    /*	Scrolli 
/*-----------------------------------------------------------------------------------*/
   
 .ylos {
    width: 45px;
    height: 45px;
    position: fixed;
    bottom: 10px;
    right: 20px;
    display: none;
    text-indent: -9999px;
    background: url('images/up.png') no-repeat;
    }

#contact-form {
	padding:25px;
	border:1px solid #E4E4E4;
	}

#contact-form label span {
	cursor:pointer;
	color:#4E4E4E;
	display:block;
	margin:5px 0;
	font-weight:100;
	font-family: 'Barlow Condensed', sans-serif;
	font-size:1.4em;
	line-height:1;
	padding-bottom:5px;
	}
	
#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form input[type="tel"],
#contact-form input[type="url"],
#contact-form textarea {
	width:100%;
	box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-webkit-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-moz-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	border:1px solid #CCC;
	background:#FFF;
	margin:0 0 5px;
	padding:10px;
	
}
#contact-form input[type="text"]:hover,
#contact-form input[type="email"]:hover,
#contact-form input[type="tel"]:hover,
#contact-form input[type="url"]:hover,
#contact-form textarea:hover {
	-webkit-transition:border-color 0.3s ease-in-out;
	-moz-transition:border-color 0.3s ease-in-out;
	transition:border-color 0.3s ease-in-out;
	border:1px solid #AAA;
	}

#contact-form textarea {
	height:100px;
	max-width:100%;
	}

#contact-form button[type="submit"] {
	cursor:pointer;
	width:100%;
	border:none;
	background:#8CC63F;
	color:#FFF;
	margin-top:20px;
	padding:20px;
	font-size:1.3em;
	font-family: 'Barlow Condensed', sans-serif;
	}

#contact-form button[type="submit"]:hover {
	background:#72AB26;
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
}
#contact-form button[type="submit"]:active {
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}
#contact-form input:focus,
#contact-form textarea:focus {
	outline:0;
	border:1px solid #999;
}
::-webkit-input-placeholder {
    color:#888;
}
:-moz-placeholder {
    color:#888;
}
::-moz-placeholder {
    color:#888;
}
:-ms-input-placeholder {
    color:#888;
}

input.check { display: none; }	

/*-----------------------------------------------------------------------------------*/
    /*	mobiili + tablet menot
/*-----------------------------------------------------------------------------------*/

@media only screen and (max-width: 1280px)  {
	
	.kalusto h1 {
	font-size:1.8em;
	}
	
}
@media only screen and (max-width: 1024px)  {
	
	.palvelut h1 {
	font-size:2.5em;
	}
	
	.palvelut p {
	font-size:1.3em;
	}
	
	.valikuva1 h1, .valikuva2 h1 {
		font-size:3.5em;
	}
	
	.kuljetuspalvelut  {
	padding:100px 15px;
	}
	
	.kalusto {
	padding:100px 5px;
	}
	
	.kalusto h1 {
	font-size:1.5em;
	}
	
	.kalusto p {
	font-size:1.2em;
	}
	
}


@media only screen and (max-width: 480px)  {

.logo {
	width:200px;
	}
	
.slogan {
    top: 15%;
    }
	
.slogan img {
    padding-bottom: 0px;
    }

.esittely h1{
	font-size:2em;
	padding-bottom:0px;
	}
	
.esittely p{
	font-size:1.5em;
	padding-top:10px;
	}
	
.palvelut  {
	padding:50px 10px;
	text-align:center;
	}
	
.palvelut h1 {
	font-size:1.5em;
	padding-left:0px;
	}
	
.palvelut h2{
	font-size:1.3em;
	padding-left:0px;
	}
	
.palvelut p {
	font-size:1em;
	color:#000;
	padding-left:0px;
	}

.valikuva1 h1 {
	font-size:2em;
	padding-left:10px;
	}
	
.valikuva1 p {
	font-size:1.3em;
	padding-left:10px;
	}
	
.palvelukuvaukset  {
	padding:50px 20px;
	}
	
.palvelukuvaukset h1  {
	font-size:1.5em;
	}
	
.valikuva2 h1{
	font-size:3.5em;
	padding-left:10px;
	}
	
.valikuva2 p {
	font-size:1.3em;
	padding-left:10px;
	}
	
.footer  {
	text-align:center;
	}
	
.footer h1 {
	padding-top:30px;
	}

.footer {
	margin:0;
	padding:0;
	}

.footer p {
	font-size:1.1em;
	}
	
.bottom-footer p{
	font-size:0.8em;
	}
	
.logo p {
	font-size:0.6em;
	padding: 0px 0px;
	color:#fff;
	font-family: 'Rajdhani', sans-serif;
	}

.nav-toggle:before {
  color: #fff; 
  font: normal 28px/55px "responsivenav"; 
  text-transform: none;
  text-align: center;
  position: absolute;
  content: "\2261"; 
  text-indent: 0;
  speak: none;
  width: 100%;
  left: 0;
  top: 0px;
}


}