@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i');

/* Fontin vaihto */

body, textarea, input, .accordion h1 {
font-family: 'Roboto', sans-serif;
line-height:1.5;
}

h1, header h1.toplevel a, nav.main h2 {
font-family: 'Roboto', sans-serif;
font-weight:bold;
}

/* Vanha sivun sisallon taustakuva ja vari

html, body {
background-image: url("https://peda.net/dev/urok/kk/kuvia/kkto:file/download/ec39e15b81530d58e5155f5aa296ab808ea0e9d9/tilkkutakki_oranssi.jpg");
background-attachment:fixed;
}*/

/* Sivun sisallon taustavari*/

html, body {
background-color:#ceff23;
}

/* Sisältötaustan väri ja tyylit*/
html:before
{
background-color:#f7f7f7;
}

article article, div.framelessimage, .eventmodify div.question {
border-radius:0;
box-shadow:none;
}

article article, div.framelessimage {
    border-color: #dedede;
}

    /* Vanha tyyli */
    /*background: #eee;
    /*background-image: linear-gradient(to bottom, #005C98 0%,#ffffff 40rem,#0C305F 100%);*/
    /*color: #000;*/
    /*border-bottom: solid 0.25rem #FF0000;*/


/*Valikkotyylit*/

nav.main nav.virtualsub li a, nav.main nav.sub .service a {
border-radius:0;
box-shadow:none;
background-color:#ff7800;
color:#fff;
font-weight:bold;
margin-bottom: 0.3rem;
padding: 0.55rem 0.5rem;
}

article article, div.framelessimage, nav.main nav.virtualsub li a, nav.main nav.sub .service a {
    border-color: #dedede;
}

nav.main nav.virtualsub li a:hover, nav.main nav.sub .service a:hover {
color:#ff7800;
background-color:transparent;
border-color:#f7f7f7;
}

/*Otsikko ja linkkityylit */

article article > header h1 {
font-size: 1.7rem;
font-weight:bold;
}

h1 a, h1 a:link, h1 a:visited {
color:#000000;
}


/*Peda.net ja henkilot linkin taustavarin muutos*/
header nav.global .links > span a,
header nav.global .links > span.persondirectory,
header nav.global .links > span.frontpage,
header nav.global input.s, header nav.global button
{
background: transparent;
}

/* Sivun otsikon taustakuva

html { --bannerimage: url("https://peda.net/dev/urok2/kk/m:file/download/85306404b329dffa74d546328094c56c93a24bb6/monenilonpaikka.jfif"); --bannerheight: minmax(max(20rem,25vh), auto); --bannerbackgroundsize: auto; --bannerbackgroundposition: 0% 0%; }

html { --bannerimage: url("https://peda.net/dev/urok2/kk/m:file/download/85306404b329dffa74d546328094c56c93a24bb6/monenilonpaikka.jfif"); --bannerheight: minmax(max(14rem,18vh), auto); }

html { --bannerbackgroundsize: cover; }

.banner
{
background: url("https://peda.net/dev/urok2/kk/m:file/download/85306404b329dffa74d546328094c56c93a24bb6/monenilonpaikka.jfif") no-repeat;
background-size:cover;

border-bottom: solid 0.1rem #000;

}*/

/*ylapalkin taustavarin muutos seka perusvari tekstille*/

header nav.global
{
	background: transparent;
	background: rgba(0,0,0,0.5);
	color: #fff;
}



/* Sivun yläotsikkoalueen ylamarginaali ja otsikkoalueen tekstin perusvari */

header nav.path
{
	padding-top: 0.6rem;
	color: #fff;
}


/*Otsikkoalueen tekstin perusvari otsikosta alaspain*/

header .path .toplevel
{
	color: #fff;
	/*height:335px;*/
	padding: 2.5rem;
}

header h1.toplevel {
padding: 5rem;
}

/*Nakymaton otsikko, joka maaraa otsikkorivin korkeuden*/

/*
header h1.toplevel a, header h1.toplevel a:hover
{ 
margin: 0;
padding: 0;
width: 100%;
}
*/


/*Murupolun taustakuva ja vari*/

nav.path .toplevel > .pathitem
{
	/*background: rgba(0,0,0,0.3);*/
	color: #fff;
	padding-top: 0.4rem;
	padding-bottom: 0.4rem;
}

/*Murupolun linkkien yleisvari*/ 

header .path a, header .path a:active, header .path a:hover
{
	color: #fff;
        /*text-shadow: 0 0 0.2rem #1F865C, 0 0 0.3rem #1F865C, 0 0 0.4rem #1F865C;*/
}


/*Murupolun linkkien vari otsikon jalkeen*/ 


