@import url('../font-source/flaticon.css');

/* ----------------------------------------------------------------
    MISC CSS
-----------------------------------------------------------------*/
.d-ib {
    display:inline-block;
}

/* ----------------------------------------------------------------
    Margin CSS
-----------------------------------------------------------------*/

.mar-top-20 {
    margin-top:20px;
}

.mar-top-25 {
    margin-top: 25px;
}

.mar-top-30 {
    margin-top: 30px;
}

.mar-top-40 {
    margin-top: 40px;
}

.mar-top-52 {
    margin-top:52px;
}

.mar-top-80 {
    margin-top: 80px;
}

.mar-top-100 {
    margin-top: 100px;
}

.mar-btm-0 {
    margin-bottom:0px;
}

.mar-btm-50 {
    margin-bottom: 50px;
}

.mar-right-20 {
    margin-right:20px;
}


/* ----------------------------------------------------------------
    Padding CSS
-----------------------------------------------------------------*/
.pad-top-50 {
    padding-top:50px;
}

.pad-btm-100 {
    padding-bottom: 100px;
}

/* ----------------------------------------------------------------
    Font CSS
-----------------------------------------------------------------*/
.fs-18 {
    font-size:18px;
}

.fs-45 {
    font-size: 45px;
}

.fs-60 {
    font-size: 60px;
}


.fs-70 {
    font-size: 70px;
}

.fs-80 {
    font-size: 80px;
}

.fs-90 {
    font-size: 90px;
}

.fs-100 {
    font-size:100px;
}

.fs-124 {
    font-size: 124px;
}


.fw-bold {
    font-weight:bold;
}

/* ----------------------------------------------------------------
    Background CSS
-----------------------------------------------------------------*/

.bg-gray-1 {
    background-color: #f5f6f6;
}

.hotel-booking-banner {
    background-image: url(../img/img-source/top-banner-26.png) !important;
}

.food-order-banner {
    background-image: url(../img/img-source/top-banner-27.png) !important;
}

.job-portal-banner {
    background-image: url(../img/img-source/top-banner-28.png) !important;
}

.hotel-cta {
    background-image: url(../img/img-source/cta-banner-img-9.jpg) !important;
}

.job-portal-cta {
    background-image: url(../img/img-source/cta-banner-img-11.jpg) !important;
}

.food-order-cta {
    background-image: url(../img/img-source/cta-banner-img-10.jpg) !important;
}

.hotel-parallax-bg {
    background-image: url(../img/img-source/vertical-img-2.jpg) !important;
}

.food-order-parallax-bg {
    background-image: url(../img/img-source/vertical-img-3.jpg) !important;
}

.job-portal-parallax-bg {
    background-image: url(../img/img-source/vertical-img-4.jpg) !important;
}

