html, body{
	
overflow-x: hidden;
	
	
}

.responsive-menu-pro-item-link{
	padding-top:inherit!important;
	padding-bottom:inherit!important;
}

.pattern{
	
background-color: rgba(21, 80, 174, 0);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='0 0 4 4'%3E%3Cpath fill='%2300b7ff' fill-opacity='0.2' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");

}



#logo{
	
	position:relative;
}


#logo img{
	width:128px;
}

#responsive-menu-pro-button, .responsive-menu-pro-inner, 
.responsive-menu-pro-inner::before, 
.responsive-menu-pro-inner::after {
   border-radius: 0!important;
}


.main-image{
/*background-image:url('../images/paakuva-yritys.jpg')!important;*/

background-repeat:no-repeat;
background-size:cover;
height:53vh;
min-height:400px;
max-height:550px;
position:relative;
}

.home .main-image{
	height:90vh;
}


.overlay{
	
box-shadow: inset 0px 0px 0px 1000px rgba(0, 99, 255, 0.36);

color:#ffffff;

}









#korostuspalkki{
	position:relative;

background-repeat:no-repeat;
background-size:cover;
background-position: center center;
padding-top:6em;
padding-bottom:6em;
}

#main-image-text{
	
	max-width:700px;
	animation: drop 1.5s ease-in-out;
}


@keyframes drop {
  0%   { top: 49%;
	  opacity:0;
	   }
  100% { top: 56%;
	  opacity:1;
	  }

}


 .center-vertical{
	
top: 56%;

}

.referenssi{
padding-top:5em;
padding-bottom:7em;
	

background-repeat:no-repeat;
background-size:cover;
background-position: center center;
position:relative;
}



.nosto{

background-repeat:no-repeat;
background-position: center center;
height:255px;

}


.nosto-sisalto, .yritys, .box-shadow{
	box-shadow: 2px 2px 17px rgba(11, 33, 67, 0.12);

}


.nosto-sisalto{
	background-color:#1550ae;
		position:relative;
margin-left:1.5em;
margin-right:1.5em;
margin-top:-128px;
margin-bottom:2em;
position:relative;
color:#ffffff;

	}

.nosto-container:last-child div{
	margin-bottom:0;
}


.button, .wpcf7-submit{
	
	transition: all .3s ease-in-out;
	 will-change: transform;
	 

}




.yritys{
	padding-top:3em;
	padding-bottom:4em;
	position:relative;


	
}


hr{
	background-color: #ecf4ff;
}








footer ul li, footer p {
	
	font-size:1rem;
	
}




	
	.button, .wpcf7-submit {
	text-decoration: none;
	padding: 0.75em;
	width:100%;
	max-width: 240px;
	font-size:16px;
	display:block;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-align:center;
	border-radius:4px!important;
	color:#ffffff!important;
}
	

 .button:hover, .wpcf7-submit:hover
{
	transform: scale(1.02); 

	
}




.button:hover{
	box-shadow: 2px 2px 17px rgba(11, 33, 67, 0.13);

}

	

