﻿.ng-cloak, .overlayContainer, .x-ng.ng-cloak, [data-ng-cloak], [ng-cloak], [ng\:cloak], [x-ng-cloak] {
    display: none
}

.nav-tabs > li > a, .overlayContent {
    font-weight: 700
}

.dariush-preview-parent, header a, header h1 a {
    cursor: pointer
}

html {
    margin: 0;
    padding: 0
}

body {
    background-image: url(images/mainpattern.png);
}

video {
    width: 100%;
}

.dariush-font-1-3 {
    font-size: 1.3rem;
    line-height: 2.5rem;
}

.dariush-mediagallery-image-container {
    position: relative;
    margin-bottom: 20px;
}

.dariush-architecture-image {
    border-radius: 5px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, .5);
    margin-bottom: 30px;
    width: 100%;
}

.dariush-mediagallery-image-container img {
    border-radius: 5px;
}

#hotelAboutFacilityMainContainer img {
    max-width: 100% !important;
    border-radius: 3px;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
}

input[type=number] {
    -moz-appearance: textfield
}

input::-webkit-inner-spin-button, input::-webkit-outer-spin-button {
    -webkit-appearance: none
}

.alertify .ajs-body, .alertify .ajs-header {
    font-family: irsans,xSans,'Josefin Sans' !important
}

.modal-backdrop, .modal-backdrop.fade.in {
    opacity: .5;
    filter: alpha(opacity=50)
}

.overlayBackground {
    top: 0;
    left: 0;
    padding-left: 100px;
    position: absolute;
    z-index: 1000;
    height: 100%;
    width: 100%;
    background-color: grey;
    opacity: .3
}

.overlayContent {
    position: absolute;
    color: #fff;
    height: 100px;
    width: 280px;
    z-index: 1000;
    text-align: center
}

input.ng-invalid, input.ng-invalid-pattern, input.ng-invalid-required, select.ng-invalid, select.ng-invalid.required {
    border-left: 5px solid #E03930 !important
}

input.ng-valid, input.ng-valid-required, select.ng-valid, select.ng-valid.required {
    border-left: 5px solid #57A83F
}

.ADMdtpInput input, .novalidate {
    border: 1px solid #dcdcdc !important
}

.ADMdtp-box header {
    background-color: transparent !important;
    background-image: none !important
}

.carousel-inner {
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    border-radius: 3px;
}

.clockpicker-popover {
    right: auto;
    left: auto;
    font-family: inherit;
    direction: ltr
}

.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10
}

.dariush-display-flex {
    display: flex
}

.dariush-preview {
    display: none;
    z-index: 10;
    margin: 10px;
    background: #fbfbfb;
    border: 3px solid #fefefe;
    border-radius: 5px;
    box-shadow: 3px 3px 5px rgba(0,0,0,.7)
}

footer, header {
    background-color: rgba(1,15,42,.85)
}

.dariush-preview-parent:hover ~ .dariush-preview {
    display: block
}

.dariush-height-100 {
    height: 100px
}

.dariush-width-32 {
    width: 32px
}

.dariush-width-320 {
    width: 320px
}

.dariush-height-50 {
    height: 50px
}

.dariush-margin-top-60 {
    margin-top: 60px
}

.dariush-margin-top-120 {
    margin-top: 120px
}

.dariush-border-radius-0 {
    border-radius: 0
}

.dariush-display-flex header {
    border-bottom: 5px solid #27334a;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    background-image: radial-gradient(ellipse at 50% -5%, #0e6696 10%, transparent 75%)
}

    header span {
        color: #fff;
        font-size: 1.3rem
    }

    header h1 a {
        border-bottom: unset;
        color: #fff;
        text-decoration: none;
        padding: 5px
    }

    header a {
        color: #fff;
        text-decoration: none;
        padding: 3px;
        border-bottom: 1px solid #dea700;
        margin: 3px
    }

        header a:active, header a:focus, header a:hover {
            color: #fff;
            background-color: #dea700;
            text-decoration: none
        }

    header h1 {
        color: #fff;
        font-size: 2rem
    }

        header h1 img {
            height: 50px;
            margin-top: -10px
        }

        header h1 a:active, header h1 a:focus, header h1 a:hover {
            color: #fff;
            background-color: transparent;
            text-decoration: none
        }

