@import url('https://fonts.googleapis.com/css?family=Merriweather:700|Montserrat:400,400i,600,600i&display=swap&subset=cyrillic');

html, body, .grid-container {min-height: 100%; display: flex; flex-direction: column; font:400 16px 'Montserrat', sans-serif; line-height: 24px; color: #484b5f; margin: 0; padding: 0;}
body {position: relative;}
.affix {top:49px; width:730px; z-index: 10;}
.affix #TourMenuSpy {background :#fff; border: none !important; box-shadow: 0px 1px 5px 0px #555;}
.name {visibility: hidden; position: absolute;}
.form-control {margin-bottom: 10px;}
.wrapper {margin-top: 50px;}
.lang li a {font-size: 12px; padding:5px 12px; border-radius:0; margin-right: 10px;}
.breadcrumb {background: none; margin-bottom:0;}
.breadcrumb a {color:#777;}
.breadcrumb>.active {color: #4D4B49;}
.breadcrumb > li + li::before {content: url(/image/arrow-right.svg); padding: 0 8px;}
.list-style {margin-right: 8px; list-style-image: url(/img/point-icon.svg); margin-left: 22px;}

header {border-bottom: solid 1px #cacaca; padding: 18px; display: block;}
.navbar {padding: 15px 20px;}
.modal-backdrop {z-index: 5;}
.lang {margin-right: 15px;}
.nav > li > a {border: solid 1px #f8f8f8; border-radius: 5px;}
.nav > li > a:hover {border: solid 1px #eee; border-radius: 5px;}
.nav-pills > li.active > a {color:inherit; background-color: inherit; border: solid 1px grey; border-radius: 5px;}
.nav-pills > li.active > a:hover {color:inherit; background-color: #eee; }

p {margin-top:10px;}

h1{font-size: 30px;	font-weight: 600; color: #ff6033; margin-bottom: 20px;}
h2{font-size: 24px; font-weight: 600; color: #484b5f;}
h3{font-size: 20px; font-weight: 600; color: #484b5f; line-height: 26px;}
h4{font-size: 16px; font-weight: 600; color: #484b5f; margin-top: 20px; line-height: 22px;} 
h5{font-weight: 600; font-size: 15px; line-height: 20px;} 
a {color: #2f9ecd;}
a:hover {color: #2f9ecd;}
article table td {padding:5px;}
article ul {font-size: 14px; list-style: disc; margin-left: 15px;}

footer{padding: 26px 0 30px;}
.footer{margin-bottom: 30px;}
hr{border-top: 1px solid #cfcfcf; margin-top: 10px;	margin-bottom: 10px;}
.btn{padding: 7px 16px;}

.border h2 a,.border h2 {font-size: 18px; font-weight: 600; text-transform: uppercase; color:#3ec6ff;}
.border h2 a:hover {text-decoration: none;}
.border h2 a span.glyphicon {font-size: 14px; }
ul.blue-list li {margin-left: 10px;}
ul.blue-list li a {font-size: 14px; text-transform: uppercase; color:#3e3736;}
.panel-heading a {color:#484b5f; }

.tour-list {margin-bottom: 10px; padding-bottom: 15px;}
.tour-short > a,.tour-list > div > a {font-size: 18px; font-weight: 600; color:#484B5F; line-height: 36px; text-decoration: underline;}
.tour-list > div > a:hover {text-decoration: none;}
.tour-short > table {margin-top: 10px;}
.price_default {font-size: 16px; font-weight: 600; color:#3ec6ff;}
.price_view {font-size: 26px; font-weight: 600; color:#3ec6ff; margin-bottom: 8px;}
.ss {font-size: 16px; font-weight: 400; font-style: italic; margin-bottom: 8px;}
.tour-dur {font-weight: 600; margin-top: 8px;}
.booking {font-size: 16px; font-weight: 600; padding:5px 25px;}
.tour-other {border:1px solid #d0d0d0; border-radius:5px; padding:8px 15px; font-size: 13px; color:#ff6033; display: inline-block; margin-top: 15px;}
.tour-other div {font-size: 16px; color:#4d4b49;}
.notes{background: #eaf1f69e; padding: 4px 20px 6px;} 

.tour-days-box {width:60px; color: #ff6033; background:#f5f5f5; float:left; border-radius:4px; text-align:center; line-height: 14px; height: 40px; padding-top: 5px; margin-right:20px;}
.tour-cities {font-size: 16px; font-weight: 600; }
.tour-menu .navbar {padding:0; margin-top:20px;}
.tour-menu .navbar-default {background:#fff; border:0; border-bottom:1px solid #ddd; border-radius:0;}
.tour-menu .navbar-default .navbar-nav > li.active > a {background:none; color:#3ec6ff; border-bottom:3px solid #3ec6ff;}
.tour-menu .navbar-default .navbar-nav > li > a {border-bottom:3px solid #fff;}
.tour-menu .navbar-default .navbar-nav > li > a:hover {border-bottom:3px solid #ddd;}
.tour-menu .nav > li > a {font-weight:600; font-size: 17px; border:0; color:#484b5f; border-radius:0;}

.incl-class {border-bottom: 0;}
.incl-class > li > a {border: none !important; padding: 10px 0;}
.incl-class > li:nth-child(2) > a {padding-left: 15px;}
.incl-class > li > a:hover {background: #fff !important;}
.incl-class > li.active > a > h3 {color:#3ec6ff;}
.incl-class > li:first-child > a > h3 {border-right: 2px solid #484b5f; padding-right: 15px;}

.tour-name {font-size: 15px; font-weight: 700; margin: 16px 0 17px 17px; text-align: left;}
.tour-name a {color: #484b5f;}
.thumbnail{border-radius: 8px; border: none; padding: 0;}
.reviews {margin-top: 22px; font-weight: 600;}
.style-name {font-size: 20px; font-weight: 600;	color: #343434;	text-align: left;}
.price{font-size: 16px;	color: white; padding: 7px 14px 5px 14px; position: absolute; top: 80px; right: 15px; background-color: #ff6033;}
.travel-style{border: 1px solid #d4d4d4; border-radius: 8px; padding: 30px 30px 20px 30px; margin-top: 16px;}
.blocks{margin-top: 40px;}
.group-size{color: #868686;	text-align: left; margin-left: 14px; margin-top: 3px;}
.short-descr{text-align: center; margin-top: -4px; font-size: 16px;}
.style-tours a, ul {font-size: 14px; text-align: left; list-style-type: none; padding-left: 0; line-height: 26px; color: #484b5f;}

.photo-title{font-size: 13px; font-style: italic; color: #8f93ae;}
.line{width: 130px; height: 1px; background: #d1d2da; margin-top: 14px;}
    
.media-object :hover {color: #3ec6ff;}
.media-heading{text-align: left;font-weight: 600;margin-bottom: 14px;}
.offers{background-image: url(/image/pattern.png);background-attachment: scroll;padding-bottom: 40px;padding-top: 20px;}
.main-name{font: 50px 'Merriweather', serif;color: #505050;margin:20px 0;}
.slogan{font: 21px 'Montserrat', sans-serif;font-weight: 600;color: #ff6033;margin-bottom: -15px;}
.banner{margin-top: 12px;margin-bottom: 24px;}
.navi a, header{font:bold 16px 'Montserrat', sans-serif;color: #484b5f;text-decoration: none;transition: color 0.3s ease;}
.grid-container *:after {position: absolute; top: 0; left: 0;}
.grid-container {display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  grid-template-areas: "Long-picture-1 Short-pic-1 Long-picture-2 short-pic-3" "Long-picture-1 Short-pic-2 Long-picture-2 short-pic-4";
}
.Long-picture-1 { grid-area: Long-picture-1; }
.Short-pic-1 { grid-area: Short-pic-1; 	margin-bottom: 15px;}
.Short-pic-2 { grid-area: Short-pic-2; }
.Long-picture-2 { grid-area: Long-picture-2; }
.short-pic-3 { grid-area: short-pic-3;	margin-bottom: 15px;}
.short-pic-4 { grid-area: short-pic-4; }

.footer-nav a{font: 14px 'Montserrat', sans-serif;color: #484b5f;}
.footer-nav :hover{color: #3ec6ff;}
.footer-nav {line-height: 30px;}
.copyright{text-align: left;margin-top: 14px;}

#facebook{background-image: url(/image/social/facebook-icon.svg);width: 27px;height: 27px;float: right;	margin-right: 10px;}
#facebook:hover{background-position: 0 -27px;}
#twitter{background-image: url(/image/social/twitter-icon.svg);width: 27px;height: 27px;float: right;margin-right: 10px;}
#twitter:hover{background-position: 0 -27px;}
#youtube{background-image: url(/image/social/youtube-icon.svg);	width: 27px;height: 27px;float: right;margin-right: 10px;}
#youtube:hover{background-position: 0 -27px;}
#instagram{background-image: url(/image/social/instagram-icon.svg);	width: 27px;height: 27px;float: right;	margin-right: 10px;}
#instagram:hover{background-position: 0 -27px;}


/*Left menu*/
.contacts{font: 16px 'Montserrat', sans-serif;color: #fff;}
ul.navi {padding: 14px;}
ul.navi li {display: inline;margin: 0 24px 0 24px;}
#menuToggle{display: block;  position: relative;  top: 50px;  left: 50px;  z-index: 1;  
  -webkit-user-select: none;
  user-select: none;
}
#menuToggle input{display: block; width: 40px; height: 32px; position: absolute; top: -7px; left: -5px; cursor: pointer; opacity: 0; z-index: 2;  
  -webkit-touch-callout: none;
}
#menuToggle span{display: block; width: 28px; height: 3px; margin-bottom: 5px; position: relative; background: #ff6033; z-index: 1; transform-origin: 2px -1px; transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}
#menuToggle span:first-child{transform-origin: 0% 0%;}
#menuToggle span:nth-last-child(2){transform-origin: 0% 100%;}
#menuToggle input:checked ~ span{opacity: 1; transform: rotate(45deg) translate(-2px, -1px); background: #fff;}
#menuToggle input:checked ~ span:nth-last-child(3){opacity: 0; transform: rotate(0deg) scale(0.2, 0.2);}
#menuToggle input:checked ~ span:nth-last-child(2){transform: rotate(-45deg) translate(0, -1px);}

#menu {position: fixed; height:110%; width:auto; margin: -49px 0 0 -50px; padding: 55px 50px 90px 85px; background: #313741; list-style-type: none;
  -webkit-font-smoothing: antialiased; 
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}
#menu li a{font: bold 16px 'Montserrat', sans-serif; color: #fff; line-height: 45px;}
#menu li a:hover{color: #ff6033;}
#menuToggle input:checked ~ ul{transform: none;}
.or-menu {display: flex; align-items: center;}
.or-menu__item {margin-right: 20px;}

.d-flex { display: flex; }
.align-items-center { align-items: center; }
.ml-auto { margin-left: auto; }
.mb-0 { margin-bottom: 0; }

.or-lang > button.btn {border: 0;}
.or-lang > button.btn:hover,
.or-lang > button.btn:focus,
.or-lang > button.btn:active {background: transparent !important; outline: none; box-shadow: none;}
.btn-info {background-color: #3ec6ff; color: white !important;border: none;}
.or-logo {margin-right: 2rem;}

#menuToggle {top: 0; left: 0; cursor: pointer; margin-right: 20px;}
/*END menu*/

/* media queries */
@media screen and (max-width: 768px) {
    .affix {top:49px; z-index: 10; width: 100%; overflow-x: auto;}
    .navbar {margin-bottom: 0;}
    .wrapper { margin-top: 30px;}
    .or-mobile-menu {display: block;}
    .or-menu {display: none; }
	.main-name{font-size: 36px;	line-height: 40px; margin: 10px 0;}
    #menu li a{line-height: 25px;}
    .slogan{margin: 0;	font-size: 18px;}
    .blocks{ margin-top: 30px;}
    h1{	font-size: 20px;font-weight: 600;}
    h2{	font-size: 18px;font-weight: 600;}
    .short-descr{font-size: 14px;}
    .travel-style{border-radius: 8px;padding: 24px 25px 8px 25px;margin-top: 16px;}
    .travel-style a{font-size: 14px;}
    .reviews {margin-top: 12px;	}
	div.tour-list > div > img {width:100%; margin: 10px auto !important;}
    div.tour-list > div > a {line-height: 26px; display: block; margin: 20px 0 -10px;}
    .tour-menu {margin:0 -10px;}
    .tour-menu .navbar-nav {display: inline-flex; width: 100%; overflow-x: auto; margin:0;}
    .tour-menu .nav > li > a {padding:12px;}
    .line{margin: 8px 0;}
}