.button-blue, .button-blue:visited, .button-blue:active, .button-blue:hover{
	background-color:#1550ae;
	background-image: linear-gradient(#0a4fbd 0%, #1550ae);

}




 .button-cyan, .button-cyan:visited, .button-cyan:active, .button-cyan:hover{
	background-color:#00b4ff;
		background-image: linear-gradient(#1dbbff 0%, #00b4ff);


}









 .wpcf7-submit {
	display: block;
	text-decoration: none;
	padding: 1.1em!important;
	font-size:18px!important;
	width: 100%;
	color: #ffffff!important;
	text-align: center;
	border:0!important;
	cursor:pointer!important;
	font-weight:700!important;
	text-transform: uppercase;
	background-color:#00c8ff!important;
	background-image: linear-gradient(#00c8ff 0%, #00bbef 100%)!important;

}


.button-large {
	
	padding: 1.075em;
	max-width:260px;
	font-size:18px;
	

}

label {
	
	display: block;
	margin-bottom: 0.25em;
	cursor: pointer;	
	font-size:0.95rem;
	text-align:left;
	font-weight:700;
	
}

input[type="text"], input[type="email"], input[type="tel"], textarea{
	font-size: 1rem;
	padding: 1em;
	width: 100%;
	-webkit-appearance: none;
	border:0;
	border-radius: 0;
	margin-bottom:-1em;
	color:#212d48;
}


textarea{
	
	 overflow: auto;
	 max-height:100px;	
	
}






.blue-bg{
	
	background-color:#1550ae;
	color:#ffffff;
}


.blue-light-bg{
	
	background-color: #ecf4ff;

}



.dark-bg{
	background-color: #212d48;
		background-color: #212d48;

	color:#ffffff;
}



.white-bg{
	
	background-color:#ffffff;
}



.kuvake{
	padding-left: 1.3em;
	background-repeat:no-repeat;
	background-position:left center;
	margin-bottom:1.25em;
	margin-right:0.5em;
	display:inline-block;
	font-size:1.075rem;
	font-weight:600;
	

}

.videonosto{
	margin-top:7.5em;
}

#tiedot .kuvake{

margin-right:0;
margin-bottom:0;
display:inline;


}

.sijainti{

	background-image: url('../images/sijainti.svg');
	background-size: 16px 20px;
	
	
}



.toimiala{

	background-image: url('../images/toimiala.svg');
	background-size: 16px 20px;
	
	
}


.liikevaihto{

	background-image: url('../images/liikevaihto.svg');
	background-size: 16px 20px;
	
	
}



.toimitila{

	background-image: url('../images/toimitilat.svg');
	background-size: 16px 16px;
	
	
}


.henkilokunta{

	background-image: url('../images/henkilokunta.svg');
	background-size: 16px 20px;
	
	
}




table th{
	text-align: left;
	padding-left:0.35em;
	padding-top:0.35em;
	padding-bottom:0.35em;
	padding-right:1.25em;
}


.tab-container {
  overflow: visible;
}

.tab-container [role=tablist] {
  display: flex;
  
}

.tab-container [role=tab] {
  position: relative;
  list-style: none;
  text-align: left;
  font-weight:700;
  cursor: pointer;
  flex-grow: 1;
  padding-bottom:1em;
  font-size:1.1rem;


 transition:all .3s ease-in-out;
  margin-top:1.2em;
  color:#1550ae;

}


.henkilokuva img{
	border-radius:50%;
	width:120px;
	height:120px;
	margin-bottom:0.5em;
	margin-left:auto;
	margin-right:auto;
}



.henkilolisays .yhteystiedot p{
	background-image: url('../images/puhelin.svg');
	background-repeat:no-repeat;
	background-position:left center;
	padding-left:1.75em;
	background-size: 20px 20px;
	display: inline-block;
}



.tab-container [role=tab]:hover, .tab-container [role=tab][aria-selected=true] {


color:#1550ae;
}





.tab-container [role=tab]::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 3px;
background-color:#d2e3ff;
transition: all .3s ease-in-out;
  left: 0;
  bottom: 0;
  
}



.tab-container [role=tab][aria-selected=true]::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 3px;
  background: #245199;

  left: 0;
  bottom: 0;
}



.tab-container [role=tab]:hover::after {

  background: #245199;

}



.tab-container main {
  
  position: relative;
  margin-top:2.5em;
}

.tab-container main [role=tabpanel] {
  display: none;
}

.tab-container main [role=tabpanel][aria-expanded=true] {
  display: block;
}


#yhteydenottopyynto{
	display:none;
}


#intro{
	padding-top:3em;
	padding-bottom:3em;
}

.home #intro{
	padding-bottom:4em;
}



#fb img {
width:22px;
}

#yhteydenottokehote{
	
	text-align: center;
}

#yhteydenottokehote .button{
	
	margin-left:auto;
	margin-right:auto;
}



.ylos{
	margin-top:-40px;
}



.alas{
	margin-bottom:-40px;
}

p a, p a:visited, p a:active, p a:hover, #post-navigation a, #post-navigation a:visited, #post-navigation a:hover{
	display: inline-block;
	position: relative; 
	text-decoration:none;
	color:#212d48;
	font-weight:600;
}


