/*
Template Name: Book html5 templete
Author:  Mohammad Shohag
Author URI: https://themeforest.net/user/shohag4y
Version: 1.0

====/========        ===== ==/====/
             CSS Index
====/========        =======/====/

01. reset CSS         ====================>

02. Header area css      ====================>

03.Header area css    ====================>>

04.Home area css   ====================>>

05.About area css     ====================>>

06.client area css ====================>>

07.party video area css    ====================>>

08.Room css ====================>>>

08.Room details    ====================>>>

10.Service css     ====================>>>

11.Team css     ====================>>>

12.Home 2 css     ====================>>>

13.404 area css     ====================>>>

13.Contact area css     ====================>>>

13.Preloader css     ====================>>>

*/

/*====/========        ===== ==/====/
             Reset CSS 
 ====/========        =======/====/*/


/* Google font poppins  */

@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700,700i,900,900i|Roboto:300,300i,400,400i,500,500i,700,700i,900,900i');


* {
    padding: 0;
    margin: 0;
    outline: none;
}

a,
span {
    display: inline-block;
    -webkit-transition: .4s;
    transition: .4s;
}

a:focus,
a:hover {
    text-decoration: none;
}

img {
    max-width: 100%;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    color: #222222;
    line-height: 28px;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    padding: 0;
    margin: 0;
}

ul {
    padding: 0;
    margin: 0;
    list-style: none
}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
    color: #666666
}
html, body{
    height: 100%;
}

/*====/========        ===== ==/====/
            top css 
 ====/========        =======/====/*/
.top-center-content h4 {
    font-size:  20px;
    font-weight:  600;
    margin-bottom: 11px;
}

.top-center-content p {
    color:  #666666;
    font-weight:  500;
    font-size:  14px;
}

a.top-btn {
    padding: 13px 35px;
    color:  #ffffff;
    font-size:  18px;
    font-weight:  900;
    background:  #70c639;
    border-radius:  4px;
}
.top-area {
    padding:  20px 0px;
}

.logo {
    padding-top:  14px;
}

.top-right {
    padding-top: 20px;
}

a.top-btn:hover {
    background:  #fdc441;
}
/*====/========        ===== ==/====/
            hero css 
 ====/========        =======/====/*/

.hero-area{
    background: url(assets/img/hero-bg.jpg)no-repeat;
    background-size: cover;
    background-position: center;
    padding: 170px 0px;
}
.hero-left-content h4 {
    font-size:  20px;
    color:  #fff;
    font-weight:  600;
}

.hero-left-content h1 {
    font-size:  50px;
    color:  #fff;
    font-weight:  600;
    line-height: 62px;
    margin-top: 14px;
}

.hero-left-content h5 {
    color:  #fff;
    font-weight:  600;
    margin-top: 15px;
}
.hero-left-content p {
    color:  #fff;
    font-size:  20px;
    margin-bottom:  0px;
    margin-top:  7px;
}

.hero-right-form input[type="text"] {
    width:  100%;
    border: none;
    padding: 14px 10px;
    color:  #666666;
    border-radius:  3px;
}

.hero-right-form input.myClass{
    width:  100%;
    border: none;
    padding: 14px 10px;
    color:  #666666;
    border-radius:  3px;
}

input.myClass.flatpickr-input.flatpickr-mobile{
    width:  100%;
    border: none;
    padding: 14px 10px;
    color:  #666666;
    border-radius:  3px;
}

.hero-right-form {
    background: #fec52e;
    padding: 22px 33px;
    border-radius: 4px;
}

.hero-right-form input::-webkit-input-placeholder {
    color: #666;
}

.hero-right-form input::-moz-placeholder {
    color: #666;
}

.hero-right-form input:-ms-input-placeholder {
    color: #666;
}

.hero-right-form input::placeholder {
    color: #666;
}
.nice-select.select-active-menu {
    width:  100%;
    font-weight:  500;
    color: #666666;
    border: none;
    height:  55px;
    padding-top:  8px;
}

.hero-right-form input[type="submit"] {
    width:  100%;
    border:  none;
    background:  #70c639;
    padding: 14px;
    color:  #fff;
    border-radius:  4px;
    margin-top:  5px;
    cursor: pointer;
    -webkit-transition: .4s;
    transition: .4s;
}
.hero-right-form input[type="submit"]:hover {
    background: #fff;
    color: #70c639;
}
.hero-right-form h4 {
    color:  #fff;
    font-size:  20px;
    margin-bottom: 30px;
    font-weight:  700;
}
span.calender-icon {
    position:  relative;
}

span.calender-icon i {
    position:  absolute;
    top: 22px;
    right: 8px;
    font-size:  13px;
}
.hero-right-form .col-md-6, .hero-right-form .col-md-12 {
    margin:  0px;
    padding:  5px;
}

/*====/========        ===== ==/====/
            header css 
 ====/========        =======/====/*/

.header-area {
    background:  #70c639;
    padding: 12px 0px;
}

.mainmenu-area li {
    display:  inline-block;
    position:  relative;
}

.mainmenu-area li a {
    display:  block;
    padding: 10px 15px;
    font-weight: 700;
    color:  #fff;
}

.mainmenu-area li a:hover {
    color:  #fec52e;
}
.slicknav_menu{
    display: none;
}

