@font-face {font-family: "neoregular"; font-style: normal; font-weight: normal;
    src: url("font/neoregular.eot?#iefix") format("embedded-opentype"), url("../font/neoregular.ttf") format("truetype"),
		url('../font/neoregular.woff') format('woff');}
body {margin-top: 99px; padding: 0; background: url('../img/bg3.jpg') no-repeat center top fixed; 	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover; font-family: neoregular, "Neo Sans Pro";
}

.hele {background: rgba(255,255,255, 0.8); color: #24262e; min-height: 750px;}
.tume {background: rgba(35,38,45, 0.9); color: #d6e3e0; min-height: 750px;}
.hele a{color: #24262e;}
.tume a{color: #d6e3e0;}
#esileht {text-align: center; font-weight: bold; font-size: 40px; text-transform: uppercase;}

@media only screen and (max-device-width: 800px) {
	#header {background: rgba(0,0,0,1); height: 100px; left:0; position: fixed; top: 0; width: 800px; z-index: 100; text-transform: uppercase; font-size: 24px;}

	#logo {display: none; color: white; background: rgba(0,0,0,1); width: 140px; height: 100px; border-radius: 0 0 10% 10%;position:absolute; margin-left: 50px; margin-top: 10px; text-align: center;}
	#logopilt {height: 80%;}
	#logopilt img {width: 60%;}
	#logotekst {font-size: 11px; margin-top: -10px;}

	#nav {float: left; color:white; margin: 40px 0;}

	#content {position:absolute; width: 800px; left: 0;}
	#content div {width: 798px; margin:0; padding: 0;}

	.inner {text-align: left; background: 111; width: 90%; margin: 0 auto; margin-bottom: 0px;}

	#footer {border:2px solid black; position: fixed; bottom: 0; opacity: 0.05;}

	a {text-decoration: none; color: white; cursor: pointer;}
	a:visited {color: white;}
	a:active {color: white;}
	#nav a:hover {color: #86dbde;}

	h2 {font-size: 40px; padding-top: 40px;}
	h3 {margin: 0; padding: 0; font-size: 30px; padding-bottom: 40px;}

	p {margin: 0; padding: 0; font-size: 24px; width: 100%; }
	
	ul {margin: 0; padding: 0;}
	#meist {
		font-size: 30px;
	}
	.button {float:right; padding: 7.5px; border-right: 0px solid white;}

	#vasakinput {display:inline-block; text-align:center;}
	#pareminput {display: inline-block; text-align:center; float: right;}

	input {border-radius: 5px;background:rgba(135,138,145, 0.2);}
	input[type=text] {height: 40px; width: 400px; margin: 1px; color: #d6e3e0; outline: 0; border: 0; padding: 5px; font-size: 25px;}
	textarea {width: 600px; height: 300px; border-radius: 5px;outline: 0; color: #d6e3e0; border: 0; padding: 5px; background:rgba(135,138,145, 0.2);}
	input[type=submit] {margin-top: 10px; border: 0; width: 300px; height: 60px; color: #d6e3e0; background: rgba(135,138,145, 0.2);}

	.portfooliotekst {display: inline-block; width: 61%; vertical-align:top;}
	.portfooliopilt {display: inline-block; border-right: 1px solid #d6e3e0;}
	.portfooliopilt img {width: 200px; margin-right: 20px;}

	ul li {margin-left: 20px;}
	ul li a{opacity: 1;}
	ul li a:hover {opacity: 0.6; cursor:pointer;}
	
	#partnerid {text-align: center; }
	.partner {display: inline-block; opacity: 0.8;}
	.partner img {border-radius: 10px; width: 400px;}
	.partner:hover {display: inline-block; opacity: 1;}

	#tegevused {text-align: center;}
	.tegevus {display: inline-block; opacity: 0.8}
	.tegevus img {border-radius: 10px; width: 400px;}
	.tegevus:hover {display: inline-block; opacity: 1;}

	#teenused table {width: 100%; font-size: 30px;}
	#teenused table tr {vertical-align: top;}

	.hidden {opacity: 0; width: 130px; height: 14px; background: rgba(0,0,0,0.8); position: absolute; margin-top: -36px; border-radius: 0 0 10px 10px; z-index: 10; color: white;}
	.hidden:hover {z-index: 20; opacity: 1;}
	.partner img:hover + .hidden {opacity: 1;}
	#overlay_foorum { display:none; opacity: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background-color: rgba(0,0,0,0.9);}
	#foorum_div {margin: 0 auto; text-align: center; padding: 20px; height: 100%;}
	#foorum_div iframe {width: 100%; height: 95%;}

	#close_button:hover {color: lightgray;}
	#close_button {color: white; position: fixed; top: 0; left: 50%; font-weight: bold; font-size: 30px; cursor: pointer;}

}

@media only screen and (min-device-width: 801px) {

	body {margin-top: 99px; padding: 0; background: url('../img/bg3.jpg') no-repeat center top fixed; 	
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover; font-family: neoregular, "Neo Sans Pro";}

	#header {background: rgba(0,0,0,1); height: 120px; left:0; position: fixed; top: 0; width: 100%; z-index: 100; text-transform: uppercase}

	#logo {color: white; background: rgba(0,0,0,1); width: 220px; height: 120px; border-radius: 0 0 10% 10%;position:absolute; margin-left: 50px; margin-top: 10px; text-align: center;}
	#logopilt {height: 80%;}
	#logopilt img {width: 60%;}
	#logotekst {font-size: 11px;}

	#nav {color:white; margin: 80px;}

	#content {position:absolute; width: 100%; left: 0;}
	#content div {padding: 10px;}
	.inner {text-align: left; background: 111; width: 70%; margin: 0 auto; margin-bottom: 60px;}

	#footer {border:2px solid black; position: fixed; bottom: 0; opacity: 0.05;}

	a {text-decoration: none; color: white; cursor: pointer;}
	a:visited {color: white;}
	a:active {color: white;}
	#nav a:hover {color: #86dbde;}
	h3 {margin: 0; padding: 0;}
	p {margin: 0; padding: 0;}
	ul {margin: 0; padding: 0;}

	.button {float:right; padding: 7.5px; border-right: 0px solid white;}

	#vasakinput {width: 40%; display:inline-block; float:left; text-align:right;}
	#pareminput {width: 20%; text-align: center; display: inline-block;}

	input {border-radius: 5px;background:rgba(135,138,145, 0.2);}
	input[type=text] {height: 25px; width: 200px; margin: 1px; color: #d6e3e0; outline: 0; border: 0; padding: 5px;}
	textarea {width: 300px; height: 200px; border-radius: 5px;outline: 0; color: #d6e3e0; border: 0; padding: 5px; background:rgba(135,138,145, 0.2);}
	input[type=submit] {border: 0; width: 100px; height: 25px; color: #d6e3e0; background: rgba(135,138,145, 0.2);}

	.portfooliotekst {display: inline-block; width: 61%; vertical-align:top;}
	.portfooliopilt {display: inline-block; border-right: 1px solid #d6e3e0;}
	.portfooliopilt img {width: 200px; margin-right: 20px;}

	ul li {margin-left: 20px;}
	ul li a{opacity: 1;}
	ul li a:hover {opacity: 0.6; cursor:pointer;}
	#partnerid {text-align: center;}
	.partner {display: inline-block; opacity: 0.8}
	.partner img {border-radius: 10px; width: 150px;}
	.partner:hover {display: inline-block; opacity: 1;}

	#tegevused {text-align: center;}
	.tegevus {display: inline-block; opacity: 0.8}
	.tegevus img {border-radius: 10px; width: 100px;}
	.tegevus:hover {display: inline-block; opacity: 1;}

	#teenused table {width: 100%; font-size: 20px;}
	#teenused table tr {vertical-align: top;}

	.hidden {opacity: 0; width: 130px; height: 14px; background: rgba(0,0,0,0.8); position: absolute; margin-top: -36px; border-radius: 0 0 10px 10px; z-index: 10; color: white;}
	.hidden:hover {z-index: 20; opacity: 1;}
	.partner img:hover + .hidden {opacity: 1;}
	#overlay_foorum { display:none; opacity: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background-color: rgba(0,0,0,0.9);}
	#foorum_div {margin: 0 auto; text-align: center; padding: 20px; height: 100%;}
	#foorum_div iframe {width: 100%; height: 95%;}

	#close_button:hover {color: lightgray;}
	#close_button {color: white; position: fixed; top: 0; left: 50%; font-weight: bold; font-size: 20px; cursor: pointer;}
}