.img-sqr-box-1 {
    background-image: url(../img/img-source/live-img-47.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.img-sqr-box-2 {
    background-image: url(../img/img-source/live-img-48.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.img-sqr-box-3 {
    background-image: url(../img/img-source/live-img-49.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}


.img-sqr-box-4 {
    background-image: url(../img/img-source/live-img-55.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.img-sqr-box-5 {
    background-image: url(../img/img-source/live-img-56.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.img-sqr-box-6 {
    background-image: url(../img/img-source/live-img-57.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}


.img-sqr-box-7 {
    background-image: url(../img/img-source/live-img-63.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.img-sqr-box-8 {
    background-image: url(../img/img-source/live-img-64.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.img-sqr-box-9 {
    background-image: url(../img/img-source/live-img-65.jpg) !important;
    padding: 170px 0px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
/* ----------------------------------------------------------------
    Color CSS
-----------------------------------------------------------------*/
.blue-1 {
    color: #0099DB;
}

.blue-2 {
    color: #004C93;
}

.blue-gradient-1 {
    background: -moz-linear-gradient(90deg, rgb(3,52,104) 0%, rgb(0,134,201) 100%);
    background: -webkit-linear-gradient(90deg, rgb(3,52,104) 0%, rgb(0,134,201) 100%);
    background: linear-gradient(90deg, rgb(3,52,104) 0%, rgb(0,134,201) 100%);
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* ----------------------------------------------------------------
    Video CSS
-----------------------------------------------------------------*/

.video {
position: relative
}

.video-relative {
position: relative;
display: inline-block
}

.video-btn {
height: 47px;
width: 47px;
text-align: center;
border-radius: 50%;
background: #fff;
position: absolute;
top: 0;
left: 0;
text-align: center;
margin: -30px 0 0 -30px;
border-radius: 100px;
z-index: 1
}

.video-link .ripple {
position: absolute;
width: 110px;
height: 110px;
z-index: -1;
left: 50%;
top: 50%;
opacity: 0;
margin: -55px 0 0 -55px;
border-radius: 100px;
-webkit-animation: ripple 1.8s infinite;
animation: ripple 1.8s infinite
}

.orangebg {
border: 3px solid #fff
}

@-webkit-keyframes ripple {
0% {
opacity: 1;
-webkit-transform: scale(0);
transform: scale(0)
}

100% {
opacity: 0;
-webkit-transform: scale(1);
transform: scale(1)
}
}

@keyframes ripple {
0% {
opacity: 1;
-webkit-transform: scale(0);
transform: scale(0)
}

100% {
opacity: 0;
-webkit-transform: scale(1);
transform: scale(1)
}
}

.video-btn .ripple:nth-child(2) {
animation-delay: .4s;
-webkit-animation-delay: .4s
}

.video-btn .ripple:nth-child(3) {
animation-delay: .7s;
-webkit-animation-delay: .7s
}


.effect-phoebe {
cursor: pointer;
text-align: center
}

.effect-phoebe {
background: #6ac none repeat scroll 0 0;
cursor: pointer;
float: left;
height: 100%;
margin: 0;
max-height: 100%;
max-width: 100%;
overflow: hidden;
position: relative;
text-align: center;
width: 100%
}

.effect-phoebe img {
display: block;
height: auto;
opacity: 1;
position: relative;
transform: scaleY(1);
transition: all .5s ease-in-out 0s;
width: 100%
}

.effect-phoebe figcaption, .effect-phoebe figcaption > a {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%
}

.effect-phoebe figcaption {
backface-visibility: hidden;
color: #fff;
background: linear-gradient(#336073,#8e8c8c00);
display: flex;
justify-content: center;
align-items: center
}

.effect-phoebe {
cursor: pointer;
border-radius: 4px;
text-align: center
}

.effect-phoebe p i {
font-size: 30px;
color: #fff
}

.effect-phoebe p {
bottom: 0;
height: 56px;
left: 0;
margin: auto;
position: absolute;
right: 0;
top: 0;
width: 112px
}

.video-btn i {
color: #acd9f7;
font-size: 18px;
line-height: 48px;
text-align: center;
padding-left: 5px
}


/* ----------------------------------------------------------------
    Misc CSS
-----------------------------------------------------------------*/

.box-style-1 {
    background: #ffffff;
    padding: 20px !important;
    box-shadow: rgb(0 0 0 / 16%) 0px 1px 4px;
    border-radius: 10px;
    min-height: 350px;
}



/* ----------------------------------------------------------------
    SEO Section CSS
-----------------------------------------------------------------*/

.seo-services {
min-height: 545px;
}


.seo-services {
box-shadow: 4px 4px 12px 0 rgb(46 53 144 / 20%);
background: #ffffff;
margin: 20px 0px;
border-radius: 5px 5px 10px 10px;
}


.service-text-box {
padding: 20px 20px 30px;
}

.seo-services h4, .orm-boxes h4 {
font-size: 16px;
margin-top: 10px;
margin-bottom: 10px;
}

.seo-services img.img-fluid {
height: 199px;
width: 100%;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}




/* ----------------------------------------------------------------
    Media Queries CSS
-----------------------------------------------------------------*/

/* 
 Mostly all smartphones
*/

@media (min-width: 320px) and (max-width: 480px) {

ul.breadcrumb li {
font-size: 10px !important;
}

.d-none-xs {
    display:none;
}

.pad-top-40-xs {
    padding-top:40px;
}

.pad-btm-40-xs {
padding-bottom: 40px;
}

.mar-top--140 {
margin-top: -140px;
}



}



/* 
  portrait tablets and ipads
*/

@media (min-width: 768px) and (max-width: 1023px) {

.d-none-sm {
display: none;
}

.pad-top-0-sm {
padding-top: 0px !important;
}

.mar-top--110-sm {
    margin-top:-110px;
}


}


/* 
 Laptops,Desktop monitors,ipad pros
*/

@media (min-width: 1024px) and (max-width: 1280px) {

.new_service_content {
    min-height: 380px !important;
}

}