.dariush-header-language-area-on-mobile {
    height: 60px;
    padding: 25px 0 10px
}

footer {
    color: #fff !important;
    background-image: url(images/pattern.png)
}

.dariush-margin-ub8 {
    margin: 8px auto
}

.dariush-margin-ub16 {
    margin: 16px auto
}

.dariush-margin-ub32 {
    margin: 32px auto
}

.dariush-margin-ub64 {
    margin: 64px auto
}

.dariush-padding-ub8 {
    padding: 8px 0
}

.dariush-padding-ub16 {
    padding: 16px 0
}

.dariush-padding-ub32 {
    padding: 32px 0
}

.dariush-padding-ub64 {
    padding: 64px 0
}

.dariush-social-network-icon {
    width: 60px;
    background: #fff;
    border-radius: 50%;
    padding: 5px
}

.dariush-display-flow-root {
    display: flow-root
}

.dariush-height-125 {
    height: 125px;
    margin: 10px 0
}

.dariush-border-radius-5 {
    border-radius: 5px
}

.dariush-white {
    color: #fff
}

.dariush-red {
    color: #dc3939
}

.dariush-green {
    color: #4b944b
}

.dariush-goldenrod {
    color: #daa520
}

.dariush-display-none {
    display: none
}

.dariush-mainPage-search-partial {
    color: #fff;
    background-color: rgba(1,15,42,.9);
    background-image: radial-gradient(ellipse at 50% 50%,#0e6696 8%,transparent 85%);
    text-align: center
}

.dariush-padding-0-1 {
    padding: 0 1px;
}

.dariush-padding-1-img-radius-3 {
    padding: 1px;
}
    .dariush-padding-1-img-radius-3 div img {
        border-radius: 3px;
    }

#Intro img {
    opacity: .85;
    width: 100%
}

#Intro .dariush-image-container {
    position: relative
}

#Intro .dariush-image-image {
    opacity: .8;
    display: block;
    width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden
}

#Intro .dariush-image-middle {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    text-align: center;
    min-width: 180px
}

#Intro .dariush-image-container:hover .dariush-image-image {
    filter: grayscale(80%)
}

#Intro .dariush-image-container:hover .dariush-image-middle {
    opacity: 1;
    -webkit-animation: animate_show3 1s;
    animation: animate_show3 1s
}

#Intro .dariush-image-text {
    text-decoration: none;
    background-color: rgba(224,173,74,1);
    color: #fff;
    text-shadow: 1px 1px 3px rgba(0,0,0,.8);
    padding: 4px 8px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, .5);
    display: block;
    border-radius: 20px;
}

.dariush-line-normal {
    line-height: 30px
}

.dariush-main-page-carousel-slogan {
    margin: 0;
    padding: 8px 0;
    font-size: 16px;
    line-height: 22px
}

.dariush-width-50 {
    width: 50%
}

.dariush-width-100 {
    width: 100% !important
}

.dariush-justify {
    text-align: justify;
    margin-bottom: 2rem !important;
}

.thumbnail {
    height: 100%;
    background: rgba(256,256,256,.9)
}

.dariush-event-card-caption-link {
    position: absolute;
    bottom: 10px
}

.row.display-flex {
    display: flex;
    flex-wrap: wrap
}

.bs-callout {
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-right-width: 5px;
    border-radius: 3px
}

    .bs-callout h5 {
        margin-top: 0
    }

.bs-callout-info {
    border-right-color: #5bc0de
}

    .bs-callout-info h5 {
        color: #5bc0de
    }

.bs-callout-danger {
    border-right-color: #bf3333
}

    .bs-callout-danger h5 {
        color: #bf3333
    }

