@font-face {
	font-family: 'Bradley Hand';
	src:  url( '/showcase/configs/870000000000495F-messut/bradley-hand-itc/BRADHITC.TTF' ) format('truetype');
}

.viewpanel.oeuvrepanel > .oeuvre_main > .oeuvre_image {
	background-color: transparent;
}

body {
	background-color: #000;
	color: #fff;
	overflow: hidden;
}

/**
 * Omanlaisensa scroll-palkki 
 */
::-webkit-scrollbar {
	width: 1em;
}

::-webkit-scrollbar-track {
	background: rgba(255,255,255,0.2);
}

::-webkit-scrollbar-thumb {
	background: rgba(255,255,255,0.2);
	border-radius: 0.5em;
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(255,255,255,0.3);
}

/* pause-nappula piilon */
#animation-control { display: none; }


/* Monitorissa ja ei-kehitystyötilassa ollessa piilotetaan mute-nappi ja kello */
body.mode-monitor:not(.DEV) #audio-control,
body.mode-monitor:not(.DEV) #animation-time-counter {
	display: none;
}

/* lista dioista piilon */
body:not(.DEV) #position_indicator ul li:not(.displayname) { display: none; }

/* "tuo kaunokirjoitus saa jäädä otsikoihin" */
.oeuvre_header,
.displayname {
    font-family: 'Bradley Hand';
}

/* "Faktateksti (kaikille näkyvä kuvaus) voi olla ihan sellaisenaan, mutta lainaukset (Asiakkaan kuvaus) voisi olla kursiivilla" */
.detailrow:nth-child(3) {
	font-style: italic;
}

/* Aloitussivun / "Etusivun" napit leveällä näytöllä normaalisti vierekkäin, kapealla allekkain */
#startcontainer .start_buttons {
	display: flex;
	justify-content: center;
}

#startcontainer .start_buttons ul.button_list {
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
}
#startcontainer .start_buttons ul.button_list > li {
	width: auto;
	margin: 1em !important;
}


/* Silmä */
#oeuvre_container_92000000002A928C .anim_container.anim > .animation {
	transform: scale(16) translate(1%, 7%);
}



.viewpanel:not(#oeuvre_container_92000000002EDBF6) .oeuvre_details .details_inner .detailrow .detailleft {
	display: none;
}
.viewpanel:not(#oeuvre_container_92000000002EDBF6) .oeuvre_details .details_inner .detailrow .detailright {
	width: 100%;
	padding-left: 0px;
}


@keyframes vaaka {

  0% {
    transform: scale(2) translate(33%, 0%);
  }
  90% {
    transform: scale(2) translate(-33%, 0%);
  }
  100% {
    transform: scale(1) translate(0%, 0%);
  }
}


@keyframes vaaka2 {

  0% {
    transform: scale(3) translate(-33%, 0%);
  }
  90% {
    transform: scale(3) translate(33%, 0%);
  }
  100% {
    transform: scale(1) translate(0%, 0%);
  }
}

@keyframes hollonjarvi {

  0% {
    transform: scale(7) translate(-43%, -5%);
  }
  25% {
    transform: scale(7) translate(-43%, 5%);
  }
  90% {
    transform: scale(2) translate(33%, 0%);
  }
  100% {
    transform: scale(1) translate(0%, 0%);
  }
}

@keyframes rotko {
    0% {
    transform: scale(1) translate(0%, 0%);
  }
  50% {
    transform: scale(3) translate(0%, 0%);
  }
  86% {
    transform: scale(2) translate(0%, 30%);
  }
  100% {
    transform: scale(1) translate(0%, 0%);
  }

}
