﻿/* background */
html {
min-height: 100%;
margin: 0;
}
body {
min-height: 100%;
margin: 0;
background-image: url("taust.jpg"); /* fallback */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00000000, endColorstr=#A5000000, GradientType=0)"; /* IE6-8 */
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 50%), url("taust.jpg"),url("taust_blur.jpg"); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(30%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.65))), url("taust.jpg"),url("taust_blur.jpg"); 
background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 50%), url("taust.jpg"),url("taust_blur.jpg"); 
background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 50%), url("taust.jpg"),url("taust_blur.jpg"); 
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.65) 50%), url("taust.jpg"),url("taust_blur.jpg"); 
}
/* --------------KKK---------------*/
#kkk-tekst{
padding: 20px 20px 20px 20px;
}
#kontaktiküsimus {
text-align:center;
padding-top:20px;
}
/* --- contact form --- */
#form-main{
display:inline;
width:100%;
padding-top:0px;
}
#form-div {
display:inline;
margin:0 auto;
padding-left:35px;
padding-right:35px;
padding-top:5px;
padding-bottom:50px;
width: 470px;
left: 50%;
margin-top:5px;
}
.feedback-input {
color:#3c3c3c;
font-family: Helvetica, Arial, sans-serif;
font-weight:500;
font-size: 18px;
border-radius: 0;
line-height: 22px;
background-color: #fbfbfb;
padding: 13px 13px 13px 54px;
margin-bottom: 10px;
width:100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
border: 3px solid rgba(0,0,0,0);
}
.feedback-input:focus{
background: #fff;
box-shadow: none;
border: 3px solid #3498db;
color: #3498db;
outline: none;
padding: 13px 13px 13px 54px;
}
.focused{
color:#30aed6;
border:#30aed6 solid 3px;
}
/* --- ikoonid --- */
#name{
background-image: url("kkk/name.svg");
background-size: 30px 30px;
background-position: 11px 8px;
background-repeat: no-repeat;
}
#name:focus{
background-image: url("kkk/name.svg");
background-size: 30px 30px;
background-position: 8px 5px;
background-position: 11px 8px;
background-repeat: no-repeat;
}
#email{
background-image: url(kkk/email.svg);
background-size: 30px 30px;
background-position: 11px 8px;
background-repeat: no-repeat;
}
#email:focus{
background-image: url(kkk/email.svg);
background-size: 30px 30px;
background-position: 11px 8px;
background-repeat: no-repeat;
}
#comment{
background-image: url(kkk/message.svg);
background-size: 30px 30px;
background-position: 11px 8px;
background-repeat: no-repeat;
}
textarea {
width: 100%;
height: 150px;
line-height: 150%;
resize:vertical;
}
input:hover, textarea:hover,
input:focus, textarea:focus {
background-color:white;
}
#button-blue{
font-family: 'Montserrat', Arial, Helvetica, sans-serif;
float:left;
width: 100%;
border: #fbfbfb solid 4px;
cursor:pointer;
background-color: #3498db;
color:white;
font-size:24px;
padding-top:22px;
padding-bottom:22px;
-webkit-backface-visibility: hidden;
-webkit-transition:  translateX(0);
-moz-transition:  translateX(0);
transition: all 0.3s;
margin-top:-4px;
font-weight:700;
}
#button-blue:hover{
background-color: rgba(0,0,0,0);
color: #0493bd;
}
.submit:hover {
color: #3498db;
}
.ease {
width: 0px;
height: 78px;
background-color: #fbfbfb;
-webkit-transition: translateX(0);
-moz-transition: translateX(0);
-o-transition: translateX(0);
-ms-transition: translateX(0);
transition: .3s ease;
}
.submit:hover .ease{
width:100%;
background-color:white;
}
@media screen and (max-width: 720px) {
#kkk-tekst{
margin-right: 0;
}
#form-div{
left: 3%;
margin-right: 3%;
width: 100%;
margin-left: 0;
padding-left: 3%;
padding-right: 3%;
}
#button-blue{
font-size: 18px;
}
}
/* --------------INFO--------------*/
.kohapildid  {
border: 1px solid black;
margin-bottom: 10px;
}
#kala {
padding-top: 5px;
}
#kana {
padding-top:20px;
}
.loom {
text-align:center;
margin-bottom:20px;
}
#escaper {
text-align:center;
height: 200px;
line-height: 200px;
vertical-align: middle;
}
#escaper2 {
text-align:center;
margin-top: -80px;
vertical-align: middle;
}
@media screen and (max-width: 700px) {
#escaper {
text-align:center;
height: 20px;
line-height: 20px;
vertical-align: middle;
}
#escaper2 {
text-align:center;
margin-top: 0px;
vertical-align: middle;
}
}
#juhis {
text-align:center;
}
.iframe-rwd  {
background-image:url("blur.jpg");
background-repeat: no-repeat;
background-size:cover;
position: relative;
padding-bottom: 20%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.iframe-rwd iframe {
background-image:url("blur.jpg");
background-repeat: no-repeat;
background-size:cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 250px;
}
@media screen and (max-width:700px) {
.iframe-rwd {
padding-bottom: 50%;
}
}
/* -------------NAVIGATSIOON------------ */
/* navigation hover */
.nav.navbar-nav > li > a:hover{
background-color:#6D4021;
}
.dropdown-menu > li > a:hover{
background-color:#6D4021;
}
.navbar {
background-color: rgba(0,0,0,0.9);
border-color: #981302;
border-bottom-width: 1.8px;
font-size: 18px;
}
.nav.navbar-nav.navbar-right li a {
color:white;
font-size: 18px;
}
.collapse.navbar-collapse li a {
color: white;
}
.navbar-brand li a{
color:white;
}
.dropdown-menu {
background-color: rgba(0,0,0,0.8);
}
/* --------NAVIGATSIOON----------- */
/* ------------AVALEHT------------- */
/* hover image effect */
#reklaam {
padding-top: 0px;
width: 80%;
height: auto;
display: block;
margin: 0 auto;
}
@media screen (max-width: 700px) {
#reklaam {
width: 100%;
}
}
.img-responsive{
 width:100%;
 height:auto;
}
.hovereffect {
width: 100%;
height: 100%;
float: left;
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
}
.hovereffect .overlay {
width: 100%;
height: 100%;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}
.hovereffect img {
display: block;
position: relative;
-webkit-transition: translateX(0);
transition: all 0.4s ease-in;
}
.hovereffect:hover img {
filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /><feGaussianBlur stdDeviation="3" /></filter></svg>#filter');
filter: grayscale(1) blur(3px);
-webkit-backface-visibility: hidden;
-webkit-filter: translateX(0);
-webkit-transform: translateX(0);
-ms-transform:  translateX(0);
transform: scale(1.2);
}
.hovereffect h2 {
text-transform: uppercase;
text-align: center;
position: relative;
font-size: 17px;
padding: 10px;
background: rgba(0, 0, 0, 0.6);
}
.hovereffect a.info {
display: inline-block;
text-decoration: none;
padding: 7px 14px;
border: 1px solid black;
margin: 50px 0 0 0;
background-color: rgba(0, 0, 0, 0.5);
}
.hovereffect a.info:hover {
box-shadow: 0 0 5px #fff;
}
.hovereffect a.info, .hovereffect h2  {
-webkit-backface-visibility: hidden;
-webkit-transform: translateX(0);
-ms-transform:  translateX(0);
transform: scale(0.7);
-webkit-transition: translateX(0);
transition: all 0.4s ease-in;
opacity: 0;
filter: alpha(opacity=0);
color: #fff;
text-transform: uppercase;
}
.hovereffect:hover a.info, .hovereffect:hover h2{
-webkit-backface-visibility: hidden;	
opacity: 1;
filter: alpha(opacity=100);
-webkit-transform: translateX(0);
-ms-transform:  translateX(0);
transform: scale(1);
}
.container {
text-align:center;
}
.block {
display:inline-block;
vertical-align:top;
margin:10px;
border: 5px double black;
}
/* hover images position from top */
#toad {
padding-top:90px;
}
/*hover images position from top large desktop version */
@media screen and (min-width: 1600px) {
#toad {
padding-top:80px;
}
}
/* mobile hover */
@media screen and (max-width: 700px) {
.hovereffect:hover img {
filter: none;
filter: none;
-webkit-filter: none;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.hovereffect a.info, .hovereffect h2 {
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transition: translate3d(0, 0, 0);
opacity: 0;
filter: alpha(opacity=0);
color: #fff;
text-transform: uppercase;
}
.hovereffect a.info:hover {
border: 1px solid white;
box-shadow: none;
}
}
#avaleht_container {
padding-top: 40px;
padding-bottom: 80px;
}
/* small,big text */
.micro {
font-size: 29px;
color: black;
font-family: League Gothic;
font-weight: normal;
font-style: normal;
}
.macro {
font-size: 29px;
color: white;
font-family: League Gothic;
font-weight: normal;
}
/* mobile text */
@media screen and (max-width: 700px) {
.micro {
font-size: 21px;
color: black;
font-family: League Gothic;
font-weight: normal;
font-style: italic;
}
.macro {
font-size: 21px;
color: white;
font-family: League Gothic;
font-weight: normal;
font-style: italic;
}
}
/* container */
.blocks {
border: 1px solid black;
margin-top: 25px;
margin-left: 5px;
margin-right: 5px;
background-color: rgb(218, 128, 66);
background-color: rgba(218, 128, 66, 0.99);
}
/* desktop brightness */
@media screen and (max-width:  700px) {
.blocks {
background-color: rgb(231, 141, 79);
background-color: rgba(231, 141, 79, 1);
}
}
@media screen and (min-width: 1600px) {
.blocks {
margin-left: 180px;
margin-right: 180px;
background-color: rgb(231, 141, 79);
background-color: rgba(231, 141, 79, 1);
}
}
#sissejuhatus {
padding-top: 20px;
padding-bottom: 20px;
padding-left: 40px;
padding-right: 40px;
}
@media screen and (max-width: 700px) {
#sissejuhatus {
text-align: justify;
padding-left: 25px;
padding-right: 25px;
}
}
#vastukaja {
border-top: 1px solid black;
text-align: justify;
}
.icons{
padding-top: 20px;
}
#footer{
max-width: 100%;
height: auto;
width: auto;
display: block;
margin: 0 auto;
opacity: 0.75;
margin-top: -60px;
margin-bottom: 10px;
}
@media screen and (max-width: 700px) {
#footer{
padding-right: 15px;
padding-left: 15px;
}
}
/********** small,big text VASTUKAJA ************/
.micro-vk {
font-size: 24px;
color: black;
font-family: League Gothic;
font-weight: normal;
font-style: normal;
}
.macro-vk {
font-size: 24px;
color: white;
font-family: League Gothic;
font-weight: normal;
}
/************* mobile text VASTUKAJA *************/
@media screen and (max-width: 700px) {
.micro-vk {
font-size: 20px;
color: black;
font-family: League Gothic;
font-weight: normal;
font-style: italic;
}
.macro-vk {
font-size: 20px;
color: white;
font-family: League Gothic;
font-weight: normal;
font-style: italic;
}
}
/* ------------AVALEHT------------- */
/* -----------BRONEERIMINE AJUTINE------------ */
#bronn {
background-image: url("loading.gif");
background-repeat: no-repeat;
background-position: 50% 10%;
margin-top: 0px;
margin-bottom: 80px;
border: 1px solid black;
background-color: rgb(192, 102, 40);
background-color: rgba(218, 128, 66, 0.99);
}
@media screen and (max-width: 700px) {
#bronn {
background-size: 50%;
margin-top: 20px;
margin-bottom: 20px;
}
}
.wrapButtons {
	text-align: center; 
	padding-top: 60px;
}
.centerButtons {
	text-align: left; 
	margin-left: auto;
	display:inline-block;
}
.vovaButton {
	border: 2px solid black;
	background-image: url("broneerimine/vovaBronn.jpg");
	width: 300px;
	height: 100px;
	font-size: 24px;
	color: white;
}
.vovaButton:hover {
	background: #181a21;
	width: 300px;
	height: 100px;
	font-size: 24px;
}
.hulluButton {
	border: 2px solid black;
	background-image: url("broneerimine/hulluBronn.jpg");
	width: 300px;
	height: 100px;
	font-size: 24px;
	color: white;
}
.hulluButton:hover {
	background: #181a21;
	width: 300px;
	height: 100px;
	font-size: 24px;
}
.bronnButtonSelectedHullu {
	border: 2px solid black;
	background: #181a21;
	width: 300px;
	height: 100px;
	font-size: 24px;
	color: white;
}
.bronnButtonSelectedHullu:hover {
	background: #181a25;
	color: white;
}
.bronnButtonSelectedVova {
	border: 2px solid black;
	background: #181a21;
	width: 300px;
	height: 100px;
	font-size: 24px;
	color: white;
}
.bronnButtonSelectedVova:hover {
	background: #181a25;
	color: white;
}
#displayInfo {
	padding: 20px;
}