.dariush-parallax {
    background-image: url(images/dgh/dghparallax.jpg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 350px
}

.modal-dialog {
    width: 1200px
}

.modal-footer {
    text-align: right
}

.dariush-map {
    width: 100%;
    height: 420px
}

.dariush-margin-b10 {
    margin-bottom: 10px
}

.form-control {
    font-size: inherit
}

.dariush-position-absolute {
    position: absolute
}

.dariush-gallery-image-preview-alt {
    color: #fff;
    background: rgba(0,0,0,.3);
    padding: 5px 10px;
    position: absolute;
    margin-top: -75px;
    transform: translate(50%);
    width: 90%;
    font-weight: 400;
    border-radius: 5px;
}

.list-unstyled a {
    text-decoration: none;
    line-height: 30px
}

    .list-unstyled a:hover {
        color: #fff;
        font-size: 14px
    }

.tinyMceCommentArea img {
    max-width: 100%
}


.tinyMceCommentArea p {
    text-align: justify;
    line-height: 2rem;
}

.dariush-white-disabled {
    background-color: #fbfbfb !important
}

.dariush-info-table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #f2faff !important
}

.carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img {
    width: 100%
}

strong {
    line-height: 2rem;
}

@media (max-width:1366px) {
    .dariush-main-page-carousel-slogan {
        margin: 0;
        padding: 1px 0;
        font-size: 15px;
        line-height: 21px
    }

    #Intro .dariush-image-text {
        font-size: 12px
    }

    header a {
        font-size: 10px
    }
}

@media (max-width:1280px) {
    .dariush-main-page-carousel-slogan {
        margin: 0;
        padding: 1px 0;
        font-size: 13px;
        line-height: 18px
    }
}

@media (max-width:1024px) {
    .modal-dialog {
        width: 800px;
    }
    .dariush-main-page-carousel-slogan {
        margin: 0;
        padding: 0;
        font-size: 9.5px;
        line-height: 13px
    }

    .dariush-display-on-tablet-landscape {
        display: block
    }

    .dariush-display-none-on-tablet-landscape {
        display: none
    }
}

@media (max-width:768px) {
    .modal-dialog {
        width: 95%;
    }
    .dariush-display-on-tablet-portrait {
        display: block
    }

    .dariush-display-none-on-tablet-portrait {
        display: none
    }

    header h1 {
        color: #fff;
        font-size: 18px
    }

        header h1 img {
            height: 40px;
            margin-top: -5px
        }

    .dariush-main-page-carousel-slogan {
        margin: 0;
        padding: 0;
        font-size: 8px;
        line-height: 6px
    }

    #Intro .dariush-image-text {
        font-size: 8px;
        padding: 4px
    }
}

@media (max-width:576px) {
    .modal-dialog {
        width: 95%;
    }
    header {
        padding-bottom: 20px
    }

    #whysloganheader {
        font-size: 22px
    }

    .dariush-display-on-mobile {
        display: block
    }

    .dariush-display-none-on-mobile {
        display: none
    }
}

.star1, .star2 {
    visibility: hidden
}

.fadeIn1, .fadeIn2, .fadeIn3 {
    visibility: visible !important
}

.fadeIn1 {
    -webkit-animation: animate_show1 1.5s;
    animation: animate_show1 1.5s
}

.fadeIn2 {
    -webkit-animation: animate_show2 1s;
    animation: animate_show2 1s
}

.fadeIn3 {
    -webkit-animation: animate_show3 1s;
    animation: animate_show3 1s
}

@-webkit-keyframes animate_show1 {
    0% {
        opacity: 0;
        transform: translateX(500px)
    }

    60% {
        opacity: .6;
        transform: translateX(-100px)
    }

    100% {
        opacity: 1;
        transform: translateX(0)
    }
}

@-webkit-keyframes animate_show2 {
    0% {
        opacity: 0;
        transform: scale(.1)
    }

    60% {
        opacity: .6;
        transform: scale(1.2)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

@-webkit-keyframes animate_show3 {
    0% {
        transform: translate(50px,100px)
    }

    80% {
        transform: translate(-100px,-30px)
    }
}