p a:after, #post-navigation a:after {    
background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 2px;
  left: 50%;
  position: absolute;
  background: #212d48;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;

}


p a:hover:after, #post-navigation a:hover:after { 
  width: 100%; 
  left: 0; 
}



#korostuspalkki-teksti p a, #korostuspalkki-teksti p a:visited{
	color:#ffffff;
}


.dark-bg p a:after, #post-navigation a:after, #korostuspalkki-teksti p a:after{
  background: #ffffff;
}


#fb p:last-of-type a:after{
	background:none;
}


#syvl-logo{
	width:148px!important;
	margin-top:0.5em;
}



@media all and (min-width: 1023px) {



.ylos2{
	margin-top:-80px;
}







#yhteydenottokehote{
	text-align: left;
}
 




#intro{
	padding-top:4em;
	padding-bottom:4em;
}

.home #intro{
	padding-bottom:6em;
}







.header {
        width: 100%;
        position: fixed;
        right: 0;
        top: 0;
        transition: .3s;
        z-index: 9999;

    }
 
  .header.tiny {
        z-index: 9999;
        box-shadow: 5px 2px 7px 3px rgba(0, 0, 0, .075);
        background:  rgba(255, 255, 255, 1);

    }
 
 .header.tiny #navigointi a{
	      	color:#212d48;

 }

#logo img{
	width:140px;
		margin-bottom:-17px;

	
}

#navigointi{

margin-top:1.95em;
}





#navigointi ul{
	float:right;
	
}

#navigointi ul li{
		padding-bottom:0!important;
	}

#navigointi li{
	text-align:left;
	padding-left:0;
	padding-right:0;
	display: table-cell; 
	position: relative; 
	
	
}



#navigointi li a{
	padding-left:0!important;
	padding-right:0!important;
	margin-right:0.8em;
	 display: inline-block;
  position: relative;
letter-spacing: 0px!important;
	
}

#navigointi li a:after {    
  background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 2px;
  left: 50%;
  position: absolute;
  background: #ffffff;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
}


 




#navigointi li a:hover:after { 
  width: 100%; 
  left: 0; 
}



.header.tiny #navigointi li a:after{
	
	background:#212d48;
	
}


#navigointi li li a{
	padding-left:1em!important;
	padding-right:1em!important;

	}

#navigointi li li a:after{
	
	  background: none!important;

}

#navigointi .current-menu-item a{
	
	border-bottom: solid 2px #ffffff;
}


#navigointi .current-menu-item li a{
	border:0!important;
}


.header.tiny #navigointi .current-menu-item a, .header.tiny #navigointi .responsive-menu-pro-current-item a{
	
	border-bottom-color: #212d48;
}




.header.tiny #navigointi li li a{
	color:#ffffff;
}







#navigointi ul li ul .responsive-menu-pro-current-item a{
color:#1550ae;
background-color:#d2e3ff;
border:0;


}




 .yritys .button{

max-width:160px;

}







.tab-container [role=tab] {
  
  font-size:1.2rem;
 
  
}








.yritys{
	padding-bottom:2em;
}


.referenssi{
padding-top:5em;
padding-bottom:5em;
	
	


}






.home .main-image{
	height:100vh;
	max-height:800px;


}



 #yhteydenottopyynto{
	margin-top:1.4em;
	display:inherit;
	
}


#fb{
	text-align: right;
}


#fb img{
	float:right;
	margin-top:0.25em;
}


.nosto-sisalto{
	
min-height:340px;

}


}

@media all and (min-width: 1200px) {
	

#navigointi li a{
	
	margin-right:1.2em!important;
	
letter-spacing: 1px!important;
	
}





.main-image{
height: 65vh;
}

.home .main-image{
	max-height:860px;


}



.button, .wpcf7-submit {
		max-width: 220px;
	}

.button-large {
	
		max-width:290px;
	

}

.nosto-sisalto, .nosto-container div{
	margin-bottom:0;


	}




}
	
	
	
@media all and (min-width: 1400px) {
	


.nosto-sisalto{
	
min-height:auto;

	}



}
	

