@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v9/jizaRExUiTo99u79D0-ExdGM.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v9/jizaRExUiTo99u79D0aExdGM.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v9/jizaRExUiTo99u79D0yExdGM.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v9/jizaRExUiTo99u79D0KExQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@color-default-color: #212529;
@color-default-menu: #5b5b5b;
@color-dark-orange: #d67e2a;
@color-orange: #fe8817;
@color-dark: rgb( 69, 68, 68 );

.red {color: red !important;}
.bold {font-weight: bold !important;}
.dark {color: rgb( 69, 68, 68 );}
.dark-orange {color:@color-dark-orange !important;}
.orange {color:@color-orange !important;}
.bg-gray {background: #efefef;}
.bg-white {background: #fff;}

.row-flex {
    display: flex;
    flex-flow: row wrap;
}

ul.nav {
	li.dropdown {
		&:hover > ul.dropdown-menu {
		    display: block;
		}
	}
}
img {max-width: 100%;}
h1 {
	font-size: 30px;
  	color: @color-dark;
  	text-transform: uppercase;
  	line-height: 1.2;
  	/*text-align: center;*/
  	font-weight: bold;
  	margin-bottom: 2rem;
}

body {
    color: @color-default-color;
    font-family: "PT Sans";  
    font-style: normal; font-variant: normal;
}
section {
	padding: 40px 0;
}
.navbar {
	padding: .5rem 0rem 1.5rem;
	li {
		&>a {
			/*font-size: 22.5px;*/
			color: @color-default-menu;
			&:hover {
				text-decoration: none;
				color: average(@color-default-menu, #000000);
			}
		}
		&.active a {
			color: @color-orange;
		}
	}
	.navbar-brand {
		padding: 0;
		margin: 0;
		img {
			max-height: 100px;
			max-width: 100%;
		}
	}
	.navbar-nav {
		flex-direction: row;
		justify-content: space-between;
	}
	@media (max-width: 769px) {
		.navbar-nav {
			flex-direction: column;
		}
	}
	.navbar-text {
		padding-bottom: 0;
	    padding-top: 0;
		&>.row {
			align-items: center;
		}
		.header-phone {
	    	font-size: 24px;
	    	font-weight: 700;
	    	line-height: 35px;
	    	margin: 10px 0px;
	    	text-align: right;
	    	&:before {
	    		display: inline-block;
	    		content: '';
	    		background: url(/assets/templates/hosteltula/img/ico-phone-1.png) no-repeat;
	    		width: 30px;
    			height: 20px;
    			margin-bottom: -2px;
	    	}
	    	.head-phone-delim {
				padding: 0 15px;
	    	}
	    	.header-callbeck {
	    		display: inline-block;
	    	}
	    	@media (max-width: 1199px) {
				.header-callbeck {
					display: block;
					margin: 15px 0;
				}
	    	}
	    	@media (max-width: 991px) {
				.header-callbeck {
					display: block;
					margin: 15px 0;
				}
				a.phone {
					display: block;
				}
				.head-phone-delim {
					display: none;
				}
				&:before {
					display: none;
				}
	    	}
		}
		@media (max-width: 769px) {
		   	&>.row, 
		   	.header-phone {
				text-align: center;
			}
	    }
	}
}
.phone {
	color: @color-default-color;
	&:hover {text-decoration: none; color: inherit;}
	.country_cod,
	.city_cod {
		color: @color-dark-orange;
	}
}
.btn-default-1 {
	background-color: #fe8817;
    font-weight: bold;
    color: #ffffff;
    box-shadow: 1px 1px 2px rgb( 171, 94, 21 );
}
.copy{
	margin: 15px 0;
}
.padding {
    height: 50px;
    width: 100%;
    background: transparent;
}
#main-title {
	.padding {
    	height: 100px;
	}
	.h1 {
		font-size: 64pt;
    	font-weight: bold;
	}
	.h3 {
		font-size: 34pt;
		padding-top: 30px;
		font-weight: 700;
	}
    &.masthead {
	    position: relative;
	    padding-top: 8rem;
	    padding-bottom: 5rem;
		background: #2b2b2b;
		div.overlay {
			position: absolute;
		    top: 0;
		    left: 0;
		    bottom: 0;
		    padding: 0;
		    overflow: hidden;
		    &:before {
				content: "";
			    top: 0;
			    left: 0;
				width: 100%;
				height: 100%;
			    background: rgba(0,0,0,0.49);
				position: absolute;
			}
			ul.slider {
			    margin: 0;
			    padding: 0;
			    img { 
			    	width: 100%; 
			    }
			}
		}
	}
    .item {
    	p {
			max-width: 70%;
		    font-size: 15px;
		    font-weight: bolder;
		    margin: 10px auto;
		}
		i {
			font-size: 35px;
		    padding: 0px 3px;
		    border: 1px solid;
		    border-radius: 100px;
		    color: #de9100;
		}
    }
    .form {
	    position: absolute;
		.block {
			background: #2b2b2b;
			padding-top: 20px;
			padding-bottom: 20px;
			border-radius: 5px;
			box-shadow: 0px 0px 5px grey;
		}
		.inputs {
			padding: 0;
		}
		input, select {
			border-radius: 5px;
		    border: 0;
		    padding: 0;
		    font-size: 12px;
		    line-height: 24px;
		    height: 24px;
			color: #454444;
			width: 100%;
		}
		input {
		    padding: 0px 5px;
		}
		label {
			font-size: 12px;
			color:rgba(255, 255, 255, 0.53);
			height: 18px;
		}
		.borderRight{
			border-right: 1px solid rgba(255, 255, 255, 0.53);
		}
		button {
			height: auto;
		    border-radius: 24.5px;
		    padding: 8px 30px;
		    width: auto;
		}
		.buttons {
			display: flex;
    		align-items: center;
    		justify-content: center;
		}
	}
}
.section-1 {
	.item {
		border-radius: 5px;
		&:hover {
			background: #e1e1e1;
			img.active {
				display: inline-block;
			}
			img.default {
				display: none;
			}
		}
		img {
			height: 76px;
			padding: 30px 0 0px 0px;
			&.active {
				display: none;
			}
		}
		.h4 {
			font-size: 1.1rem;
		    font-weight: bold;
		    padding: 20px 0 10px 0px;
		}
	}
}
.section-2 {
	.item {
		margin-bottom: 15px;
		border-radius: 5px 5px 5px 5px;
		display: inherit;
		.bg {
			background-color: #454444;
			border-radius: 5px;
			width: 100%;
			display: inline-block;
			box-shadow: 0 0 3px black;
		}
		&:hover {
			.bg {
				box-shadow: 0 0 10px black;
			}
		}
		.btn {
		    border: 0;
		    padding: 10px 40px;
		    border-radius: 40px;
		    margin: 0 auto 15px;

		}
		img {
			/*position: absolute;
		    left: 0;
			top: 0;
			right: 50%;*/
		    height: 100%;
		    border-radius: 5px 0 0 5px;
		    padding: 0;
		}
		@media (max-width: 767px) {
		   	img {
    			height: auto;
			}
	    }
		.h2 {
			font-size: 30px;
		    color: rgb( 69, 68, 68 );
		    font-weight: bold;
		    line-height: 1.2;
		}
		.h4, p {
			padding: 15px 15px 0px 15px;
		}
		.h4 {
			font-size: 16px;
    		font-weight: 700;
		}
	}
}
.section-3 {
	background: url(/assets/templates/hosteltula/img/bg-masthead.jpg) 0 0;
	position: relative;
	&:before {
		content: "";
	    top: 0;
	    left: 0;
		width: 100%;
		height: 100%;
	    background: rgba(0,0,0,0.49);
		position: absolute;
	}
	.item {
		padding: 15px;
		display: flex;
		align-items: center;
		img {
		    color: #f18620;
		    width: 40px;
		    margin: auto 10px;
		}
		p {
		    color: #fff;
		    font-size: 18px;
		    padding-left: 10px;
		    margin: 0;
			font-weight: bold;
			text-shadow: 0 0 1px black;
		}
	}
}
.section-4 {
	.bg {
		background: #484848;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 15px;
		right: 15px; 
		z-index: -1
	}
	.item {
		position: relative;
		z-index: 1;
		img {
			width: 100%;
			padding-bottom: 10px;
		}
		.h4, p, span {
			padding: 10px;
		}
		.h4 {
			font-weight: bolder;
			font-weight: 800;
		    font-size: 13pt;
		}
		span {
			color: #e2e2e2 !important;
			font-size: 10px;
		}
	}
}
.event_body_block {
	width: 75%;
	min-width: 250px;
	margin: 0 auto;
	img {
		width: 75%;
		min-width: 250px;
		display: block;
		margin: 0 auto 15px auto;
	}
}
.reviews {
	.item {
		margin-bottom: 15px;
		border-radius: 5px 5px 5px 5px;
		display: inherit;
		.bg {
			background-color: #e5e5e5;
			border-radius: 5px;
			width: 100%;
			display: inline-block;
			padding: 15px;
		}
		.title {

		}
		.body {
			display: flex;
    		align-items: flex-start;
		}
	}
	.circle {
		border-radius: 75px;
	    width: 75px;
	    height: 75px;
	    max-width: 75px;
	}
	.quotes {
		width: 40px;
		max-width: 40px;
		margin-left: -10px;
		padding-right: 10px;
	}
	.more {
		text-align: center;
		padding: 30px 0;
		a {
			font-size: 18px;
	  		color: rgb( 254, 136, 23 );
	  		font-weight: bold;
	  		text-decoration: underline;
	  	}
	}
}
.hr-2 {
	height: 5px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.01));
}
#breadcrumbs {
	padding: 0;
	.B_crumbBox {
	    list-style: none;
	    margin: 0;
    	padding: 0;
	    li {
		    display: inline-block;
		    font-size: 12px;
		    color: @color-orange;
		    line-height: 2.8;
		    a {
		    	color: rgb( 135, 135, 135 );
		    }
		}
		.separ {
			padding: 0 10px;
			color: rgb( 135, 135, 135 );
		}
	}
}
.callback {
	background: #454444;
	line-height: normal;
	color: #e5e5e5;
	.container {
		margin-top: 1rem;
	}
	.h5 {
		font-weight: 600;
    	margin: 0;
	}
	.title {
		margin-bottom: 1rem;
	}
	form { 
		input {
			border-radius: 5px;
		    border: 0;
		    padding: 0 20px;
		    font-size: 14px;
		    line-height: 45px;
		    height: 38px;
			color: #454444;
			width: 100%;
		}
		.btn {	
		    border-radius: 28px;
		}
	}
}
.events {
	.item {
		cursor: pointer;
		.bg {
			box-shadow: 0 0 3px black;
		}
		&:hover {
			.bg {
				box-shadow: 0 0 10px black;
			}
		}
	}
}
#content {
	text-align: justify;
	&.contacts {
		.h4 {
			text-transform: uppercase;
			margin: 1.5rem 0;
		}
		.footer-phone {
			display: flex;
			margin-bottom: 1rem;
			font-weight: bold;
			font-size: 1.2rem;
			align-items: center;
			&:before {
				display: inline-block;
				content: '';
				background: url(/assets/templates/hosteltula/img/ico-phone-2.png) no-repeat;
				width: 24px;
				height: 24px;
				float: left;
				margin-right: 20px;
			}
			a {
				color: inherit;
			}
		}
		.footer-adres {
			display: flex;
			margin-bottom: 1rem;
			&:before {
				display: inline-block;
				content: '';
				background: url(/assets/templates/hosteltula/img/ico-location.png) no-repeat;
				width: 24px;
				height: 24px;
				float: left;
				margin-right: 20px;
			}
		}
		.footer-mail {
			display: flex;
			margin-bottom: 1rem;
			&:before {
				display: inline-block;
				content: '';
				background: url(/assets/templates/hosteltula/img/ico-mail.png) no-repeat;
				width: 24px;
				height: 24px;
				float: left;
				margin-right: 20px;
			}
			a {
				color: inherit;
			}
		}
		.soc {
			height: 40px;
			margin-right: 5px;
		}
		.soctel{
			margin-top: -20px;
			margin-left: 45px;
			font-weight: bold;
			a {
				color: inherit;
			}
		}
	}
	&.room {
		.h3, 
		.h4 {
			font-weight: bold;
			text-transform: uppercase;
		}
	}
}
footer {
	background-color: rgb( 234, 234, 234 );
	.icon {
		padding: 20px 0px 0px 10px;
	}	
	p {
		padding: 20px 0px 0px 45px;
	}
	.btn {
	    border-radius: 28px;
	    padding: 10px 40px;
	    margin-top: 0.5rem;
	}
	.phone-delim {
		font-size: 1em;
	    font-weight: 700;
	    margin: 0 10px;
	}
	.logo {
		margin-top: 30px;
	    margin-bottom: 30px;
	}
	.footer-adres {
		display: flex;
		margin-bottom: 1rem;
		&:before {
			display: inline-block;
		    content: '';
		    background: url(/assets/templates/hosteltula/img/ico-location.png) no-repeat;
		    width: 24px;
		    height: 24px;
		    float: left;
		    margin-right: 20px;
		}
	}
	.footer-mail {
		display: flex;
		margin-bottom: 1rem;
		&:before {
			display: inline-block;
		    content: '';
		    background: url(/assets/templates/hosteltula/img/ico-mail.png) no-repeat;
		    width: 24px;
		    height: 24px;
		    float: left;
		    margin-right: 20px;
		}
		a {
			color: inherit;
		}
	}
	.footer-phone {
		display: flex;
		margin-bottom: 1rem;
		font-weight: bold;
		&:before {
			display: inline-block;
		    content: '';
		    background: url(/assets/templates/hosteltula/img/ico-phone-2.png) no-repeat;
		    width: 24px;
		    height: 24px;
		    float: left;
		    margin-right: 20px;
		}
		a {
			color: inherit;
		}
	}
	#map {
	    height: 497px;
	}
}
.footer-messengers {
	margin-bottom: 1rem;
	height: 40px;
	.viber {
		&:before {
			display: inline-block;
			content: '';
			background: url(/assets/templates/hosteltula/img/social_icons_v2_graphicsland.ru-3-1.png) no-repeat;
			width: 40px;
			height: 40px;
			float: left;
			margin-right: 10px;
			background-position-x: 0px;
			background-size: 750%;
			background-position-y: -155px;
		}
	}
	.whatsup {
		&:before {
			display: inline-block;
			content: '';
			background: url(/assets/templates/hosteltula/img/social_icons_v2_graphicsland.ru-3-1.png) no-repeat;
			width: 40px;
			height: 40px;
			float: left;
			margin-right: 10px;
			background-position-x: -52px;
			background-size: 750%;
			background-position-y: -155px;
		}
	}
	.vk {
		&:before {
			display: inline-block;
			content: '';
			background: url(/assets/templates/hosteltula/img/social_icons_v2_graphicsland.ru-3-1.png) no-repeat;
			width: 40px;
			height: 40px;
			float: left;
			margin-right: 10px;
			background-position-x: -52px;
			background-size: 750%;
			background-position-y: 2px;
		}
	}
	.vk {
		&:before {
			display: inline-block;
			content: '';
			background: url(/assets/templates/hosteltula/img/social_icons_v2_graphicsland.ru-3-1.png) no-repeat;
			width: 40px;
			height: 40px;
			float: left;
			margin-right: 10px;
			background-position-x: -52px;
			background-size: 750%;
			background-position-y: 2px;
		}
	}
	.instagram {
		&:before {
			display: inline-block;
			content: '';
			background: url(/assets/templates/hosteltula/img/social_icons_v2_graphicsland.ru-3-1.png) no-repeat;
			width: 40px;
			height: 40px;
			float: left;
			margin-right: 10px;
			background-position-x: -261px;
			background-size: 750%;
			background-position-y: 2px;
		}
	}
}

