/* Sinisen teeman väriasetukset */
/* Tiedoksi: #0000C8 on Innovatics-logon hex code */

/* Alla logoon perustuva väripaletti vaaleimmasta tummimpaan siniseen + vaihtoehdot valkoinen ja musta */
.theme-15 {color:#363232 !important; background-color:#00C7C8 !important} /*aiemmin: CCCCFE*/
.theme-14 {color:#363232 !important; background-color:#99F !important}
.theme-13 {color:#363232 !important; background-color:#66F !important}
.theme-12 {color:#363232 !important; background-color:#33F !important}
.theme-11 {color:#fff !important; background-color:#00F !important}
.theme-d1 {color:#fff !important; background-color:#0000D8 !important}
.theme-d2 {color:#fff !important; background-color:#00C !important}
.theme-d3 {color:#fff !important; background-color:#0000A4 !important}
.theme-d4 {color:#fff !important; background-color:#009 !important}
.theme-d5 {color:#fff !important; background-color:#006 !important}
.theme-d6 {color:#fff !important; background-color:#0063C8 !important}
.theme-h {color:#0000c8 !important; background-color:none !important;}

/* muita värimäärittelyitä, mm. theme-dark on footerissa */
.theme-light {color:#363232 !important; background-color:#00C7C8 !important}
.theme-dark {color:#fff !important; background-color:#009 !important} /* HEX #006 is a good alternative */
.theme-action {color:#fff !important; background-color:#66F !important}
.theme {color:#fff !important; background-color:#0000C8 !important}
.theme-grey, .theme-gray {color:#363232 !important; background-color:#d4d4d4 !important}
.theme-white {color:#363232 !important; background-color:#ffffff !important}


/*Päämenun linkit
.theme-menu: {color:#0063C8 !important;}
.theme-menu:hover {color:#fff !important; background-color:#0000C8 !important;}


/* Läpinäkyvyys */
.theme-transparent {
color: #ffffff;
  background-color: rgba(0,0,200,0.75);
}
.theme-d6-transparent {
color: #ffffff;
  background-color: rgba(0,99,200,0.75);
}
.theme-dark-transparent {
color: #ffffff;
  background-color: rgba(0,0,153,0.75);
}

.theme-purple-transparent {
color: #ffffff;
  background-color: rgba(99,0,200,0.75);
}

.theme-15-transparent {
color: #ffffff;
  background-color: rgba(0,199,200,0.75);
}


/* tummassa footerissa olevien ikonien vaalea väri */
.theme-footer-icons {color:#FFFFFF !important; background-color:NONE !important}

/* ikonien yleinen väri */
.text-theme {color:#009 !important}


/* gradientti */
.gradient-dark { /* vasemmasta yläkulmasta oikeaan alakulmaan */
  height: auto;
  background-color: #0000C8; /* For browsers that do not support gradients */
  background-image: linear-gradient(to bottom, #0000C8, #006);
}

.gradient-dark-lr { /* ylhäältä alas */
  height: auto;
  background-color: #0000C8; /* For browsers that do not support gradients */
  background-image: linear-gradient(to bottom, #006, #0000C8);
}

.gradient-light-r { /* vasemmasta yläkulmasta oikeaan alakulmaan */
  height: auto;
  background-color: #0000C8; /* For browsers that do not support gradients */
  background-image: linear-gradient(to right, #0000C8, #00C7C8);
}

.gradient-medium { /* ylhäältä alas */
  height: auto;
  background-color: #0000C8; /* For browsers that do not support gradients */
  background-image: linear-gradient(to bottom, #0000C8, #0063c8);
}

/* hover-värit */
.hover-theme:hover {color:#fff !important; background-color:#6300C8 !important}
.hover-text-theme:hover {color:#6300C8 !important}
.hover-border-theme:hover {border-color:#6300C8 !important}

/* InnoLIMS ja Oskari-sivujen alanavigointi; sivu, jolla käyttäjä sijaitsee + hover */
.nav-active,.hover-nav-active:hover {
color:#fff!important;
background-color:#00C7C8!important
}

/* Logo */
.logo {
    max-width: 100%;
    max-height: auto;
    text-decoration: none;
}

/* Logo, valkoinen */
.logo-white {
  filter: grayscale(100%) invert(100%);
  max-width: 100%;
  max-height: auto;
  }

/* sivujen buttonien teemaväri - normaali */
.button-color {color:#fff !important; background-color:#0000C8 !important; border-radius: 4px;}
.button:hover, .button-card:hover {color:#fff!important; background-color:#0063C8 !important;}

/* sivujen buttonien teemaväri - vaaleampi */
.button-color-light {color:#000!important;background-color:#00C7C8!important; border-radius: 4px;}
.button-color-light:hover {color:#fff !important; background-color:#0000C8 !important; border-radius: 4px;}

/*Korttien valkoinen reunus - 50% läpinäkyvä */
.card-borders-white {
border-style: solid;
border-color: rgba(255,255,255, 0.5);
border-block-style: solid;
}

/* valikon avaavan nappulan värimäärittely */
.button-menu {
color:#0000c8 !important;
background-color: transparent;
background-repeat: no-repeat; 
border:none;
border-radius: 20px;
display:inline-block;
padding:8px 16px;
vertical-align:middle;
overflow:hidden;
text-decoration:none;
text-align:center;
cursor:pointer;
white-space:nowrap;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
}

/* valikon avaavan nappulan hover-käytös */
.button-menu:hover {
font-size: 6rem;
  margin: 0.5rem auto;
  color: #00C7C8;
  background: -webkit-gradient(linear, left top, right top, from(#e6e6e6), to(#1d1c1c), color-stop(0.8, #ffffff)) no-repeat;
  background: gradient(linear, left top, right top, from(#222), to(#222), color-stop(0.8, #fff)) no-repeat;
  background-size: 20%;
  -webkit-background-clip: text;
  background-clip: text;
  animation: flick 1.5s infinite;
}
@keyframes flick {
  0% {
    background-position: top left;
  }
 100% {
    background-position: top right;
  }
}
