body, html {margin: 0px; padding:0px; background: #f3f1df;}
img {border:0px;}

body, div, p, button, input, span, textarea { font-family: georgia; font-size: 14px; color: #444444;}

a {color: #7b4420; text-decoration: none; }
a:hover {color: #c08e39;}

h1, h2 {font-style: italic; color: #7b4420}
.cottage h2 {margin:0 0 20px 0; padding: 0px;}

#header {margin-top: -70px; position: relative; }

.limited {position: absolute; top:0; left: 0; right: 0;  margin: 0px auto 0px auto; max-width: 1365px;}
.limited2 {max-width: 1365px; margin: 0px auto 0px auto;}
.limited3 {max-width: 1365px; margin: 0px auto 0px auto; padding: 0 20px 0 20px; box-sizing: border-box;}

.headerblock {position: relative; margin: 0 auto; max-height: 577px; text-align: center;}
.headerblock img {max-width: 100%; max-height: 577px; }
.deep-sea { background: url("../images/top-sea.png") repeat-x; background-position: bottom;}

.top-menu {position: absolute; right: 15px; top: 95px;}
.top-menu a {display: inline-block;color: #7b4420; font-style: italic; font-size: 16px;  padding: 30px 10px 33px 10px; }
.top-menu a:hover {color: #c08e39;}
.top-menu a#active { background: url("../images/menu_elements.png") no-repeat; background-position: center; min-width: 70px;}

.logo {position: absolute; top: 95px; left: 20px; max-width: 350px; margin: 0 0 15px 0; text-align: center;}
.logo:hover { opacity: 0.9; }
.logo img {margin: 0 0 12px 0; max-width: 100%;}
.logotext {display: block; color: #7b4420; font-style: italic; font-size: 16px; text-align: center; font-weight: bold;}
.zavitushka {background: url("../images/zavitushka.png") no-repeat center; height: 46px; margin: 10px auto 0 auto; width: 268px; }

.top-ornament {background: url("../images/top-ornament.png") repeat-x; height: 21px;}
.top-ornament-reverse {background: url("../images/top-ornament-reverse.png") repeat-x bottom; height: 18px;}
.top-ornament-reverse.topmn {display: none;}
.klimentina-mobi {display: none;}

#content {min-height: 200px;}

#footer {position: relative;}
.seashore { background: url("../images/seashore.png") repeat-x; height: 200px;}
.bottom-logo { max-width: 310px; padding: 20px; display:inline-block; text-align: center;}
.telephone {max-width: 310px; display:inline-block; vertical-align: top; padding: 65px 0 0 20px; vertical-align: top;}
.telephone img {width: 61px; vertical-align: top;}
.telephone span {display: inline-block; vertical-align: top; color: #7b4420; font-style: italic; font-size: 16px; font-weight: bold;}
.ship { background: url("../images/ship.png") no-repeat; position: absolute; width: 117; height: 73px; right: 50px; top: 92px;}

.front-rooms, .rooms {background: #fbe7bd; min-height: 100px;   text-align: justify; -ms-text-justify: distribute-all-lines; text-justify: distribute-all-lines; padding: 25px 20px 25px 20px;}

.room-block {display: inline-block; width: 22%; vertical-align: top; margin-bottom: 40px;}
.room-block:hover {opacity: 0.85;}
.room-block img {max-width: 100%; }
.room-block .room-title {font-size: 16px; font-style: italic; color: #c08e39; font-weight: bold; padding: 10px 10px 10px 0; height: 30px; overflow: hidden; margin: 5px 0 5px 0; text-align: left;}
.room-block .room-description {height: 112px; overflow: hidden; text-align: left;}
.readmore a, .button{display: block; width: 100%; background: #faa608; color: #fff; text-align: center; padding: 10px 0 10px 0; font-style: italic;  font-weight: bold; margin: 15px 0 15px 0;}
.readmore a:hover {opacity: 0.9;}
.button { border: 0px; width: 90%; cursor: pointer; }
.button:hover {opacity: 0.9;}
.stretch { width: 100%; display: inline-block; font-size: 0; line-height: 0 }

.columns {text-align: justify; -ms-text-justify: distribute-all-lines; text-justify: distribute-all-lines; padding: 25px 20px 25px 20px;}
.column {display: inline-block; width: 48%; vertical-align: top; text-align: left;}

.cottage {margin: 10px 0 40px 0;}

.mainphoto {margin-bottom: 20px;}
.mainphoto img{max-width: 100%;}
.room-gallery, .photogallery {text-align: justify; -ms-text-justify: distribute-all-lines; text-justify: distribute-all-lines;}
.gallery-photo {display: inline-block; width: 30%; max-height: 105px; overflow: hidden; margin-bottom: 20px; vertical-align: top; overflow: hidden; height: 193px;}
.gallery-photo img {max-width: 100%;}
.photogallery {margin-top: 30px;}
.photogallery .gallery-photo {width: 22%; max-height: 100%; }
.photogallery .gallery-photo span {display: block; margin: 7px 0 20px; font-size: 16px; font-style: italic; font-weight: bold; color: #7b4420; text-align: left;}
.gallery-photo:hover {opacity: 0.9;}

.room-details {margin: 0 auto; width: 90%; }

.prices, .prices-fixed {border-bottom: 1px solid #c08e39;border-right: 1px solid #c08e39;}
.prices td, .prices th, .prices-fixed td, .prices-fixed th {color: #7b4420; font-style: italic; text-align: center; font-size: 14px; font-weight: bold;}
.prices thead th, .prices-fixed thead th {color: #c08e39;}
.prices td, .prices th, .prices-fixed td, .prices-fixed th {border-top: 1px solid #c08e39; border-left: 1px solid #c08e39;padding: 10px;}
.prices .bg, .prices-fixed .bg { background: #fbe7bd; }
.subnote {font-size: 12px; color:#c08e39; margin: 7px 0 7px;}

.prices.small-only {border-spacing: 0px;border-collapse: separate; width:100%;}

.phones {font-size: 22px; font-style: italic; font-weight: bold; color: #c08e39;}

.send-review {max-width: 650px;}
#contact-form input, #contact-form textarea, .send-review input, .send-review textarea, #login-form input{ padding: 3px 7px; width:90%; border: 1px solid #c08e39;}
.send-review input, .send-review textarea {margin: 3px 0;}
.site-login {max-width: 300px;}

.review {margin-bottom: 40px; font-size: 16px;}
.review-header {position: relative; border-bottom: 1px solid #c08e39; padding-bottom: 10px; margin-bottom: 10px;}
.review-author {color: #7b4420; font-size: 22px; font-style: italic; text-indent: 20px; background: url("../images/user.png") no-repeat; background-position: 0px 8px;}
.review-city {font-size: 18px; color: #686868;}
.review-date {position: absolute; right: 20px; top: 10px; font-size: 12px; color: #888; text-indent: 15px; background: url("../images/calendar.png") no-repeat; background-position: 0px 3px;}

blockquote {font-size: 12px; margin-bottom: 0px; padding-bottom: 0px; color: #c08e39;}

ul.pagination {text-align: center; font-size: 15px; font-weight: bold;}
.pagination li {display: inline-block; padding: 5px 8px;}
.pagination li a { color: #444; }
.pagination li.active { background: #faa608; }
.pagination li.active a {color: #fff}

.smedia {position: absolute; right: 200px; top: 65px;}
.smedia a {display: inline-block; background: url("../images/sc.png") no-repeat; width: 32px; height: 32px; background-size: 184px 32px; margin:5px 5px 5px 0;}

.smedia a:hover {opacity: 0.8;}
.smedia a.ok {background-position: -38px 0px;}
.smedia a.fb {background-position: -76px 0px;}
.smedia a.gp {background-position: -114px 0px;}
.smedia a.ml {background-position: -152px 0px;}

.relative {position: relative;}

.control-panel a { display: inline-block; background: #fbe7bd; border: 1px solid #c08e39; padding:40px 40px; border-radius: 10px; text-align: center;}

.counter {margin:0px auto; text-align: center; width: 90px; position: absolute; left: 0; right: 0; bottom: 20px; }

@media (max-width:1080px) {
  #header {margin-top: -110px; text-align: right;}
  #header img.gostevoy-dom {margin-top: 0px; max-width: 80%;}
  .headerblock {position: static;}
  .deep-sea { background-size: 245px; margin-bottom: 114px;}
  .limited {position: static; height: auto; top: auto; right: auto; left: auto; margin: auto; width: auto;}
  .headerblock {text-align: right;}
  .logo {top: 135px;}
  .top-menu {top: auto; bottom: 21px; left: 0; right: 0;  margin: 0px auto 0px auto; padding: 0px 0 10px; overflow: hidden; background: #fbe7bd; text-align: center;}
  #header {background-size: 395px; background-position: 100px;}
  .top-ornament-reverse.topmn {display: block; margin-bottom: 10px;}
  .smedia {right: 140px;}
}

@media (max-width:940px) {
  .telephone {padding-top: 25px;}
  .smedia {left: 380px; top: 95px;}
}

@media (max-width:885px) {
  .logo img {width: 80%; margin: 0 0 8px 0;}
  .zavitushka {background-size: 80%; }
  .logotext {font-size: 14px; }
  .deep-sea { margin-bottom: 84px; background-size: 205px;}
  .top-menu a {font-size: 14px; padding: 20px 10px 23px 10px; }
  .top-menu a#active { background-size: 60px 63px; }
  .room-block {width: 45%;}
}

@media (max-width:830px) {
    .logo {top: 85px;}
    #header {margin-top: -70px; text-align: right;}
    #header img.gostevoy-dom {margin-top: 0px; max-width: 70%;}
}

@media (max-width:810px) {
  .deep-sea { background-size: 175px;}
}

@media (max-width:750px) {
  #header {margin-top: -60px; text-align: right;}
  .headerblock {max-height: 100%;}
  .logo {top: 85px;}
  .logo img {width: 60%; margin: 0 0 8px 0;}
  .zavitushka {background-size: 60%; margin: 0px auto 0 auto;}
  .bottom-logo {padding-right: 0px;}
  .bottom-logo img.klimentina {width: 80%;}
  .bottom-logo .zavitushka {width: 80%;}
  .telephone {padding: 25px 0 0 0px;}
  .ship {top: 68px;}
  .top-menu a#active {min-width: 30px;}
  .smedia {left: 330px; top: 95px;}
}

@media (max-width:660px) {
  #header {margin-top: 0px;}
 .deep-sea {display: none;}
 .logo {position: static; width:100%; text-align: center; left:auto; right: auto; margin: auto; padding: 20px 0 20px 0; max-width: 100%; background: url("../images/logo-bg.png") repeat-x;}
 .logo img {margin: 0 0 12px 0; max-width: 100%;}
 .zavitushka {background-size: 100%; margin: 10px auto 0 auto;}
 .limited {position: static;}
 .top-menu {position: static; top: auto; right: auto; background: none; margin: 20px auto 20px auto; }
 .top-ornament, .top-ornament-reverse.topmn {display: none;}
 .klimentina-mobi {display: block; text-align: center; }
 .bottom-logo {display: none;}
 .telephone {padding: 35px 0px 20px 40px;}
 .ship {top: 48px;}
 .room-block {width: 90%;}
 .column {width: 90%}
 .columns {text-align: center;}
 .front-rooms, .rooms {text-align: center;}
 .stretch {display: none;}
 .room-gallery div.stretch { display: inline-block;}
 .photogallery .gallery-photo {width: 43%;}
 .smedia {left: 45px; top: 75px;}
 .telephone {padding-top:10px; margin-bottom: 25px;}
}