.mainmenu-area ul.subdrop-menu {
    position: absolute;
    width: 210px;
    background: #fff;
    border: 1px solid #ddd;
    top: 40px;
    text-align: left;
    z-index: 2;
    padding-bottom: 10px;
    padding-top: 10px;
    border-bottom: 3px solid #70c639;
    border-radius: 4px;
    -webkit-transition: .3s;
    transition: .3s;
    left: 15px;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
    -webkit-transform-origin: top;
    transform-origin: top;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-transform: scale(1, .7);
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.mainmenu-area ul li:hover ul.subdrop-menu {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
}

.mainmenu-area ul.subdrop-menu li {
    display: block;
}

.mainmenu-area ul.subdrop-menu li a {
    display: block;
    text-align:  left;
    line-height: 18px;
    color: #333;
}
/*====/========        ===== ==/====/
            agency css 
 ====/========        =======/====/*/
.agency-area {
    padding:  90px 0px;
    background:  #f4f4f4;
}

.agency-text h1 {
    font-size:  30px;
    color:  #222222;
    font-weight:  800;
}

.agency-text h1 span {
    color:  #70c639;
}

.agency-text p {
    color:  #666666;
    margin-top: 28px;
    margin-bottom:  30px;
}

a.agency-btn {
    font-weight: 800;
    font-size:  18px;
    color:  #fff;
    padding: 14px 0px;
    background:  #70c639;
    min-width:  160px;
    border-radius:  4px;
    margin:  0px 15px;
}

a.agency-btn:hover {
    background:  #fdc441;
}

/*====/========        ===== ==/====/
            hollyday package css 
 ====/========        =======/====/*/
.section-padding{
    padding: 100px 0px;
}
.hollyday-title h2 {
    font-size:  30px;
    color:  #222222;
}

.hollyday-title h2 span {
    color:  #70c639;
}

.hollyday-title {
    margin-bottom:  50px;
}

.hollyday-single-items h3 {
    font-size:  25px;
    color:  #70c639;
    font-weight:  700;
    margin-top: 26px;
    margin-bottom: 7px;
}
.hollyday-single-items h3
 span {
    position:  relative;
}

.hollyday-single-items h3 span:after {
    position:  absolute;
    right:  0;
    top: 17px;
    width:  100%;
    height: 1px;
    content:  "";
    background: #70c639;
}

.hollyday-single-items p {
    color:  #666666;
    margin-bottom: 10px;
}

.hollyday-single-items span {
    font-size:  14px;
    color:  #666666;
    display:  block;
}

.hollyday-single-items span.admin-user {
    float: right;
}

span.price-sts {
    font-size: 25px;
    display: inline-block;
    color: #222222;
    font-weight: 700;
    margin-top: 10px;
}
a.hollyday-btn {
    float:  right;
    font-size:  16px;
    padding: 10px 40px;
    background:  #70c639;
    color:  #fff;
    font-weight: 700;
    display:  inline-block;
    border-radius:  4px;
}
a.hollyday-btn:hover {
   background: #fcc34e;
   color: #fff;
}
.hollyday-package-text-bottom {
    margin-top: 25px;
}
.hollyday-single-items {
    padding-bottom: 35px;
    border-bottom: 10px solid #f0f1f1;
    -webkit-transition: .4s;
    transition: .4s;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
}
.hollyday-single-items:hover {
    box-shadow: 0px 14px 20px #f1f1f2;
    border-bottom: 10px solid transparent;
}


/*service area*/
.secrive-area {
    background:  #f4f4f4;
}

.agency-text.cta {
    margin-bottom: 76px;
}

.service-single-item span {
    height:  70px;
    width:  70px;
    background:  #fff;
    line-height:  70px;
    border-radius: 100px;
    box-shadow: 0px 10px 10px #e0eed8;
}

.service-single-item h4 {
    font-size:  20px;
    margin-top:  20px;
    color:  #222222;
    margin-bottom:  10px;
}

.service-single-item p {
    color:  #666666;
    font-size:  14px;
}

/*====/========        ===== ==/====/
            deals package css 
 ====/========        =======/====/*/
.deals-text h3 {
    font-size:  30px;
    color:  #282828;
    line-height:  37px;
    margin-bottom: 24px;
}

.deals-text h3 span {
    color: #70c639;
}

.deals-text p {
    color:  #666666;
    font-size:  14px;
}

.deals-text ul li {
    font-size:  14px;
    color:  #222222;
    line-height: 26px;
}

.deals-text ul {
    margin-top: 28px;
}

.deals-text ul li i {
    color:  #70c639;
    margin-right: 5px;
}

.deals-text a {
    margin-top: 40px;
}

/*====/========        ===== ==/====/
        booking area css 
 ====/========        =======/====/*/
.booking-area{
    background: url(images/1920-530/massage-center.jpg)no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 1;
}
.booking-area:after {
    position:  absolute;
    left:  0;
    top: 0;
    height:  100%;
    width:  100%;
    content:  "";
    background:  #469c1a;
    opacity:  .9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    z-index: -1;
}

.section-title h3 {
    color:  #ffffff;
    font-size:  30px;
    margin-bottom:  30px;
}

.section-title p {
    color: #f4f4f4;
    margin-bottom:  0px;
}

.section-title {
    margin-bottom:  60px;
}

.booking-single-items h3 {
    font-size:  20px;
    color:  #fff;
    margin-top: 16px;
}

.booking-single-items p {
    color:  #f4f4f4;
    margin-bottom:  0px;
    margin-top: 10px;
}

/*====/========        ===== ==/====/
        room slide area css 
 ====/========        =======/====/*/
.section-title.cta h3 {
    color:  #222222;
}
.room-slide-area {
    padding-top: 100px;
}

.section-title.cta p {
    color:  #666666;
}

.section-title.cta h3 span {
    color:  #70c639;
}

.section-title.cta h3 {
    color:  #222222;
}

.section-title.cta p {
    color:  #666666;
}

.section-title.cta h3 span {
    color:  #70c639;
}

.room-single-slide .hollyday-single-items span {
    display: inline;
}

.room-single-slide h3 span {
    float:  right;
    color:  #70c639;
    font-size:  18px;
}

.room-single-slide p {
    font-size:  14px;
    color:  #666666;
}

.room-single-slide p span {
    float:  right;
    font-size:  25px;
    font-weight:  700;
    color:  #222222;
}

span.rating-scta i {
    color:  #fec52e;
    padding-right:  1px;
}

span.rating-right {
    color:  #666666;
}

.room-slide-text-bottom span.rating-right {
    float: right;
}

.room-slide-text-bottom {
    margin-top: 15px;
}

.room-single-slide .hollyday-single-items {
    padding-bottom: 25px;
}
.room-single-slide h3 a {
    color:  #72c443;
}

.room-slide-area .owl-nav div, .about-slide-area .owl-nav div {
    position:  absolute;
    top: 30%;
    left: -60px;
    font-size:  25px;
    height:  50px;
    width: 50px;
    background:  #cfcfcf;
    text-align:  center;
    line-height:  50px;
    border-radius:  100px;
    -webkit-transform: translateY(-30%);
            transform: translateY(-30%);
    -webkit-transition: .4s;
    transition:  .4s;
    color:  #fff;
}

.about-slide-area .owl-nav div {
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}

.room-slide-area .owl-nav .owl-next, .about-slide-area .owl-nav .owl-next {
    left:  auto;
    right: -60px;
}

.room-slide-area .owl-nav div:hover,  .about-slide-area .owl-nav div:hover {
    background:  #74c24b;
}

.room-bottom-single-item-cta {
    position:  relative;
    z-index:  1;
    border-radius:  3px;
}

.room-bottom-text {
    position:  absolute;
    top: 44%;
    width:  100%;
    color:  #fff;
    padding: 0px 20px;
    -webkit-transform: translateY(-44%);
            transform: translateY(-44%);
    z-index: 2;
}

.room-bottom-text h2 {
    color:  #fff;
}

.room-bottom-single-item-cta:after {
    position:  absolute;
    left:  0;
    top:  0;
    height:  100%;
    width:  100%;
    content:  "";
    background: #40911a;
    opacity: .9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    border-radius:  3px;
}

.room-bottom-text h2 {
    margin-bottom: 26px;
    line-height: 35px;
    font-size:  30px;
}

.room-bottom-single-item-cta p {
    line-height: 26px;
    margin-bottom: 35px;
}

a.room-bottm-btn {
    padding:  13px 33px;
    background:  #70c639;
    color:  #fff;
    font-weight:  800;
    font-size:  18px;
    border-radius:  4px;
}

a.room-bottm-btn:hover {
    background:  #fff;
    color:  #72c443;
}

.room-bottom-single-item-cta:before {
    position:  absolute;
    left:  20px;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    content:  "";
    border: 1px solid #b8d6a0;
    z-index:  2;
    top: 20px;
}

.room-bottom-single-item {
    position: relative;
    margin-bottom: 10px;
}

a.room-bottm-btn.cta {
    position:  absolute;
    z-index:  1;
    bottom: 25px;
    left: 25px;
    background:  #ffffff;
    color:  #72c443;
}

a.room-bottm-btn.cta:hover {
    background:  #72c443;
    color:  #fff;
}

.room-bottom-area {
    padding-bottom:  80px;
}

/*====/========        ===== ==/====/
        counter area css 
 ====/========        =======/====/*/
.counter-area {
    background:  #68b735;
    padding: 90px 0px;
}

.counter-single img {
    float:  left;
    padding-top:  6px;
}

.counter-single {
    text-align:  left;
}

.counter-text {
    margin-left: 73px;
}

.counter-text h4 {
    font-size:  18px;
    color:  #fff;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

.counter-text h1 span {
    font-size: 38px;
    color:  #fff;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
}

.counter-text h1 {
    color:  #fff;
    font-size: 26px;
    font-weight:  400;
    font-family: 'Roboto', sans-serif;
}

/*====/========        ===== ==/====/
        best deal area css 
 ====/========        =======/====/*/

.best-deal-area {
    padding:  80px 0px;
}

.best-deal-left h2 {
    font-size:  30px;
    color:  #282828;
}

.best-deal-left h3 {
    font-size:  30px;
    color:  #70c639;
    margin-top: 10px;
    margin-bottom:  30px;
}

.best-deal-left p {
    color:  #666666;
    font-size:  15px;
    margin-bottom:  33px;
}

.deal-column h4 {
    font-size: 15px;
    color:  #666666;
    margin-top: 10px;
}
a.room-bottm-btn.cts {
    margin-top: 50px;
    padding:16px 39px;
}

a.room-bottm-btn.cts:hover {
    background: #408123;
    color:  #fff;
}

.best-deal-right {
    margin-right: -70px;
}

/*client slide*/
.client-slide-area {
    background: url(assets/img/client-pattern.jpg)no-repeat;
    background-size: cover;
    background-position: center;
    padding: 100px 0px;
}

.client-slide {
    background:  #ffffff;
    display:  -webkit-box;
    display:  -ms-flexbox;
    display:  flex;
    -webkit-box-pack:  center;
        -ms-flex-pack:  center;
            justify-content:  center;
    -webkit-box-align:  center;
        -ms-flex-align:  center;
            align-items:  center;
    vertical-align:  middle;
    text-align:  center;
    padding-top: 90px;
}

.client-single-slide h2 {
    font-size: 30px;
    color:  #222222;
    font-weight:  800;
    margin-bottom: 36px;
}

.client-single-slide h2
 span {
    color:  #70c639;
}

.client-single-slide h4 {
    color:  #666666;
    font-size: 22px;
    line-height: 34px;
    margin-bottom: 30px;
}

.client-single-slide span i {
    color:  #fdc02f;
    font-size:  20px;
    margin:  0px 3px;
}

.client-single-slide h5 {
    font-size:  20px;
    color:  #70c639;
    margin-top: 10px;
}

.client-slide-area .owl-nav div {
    position:  absolute;
    top:  50%;
    font-size:  25px;
    height:  50px;
    width:  50px;
    background:  #cfcfcf;
    line-height:  50px;
    color:  #fff;
    border-radius:  100px;
    left:  -24px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    cursor:  pointer;
    -webkit-transition: .4s;
    transition:  .4s;
}

.client-slide-area .owl-nav div:hover {
    background:  #72c443;
}

.client-slide-area .owl-nav .owl-next {
    left:  auto;
    right: -24px;
}
.client-single-slide span i.fa-star-half-o {
    color: #adadad;
}

/*====/========        ===== ==/====/
        blog area css 
 ====/========        =======/====/*/

.blog-img img {
    width:  100%;
    -webkit-transition: .4s;
    transition: .4s;
}

.blog-img {
    overflow:  hidden;
}

.blog-single-items:hover
 .blog-img img {
    -webkit-transform: scale(1.3);
            transform: scale(1.3);
}

.blog-items-text {
    padding-top: 20px;
    padding-bottom: 30px;
    padding-left: 20px;
    padding-right: 20px;
    box-shadow: 0px 16px 8px #eff1ef;
    -webkit-transition: .4s;
    transition: .4s;
}
.blog-items-text span {
    color:  #666666;
    font-size:  14px;
    margin-right: 12px;
}

.blog-items-text span i {
    color:  #a9cf3a;
    margin-right: 6px;
}

.blog-items-text h4 a {
    color:  #222222;
    font-size:  20px;
    margin-top: 8px;
    margin-bottom:  20px;
}

.blog-items-text p {
    color:  #666666;
}

.blog-items-text:hover h4 a {
    color: #aace47;
}

.blog-items-text:hover {
    box-shadow: 0px 20px 30px #eff1ef;
}

/*====/========        ===== ==/====/
        news letter area css 
 ====/========        =======/====/*/

.news-letter-map {
    position:  relative;
}

.news-letter-map .news-letter-form h2 {
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 40px;
    background: #fff;
    padding: 15px 30px;
    border-radius: 30px;
    box-shadow: 0px 10px 20px #d8d7dc;
}

.news-letter-map span.form-input, .news-letter-form.cta span.form-input {
    width: 100%;
    background: #fff;
    padding: 12px 8px;
    border-radius: 50px;
    box-shadow: 0px 10px 20px #d8d7dc;
}

.news-letter-form input[type="email"], .news-letter-form.cta input[type="email"]{
    color:  #666;
    padding:  11px;
    border:  none;
    background:  none;
    width: 70%;
}

.news-letter-form input::-webkit-input-placeholder, .news-letter-form.cta input::-webkit-input-placeholder {
    color:  #666;
}

.news-letter-form input::-moz-placeholder, .news-letter-form.cta input::-moz-placeholder {
    color:  #666;
}

.news-letter-form input:-ms-input-placeholder, .news-letter-form.cta input:-ms-input-placeholder {
    color:  #666;
}

.news-letter-form input::placeholder, .news-letter-form.cta input::placeholder {
    color:  #666;
}

.news-letter-form input[type="submit"], .news-letter-form.cta input[type="submit"] {
    
    background:  #fec52e;
    border:  none;
    padding: 11px 14px;
    color:  #fff;
    border-radius: 45px;
    width: 28%;
    cursor:  pointer;
    -webkit-transition: .4s;
    transition:  .4s;
    font-weight: 700;
    font-family:  'Playfair Display', serif;
}
.btn-circle{
       background:  #fec52e;
    border:  none;
    padding: 11px 28px;
    color:  #fff;
    border-radius: 45px;
    width: 40%;
    cursor:  pointer;
    -webkit-transition: .4s;
    transition:  .4s;
    font-weight: 700;
    font-family:  'Playfair Display', serif;
}

.news-letter-form input[type="submit"]:hover {
    background: #70c639;
}

.news-letter-form {
    position:  absolute;
}
.map-overlay {
    position:  absolute;
    width:  100%;
    top: 10%;
}

/*====/========        ===== ==/====/
        footer area css 
 ====/========        =======/====/*/

.footer-widget {
    background:  #282828;
    padding:  80px 0px;
}

.footer-single-widget img {
    margin-bottom:  22px;
}

.footer-single-widget p {
    color:  #fff;
    font-size:  14px;
}

.footer-social-icon {
    margin-top:  30px;
}

.footer-social-icon a {
    height: 35px;
    width: 35px;
    background:  #70c639;
    text-align:  center;
    line-height: 35px;
    color:  #fff;
    font-size:  20px;
    border-radius: 100px;
    margin-right: 5px;
}

.footer-social-icon a:hover {
    background:  #fff;
    color:  #72c443;
}

.footer-single-widget li
 a {
    color:  #fff;
    padding-bottom: 10px;
}

.footer-single-widget li a i {
    margin-right: 10px;
    -webkit-transition: .2s;
    transition: .2s;
}

.footer-single-widget li a:hover {
    color:  #72c443;
}

.footer-single-widget li a:hover i {
    -webkit-transform: translateX(3px);
            transform: translateX(3px);
}

/*====/========        ===== ==/====/
        about area css 
 ====/========        =======/====/*/
.broadcamp-area{
    background:url(assets/img/broad-camp-bg1.jpg)no-repeat;
    background-size: cover;
    background-position: center;
    padding: 110px 0px;
}
.broadcamp-area h1 {
    color:  #fff;
    font-size:  50px;
    font-weight:  800;
    margin-bottom: 16px;
    line-height: 50px;
}

.broadcamp-area h4 {
    color:  #fff;
    font-size:  20px;
}

.broadcamp-area a {
    color: #fff;
}

.broadcamp-area a:hover {
    color:  #72c443;
}

/*====/========        ===== ==/====/
        about agency css 
 ====/========        =======/====/*/

.agency-area.cta {
    background: url(images/1920-530/dubai-bright-massage.jpg)no-repeat;
    background-size: cover;
    background-position: center;
}

.agency-area.cta h1 {
    color: #fff;
    line-height: 38px;
}

.agency-area.cta p {
    color:  #fff;
}

.agency-area.cta h1 {
    color: #fff;
    line-height: 38px;
}

.agency-area.cta p {
    color:  #fff;
    margin-bottom: 45px;
}

.agency-area.cta a.agency-btn {
    background:  #fff;
    color:  #666666;
    font-size: 18px;
    border-radius:  40px;
    min-width: auto;
    padding: 14px 40px;
}

.agency-area.cta a.agency-btn:hover {
    background:  #fec52e;
    color:  #fff;
}

.about-content-area {
    padding-top:  90px;
}

.about-top-title h2 {
    color:  #222222;
    font-weight:  400;
    line-height:  40px;
    margin-bottom: 22px;
}

.about-content-bottom p {
    color:  #666666;
    margin-bottom: 30px;
}

.about-content-bottom h4 {
    color:  #222222;
    font-weight:  700;
    font-style:  italic;
    font-size:  20px;
    text-align:  center;
    margin-top: 30px;
}

.about-content-bottom {
    margin-bottom:  50px;
}
.room-single-slide.cta3 img{
    width: 100%;
}

/*====/========        ===== ==/====/
        team member css 
 ====/========        =======/====/*/
 .about-team-member {
    padding: 90px 0px;
}
.room-single-slide.cta3 .hollyday-single-items {
    border-bottom:  0px;
    padding-bottom: 18px;
}

.room-single-slide.cta3 {
    box-shadow: 0px 22px 42px #eef1ec;
}

.room-single-slide.cta3
 h3 {
    margin-top: 22px;
    font-size:  22px;
}

.room-single-slide.cta3 h3 a {
    color:  #222;
}

.room-single-slide.cta3
 p {
    color:  #666666;
    font-size: 16px;
    margin-bottom:  0px;
}

.room-single-slide.cta3 p a {
    color:  #72c443;
}

.room-single-slide.cta3 .room-slide-text-bottom {
    margin-top:  6px;
}

.room-single-slide.cta3 .room-slide-text-bottom
 p {
    color:  #666;
    margin-bottom: 18px;
    font-size:  14px;
}

.team-socila-icon.text-center a {
    height:  33px;
    width:  33px;
    border:  2px solid #70c639;
    text-align:  center;
    border-radius:  100px;
    line-height: 28px;
    margin: 0px 3px;
    color:  #fff;
}

.team-socila-icon.text-center a i {
    background: #72c443;
    font-size: 12px;
    border-radius: 3px;
    height: 14px;
    width: 14px;
    line-height: 14px;
}

.team-socila-icon.text-center a:hover {
    background:  #72c443;
}

.team-socila-icon.text-center a:hover i {
    background:  #fff;
    color:  #74c24b;
}

.room-single-slide.cta3:hover h3 a {
    color: #72c443;
}

/*====/========        ===== ==/====/
        404 css 
 ====/========        =======/====/*/
.broadcamp-area.cta {
    background: url(assets/img/404bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 170px 0px;
}
.news-letter-form.cta {
    position:  inherit;
}

.broadcamp-area span.form-input, .news-letter-form.cta span.form-input {
    width: 100%;
    background: #fff;
    padding: 12px 8px;
    border-radius: 50px;
    box-shadow: none;
}
.broadcamp-area.cta h1 {
    font-size: 200px;
    font-weight:  800;
    margin-bottom: 110px;
}

.broadcamp-area.cta p {
    color:  #fff;
    font-size:  20px;
    margin-bottom: 50px;
}

/*====/========   ===== ==/====/
        contact area css
 ====/========    =======/====/*/

.broadcamp-area.contact-cta{
    background: url(assets/img/contact-bg.jpg)no-repeat;
    background-size: cover;
    background-position: center;
}

.map-1 {
    margin-top:  40px;
    border: 10px solid #fff;
}
.contact-map-top {
    background: #f4f4f4;
    padding-bottom: 100px;
}
.map-top-text {
    margin-top: 70px;
}

.map-top-text h3 {
    color:  #222222;
    font-size:  30px;
    margin-bottom:  10px;
    font-weight: 400;
}

.map-top-text span {
    font-size: 18px;
    color:  #222222;
}

.map-top-text p {
    color:  #666666;
    font-size: 16px;
    margin-top: 20px;
}

.map-top-text {
    margin-bottom: 60px;
}

.map-sinlge-items span {
    height: 90px;
    width: 90px;
    background:  #fff;
    line-height: 90px;
    border-radius:  100px;
    box-shadow: 0px 10px 20px #e0e2e2;
    margin-bottom: 25px;
    -webkit-transition: .4s;
    transition:  .4s;
}

.map-sinlge-items p, a {
    color:  #666666;
    font-size:  16px;
}

.map-sinlge-items:hover span {
    -webkit-transform: scale(.8);
            transform: scale(.8);
}

.map-sinlge-items a:hover {
    color:  #70c639;
}
.section-title.ctas h3 {
    color:  #222222;
    margin-bottom: 10px;
    font-weight:  400;
}

.section-title.ctas h4 {
    font-size:  20px;
    color:  #222222;
    font-weight:  400;
}

.section-title.ctas p {
    color:  #666666;
    margin-top: 22px;
}

.contact-contact-form input[type="text"], .contact-contact-form input[type="email"], .contact-contact-form textarea, .nice-select.contact-select {
    width:  100%;
    background:  #f4f4f4;
    border:  none;
    padding: 14px;
    color:  #666666;
    border: 1px solid #e2e2e2;
    border-radius:  4px;
    margin-bottom: 20px;
}

.nice-select.contact-select {
    width: 100%;
    height: 54px;
    padding-top: 6px;
    font-size: 16px;
}
.nice-select.contact-select ul{
    width: 100%;
}
.contact-contact-form input::-webkit-input-placeholder, .contact-contact-form textarea::-webkit-input-placeholder{
    color:  #666666;
}
.contact-contact-form input::-moz-placeholder, .contact-contact-form textarea::-moz-placeholder{
    color:  #666666;
}
.contact-contact-form input:-ms-input-placeholder, .contact-contact-form textarea:-ms-input-placeholder{
    color:  #666666;
}
.contact-contact-form input::placeholder, .contact-contact-form textarea::placeholder{
    color:  #666666;
}
.contact-contact-form textarea {
    height:  180px;
}

.contact-contact-form {
    text-align:  center;
}

.contact-contact-form input[type="submit"] {
    background:  #70c639;
    border: 1px solid #e2e2e2;
    padding: 14px 65px;
    display:  inline-block;
    border-radius:  4px;
    color: #fff;
    font-weight:  700;
    -webkit-transition: .4s;
    transition:  .4s;
    cursor:  pointer;
}

.contact-contact-form input[type="submit"]:hover {
    background:  #333;
}

/*====/========   ===== ==/====/
        video area css
 ====/========    =======/====/*/
.broadcamp-area.cta4{
    background: url(assets/img/broadcamp-video-bg.jpg)no-repeat;
    background-size: cover;
    background-position: center;
}
.video-single-items {
    position:  relative;
}

a.play-btn {
    position:  absolute;
    top:  50%;
    color:  #fff;
    left:  50%;
    height: 70px;
    width: 70px;
    background:  #ffffff;
    text-align:  center;
    color:  #333;
    line-height: 70px;
    border-radius:  100px;
    font-size: 20px;
    -webkit-transform: translateX(-50%)translateY(-50%);
            transform: translateX(-50%)translateY(-50%);
}

a.play-btn:hover {
    background:  #70c639;
    color:  #fff;
    -webkit-transform: translateX(-50%)translateY(-50%)scale(1.2);
            transform: translateX(-50%)translateY(-50%)scale(1.2);;
}

.video-area {
    background: url(assets/img/video-pattern.png)no-repeat;
    background-size: cover;
    background-position: center;
    padding-bottom: 90px;
    padding-top: 60px;
}
.recent-add-text {
    background:  #fff;
    padding: 15px;
    margin-top:  30px;
    margin-bottom:  20px;
}

.recent-add-text h4 {
    font-size:  20px;
    color:  #222222;
    font-weight:  400;
}

.video-single-items {
    padding:  10px;
    background:  #fff;
    margin-bottom:  20px;
}

.load-more-video {
    margin-top:  30px;
}

a.load-more-video-btn {
    padding: 14px 55px;
    background:  #fec52e;
    color:  #fff;
    border-radius: 3px;
    box-shadow: 0px 10px 40px #dee2dc;
}

a.load-more-video-btn:hover {
    background:  #72c443;
}

.video-single-items.cta{
    padding: 0px;
    box-shadow: none;
    margin-bottom: 0px;
}
.best-deal-area.cta {
    border-bottom:  1px solid #e3e3e3;
}

/*room area css*/
.broadcamp-area.cta5{
    background: url(assets/img/room-cta-bg.jpg)no-repeat;
    background-size: cover;
    background-position: center;
}
.room-area {
    padding-bottom:  80px;
    padding-top:  30px;
}

.room-pagination a {
    color:  #666666;
    padding:  0px 10px;
    font-size:  18px;
    font-weight: 500;
}

.room-pagination a:hover {
    color:  #74c24b;
}

.room-pagination {
    margin-top: 36px;
}

.best-deal-area.cta5 {
    background:  #f4f4f4;
}
.blog-area.cta5 {
    padding-top:  25px;
    padding-bottom: 80px;
}

/*====/========   ===== ==/====/
      room details area css
 ====/========    =======/====/*/
.broadcamp-area.cta6 {
    background: url(assets/img/room-details-cta-bg.jpg)no-repeat;
    background-size: cover;
    background-position: center;
}
.room-details-single-slide {
    position:  relative;
}

.room-details-slide-text {
    position:  absolute;
    bottom: 60px;
    left:  100px;
}

.room-details-slide-text
 h3 {
    color:  #fff;
    font-size:  30px;
    font-weight:  800;
}

.room-details-slide-text
 p {
    font-size:  20px;
    color:  #fff;
    font-weight:  600;
    margin-top: 10px;
}

.room-details-slide-area {
    margin-bottom: 10px;
    margin-top: 30px;
}
.room-details-slide-area .owl-nav div {
    position:  absolute;
    bottom:  50%;
    font-size:  25px;
    height:  50px;
    width:  50px;
    color:  #fff;
    text-align:  center;
    line-height:  50px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    z-index:  1;
}

.room-details-slide-area .owl-nav .owl-next {
    left:  auto;
    right:  0;
}

.room-details-slide-area .owl-nav div:after {
    position:  absolute;
    left:  0;
    top:  0;
    height:  100%;
    width:  100%;
    content:  "";
    background:  #fec52e;
    z-index:  -1;
    opacity:  .8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    -webkit-transition: .3s;
    transition:  .3s;
}

.room-details-slide-area .owl-nav div:hover:after {
    opacity:  1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.room-details-service h3 {
    font-size:  20px;
    color:  #222222;
    font-weight: 600;
    margin-top: 10px;
}

.room-details-service h3
 span {
    color:  #70c639;
    font-size:  30px;
}

.room-details-service h1 {
    color:  #70c639;
}

.room-details-service p {
    color:  #666666;
    margin-top:  18px;
}

.room-details-service .agency-text.cta {
    margin-bottom: 50px;
}

.room-details-service .service-single-item h4 {
    font-size: 16px;
    color: #666666;
    font-weight: 400;
}

span.room-details-logo.cta1 {
    background: url(assets/img/room-details-service-icon1.png)no-repeat;
    background-position: center;
}

.service-single-item:hover span.room-details-logo.cta1 {
    background: url(assets/img/room-details-service-icon1-hv.png)no-repeat;
    background-position: center;
}

span.room-details-logo.cta2 {
    background: url(assets/img/room-details-service-icon2.png)no-repeat;
    background-position: center;
}

.service-single-item:hover span.room-details-logo.cta2{
    background: url(assets/img/room-details-service-icon2-hv.png)no-repeat;
    background-position: center;
}

span.room-details-logo.cta3 {
    background: url(assets/img/room-details-service-icon3.png)no-repeat;
    background-position: center;
}
.service-single-item:hover span.room-details-logo.cta3{
    background: url(assets/img/room-details-service-icon3-hv.png)no-repeat;
    background-position: center;
}

span.room-details-logo.cta4 {
    background: url(assets/img/room-details-service-icon4.png)no-repeat;
    background-position: center;
}

.service-single-item:hover span.room-details-logo.cta4{
    background: url(assets/img/room-details-service-icon4-hv.png)no-repeat;
    background-position: center;
}

.service-single-item:hover span.room-details-logo.cta1,
.service-single-item:hover span.room-details-logo.cta2,
.service-single-item:hover span.room-details-logo.cta3,
.service-single-item:hover span.room-details-logo.cta4{
    background-color: #fec52e;
}

.room-details-service {
    padding-bottom:  50px;
    border-bottom:  1px solid #e4e4e4;
}

.room-details-service-bottom {
    padding-top:  65px;
}

.room-details-service-bottom h5 {
    color:  #222222;
    font-weight:  700;
    margin-bottom: 35px;
}

.room-details-service-bottom ul li {
    color:  #666666;
    line-height:  40px;
}

.room-details-service-bottom ul li i {
    margin-right:  10px;
    color:  #fec52e;
}

.room-details-service-bottom h4 {
    font-size: 20px;
    text-align:  center;
    background:  #70c639;
    padding: 40px 60px;
    color:  #fff;
    font-style:  italic;
    margin-top: 50px;
    border-radius:  4px;
}

.room-details-tab {
    margin-top: 50px;
}

.room-details-tab ul li
 a {
    color:  #666666;
    font-size:  20px;
    padding-left:  0px;
    margin-right: 40px;
    padding-right: 0px;
}

.room-details-tab ul {
    margin-bottom: 20px;
}

.room-details-tab ul li a.active {
    color:  #70c639;
    border-bottom:  1px solid;
}

.room-details-tab p {
    color: #666666;
    margin-bottom: 20px;
}

.room-details-table h4 {
    color:  #222222;
    font-size:  20px;
    margin-bottom: 15px;
}

.room-details-table li {
    color:  #666666;
    font-size:  18px;
    border-bottom:  1px solid #dedede;
    line-height: 30px;
    padding-bottom:  15px;
    padding-top: 15px;
}

.room-details-table li span {
    float:  right;
}

.room-details-table a {
    color:  #666666;
    font-size:  20px;
    float:  right;
    margin-top:  45px;
    font-weight: 300;
}

.room-details-table {
    overflow:  hidden;
}

.room-details-table a i {
    margin-left:  3px;
}

.room-details-table a:hover {
    color:  #fec52e;
}

.client-review {
    margin-top: 50px;
}

.client-review h4 {
    font-size:  20px;
    color:  #222222;
    margin-bottom:  20px;
}

.client-review h4 span {
    color:  #fec52e;
}

.client-review-single {
    background:  #f4f4f4;
    padding:  30px;
    margin-bottom:  10px;
    border-radius:  4px;
}

.client-review-single img {
    float:  left;
}

.client-review-text {
    margin-left: 90px;
}

.client-review-text span {
    color:  #fec52e;
}

.client-review-text p {
    color:  #666666;
    font-style:  italic;
}

.client-custom-review {
    margin-top: 30px;
}

.client-custom-review h4 {
    font-size:  20px;
    color:  #222222;
    font-weight: 600;
    margin-bottom: 4px;
}

.client-custom-review span {
    color:  #fec52e;
    font-size:  20px;
}

.room-details-contact-form {
    margin-top:  15px;
}

.room-details-contact-form input[type="text"], .room-details-contact-form input[type="email"], .room-details-contact-form
 textarea {
    width:  100%;
    background:  #f4f4f4;
    border:  none;
    padding: 14px 14px;
    border-bottom:  2px solid #ececee;
    border-radius:  4px;
    color:  #666666;
    margin-bottom:  20px;
}

.room-details-contact-form input::-webkit-input-placeholder, .room-details-contact-form textarea::-webkit-input-placeholder{
   color:  #666666;
}

.room-details-contact-form input::-moz-placeholder, .room-details-contact-form textarea::-moz-placeholder{
   color:  #666666;
}

.room-details-contact-form input:-ms-input-placeholder, .room-details-contact-form textarea:-ms-input-placeholder{
   color:  #666666;
}

.room-details-contact-form input::placeholder, .room-details-contact-form textarea::placeholder{
   color:  #666666;
}

.room-details-contact-form textarea {
    height:  132px;
}

.room-details-contact-form input[type="submit"] {
    color:  #fff;
    border:  none;
    background:  #70c639;
    padding:  14px 40px;
    border-radius:  4px;
    text-transform:  uppercase;
    cursor:  pointer;
    -webkit-transition: .4s;
    transition:  .4s;
}

.room-details-contact-form input[type="submit"]:hover {
    background:  #333;
}

/*====/========   ===== ==/====/
      service area css
 ====/========    =======/====/*/
.broadcamp-area.cta6{
    background: url(assets/img/service-cta-bg.jpg)no-repeat;
    background-position: center;
    background-size: cover;
}
.room-area.ctas .hollyday-single-items h4 {
    padding-top: 15px;
    font-size: 20px;
    padding-bottom: 12px;
}
.room-area.ctas .room-slide-text-bottom {
    padding-top: 10px;
    margin-top: 0px;
    padding-bottom: 18px;
    border: 1px solid #eff0f0;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding-left: 20px;
    padding-right: 20px;
}
.room-area.ctas .hollyday-single-items {
    border-bottom: 0px;
    padding-right: 0px;
    padding-left: 0px;
    margin-bottom: 10px;
    padding-bottom: 0px;
}
.room-area.ctas .hollyday-single-items:hover {
    border-bottom:  0px;
}

.room-area.ctas .room-single-slide p {
    margin-top: 10px;
}

/*====/========   ===== ==/====/
      team area css
 ====/========    =======/====/*/
 .about-team-member.cta {
    background: #f4f4f4;
}

.broadcamp-area.cta7{
    background: url(assets/img/team-cta-bg.jpg)no-repeat;
    background-position: center;
    background-size: cover;
}
.about-team-member.cta .room-single-slide.cta3 {
    box-shadow: 0px 22px 42px #eef1ec;
    background: #fff;
    margin-top: 20px;
}

/*====/========   ===== ==/====/
      client area css
 ====/========    =======/====/*/

.client-slide-area.cta .client-slide {
    padding-top: 0px;
    background: inherit;
}

.client-slide-area.cta .client-slide-csa {
    padding-top:  90px;
    background:  #fff;
    padding-right: 60px;
    padding-left: 60px
}

.client-slide-area.cta .client-slide-csa h2 {
    padding-bottom: 45px;
    font-size: 30px;
    color: #222222;
}
.client-slide-area.cta .client-slide-csa h2 span {
    color: #72c443;
}

.client-slide-area.cta .client-single-slide h4 {
    font-size: 16px;
    line-height: 28px;
}
.client-slide-area.cta .client-single-slide h4 br {
    display: none;
}

.client-slide-area.cta .owl-nav div {
    top: 7%;
    left: -86px;
    -webkit-transform: translateY(-7%);
            transform: translateY(-7%);
}

.client-slide-area.cta .owl-nav .owl-next {
    right: -86px;
    left: auto;
}

.client-area-bottom-bg {
    background:  #fff;
    margin-top:  10px;
    padding: 50px 60px;
}

.client-single-bottom {
    padding:  20px 0px;
}

/*====/========   ===== ==/====/
      home2 area css
 ====/========    =======/====/*/
body.home2 .csmargin {
    padding: 0px 5px;
}

body.home2 .hero-right-form {
    padding:  10px 20px;
}

body.home2 .hero-right-form input[type="text"] {
    padding:  16px 10px;
}

body.home2 .nice-select.select-active-menu {
    height: 57px;
    padding-top: 10px;
    font-size: 16px;
}
body.home2 .hero-right-form input[type="submit"] {
    margin-top:  0px;
    padding: 16px;
}

body.home2 .hero-left-content h4 {
    font-size:  50px;
    margin-bottom: 35px;
}

body.home2 .hero-left-content p {
}

body.home2 .hero-left-content {
    margin-bottom: 58px;
}

body.home2 .hero-area {
    position:  relative;
}

body.home2 .header-area {
    position:  absolute;
    z-index:  2;
    width:  100%;
    background:  none;
}

body.home2 .mainmenu-area {
    padding-top: 30px;
}

body.home2 .hero-area {
    background: url(images/1920-767/dubai-massage.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-bottom: 300px;
    padding-top: 300px;
}
body.home2 .hero-area.bg2 {
    background: url(images/1920-767/Liwan-massage.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-bottom: 300px;
    padding-top: 300px;
}
body.home2 .hero-area.bg3 {
    background: url(images/1920-767/nature-bright-massage.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-bottom: 300px;
    padding-top: 300px;
}

body.home2 .hero-area-slide .owl-nav div {
    position:  absolute;
    left: 4%;
    top:  50%;
    font-size:  20px;
    color:  #fff;
    height:  50px;
    width:  50px;
    line-height:  50px;
    text-align:  center;
    border-radius:  100px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    -webkit-transition: .4s;
    transition:  .4s;
}

body.home2 .hero-area-slide .owl-nav .owl-next {
    left:  auto;
    right: 4%;
}

body.home2 .hero-area-slide .owl-nav div:after {
    position:  absolute;
    left:  0;
    top:  0;
    height:  100%;
    width:  100%;
    content:  "";
    background:  #000;
    z-index:  -1;
    border-radius:  100px;
    opacity:  .5;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    -webkit-transition: .4s;
    transition:  .4s;
}

body.home2 .hero-area-slide .owl-nav div:hover:after {
    opacity:  1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    background:  #fec52e;
}

body.home2 .hollyday-single-items h3 span:after {
    background: none;
}

body.home2 .hollyday-single-items h3 span {
    float: right;
    margin: 0px;
}
body.home2 .hollyday-single-items {
    padding-bottom: 30px;
    border-bottom: 0px solid;
    box-shadow: 0px 14px 20px #f1f1f2;
}

body.home2 .hollyday-single-items:hover {
    box-shadow: 0px 14px 50px #f1f2f3;
}
body.home2 .img-hv {
    overflow:  hidden;
}

body.home2 .img-hv img {
    -webkit-transition: .6s;
    transition:  .6s;
}

body.home2 .hollyday-single-items:hover .img-hv img {
    -webkit-transform: scale(1.4);
            transform: scale(1.4);
}

body.home2 .booking-area{
    background: url(images/1920-530/dubai-massage-center.jpg)no-repeat;
    background-size: cover;
    background-position: center;
}

body.home2 .booking-area:after {
    background: none;
}
.home2-empty-img {
    padding-top: 30px;
}

body.home2 .service-single-item span.star-icon {
    height: 0px;
    width: auto;
    background:  none;
    box-shadow: 0px 0px 0px;
    color:  #fdc02f;
    line-height:  0px;
    margin-top: 20px;
    display: block;
}
body.home2 .service-single-item span.star-icon i.fa-star-half-o{
    color:  #adadad;
}

body.home2 .service-single-item span{
      box-shadow: inherit;
}

body.home2 .service-single-item h4 {
    margin-bottom: 4px;
    font-size: 16px;
    color: #70c639;
}

body.home2 .service-single-item p {
    color: #666666;
    font-style: italic;
    font-weight: 400;
    font-size: 15px;
}
body.home2 .hollyday-title h2 {
    margin-bottom: 30px;
}

body.home2 .news-letter-map{
    background: url(assets/img/home2-map-bg.jpg)no-repeat;
    height: 300px;
    background-size: cover;
    background-position: center;
}

body.home2 .news-letter-map span.form-input, .news-letter-form.cta span.form-input {
    box-shadow: 0px 0px 0px;
}

body.home2 .news-letter-map .news-letter-form h2 {
    background:  none;
    box-shadow:  0px 0px 0px;
    color:  #fff;
    padding-bottom: 0px;
    padding-top: 30px;
}

/*====/========        ===== ==/====/
            preoader css 
 ====/========        =======/====/*/

#loading {
    width: 100vw;
    height: 100vh;
    background: #20232D;
    position: fixed;
    z-index: 999;
}

#loading #preloader {
    position: relative;
    width: 100%;
    height: 80px;
    top: calc(50% - 50px);
    text-align: center;
    margin: 0 auto;
}

#loading #preloader:after {
    content: "BOOK IS LOADING";
    /* Text under the circles */
    position: absolute;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 400;
    color: #fff;
    letter-spacing: 1px;
    font-family: 'Open Sans', sans-serif;
    top: 90px;
    width: 100%;
    left: 0;
    right: 0;
    height: 1px;
    text-align: center;
}

#loading #preloader span {
    position: absolute;
    border: 4px solid #72c443;
    border-radius: 100%;
}

#loading #preloader span:nth-child(1) {
    width: 80px;
    height: 80px;
    left: calc(50% - 40px);
    -webkit-animation: spin-1 1s infinite cubic-bezier(0.645, 0.045, 0.355, 1);
    animation: spin-1 1s infinite cubic-bezier(0.645, 0.045, 0.355, 1);
}

#loading #preloader span:nth-child(2) {
    top: 20px;
    left: calc(50% - 20px);
    width: 40px;
    height: 40px;
    -webkit-animation: spin-2 1s infinite cubic-bezier(0.645, 0.045, 0.355, 1);
    animation: spin-2 1s infinite cubic-bezier(0.645, 0.045, 0.355, 1);
}

@-webkit-keyframes spin-1 {
    0% {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }
    50% {
        opacity: 0.3;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    }
    100% {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }
}

@keyframes spin-1 {
    0% {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }
    50% {
        opacity: 0.3;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    }
    100% {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }
}

@-webkit-keyframes spin-2 {
    0% {
        opacity: 0.3;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    }
    50% {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }
    100% {
        opacity: 0.3;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    }
}

@keyframes spin-2 {
    0% {
        opacity: 0.3;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    }
    50% {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }
    100% {
        opacity: 0.3;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    }
}

.hero_2_slide {
    margin-top: -300px;
    position: absolute;
    z-index:  99;
    width:  100%;
    text-align:  center;
}
/*end css*/