html, body {
    background:#378BC7;
    font-family:Lato;
    color:black;
    height:100%
}

@font-face {
        font-family: "Lato";
        font-style: normal;
        src: url("/fonts/Lato-Regular.ttf"); /*if IE */
        src: local("akaPosse"), url("/fonts/Lato-Regular.ttf") format("truetype"); /* non-IE */
}

.middle{
    background:#378BC7;
}

::-webkit-inner-spin-button { -webkit-appearance: none;}
::-webkit-outer-spin-button { -webkit-appearance: none;}
input[type=number] {-moz-appearance: textfield;}

.btn-square-lg {
  width: 60px;
  height: 60px;
  border-radius: 50%;          
  border: 1px solid white; 
} 

.btn-square-magn {
  background-color:#ffffff;
  border: 1px solid #e7e7e7;
  text-transform:uppercase;
  width: 40px;
  height: 40px;
  border-radius: 50%;   
  font-weight: bold;       
  font-size:12px
} 

.btn-square-lg:active {
    border-width:2px;
}

.btn-square-md {  
  width: 48px;
  height: 48px;

  border-radius: 5px;  
  border:none;  
} 

.btn-square-sm {            
    border-radius: 5px;          
    border-style:solid;
    border-width:1px;     
    border-bottom-style:solid;    
    border-bottom-width:2px;         
    width: 30px;
    height: 30px;   
}

.btn-square-s {
    border-radius: 5px;          
    border-style:solid;
    border-width:1px;     
    border-bottom-style:solid;    
    border-bottom-width:2px;         
    width: 36px;
    height: 36px;  
}

.btn-blue{
    background-color: #378BC7; 
    border-color: white;  
    border-width:1px;
    color:white;
}
.btn-grey {
    background-color: #555555; 
    border-right-color: #404040;  
    border-bottom-color:#404040;
}
.btn-light-gray{
    font-family:Lato;
    background-color:#eeeeee;
    color:black;
    text-transform:uppercase;
    border: 1px solid #D5D5D5;
}
.btn-yellow {
    background-color: gold; 
    border-right-color: goldenrod;  
    border-bottom-color:goldenrod;
}

.btn-green:hover {
    background-color:#40b16f;
}

.btn-green:active {
    background-color:#1e8549;
    border-color:#1e8549;
    border-width:2px;    
}

.btn-red {      
    background-color: #e74c3c;  
    border-color: #e74c3c;  
    border-bottom-color:#e74c3c;
}

.btn-red:hover {
    background-color:#ea6254;
}

.btn-red:active {
    background-color:#b93d30;
    border-color:#b93d30;
    border-width:2px;
}

.btn-black {    
  background-color: #404040;       
  border-bottom-color:#202020;  
} 

.btn-black:hover  {
    background-color: #575757; 
}

.btn-black:active {
    background-color: #202020;
}

.btn-white {
    background-color:#ffffff;
    border: 1px solid #e7e7e7;
    font-size:20px !important;
    text-transform:uppercase;
}

.btn-white:hover {
    background-color:#ffffff;
    border-color:#e7e7e7;
    border-bottom-color:#d0d0d0;
}
.btn-white:active {    
    border-color:darkgray;
}
.errorBox{
    background:#E84C3D;
    color:white;
    font-family:Lato;
    height:200px;
    width:100%;
    border-bottom:10px solid white;
    vertical-align:central;
}
.row{
    margin-right: 0;
  margin-left: 0;
}
.pi-active{
    background-color:white;width:38px;height:38px;border-radius:50%;color:black;font-weight:bold;vertical-align:middle;font-size:18px;border:1px solid white;margin:0
}
.pi-inactive{
    background-color:#378BC7;width:38px;height:38px;border-radius:50%;color:white;font-weight:bold;vertical-align:middle;font-size:18px;border:1px solid white;margin:0
}

.pi-active-step, .pi-inactive-step{
    text-align:center;font-family:Lato;text-transform:uppercase;font-size:xx-small;color:white;font-weight:bold
}
@media screen (min-height: 640px) and (max-height: 1600px){
 /* some css here */
}  
.klukka, .klukkasmall{
    color:white;
}
.selectedTab {
    
    vertical-align:text-bottom;
    float:none;
	width: 0; 
	height: 0; 
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 8px solid #ffffff;
	font-size: 0;
	line-height: 0;
    margin-top:-22px;
}
.accessButton{
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    cursor:pointer;
    color:black;
    background:white;
    padding-top:7px;
    padding-bottom:10px;
    border-top:1px solid #eeeeee;
    border-right: 2px solid #000000 inset;
    float:left;
    text-align:center;
    font-weight:bold;
    
}