* {margin:0px; padding:0px; border:0; box-sizing:border-box;}
body {position:relative; min-width:320px; width:100vw; height:100vh; color:#000000; font-family:'Roboto', sans-serif; background-color:#ffffff; text-align:center; overflow-x:hidden;}
tbody {width:100%}
p {margin:10px 0; padding:0; font-size:18px; line-height:1.3;}
ol, ul {margin:0 0 0 20px;}
li {margin:0 0 5px 10px;}
a, a:link, a:visited, a:hover {color:inherit; text-decoration:underline;}

img#back {position:fixed; top:0; left:0; width:100%; transition:.5s;}

div#top {position:fixed; left:0; top:0; width:100%; height:150px; overflow:hidden; transition:.5s; text-align:center; z-index:10000;}
div#hat {position:relative; display:inline-block; width:100%; max-width:1200px; height:100px; padding:0 25px;}
a#logo {position:absolute; display:inline-block; left:25px; top:15px; width:calc(100% - 50px); max-width:350px; height:70px; background-image:url(/Images/saunaozery.png); background-position:left top; background-repeat:no-repeat; background-size:contain; padding-top:47px; font-size:18px; font-weight:bold; text-decoration:none; text-transform:uppercase;}
div#address {position:absolute; display:inline-block; right:220px; top:10px; width:300px; padding:0 0 0 35px; background-image:url(/Images/mappoint.png); background-position:left 50%; background-repeat:no-repeat; font-size:14px; text-align:left; transition:.5s;}
div#address h2 {font-size:18px;}
div#phones {position:absolute; display:inline-block; right:20px; top:10px; width:200px; padding:0 0 0 35px; background-image:url(/Images/phones.png); background-position:left 50%; background-repeat:no-repeat; text-align:left; transition:.5s;}
a.phone {display:block; font-size:18px; font-weight:bold;}
a#phone {position:absolute; display:none; right:20px; top:10px; width:30px; height:30px; background-image:url(/Images/phones.png); background-position:50% 50%; background-repeat:no-repeat;}


div#main {position:relative; width:100%; margin-top:350px; transition:.5s;}
div#line {width:100%; max-height:200px; overflow:hidden;}
div#head {position:absolute; left:0; top:30px; width:100%; height:170px; text-align:center;}
div#head div {position:relative; display:inline-block; width:100%; max-width:1200px; height:170px; border:0; text-align:left;}

h1#welcome {position:relative; font-size:32px; line-height:1; font-weight:bold; padding:0 20px; text-align:center; margin-top:130px; color:red; z-index:1000; text-shadow:0 1px 1px #FFFFFFDD, 0 1px 3px #FFFFFFDD, 0 1px 5px #FFFFFFDD, 0 1px 10px #FFFFFFDD;}
img#icon {position:absolute; right:20px; top:0; width:150px;}

div#page {width:100%; min-height:100vh; background:white; text-align:center;}
div.text {display:inline-block; width:100%; max-width:800px; padding:20px; text-align:left;}

table#price td {padding:5px 25px; text-align:right; font-size:20px; line-height:1; font-weight:bold; color:#669900;}

div#photos {position:relative; width:100%; height:80vh; text-align:center; padding:0; background-position:50% 50%; background-repeat:no-repeat; background-size:contain; transition:.5s;}
div#left {display:inline-block; width:70px; height:100%; position:absolute; left:20px; top:0; background-image:url(/Images/arrowleft.png); background-position:50% 50%; background-repeat:no-repeat; cursor:pointer; filter:invert(1);}
div#right {display:inline-block; width:70px; height:100%; position:absolute; right:20px; top:0; background-image:url(/Images/arrowright.png); background-position:50% 50%; background-repeat:no-repeat; cursor:pointer; filter:invert(1);}

@media only screen and (max-width : 950px), only screen and (max-device-width : 950px){
	img#back {top:90px;}
	div#top {height:170px;}
	div#address {left:20px; top:90px;}
}
@media only screen and (max-width : 700px), only screen and (max-device-width : 700px){
	img#back {top:120px;}
	div#phones {right:20px; top:90px;}
	div#main {margin-top:300px;}
}
@media only screen and (max-width : 500px), only screen and (max-device-width : 500px){
	div#phones {display:none;}
	a#phone {display:inline-block; right:20px; top:95px;}
	div#main {margin-top:250px;}
	div#line {max-height:120px;}
	h1#welcome {margin-top:50px; font-size:24px;}
	img#icon {width:100px;}
	table#price td {padding:5px 5px; text-align:right; font-size:18px; line-height:1; font-weight:bold; color:#669900;}
}
@media only screen and (max-width : 360px), only screen and (max-device-width : 360px){
	a#phone {display:inline-block; right:20px; top:60px;}
	h1#welcome {font-size:18px; width:calc(100% - 150px); top:20px; bottom:none;}
}