.carousel {
	background-color: @color-orange;
	padding: 0 10px;
	border-radius: 5px;
	a {
		padding: 20px 10px;
		img {
			border-radius: 5px;
		}
	}
}
.slider-nav{
	padding: 10px 0;
	margin: 0 -4px;
	img {
		padding: 0 5px;
		border-radius: 5px;
	}
}
.gallery {
	.item {
		margin-bottom: 15px;
	}
	p {
		margin-top: 1rem;
    	text-align: center;
	}
	img {
		border-radius: 5px;
	}
}
.b-top {
     bottom: 90px;
    opacity: 1;
    position: fixed;
    right: 10px;
    width: 100%;
    z-index: 2600;
}
.b-top-but {
    background: #fe8817 url("/assets/images/b-j-top.png") no-repeat scroll 50% 11px;
    border-radius: 7px;
    bottom: 0;
    color: white;
    cursor: pointer;
    display: block;
    padding: 32px 12px 4px;
    position: absolute;
    right: 0;
    z-index: 2600;
}

.sale-icon {
	position: absolute;
	left: 33%;
	top: -42%;
	width: 176px;
	height: 107px;
	padding: 10px 12px 10px 13px;
	border-radius: 0 4px 4px 0;
	background: #fe0000;
	line-height: 1.1em;
	font-size: 14px;
	color: #fff;
	text-align: center;
	background: url(/assets/templates/hosteltula/img/sale-label.png);
}

.sale-icon__text {
	width: 101px;
	padding-top: 8px;
	transform: rotate(7deg);
}

@media (min-width: 375px) {
  .sale-icon {
  	left: 43%;
	top: -43%;
  }
}

@media (min-width: 425px) {
  .sale-icon {
  	left: 53%;
	top: -49%;
  }
}

@media (min-width: 530px) {
  .sale-icon {
  	left: 70%;
  }
}

@media (min-width: 768px) {
  .sale-icon {
  	left: -32.5%;
	top: -20%;
  }
}

@media (min-width: 992px) {
  .sale-icon {
  	left: -56%;
	top: -8%;
  }
}

@media (min-width: 1200px) {
  .sale-icon {
  	left: -44%;
	top: -9%;
  }
}

/*
.sale-icon::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 120%;
	width: 9px;
	height: 9px;
	margin-top: -4.5px;
	border-radius: 50%;
	background: #454444;

}

.sale-icon::before {
	content: '';
	display: block;
	position: absolute;
	left: 99.5%;
	top: 0;
	height: 100%;
	width: 0;
	border-left: 35px solid #fe0000;
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent;
}
*/

.room-item__right {
	position: relative;
}