header .path .toplevel a, header .path .toplevel a:active, header .path .toplevel a:hover
{
	color: #fff;
}

/*Murupolun viimeisen linkin vari*/

header h1.toplevel .pathitem.redundant a 
{
    color: #fff;
}

/*Murupolun efekti*/

/*
header .path .pathitem a:hover, header .path .pathitem a:active, header h1.toplevel a:hover, header h1.toplevel a:active
{
    color: #fff;
    text-shadow: 0 0 0.2rem #FFFFFF;
}
*/



/* Sivun yläotsikon väri */

header h1.toplevel a, header h1.toplevel a:active
{
   color: #fff;
   text-shadow: 0 0 0.2rem #FFFFFF;
}

/* Sivun yläotsikon väri hoverina*/
header h1.toplevel a:hover
{
 color: #fff;
 text-shadow: 0 0 0.1rem #fff;
}


/*Sivun otsikon vari*/

h1 a, h1 a:link, h1 a:visited
{
    color: #000000;
}

/*Moduuleiden otsikoiden vari*/

h2 a, h2 a:link, h2 a:visited
{
    color: #000000;
}




/* Tällä määritellään sivun otsikolle heittovarjo ja rajoitetaan sen rivittymistä */

/*
/*
header h1.toplevel a, header h1.toplevel a:hover
{
  text-shadow: 0rem 0rem 0.2rem rgba(0,0,0,0.6);
  white-space: nowrap;
}
*/
*/

/* Tällä määritellään että sivun otsikko rivitetään kuitenkin, jos sivun leveys on vähemmän kuin 60rem */

@media all and (max-width:60rem)
{

  html { --bannerimage: url("https://peda.net/dev/theme/kouvola/style/banneri_pieni-jpg:file/download/"); --bannerheight: minmax(max(20rem,25vh), auto); --bannerbackgroundsize: auto; --bannerbackgroundposition: 0% 0%; }

html { --bannerimage: url("https://peda.net/dev/theme/kouvola/style/banneri_pieni-jpg:file/download/"); --bannerheight: minmax(max(14rem,18vh), auto); }

body > header > .banner { background: linear-gradient(to right,rgba(255,255,255,1) 0%, rgba(188,148,16,0) 10rem, rgba(188,148,16,1) 80%), url("https://peda.net/dev/theme/sodankyla/style/banneri_pieni_2-jpg:file/download/"); }

.banner
  {

      /*background: url("https://peda.net/dev/theme/kouvola/style/banneri_pieni-jpg:file/download/") no-repeat left bottom #fff;*/
      /*background-image: linear-gradient(to right,rgba(255,255,255,1) 0%, rgba(188,148,16,0) 10rem, rgba(188,148,16,1) 80%), url("https://peda.net/dev/theme/sodankyla/style/banneri_pieni_2-jpg:file/download/");*/

        
}
}

/* Tällä määritellään sivun ikonin koko, kun käytössä on kaikki kolme otsikkoriviä */

header h1.toplevel a.withsubtitle1.withsubtitle2 img
{
height: 3.8rem;
max-width: 5.8rem;
padding-top: 0.2rem;
padding-bottom: 0.5rem;
padding-left: 0.5rem;
}

/* Tällä määritellään sivun ikonin koko silloin kun käytössä on vain sivun perusotsikko */


header h1.toplevel a img
{
max-width:100%;
height:auto !important;
/*height: 3.0rem;
max-width: 10.0rem;
padding-top: 0.1rem;
padding-bottom: 0.3rem;
*/
}

/* Tällä määritellään että otsikossa koulun nimi näkyy isoilla kirjaimilla, vaikka palvelun tiedoissa nimi kirjoitetaan normaalisti */

/*
header h1.toplevel a, header h1.toplevel a:hover
{
background: url("https://peda.net/dev/urok/kk/kuvia/kkl:file/download/719d05b641f906d56eddaea66c537861e3799433/kvlkansalaisopisto.png") no-repeat left center;
background-size:contain;
	/*background: url("https://peda.net/dev/theme/kouvola/style/logo-png:file/download/") no-repeat left center;*/

}
*/

header h1.toplevel a span span
{
font-weight: 900;
text-transform: uppercase;
/* font-variant: small-caps; */
}

/* Tällä kätketään ikoni ja määritellään marginaali ikonin oikealle puolelle */

header h1.toplevel a span
{
visibility: hidden;
}

header h1.toplevel a img
{
margin-right: 0.4rem;
visibility: hidden;
}




header .path .toplevel .service.toplevel
	{
		padding-left: 0.5rem;
	}


article {
border-radius:1rem;
}


html{
--bannerlinkbackground:none;
}