
@font-face {
    font-family: "IranSans";
    src: url("/fonts/IRANSansWeb.eot");
    src: url("/fonts/IRANSansWeb.eot?#iefix") format("embedded-opentype"),
         url("/fonts/IRANSansWeb.woff") format("woff"),
         url("/fonts/IRANSansWeb.ttf") format("truetype"),
         url("/fonts/IRANSansWeb.svg#IRANSansWeb") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "icon";
    src: url("/fonts/icon.woff") format("woff");
}

* { 
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    outline: none;
}

html {
    font-family: "IRANSansWeb(FaNum)",IranSans,Tahoma, Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
    letter-spacing: -0.02em;
    word-spacing: -0.1em;
    color: #999999;
}

img {
	opacity: 1;
	transition: opacity 0.4s;
}

img[data-src] {
	opacity: 0;
}

hr {
    height: 2px;
    background-color: #999999;    
}

.main {
    min-height: calc(100vh - 270px);
}

.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.center-v {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -ms-box-align: center;
    align-items: center;    
}

.center-h {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -ms-box-pack: center;
    justify-content: center;
}

.wrap {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.logo {
	max-width: 170px;
	overflow: hidden;
}

.logo-img {
	position: relative;
    width: 48px;
    height: 48px;
	margin-left: 5px;
}

.logo-line1 {
    font-size: 1em;
    line-height: 1.3em;
	-webkit-text-stroke: 1px #808080;
    letter-spacing: -0.03em;
    word-spacing: -0.2em;
}

.logo-line2 {
    font-size: 0.7em;
    line-height: 1.3em;
	letter-spacing: -0.06em;
}

.topdiv {
    height: 60px;
}

.menu-bar {
    position:fixed;
    width: 100%;
    height: 60px;
    top: 0px;
    transition: top 0.4s ease-in-out;
    color: #808080;
    background-color: #F8F8FF;
    box-shadow: 0px 3px 5px #aaaaaa;
    z-index: 100;
}

.menu-button {
    display: none;
}

.menu-nav {
    display: block;
    background-color: inherit;
}

.menu-bar a {
    text-decoration: none;
    color: inherit;
    white-space: nowrap;
}

.menu-bar ul {
    list-style-type: none;
    background-color: inherit;
}

.menu-bar ul span:after {
    font-family: icon;
    font-size: 12px;
    content: "\F134";
    margin-right: 10px;
}

.menu-bar ul li {
    display: inline-block;
    position: relative;
    padding : 0 10px 0 10px;
    border-right: 1px solid silver;
    background-color: inherit;
    cursor: pointer;
}

.menu-bar ul li:First-child {
    border-right: none;
}

.menu-bar ul li:hover ul {
    display: block;
}

.menu-bar ul li ul {
    display: none;
    position: absolute;
    min-width: 160px;
    top: 100%; 
    padding-top: 15px;
    background-color: inherit;
}

.menu-bar ul li ul li {
    display: block;
    border-right: 0;
}

.menu-bar i {
    font-size:28px;
    height: 28px;
    line-height: 0px;
    margin: 0 5px 0 5px;
}

.menu-bar .menu-reg {
    margin-right: auto;
    cursor: pointer;
}

.menu-bar .menu-phone {
    cursor: pointer;
}

.menu-bar .menu-phone span {
    direction: ltr;
}

.menu-bar .menu-item {
	padding-right: 2.6em;
}

.menu-bar .menu-item:before {
	position: absolute;
	color: Silver;
    font-family: icon;
    font-size: 1.5em;
	top: -0.5em;
	right: 0.5em;
}

.header {
    position: relative;
    width: 100%;
	height: 50vh;
	background-color: #D5CDBB;
}

.header img {
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
	background-color: #D5CDBB;
}

.search-panel {
    position: relative;
    background-color: rgba(242,242,242,.75);
    width:90%;
    max-width:640px;
    padding: 20px;
    border-radius: 5px;
}

.search-panel-header {
    width : 100% ;
    border-bottom: 1px solid #fff;
    margin: 0 0 10px 0;
    padding: 0 0 10px 0;
    font-size: 16px;
    color: gray;
}

.search-panel h1, .search-panel h2 {
    letter-spacing: -0.02em;
    word-spacing: -0.2em;
}


.mainselection {
    position: relative;
    width:100%;
    margin-right:auto;
    margin-left:auto;
    border-radius: 20px 20px 20px 20px;
    border: 1px solid #ccc;
    background-color: rgba(255, 255, 255, 0.9);
    overflow:hidden;
}

.mainselection div {
    position: absolute;
    width: 60px;
    top:10px;
    left:0px;
    font-size: 32px;
    line-height: 1em;
    text-align: center; 
    color : silver ;
    background: transparent;
    cursor: pointer;
}    

.mainselection select {
    border: none;
    color: silver;
    background: transparent;
    font-size: 18px;
    font-weight: bold;
    padding: 2px 20px;
    width: 100%;
    height: 50px;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.mainselection option {
    color: #000;
    font-weight: bold;
} 

.info-panel {
    position: relative;
    width:90%;
    max-width:700px;
    padding: 20px;
    border-radius: 5px;
	color: white;
}

.info-panel h1 {
	font-size: 1.8em;
}	

.info-panel p {
	font-size: 1em;
	color: silver;
}	

.info-panel div {
	max-width: 450px;
}

.info-panel .button {
	font-size: 1em;
	color: white;
	background-color: rgba(0,0,0,.25);
	border: 2px solid silver;
	padding: 0.5em 2em;
	margin: 10em 1.5em 0 1.5em;
	cursor: pointer;
}

.info-panel .button:hover {
	background-color: #555555;
}

.welcome { 
    overflow: hidden;    
} 

.welcome h3 {
    width: 100% ;
    font-size: 1.5em;
    text-align: center;
    overflow: hidden;
}

.welcome p {
    text-align: justify;
}

.welcome blockquote {
    text-align: center;
    font-size: 1.2em;
}

.max-min {
    height: auto;    
}

.mymorebtn {
    display:none;
    font-size: 0.8em;
    color: #00BFFF;
    background-color: transparent;
    cursor: pointer;
}

.mymorebtn-open {
    font-size: 0.8em;
    color: #00BFFF;
    background-color: transparent;
    cursor: pointer;
}

.orange {
    color: #ff6600;
}

.scroll-box {
    position: relative;
    display: flex;
    width: auto;
    margin-right:auto;
    margin-left:auto;
    overflow-x: auto;
    overflow-y: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.scroll-box::-webkit-scrollbar {
	display: none;
}

.scroll-box::-moz-scrollbars {
	display:none;
}

.scroll-box::-webkit-scrollbar-track {
    background: #fff; 
}
 
.scroll-box::-webkit-scrollbar-thumb {
    background: silver; 
}

.scroll-box::-webkit-scrollbar-thumb:hover {
    background: #555; 
}

.prev,
.next {
    position: absolute ;
    width: auto;
    top: calc(50% - 2em);
    padding: 1.3em 0.8em;
    color: white;
    font-weight: bold;
    font-size : 1.5em;
    line-height: 1.5em;
    user-select: none;
    -webkit-user-select: none;
    background-color: rgba(0, 0, 0, 0.4);
    cursor: pointer;
}

.next {
    left: 0;
    border-radius: 0 6px 6px 0;
}

.prev{
    right: 0;
    border-radius: 6px 0 0 6px;
}

.prev:hover,
.next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

.top-city {
    position: relative;
    width: 100% ;
    font-size: 0.5em;
}

.top-city-item {
    position: relative;
    width: 240px;
    height: 180px;
    margin:4px 0 6px 8px;
    border-radius: 10px;
    box-shadow: 0px 3px 5px #aaaaaa;
    overflow: hidden;
    flex-shrink: 0;
}

.top-city-item-title {
    position: absolute;
    top:80%;
    left:50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size:22px;
}

.top-city-item img {
    width: 240px;
    height: 180px;
}

.suite-images {
    position: relative;
    width: 100%;
    font-size: 0.8em;
    line-height: 0;
    background-color: black;
}

.suite-images-item {
    position: relative;
    width: 400px;
    height: 300px;
    border: 1px solid white;
    overflow: hidden;
    flex-shrink: 0;
}

.suite-images-item img {
    width: 400px;    
    height: 300px;
}    

.suite-box {
    width: 100%;
}

.suite-cell {
    position: relative;
    width: 100%;
    max-width: 320px;
    border: 1px solid #DFE1E5; 
    border-radius: 10px;
    overflow: hidden;
    margin: 0 3px 3px 3px;
}

.suite-img {
    position: relative;
    height: 240px;
    overflow: hidden;
	background-color: #FFFFFF;
}

.suite-img .image {
   position: absolute;
   width: 400px;
   height: 300px;
   left: 50%;
   top: 50%;
   -webkit-transform: translateY(-50%) translateX(-50%);
   right: initial;
}

.suite-cell .content {
    width: 100%;
    padding: 0 10px 0 10px;
	background-color: #FFFFFF;
}

.suite-cell .title {
    width: calc(100% - 30px);
    height: 1.68em;
}

.suite-cell h3 {
    width: calc(100% - 30px);
    text-align: right;
    font-size: 1.125em;
    color : #000000;
    overflow: hidden;
}

.suite-cell .fulllink {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding:240px 10px 0 10px;
    text-decoration: none;
    z-index:2;
}

.suite-cell .love {
    font-size: 1.2em;
    font-weight: normal;
    color: silver;
    line-height: .5em;
    margin-right: auto;
}

.suite-cell .code {
    font-size: 0.8em;
    color: SkyBlue;
}

.rating {
    margin-right: auto;
}

.rating-text {
    color: gray;
    font-size: 0.875em;
}

.suite-cell .description {
    width: 100%;  
    height:50px;
    font-size: 0.75em;
    line-height: 1.4em;
    color: gray;
    text-align: justify;
    overflow: hidden; 
}

.suite-cell .type {
    width: 50%;  
    font-size: 0.95em;
    white-space: nowrap;
    text-align: right;
    overflow: hidden; 
}

.suite-cell .price {
    width: 50%;  
    font-size: 0.95em;
    white-space: nowrap;
    text-align: left;
    overflow: hidden; 
}

.border {
    width: 100%;    
}    

.border .cell {
    width: 25%;
    text-align: center;
    line-height: 1.2em;
    border-right: 1px solid #DFE1E5; 
    margin: 10px 0;
    overflow: hidden; 
}

.border .cell:first-child {
    border-right: none;
}

.border .cell i {
    font-size: 1.3em;
    color: gray;
}

.border .cell span {
    display: block;
    width: 100%;
    font-size: 0.8em;
    text-align: center;
}

.suite-cell-more {
    width: 100%;
    bottom: 0;
    background-color: #FFFFFF;
    text-align: center;
    font-size: 0.95em;
    color: #000000;
    line-height: 24px;
    border: 1px solid #000000;
    border-radius: 10px;
    margin:  0 0 10px 0;
    padding: 8px 13px;
}

.breadcrumb {
    list-style: none;
    margin: 5px 0;
    padding: 0 15px;
}

.breadcrumb li {
    position: relative;
    min-width: 50px;
    margin-left: 20px;
    padding: 3px 5px;
    font-size: 0.875em;
    text-align: center;
    letter-spacing: -0.03em;
    word-spacing: -0.2em;
    background: #d7d7d7;
}

.breadcrumb li:after {
    content: "";
    position: absolute;
    top: 0;
    border: 0 solid transparent;
    border-width: 15px 10px;
    width: 0;
    height: 0;
    z-index: 0;
    right: 100%;
    border-right-color: #d7d7d7;
}

.breadcrumb li:before {
    content: "";
    position: absolute;
    top: 0;
    border: 0 solid #d7d7d7;
    border-width: 15px 10px;
    width: 0;
    height: 0;
    z-index: 0;
    right: -16px;
    border-right-color: transparent;
}

.breadcrumb a {
    text-decoration: none;
    color: black;
}

.suite-block {
	width: 70%;
}

.suite-sidebar {
	width: 30%;
	padding: 10px;
}

.suite-reservation {
	position: -webkit-sticky;
	position: sticky;
	top: 60px;
	width: 100%;
	border: 1px solid #d7d7d7;
}

.suite-reservation-header {
	padding: 5px 10px;
	font-size: 0.9em;
	color: #FFFFFF;
	background: #000000;
}

.suite-reservation-content {
	padding: 5px 10px;
	font-size: 0.9em;
}

.suite-reservation-bar {
	display: none;
	position: fixed;
	width: 100%;
	right: 0;
	bottom: 0;
	padding: 0 80px 0 10px;
	background: #F5F5F5;
}

.suite-reservation-bar span {
	font-size: 0.8em;
	padding: 0 2px;
}

.suite-reservation-bar b {
	font-size: 1.125em;
	color: #000000;
}

.suite-reservation-bar a {
	padding: 5px 15px;
	margin-top: 5px;
	margin-bottom: 5px;
	text-decoration: none;
	color: #FFFFFF;
	box-shadow: 0px 3px 5px #aaaaaa;
	background: red;
}

.suite-reservation select {
	width: 100%;
	height: 37px;
	padding: 4px 0;
	margin: 0 0 8px 0;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	color: #444444;
	background: #FFFFFF;
}

select[name="indate-y"],
select[name="indate-m"],
select[name="indate-d"] {
	width: 33%;
	-webkit-appearance1: none;
	-moz-appearance1: none;
	appearance1: none;
	text-align-last: center;
	margin: 0 -1px 8px -1px;
	border-radius: 4px;
}

select[name="indate-y"]{
	border-right: 0;
	border-radius: 4px 0 0 4px;
}

select[name="indate-m"]{
	border-right: 0;
	border-left: 0;
	border-radius: 0;
}

select[name="indate-d"]{
	border-left: 0;
	border-radius: 0 4px 4px 0;
}

.automargin-r {
	margin-right: auto;
}

.automargin-l {
	margin-left: auto;
}

.suite-title {
    font-size: 1.250em;
    overflow: hidden;
}

.suite-code {
    color: SkyBlue;
    font-size: 0.875em;
}

.suite-part-title {
    color: #484848;
    font-size: 1.125em;
    padding: 10px 0 5px 0;
}

.suite-part-content {
    font-size: 1em;
    text-align: justify;
}

.article {
    text-align: justify;    
	padding-bottom: 1em;
}

.article-title {
    color: #484848;
    font-size: 1.250em;
    margin: 20px 0 10px 0;
}

.article h2,.article h3 {
    color: #484848;
    font-size: 1.125em;
}

.article-images {
    position: relative;
    width: 100%;
    height: 300px;
    max-width: 400px;
    margin-right: auto;
    margin-left: auto;
    overflow: hidden;
}

.article-images .image {
	position: absolute;
	width: 400px;
	height: 300px;
	right: initial;
	left: 50%;
	top: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
}

.pagination {
    margin: 10px 0;
}

.pagination a,.pagination span {
    display: block;
    padding: 0.5em 1.2em;
    margin: 2px;
    border: 1px solid #d7d7d7;
    border-radius: 8px;
    color: inherit;
    text-align: center;
    text-decoration: none;
}

.pagination .active {
    background: #d7d7d7;
}

.category-title {
    margin: 0.5em 0 0.1em 0;
    font-size: 1.250em;
    overflow: hidden;
}

.center {
    text-align: center;
}

.frontpage-more-button {
	display: inline-block;
	width: 100%;
	height: 50px;
	margin: 10px 0;
	line-height: 50px;
	font-weight: bold;
	color: #ffffff;
	text-indent: 0;
	text-decoration: none;
	text-align: center;
	text-shadow: 1px 1px 0px #cc9f52;
	box-shadow: inset 0px 1px 0px 0px #fce2c1;
	background-color: rgb(255, 103, 1);
	border-radius: 6px;
}

.btn-green {
	display: inline-block;
    color:#fff;
    text-decoration:none;
    font-size: 16px;
    background:#6cc920;
    padding:6px 14px;
	margin: 10px 0;
    border:solid #fff 1px;
}

.btn-green:hover {
    background:#76d329;
}

.nemad {
	position: relative;
	width: 136px;
	height: 136px;
	margin: 10px 0;
}

.nemad .image1 {
    cursor: pointer;
	width: 125px;
	height: 136px;
}

.nemad .image2 {
    cursor: pointer;
	width: 136px;
	height: 136px;
}

.get-contact {
    width : 100% ;
    min-height: 60px;
    margin: 20px 0;
    text-align: center; 
    color: #299dbe ;
    background: #edfbff;
    border-radius: 10px;
    border: 1px solid PowderBlue; 
    padding: 10px 0;
}	

.get-contact-cel1 {
	width: calc(100% - 330px);
	padding: 10px;
	text-align: center;
}

.get-contact-cel2 {
	width: 330px;
	padding: 10px;
	text-align: center;
}

.get-contact-btn {
    padding: 6px 14px;
    border-radius: 50px;
    box-shadow: 0px 3px 5px #aaaaaa;
	text-decoration:none;
    font-size: 1.125em;
    color: #ffffff ;
    background: Coral ;
	cursor: pointer;
}

.get-contact-btn:hover {
    text-decoration: none;
    box-shadow: 0px 3px 3px #aaaaaa;
}

.contact_main {
    width:100%;
    max-width:600px;
    margin-right:auto;
    margin-left:auto;
    margin-top: 40px ;
    margin-bottom: 60px ;
    border-radius: 10px;
    overflow: hidden;
    line-height: 50px;
    color: #299dbe ;
    background: #edfbff;
}

.div_right {
    width:25%;
    min-width:150px;
    text-align:left;
    float: right;
}

.div_left {
    width:auto;
    text-align:center;
    overflow: hidden;
}

.telBox {
    width : calc(100% - 20px) ;
    margin : 20px auto 20px auto ;
    border-radius: 10px;
    border: 1px solid PowderBlue  ;
    padding : 15px 0 15px 0 ;
    color: #299dbe ;
    background: #edfbff ;
}

.telBox .rightBox {
    width : 50% ;
    min-width : 300px ;
    text-align: center; 
}

.telBox .leftBox {
    width : 50% ;
    min-width : 300px ;
    text-align: center; 
    margin : 10px 0 10px 0;
}

.telBox .rightBox h3 {
    font-size: 32px;
    color: #299dbe ;
    margin: 0;
}

.tel-box-btn {
    padding: 6px 24px;
    border-radius: 50px;
    box-shadow: 0px 3px 5px #aaaaaa;
	text-decoration:none;
	font-size: 1.125em;
    color: #ffffff ;
    background: red ;
    cursor: pointer;
}

.telBox a:hover {
    text-decoration: none;
    box-shadow: 0px 3px 3px #aaaaaa;
}

.blog-list a {
	display: inline-block;
	color : inherit;
	text-decoration: none;
}

.services {
	width: 100%;
	padding-top: 2em;
	padding-bottom: 2em;
}	

.services .col {
	width:25%;
	text-align: center; 
}	

.services .col h2 {
	font-size: 1.3em;
}	

.services .col a {
	display: block;
	text-decoration: none;
	color: gray;
}	

.services i {
	font-size: 3em;
	color: CadetBlue;
}	

.property {
	width: 100%;
	padding-top: 2em;
	padding-bottom: 2em;
	background-color: WhiteSmoke;
}

.property h3 {
	padding-bottom: 1em;
}

.property .col {
	width:25%;
}

.property p:before {
    font-family: icon;
	color : Green;
	margin-left: 1em;
	content: '\F133';
}

.samples {
	position: relative;
	width: 100%;
	padding-top: 2em;
	padding-bottom: 2em;
}	

.samples h3 {
	padding-bottom: 1em;
}

.samples .image {
	position: relative;
	width: 200px;
	height: 155px;
	border: 2px solid silver;
	margin:10px;
}

.footer {
    width: 100%;
    color: white;
    background-color: gray;
}

.footer-block {
    width: 25%;
    font-size: 1em;
    color: inherit;
    margin-bottom: 10px;
    padding: 0 5px;
    text-align: right;
    font-size: 1em;
}

.footer-block ul {
	color: inherit;
    margin-right: 15px;
}

.footer-block ul a {
    font-size: inherit;
	color: inherit;
	text-decoration: none;
}

.footer-block ul li ul {
    margin-right: 0;
}    

.footer-block-header {
    width: 100%;
    padding: 6px 5px;
    border-bottom: 1px solid white;
    font-size: 1em;
}

.footer-block-header h3 {
    font-size: inherit;
    text-align: right;
    color: inherit;
}

.footer-block-content {
    width: 100%;
    padding: 0 5px;
    font-size: 0.875em;
}

.footer-block-content p {
    font-size: inherit;
    text-align: justify;
}

.chat-layout {
    position: fixed;
    right:15px;
    bottom:15px;
    z-index:1400;
}

.chat-button {
    position: absolute;
    width: 64px;
    height: 64px;
    right: 0;
    bottom: 0;
    border: 1px solid #ffffff;
    border-radius: 50%;
    box-shadow: 0px 0px 20px 0px #C0C0C0;
    background-color: #FFA500;
    cursor: pointer;
}

.chat-button-icon {
    position: relative;
	display: block;
    width:38px;
    height:24px;
    margin:0 auto;
    border-radius: 6px;
    background-color: #ffffff ;
}

.chat-button-icon:after {
   	content: '';
	position: absolute;
	left: 70%;
	bottom: 0;
	margin-left: -5px;
	margin-bottom: -10px;
	border: 10px solid transparent;
	border-bottom: 0;
	border-right: 0;
	border-top-color: #ffffff ;
}

.dot {
    position: absolute;
    width:6px;
    height:6px;
    top:10px;
    right:7px;
    border: 0 solid #aaa;
    border-radius: 50%;
    background-color: #FFA500;
}

.dot:before {
    content: '';
    position: absolute;
    width:6px;
    height:6px;
    top:0;
    right:9px;
    border: 0 solid #aaa;
    border-radius: 50%;
    background-color: #FFA500;  
}

.dot:after {
    content: '';
    position: absolute;
    width:6px;
    height:6px;
    top:0;
    right:18px;
    border: 0 solid #aaa;
    border-radius: 50%;
    background-color: #FFA500;  
}

.chat-button-close {
    position: relative;
	display: none;
    width:32px;
    height:32px;
    margin:0 auto;
}

.chat-button-close:before, .chat-button-close:after {
    content: ' ';
    position: absolute;
    width: 3px;
    height: 33px;
    left: 15px;
    background-color: #fff;
}

.chat-button-close:before {
    transform: rotate(45deg);
}

.chat-button-close:after {
    transform: rotate(-45deg);
}

.chat-balloon-layout {
    position: absolute;
    display: none;
    width:195px;
    height:74px;
    bottom:74px;
    right:0px;
    cursor: pointer;
}

.chat-balloon {
    position: absolute;
    width:195px;
    height:74px;
    top:0;
    right:0;
    border-radius: 6px;
    box-shadow: 0px 0px 15px 0px #C0C0C0;
    font-weight: bold;
    background-color:#ffffff;
}

.chat-balloon:after {
   	content: '';
	position: absolute;
	left: 85%;
	bottom: 0;
	margin-left: -5px;
	margin-bottom: -10px;
	border: 10px solid transparent;
	border-bottom: 0;
	border-right: 0;
	border-top-color: #ffffff ;
}

.chat-balloon-close {
    position: absolute;
    width:26px;
    height:26px;
    left:5px;
    top:5px;
	background-color: inherit;
	cursor: pointer;
}

.chat-balloon-close:before, .chat-balloon-close:after {
    content: ' ';
    position: absolute;
    width: 2px;
    height: 18px;
    left: 11px;
    top:3px;
    background-color: #808080;
}

.chat-balloon-close:before {
    transform: rotate(45deg);
}

.chat-balloon-close:after {
    transform: rotate(-45deg);
}

.balloon-msg {
    position: absolute;
    top:15px;
    right :80px;
    width:130px;
    font-size:15px;
    letter-spacing: -0.02em;
    word-spacing: -0.1em;
    color:gray;
	text-align: right; 
}

.balloon-msg span {
     font-size:12px;
     color:gray;
}

.led-green {
    position: absolute;
    width:14px;
    height:14px;
    bottom:7px;
    right :52px;
    border-radius: 50%;
    border: 2px solid #ffffff;
    background-color:green;
    animation: blinkRed 0.5s infinite;
}

@-webkit-keyframes blinkRed {
  50% {opacity: 0.1;}
}

.avatar {
    position: absolute;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-image: url("/images/avatar.jpg"); 
}

.avatar-chat {
    right:10px;
    top:35px;
}

.avatar-ball {
    right:5px;
    top:5px;
}

.chat-box {
    position:fixed;
    display:none;
    width:340px;
    height:500px;
    right:40px;
    bottom:130px;
    border-radius: 10px;
    box-shadow: 0px 0px 15px 1px #aaaaaa;
    background-color: #F5F5F5;
    overflow:hidden; 
    z-index:1401;
}

.chat-box-header {
    position: relative;
    width:100%;
    height:110px;
    background-color: #FFA500;
    margin-bottom:15px;
}

.chat-title {
    position: absolute;
    right:90px;
    bottom:35px;  
    color:#ffffff;
    font-size:18px;
}

.chat-info {
    position: absolute;
    right:90px;
    bottom:10px;  
    color:#ffffff;
    font-size:12px;
}

.chat-icon-frame {
    position: absolute;
    width:64px;
    height:64px;
    left:15px;
    bottom:-30px;
    border-radius: 50%;
    box-shadow: 0px 0px 3px 0px #aaaaaa;
    background-color: #ffffff;
}

.chat-icon-icon {
    position: relative;
    display: block;
    width:38px;
    height:24px;
    margin:0 auto;
    margin-top:18px;
    border: 1px solid silver;
    border-radius: 6px;
    background-color:#ffffff;
}

.chat-icon-icon:after {
   	content: '';
	position: absolute;
	left: 70%;
	bottom: 0;
	margin-left: -5px;
	margin-bottom: -10px;
	border: 10px solid transparent;
	border-bottom: 0;
	border-right: 0;
	border-top-color: #ffffff ;
}

.chat-icon-icon:before {
   	content: '';
	position: absolute;
	left: 70%;
	bottom: 0;
	margin-left: -6px;
	margin-bottom: -12px;
	border: 12px solid transparent;
	border-bottom: 0;
	border-right: 0;
	border-top-color: silver ;
}

.chat-icon-line {
    position: absolute;
    width:20px;
    height:8px;
    top:7px;
	right: 8px;
    border-width: 2px 0 2px 0 ;
    border-style: solid;
    border-color: silver;
}

.chat-box span {
    margin-right:15px;
    line-height: 60px;
    padding:10px;
    border-radius: 8px;
    background-color:#ffffff;
}

.messenger-frame {
    position: absolute;
    width:calc(100% - 20px);
    height:58px;
    margin-right:10px;
    margin-left:10px;
	padding: 5px 5px;
    bottom:70px;
    border-radius: 50px;
    box-shadow: 0px 0px 3px 0px #aaaaaa;
    background-color:#ffffff;
}

.telegram-icon ,.whatsapp-icon , .phone-icon{
    position: relative;
    width:48px;
    height:48px;
}

.phone-icon	{
	display: none;
    position: relative;
    margin-right: auto;
}

.telegram-icon {
	margin-right:auto;	
}

.chat-close-button {
    position: absolute;
    width:calc(100% - 20px);
    height:48px;
	right: 0;
    margin-right:10px;
    margin-left:10px;
    bottom:10px;
    box-shadow: 0px 0px 3px 0px #aaaaaa;
    font-size:18px;
    font-weight: bold;
    color:#ffffff;
    text-align: center;
    line-height: 48px;
    background-color: #FF0000;
	cursor: pointer;
}

input[type=text]{
	display: block;
	width: 100%;
	height: 37px;
	padding: 4px 6px;
	margin: 8px 0 8px 0;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	color: #444444;
}

input[name="mobile"],
input[name="password"],
input[name="passwordrep"],
input[name="mobilenumber"],
input[name="phonenumber"],
input[name="analyticsid"],
input[name="enamadurl"],
input[name="samandehiurl"],
input[name="frontpagemorelink"],
input[name="menubgcolor"],
input[name="menutextcolor"],
input[name="textcolor"],
input[name="headerbgcolor"],
input[name="frontpagesuites"],
input[name="frontpagemorecolor"],
input[name="suitecelltitlecolor"],
input[name="telegramid"],
input[name="suitecellbgcolor"],
input[name="suitecellmorecolor"],
input[name="chatbuttoncolor"],
input[name="chatclosecolor"],
input[name="suitecellmoretextcolor"]{
    direction: ltr;
}	

input[type=submit]{
	display: block;
	min-width: 150px;	
	margin: 40px auto 20px auto;
	padding: 2px 15px;
	color: #FFFFFF;
	background-color: #46a546;
	border: 1px solid rgba(0,0,0,0.2);
	cursor: pointer;
}

input[name="save"]{
	margin: 20px 10px;
}

input[name="reservation"]{
	padding: 5px;
	margin: 10px auto 10px auto;
	box-shadow: 0px 3px 5px #aaaaaa;
	font-size: 1.125em;
	background-color: #FF0000;
}

input[name="password"],
input[name="passwordrep"] {
    -webkit-text-security: disc;
}

.login {
	display: block;
	position:relative;
	width: 100%;
	max-width: 300px;
	margin: 40px auto;
	padding: 15px;
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 5px;
	background-color: #F5F5F5;
}

.login H3 {
	padding: 0 0 0.5em 0;
	margin-bottom: 1em;
	font-size: 1.2em;
	color: #444444;
	border-bottom: 1px solid #ddd;
}

.login a {
	padding: 0 5px;
	text-decoration: none;
	color: #6495ED;
}

.forgot {
	font-size: 0.7em;
}

.alert-error {
	width: 100%;
	padding: 10px 15px;
	margin: 10px 0;
    border: 1px solid #ebccd1;
	border-radius: 3px;
    color: #a94442;
	background-color: #f2dede;
}

.alert-success {
	width: 100%;
	padding: 10px 15px;
	margin: 10px 0;
    border: 1px solid #d6e9c6;
	border-radius: 3px;
    color: #3c763d;
	background-color: #dff0d8;
}

.dashbord {
	padding: 15px;
}

.dashbord-right {
	position: relative;
	width: 250px;
}

.dashbord-main {
	width: calc(100% - 250px);
	padding-right: 10px;
}

.dashbord-section {
    position: relative;
	width: 100%;
    border: 1px solid #ddd;
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
}

.dashbord-section-header {
    font-size: 1em;
    padding: 0.5em 1em;
    color: #484848;
    background-color: #f5f5f5;
    border-bottom: 1px solid #ddd;
}

.dashbord-section-content {
	width: 100%;
	max-width: 470px;
    font-size: 0.9em;
    padding: 10px;
    color: #484848;
}

.dashbord-section-content li {
    margin-bottom: 1em;
}

.dashbord-section-content a {
    color: #484848;
	text-decoration: none;
}

.dashbord-section span {
	display: block;
    width: 150px;
	padding: 4px 0;
	margin: 8px 0 8px 0;
	color: #555555;
}

.dashbord-section input[type=text] {
	display: block;
	width: 300px;
	height: 37px;
	padding: 4px 6px;
	margin: 8px 0 8px 0;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	color: #444444;
}

.dashbord-section textarea {
	display: block;
	width: 300px;
	height: 150px;
	padding: 12px 20px;
	margin: 10px 0;
	box-sizing: border-box;
	border: 2px solid #ccc;
	border-radius: 4px;
	resize: none;
	color: #444444;
}

.dashbord-section select {
	width: 300px;
	height: 37px;
	margin:10px 0;
	border: 2px solid #ccc;
	color: #444444;
	background-color: #FFFFFF;
}

.show {
    display: block;
}

.hide {
    display: none;
}


@media only screen and (min-width: 1024px) {
    .block {
        padding-right:calc((100% - 984px)/2);
        padding-left:calc((100% - 984px)/2);
    }
}


@media only screen and (max-width: 1044px) {

	.block {
        padding:0 1em 0 1em;    
    }
    
    .menu-bar,.services {
        padding: 0 15px 0 15px;
    }

    .menu-nav {
        display: none;
        background-color: inherit;
    }

    .menu-bar ul {
        position: absolute;
        width: 100%;
        top: 60px;
        right: 0;
    }

	.menu-bar ul a {
		display: block;
		width: 100%;
		padding: 1em 0;
	}

	.menu-bar ul span {
		display: block;
		width: 100%;
		padding: 1em 0;
	}
	
	.menu-bar ul li {
        display: block;
        position: relative;
        border-right: 0;
    }

    .menu-bar ul li ul {
        position: relative;
        width: 100%;
        top : 0; 
        padding-top: 0;
    }

    .menu-bar ul li ul li {
        padding: 0;
    }

    .menu-bar .menu-reg span {
        font-size: 10px;
        letter-spacing: -0.03em;
        word-spacing: -0.2em;
    }

    .menu-bar .menu-phone span {
        display: none;
    }
    
    .menu-button , .menu-button-close {
        display: block;
        position: relative;
        cursor: pointer;
        height: 36px;
        width: 36px;
        margin-right: 5px;
        background-color: inherit;
    }

    .menu-button:before , .menu-button-close:before {
        content: "";
        position: absolute;
        top: 7px;
        right: 0;
        width: 36px;
        height: 5px;
        border-top: 5px solid #999999;
        transition: 0.4s;
    }

    .menu-button:after , .menu-button-close:after {
        content: "";
        position: absolute;
        top: 17px;
        right: 0;
        width: 36px;
        height: 5px;
        border-top: 5px solid #999999;
        border-bottom: 5px solid #999999;
        transition: 0.4s;
    }

    .menu-button-close:before {
        -webkit-transform: rotate(-45deg) translate(-3px, 10px);
        transform: rotate(-45deg) translate(-5px, 9px);
    }

    .menu-button-close:after {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        border-bottom: 0px solid transparent;
    }
    
	.menu-bar .menu-item:before {
		top: 0.2em;
	}

	.info-panel div {
		text-align: center; 
	}

	.info-panel .button {
		margin: 2em 1.5em 0 1.5em;
	}

	.services .col {
		width: 100%;
		min-width: 200px;
	}

	.property .col {
		width: 100%;
		padding-right: 30px;
	}

    .max-min {
        height: 268px;
    }

    .max-min-open {
        height: auto;
    }

    .mymorebtn {
        display: inline-block;
    }

    .mymorebtn:after  {
        content: "+ مشاهده بیشتر ...";
    }

    .mymorebtn-open:after  {
        content: "- مشاهده کمتر ...";
    }
    
    
    .arrow-right ,.arrow-left { 
        display : none ;
    }

    .imageScroll {
        width: 100% ;
    }

    .imageItem:First-child {
        margin-right: 0;
    }
    
    .suite-cell {
        max-width: 328px;
        margin: 0 0 5px 0;
    }
    
	.get-contact-cel1,.get-contact-cel2 {
		width: 100%;
	}

	.blog-list a {
		padding: 1em 0;
	}
	
	.footer-block {
        width: 100% ;
        padding: 0;
    }

	.footer-block-content ul a {
		display: block;
		width: 100%;
		padding: 1em 0;
	}

	.footer-block-content ul span {
		display: block;
		width: 100%;
		padding: 1em 0;
	}
	
	.chat-box {
		width: 100%;
		height: 100%;
	    right: 0;
		top: 0;
	}
	
	.phone-icon{
		display: block;
    }

	.suite-block {
		width: 100%;
	}

	.suite-reservation-bar {
		display: flex;
	}

	.suite-sidebar {
		width: 100%;
		padding: 10px 0;
	}

	.dashbord-section span {
    	width: 100%;
		padding: 0;
		margin: 0;
	}

	.dashbord-section input[type=text] {
		width: 100%;
		margin-top: 0;
	}

	.dashbord-section textarea {
		width: 100%;
		margin-top: 0;
	}

	.dashbord-section select {
		width: 100%;
		margin-top: 0;
	}

	.dashbord-right {
		width: 100%;
	}

	.dashbord-main {
		width: 100%;
		padding-right: 0;
	}

	input[name="save"]{
		margin: 20px auto;
	}

	.show {
        display: block;
    }

    .hide {
        display: none;
    }


}


.icon {
    text-align: center;
    font-style: normal;
    line-height: inherit;
    font-size: inherit;
}

.icon:before {
    font-family: icon;
    line-height: .7em;
}

.icon:after {
    font-family: icon;
}

.icon_group:before {
    content: '\F180';
}

.icon_rooms:before {
    content: '\F1CE';
}

.icon_externallink:before {
    content: '\F16B';
}

.icon_currencyrub:before {
    content: '\F153';
}

.icon_heartalt:before {
    content: '\F189';
}

.icon_user:before {
    content: '\F1FC';
}

.icon_phone:before {
    content: '\F1B9';
}

.icon_magnifier:before {
    content: '\F1D0';
}

.icon_system:before {
    content: '\F15C';
}

.icon_license:before {
    content: '\F194';
}

.icon_letter:before {
    content: '\F168';
}

.icon_sms:before {
    content: '\F13F';
}

.icon_star:before {
    content: '\F1E1';
}

.menu-bar .suite_icon:before {
    content: "\F138";
}

.menu-bar .hotel_icon:before {
	content: "\F10D";
}

.menu-bar .restaurant_icon:before {
	content: "\F1AA";
}

.menu-bar .attraction_icon:before {
	content: "\F1B6";
}

.icon_star.active {
    color: #efce4a;
}

.icon_star.deactive {
    color: #ddd;
}