/* -----------BRONEERIMINE AJUTINE---------- */
/* -----------MÄNGUD------------ */
/* button */
.bronn-button{
padding-top: 10px;
display: -webkit-flex; /* Safari */
-webkit-align-items: left; /* Safari 7.0+ */
display: flex;
}
section button {
width: 100%;
height: 100%;
margin: 0 auto;
font-size: 18px;
padding: 14px 26px;
display: block;
background-color: rgba(206, 116, 54, 1);
border: 1px solid black;
color: black;
font-weight: 300;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
section button:hover {
background-color: white;
color: black;
border-color: black;
}
@media screen and (max-width: 700px) {
section button {
font-size: 13px;
padding: 9px 16px;
background-color: rgba(181, 91, 29, 1);
}
}
/* button*/
.info-games-container {
padding-top: 60px;
padding-bottom: 80px;
margin-right: 25px;
margin-left: 25px;
}
@media screen and (max-width: 700px) {
.info-games-container {
padding-top: 60px;
padding-bottom: 80px;
margin-left: 5px;
margin-right: 5px;
}
}
/*picture blur effect */
@media screen and (min-width: 700px) {
.blur img{
-webkit-backface-visibility: hidden;
-webkit-transition: translateX(0);
-moz-transition: translateX(0);
-o-transition: translateX(0);
-ms-transition: translateX(0);
transition: all 0.3s ease-in-out;
filter: blur(0);
-webkit-filter: translateX(0);
-moz-filter: translateX(0);
-o-filter: translateX(0);
-ms-filter: translateX(0);
}
.blur img:hover{
-webkit-backface-visibility: hidden;
-webkit-transition: translateX(0);
-moz-transition: translateX(0);
-o-transition: translateX(0);
-ms-transition: translateX(0);
transition: all 0.2s ease-in-out;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-o-transform: translateX(0);
transform: scale(1.01);
filter: blur(0.5px);
-webkit-filter: translateX(0);
-moz-filter: translateX(0);
-o-filter: translateX(0);
-ms-filter: translateX(0);
}
}
/* picture blur effect */
/*picture expand effect INFOS */
@media screen and (min-width: 700px) {
.expand img{
-webkit-backface-visibility: hidden;
-webkit-transition: translateX(0);
-moz-transition: translateX(0);
-o-transition: translateX(0);
-ms-transition: translateX(0);
transition: all 0.3s ease-in-out;
}
.expand img:hover{
-webkit-backface-visibility: hidden;
-webkit-transition: translateX(0);
-moz-transition: translateX(0);
-o-transition: translateX(0);
-ms-transition: translateX(0);
transition: all 0.2s ease-in-out;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-o-transform: translateX(0);
transform: scale(1.2);
}
}
/* picture expand effect INFOS */
/* ribad */
.riba-üleval {
border-bottom: 1px solid black;
max-width: 100%;
height: auto;
width: auto;
display: block;
margin: 0 auto;
}
.riba-keskel {
border-top: 1px solid black;
border-bottom: 1px solid black;
max-width: 100%;
height: auto;
width: auto;
display: block;
margin: 0 auto;
}
.riba-all {
border-top: 1px solid black;
max-width: 100%;
height: auto;
width: auto;
display: block;
margin: 0 auto;
}
.mängu_tekst {
margin: 50px 100px 50px 100px;
}
@media screen and (max-width: 700px) {
.mängu_tekst {
margin: 20px 20px 20px 20px
}
}
/* -----------MÄNGUD------------ */
.new {
color: red;
}