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

:root {
--primary: #fff;
--secondary: #fff;
--lightshadow: 0px 0px 8px 2px rgba(0,0,0,0.1);
--heavyshadow: 0px 0px 50px -10px rgba(1,10,18,0.90); 

--loginshadow: 0px 0px 4px 2px rgba(255,255,255,0.9);  
--loginborder: #D3D3D3;
    
--loginshadow-focus: 0px 0px 4px 2px rgba(124,190,235,0.50);  
--loginborder-focus: rgba(124,190,235,0.50);  
    
--loginbg: #ddd;
--loginbg-hover: #eee;
--loginbg-focus: #fff;
    
--light:#f2f2f2;
--light2:#E1E1E1;
--light3:#C6C6C6; 
    
    
--dark:#0a0a0a;
--dark1:#19191a;
--dark2:#2a2a2a;
--dark3:#363636;
--dark4:#515151;
--dark5:#605e5e;
--dark6:#938a87;
--dark7:#A19996;
--dark8:#B0A9A7;

--input-border: #CDCDCD;   
--table-border: #848484; 
    
--icon-dark:#F77719;
--heading-color:#FFAE6C;
    
  
--tehoste-orange: #ff6600;
--tehoste-orange-secondary: #ff9220; 
--teho: #FF0072;
--avatar-border: #ff7200;    
    
  --radius-none: 0px;
  --radius-xs: 2px;
  --radius-s: 4px;
  --radius-m: 8px;
  --radius-l: 12px;
  --radius-xl: 18px;
  --radius-xxl: 28px;
  --radius-full: 9999px;
}

.glassbox {
    display:block;
    box-sizing: border-box;
    width:100%;
    padding:20px;
    position:relative; 
    z-index: 2;
}

.glassbox .border-bottom {border-bottom:1px solid rgba(255, 255, 255, 0.22) !important}

.bg-glass-white {
/* From https://css.glass */
background: rgba(255, 255, 255, 0.1);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(8.6px);
-webkit-backdrop-filter: blur(8.6px);
border: 1px solid rgba(255, 255, 255, 0.37);    
}


.glass {background: rgba(15,32,33,0.18);
backdrop-filter: blur(12px) saturate(145%);
-webkit-backdrop-filter: blur(12px) saturate(185%);
border: 1px solid rgba(255, 255, 255, 0.22);
border-radius: var(--radius-xl);
box-shadow: 0 2px 18px -5px rgba(0, 0, 0, 0.75);
}

.glass-thin {
  background: rgba(15,32,33,0.10) !important;
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 15px -5px rgba(0, 0, 0, 0.1);
}



.bg000 {background:  var(--dark) !important;}
.bg111 {background:  var(--dark) !important;}
.bg19, .bg222 {background:  var(--dark1) !important;}
.bg333 {background:  var(--dark3) !important;}

.main {background: var(--dark) !important;}

.perusbox {border-radius:var(--radius-xl) !important;}
.newlivethumb {border-radius:var(--radius-l) !important;}
.grid-item img {border-radius:var(--radius-l) !important; overflow: hidden !important;}
.tube69 .inner {border-radius:var(--radius-l) !important; overflow: hidden !important;}
.kuvathumbcontainer {border-radius:var(--radius-l) !important; overflow: hidden !important;}

.previewkuva {border-radius:var(--radius-l) !important; overflow: hidden !important;}

.kateholder {border-radius:var(--radius-m) !important; box-shadow: var(--heavyshadow);}
.sedbox {border-radius:var(--radius-l) !important; box-shadow: var(--heavyshadow);}

.oholder span {border-radius:var(--radius-m) !important;}
.newholder .online, .newholder .kuuma, .newholder .uusi {border-radius:var(--radius-m) !important;}

.txt_orange {color: var(--tehoste-orange) !important}
.button_lomake {display: inline !important; border-radius: var(--radius-m); background: var(--tehoste-orange); line-height: 20px}
.button_lomake:hover, .button_lomake:active, .button_lomake:focus {background: var(--tehoste-orange-secondary);}
.login.round2, .login_pwd.round2 {border-radius:var(--radius-m) !important;}
.nappi-punainen, .nappi {border-radius:var(--radius-m) !important;}

.nappi.nappi2nd {background-color:var(--light2);}




.topline {border-top:2px solid var(--tehoste-orange) !important;}

h2.big1 {font-size:2em !important}
h1.video {font-size:2.2em !important}
h2.video {font-size:2.2em !important}

h1.glassheader {font-size: 2.8em !important; color: var(--light) !important}
h2.orange { color: var(--tehoste-orange-secondary) !important}

.nbg-3 {background-image: url("/ai/kansi-pm12.jpeg") !important; background-position: bottom center; background-size: cover;}

.overlay-40 {display:block; width:100%; height:100%; position: absolute; top:0; left:0; background-color:rgba(0,0,0,0.40)}
.overlay-50 {display:block; width:100%; height:100%; position: absolute; top:0; left:0; background-color:rgba(0,0,0,0.50)}
.overlay-60 {display:block; width:100%; height:100%; position: absolute; top:0; left:0; background-color:rgba(0,0,0,0.60)}