@charset "utf-8";
/* CSS Document */


.varor_menu{
width:172px;
float:left;
height: 100%;

}


.varor_so{
width:100%;
float:left;
height: 400px;
    text-align: center;
    
    font-size: 16px;

}

.varor_right{ 
 margin-left: 172px;
 height: 100%;
}


.varor_upp{ 
	float: left;
    width: 100%;
    margin-bottom: 10px;
    border-top: #dddddd 0px solid;
    padding-top: 5px;
	
}


.varor_uppA{ 
	float: left;
    margin-left: 10px;
    
}

.varor_uppB{ 
	float: right;
    margin-left: 5px;
    text-align: right;
    
}


.varor_downB{ 
	float: right;
    margin-left: 5px;
    text-align: right;
    margin-top: 20px;
    margin-bottom: 20px;
    
}


.varor_uppB1{ 
	float: right;
    margin-left: 10px;
    text-align: right;
    
    
}

.varor_uppB2{ 
	float: right;
    margin-left: 0px;
    text-align: right;
   
    
}


.varor_mpic{ color: #666666;}

.varor_mpic2{
 color: #f45294;
}


.varasse2{
float:right;
}

.varasse2a{
float:left;
margin-right:0px;
font-family: 'OpenSans', sans-serif;
}
.varasse2b{
float:left;
margin-right:0px;
font-size: 14px;
}


.varasse2c{color:#64CBF6;
	
	font-size: 20px;
}

.varor_rubrik{
	width: 100%;
float:left;
margin-right:0px;
font-size: 32px;
text-align: center;
    margin-bottom: 15px;
}

h1.varor_rub{
    margin: 0;
    padding: 0;
    font-size: 28px;
    font-weight: normal;
}


.varor_saldos1w{
    width: 140px;
    margin: 0;
    padding: 0;
    font-size: 32px;
    font-weight: 600;
    color: red;
    
    border: 0;
   position: relative;
    top: -30px;
    left: 530px;
    border: 2px solid red;
   
    margin-bottom: -20px;

    
    
        -ms-transform: rotate(12deg); /* IE 9 */
    -webkit-transform: rotate(20deg); /* Chrome, Safari, Opera */
    transform: rotate(12deg);
 
}



.varor_varor{
	width: 100%;
float:left;
}

.varor_vara{
	width: 33%;
float: left;
margin-left: 0px;
margin-bottom: 10px;
    border: #dddddd 0px solid;
    position: relative;
    display:inline-block;
    z-index: 0;
}


.varor_overlayer_rea { 
     position:absolute;right:10px;top:0;
    
  border-radius: 50%;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */

    width: 36px;
    height: 32px;
    padding-bottom: 0px;
    padding-left:3px;
    padding-right:3px;
    padding-top: 10px;
    margin-top: 5px;
    
    background: red;
    
    color: #fff;
    text-align: center;
    
    
    font-family: 'OpenSans', sans-serif;
    font-weight:bold;
    font-size:15px;
}

.varor_overlayer_black { 
     position:absolute;right:0px;bottom:0;
    
       width: 100px;
    height: 80px;
}



.varor_overlayer {  
	    display:none;
	    width:100%;height:100%; 
	    -webkit-transition: all 0.3s ease-in-out;
	    -moz-transition: all 0.3s ease-in-out;
	    -o-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	    transition: all 0.3s ease-in-out;
          border-left:1px solid #cccccc;
    border-right:1px solid #cccccc;
    border-top:1px solid #cccccc;
	    
        position:relative;
        
        top:-413px;
        left:-64px;
    position:absolute;left:-60px;top:0;
    
    padding-right: 60px;
   
    
	}


.varor_overlayerB {  
	    display:none;
	    width:100%;height:80px; 
	    -webkit-transition: all 0.3s ease-in-out;
	    -moz-transition: all 0.3s ease-in-out;
	    -o-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	    transition: all 0.3s ease-in-out;
          border-bottom:1px solid #cccccc;
	           border-left:1px solid #cccccc;
    border-right:1px solid #cccccc;
        position:relative;
        
        top:-413px;
        left:-64px;
    
    
    left:-60px;
   
    
    padding-right: 60px;
    top: 0px;
    margin-bottom: -80px;
    position: absolute; z-index: 60;
	}




.varor_vara_img{
    
    width: 100%;
    height: auto;
    
    
}





.varor_vara:hover .varor_overlayer {
	    
        display:block;
	}


.varor_vara:hover .varor_overlayerB {
	    
        display:block;
	}

.varor_vara1{
	width: 98%;
	height: auto;
position: relative;
    display:inline-block;
    

}

.varor_rosa{
  color: #f45294;  
    font-size: 12px;
}


.varor_sor{
float: left;
    height: 25px;
    width: 100%;
}
.varor_sor1{
float: left;
    width: 25px;
    text-align: center;
    color: #f45294; 
    height: 25px;
    line-height: 25px;
}

.varor_sor2{
float: left;
    height: 25px;
    line-height: 25px;
  
}
.varor_vara2{width: 98%;float:left; margin-bottom: 5px; font-size: 15px; margin-top: 0px;
    padding-top: 5px;


position: relative;
    display:inline-block;


}




.varor_vara3{width: 100%;float:left;margin-bottom: 10px; font-size: 15px; color: #f45294; font-weight: 600; margin-left: 3px; }

.varor_boxes{	width: 100%;float:left; margin-bottom: 15px;}


.varor_cbr{	width: 100%;float:left; margin-top: 10px; margin-bottom: 10px;}

.varor_cba{float:left; margin-left: 7px;	padding: 4px; border: 1px #dddddd solid; margin-bottom: 7px;}

.varor_cba2{float:left; 
margin-top: 10px;
margin-left: 7px;
padding: 5px; 
border: 1px #dddddd solid;
	
	min-width: 22px;
	text-align: center;
	
}

.varor_cba2:hover{
	border-color: #f45294;
	color: #f45294;
 -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
}



.varor_cb{	width: 20px; height: 20px; float:left; }


.varor_cb2{	float:left; }

.varor_cbc{	width: 120px; height: 1px; float:left; background-color: #ffffff;

	position: absolute;
    top: -1px;
}


.varor_dm1{padding-bottom: 4px; padding-top: 4px; cursor: pointer; border: 1px #dddddd solid; width: 120px;
text-align: center;}

.varor_dm1:hover{
	border-color: #f45294;
	color: #f45294;
	
	
		  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
}

.varor_dm2{z-index: 4; cursor: pointer; border-left: 1px #ffffff solid; border-right: 1px #ffffff solid; width: 120px; height: 10px;}



.onclick-menu {
    position: relative;
    display: inline-block;
    margin-left: 10px;
    
    
}
.onclick-menu:before {
    
}
.onclick-menu:focus {
    /* clicking on label should toggle the menu */
    pointer-events: none;
    outline:none;
    }

.onclick-menu:focus .varor_dm2 {
	border-left: 1px #dddddd solid; border-right: 1px #dddddd solid;

}

.onclick-menu:focus .varor_dm1 {
	border-bottom: 1px #ffffff solid; 

}


.onclick-menu:focus .onclick-menu-content {
    /*  opacity is 1 in opened state (see below) */
    opacity: 1;
    visibility: visible;

    /* don't let pointer-events affect descendant elements */
    pointer-events: auto;
}
.onclick-menu-content {
	outline:none;
    position: absolute;
    top: 40px;
    z-index: 1;
    background-color: #ffffff;
    border: 1px #dddddd solid;
    width: 180px;

    /* use opacity to fake immediate toggle */
    opacity: 0;
    visibility: hidden;
    transition: visibility 0.5s;
}






.overik{
    display: inline-block;
    position:absolute;
    width: 100%;
    background-color: aqua;
    height: 50%;
    
    left:0;
    top:0;
    z-index: 10;
    margin-left: 30px;
    position: relative;
}
	


	.ov1 { 
float:left;
width:60px;
background-color:#ffffff;
height: 100%;
}
.ov2 { 
float:left;
width:205px;


}

.ov2a { 
float:left;
width:205px;
width: 100%;
height: 315px;
}




.ov2b { 
float:left;
width:100%;
height: 44px;
}

.ov2c { 
float:left;
width:100%;
background-color:#ffffff;
font-family: 'Open Sans', sans-serif;
font-size:13px;
color: #a3a4a7;
}

.ov2d { 
float:left;
width:100%;
background-color:transparent;
    font-size: 11px;

height: 16px;

}


.ov1_bild { 
	
	float:left;
width:60px;

padding-top:5px;
text-align:center;



-webkit-user-select: none;  /* Chrome all / Safari all */
-moz-user-select: none;     /* Firefox all */
-ms-user-select: none;      /* IE 10+ */
-o-user-select: none;
user-select: none;


	    
	}

	
	a.fill-div {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;
}











 @media only screen and (max-width: 1028px){
 .varor_menu{
 	display: none;
 	width: 0px;
 	height: 0px;
 }	
 .varor_right{
 	margin-left: 0px;
 	width: 100%;
 }
 
 
 }


  /* Small devices (phones) */

       @media screen and (max-width: 767px){
.varor_vara{
	width: 50%;

 }
           
           
           .varor_vara:hover .varor_overlayer {
	    
        display:none;
	}


.varor_vara:hover .varor_overlayerB {
	    
        display:none;
	}
           
           
}



