@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

* {
    box-sizing: border-box;
}
img {
    max-width: 100%;
}
html {
    overflow: hidden;
    overflow-y: auto;
}
body {
    overflow: hidden;
    font-size: 14px;
    line-height: 1.71429;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: 'Poppins', sans-serif;
    color: #1d1d24;
    font-weight: 400;
}

a {
    transition: all 0.4s ease-in-out 0s;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
address,
p,
pre,
blockquote,
dl,
dd,
menu,
ol,
ul,
table,
caption,
hr {
    margin: 0;
    margin-bottom: 15px;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: 'Poppins', sans-serif;
    line-height: 1.4074;
    color: color: #1f1f25;
}
h1,
.h1 {
    font-size: 64px;
}
h2,
.h2 {
    font-size: 54px;
}
h3,
.h3 {
    font-size: 24px;
}
h4,
.h4 {
    font-size: 20px;
}
h5,
.h5 {
    font-size: 18px;
}
h6,
.h6 {
    font-size: 16px;
}
h1,
.h1,
h2,
.h2,
h3,
.h3 {
    font-weight: 700;
}
h4,
.h4,
h5,
.h5 {
    font-weight: 600;
}
h6,
.h6 {
    font-weight: 500;
}
a:hover,
a:focus,
a:active {
    text-decoration: none;
    outline: none;
}
a:visited {
    color: inherit;
}
input,
button,
select,
textarea {
    background: transparent;
    border: 1px solid $border-color;
    transition: all 0.4s ease-out 0s;
    color: $body-color;
    &:focus,
    &:active {
        outline: none;
        border-color: $theme-color;
    }
}
input,
select,
textarea {
    width: 100%;
    font-size: 14px;
}
input,
select {
    height: 40px;
    padding: 0 15px;
}
::marker {
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    text-transform: none;
}
ul {
    list-style-type: square;
}
.bg_color--5 {
    background: #f8f9fc;
}
.color-blue{
    color: #0096d1;
}
.rn-brand-area {
    display: none;
}
.blog-style--1, .blog-style--1 .content, .blog-style--1 .content .blog-btn, .blog-style--1 .content:before, .blog-style--1 .content h4.title a, .blog-style--1 .thumbnail a:after, .blog-style--1 .thumbnail a img, .footer-right .footer-link ul.ft-link li a, .header-area .header-wrapper a.rn-btn, .item-portfolio-static .thumbnail a img, .mainmenunav ul.mainmenu>li>a, .mainmenunav ul.mainmenu>li>ul.submenu, .mainmenunav ul.mainmenu>li>ul.submenu li a, .portfolio, .portfolio-sacousel-inner .slick-dots li button:after, .portfolio-style--3, .portfolio-style--3 .content, .portfolio-style--3 .content .portfolio-btn, .portfolio-style--3 .content:before, .portfolio-style--3 .content h4.title a, .portfolio-style--3 .thumbnail a:after, .portfolio-style--3 .thumbnail a img, .portfolio-tilthover .portfolio .bg-blr-image, .portfolio-tilthover .portfolio .content, .portfolio .bg-blr-image, .portfolio .content .inner .portfolio-button, .portfolio .thumbnail-inner:before, .portfolio .thumbnail:after, .related-work .inner h4 a, .rn-address .icon, .rn-address .inner p a, .rn-pagination ul.page-list li a:before, .rn-pricing .pricing-table-inner .pricing-footer a.rn-btn, .rn-slick-dot .slick-dots li button:after, .service.service__style--1, .service.service__style--2, .service.service__style--2 .content h3.title, .service.service__style--2 .content p, .service.service__style--2 .icon, .service.service__style--2:before, .single-demo a, .standard-service .content h3 a, .team .thumbnail:after, .team .thumbnail img, a.btn-transparent, a.btn-transparent:after, a.rn-btn, button.rn-btn, input, textarea, ul.brand-list li, ul.brand-list li img, ul.social-share li a, ul.testimonial-thumb-wrapper li .thumb:after, ul.testimonial-thumb-wrapper li .thumb img {
    -webkit-transition: all .3s cubic-bezier(.645,.045,.355,1);
    transition: all .3s cubic-bezier(.645,.045,.355,1);
}
.service.service__style--2:hover .content h3.title, .service.service__style--2:hover .content p {
    color: #fff;
}
.bg_image--5, .bg_image--1 {
    background-image: url(../images/header-banner-subpages.jpg) !important;
}
.blog-single-page-title ul.blog-meta, .breadcrumb-inner ul.page-list, .color-black .mainmenunav ul.mainmenu, .color-white .mainmenunav ul.mainmenu, .list-style--1, .liststyle, .mainmenunav ul.mainmenu, .mainmenunav ul.mainmenu>li>ul.submenu, .rn-pagination ul.page-list, ul.brand-list, ul.list-style, ul.tab-style--1 {
    padding: 0;
    margin: 0;
    list-style: none;
}
.bg_image {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
}
.details a, .details a:visited,
p > a, p> a:visited{
    color: #0096d1;
    text-decoration: underline;
}
.details a:hover,
p > a:hover { 
    color : #1f1f25;
    text-decoration: underline;
}

.about-us-list h3.title, .rn-progress-bar .single-progress .label, .rn-progress-bar .single-progress .title {
    font-weight: 500;
}
.blog-style--1:hover .content {
    bottom: 0;
}

.blog-style--1:hover .content::before {
    opacity: 0;
}

.blog-style--1:hover .thumbnail a img {
    transform: scale(1.1);
}

.blog-style--1:hover .thumbnail a::before {
    opacity: 0;
}

.blog-style--1:hover .thumbnail a::after {
    opacity: 0.85;
    top: 0;
}

.blog-style--1:hover .content .blog-btn {
    opacity: 1;
    visibility: visible;
}

.blog-style--1 .content p.blogtype {
    font-size: 14px;
    margin-bottom: 5px;
    color: #c6c9d8;
}

.blog-style--1 .content h4.title {
    margin-bottom: 0;
}

.blog-style--1 .content h4.title a {
    color: #ffffff;
    font-size: 24px;
    font-weight: 500;
    line-height: 36px;
}

.blog-style--1 .content .blog-btn {
    margin-top: 35px;
    transition: 0.7s;
    opacity: 0;
    visibility: hidden;
}

.blog-style--1 {
    position: relative;
    margin-bottom: 40px;
    overflow: hidden;
    border-radius: 6px;
}

.blog-style--1 .thumbnail a {
    display: block;
    position: relative;
    z-index: 1;
}

.blog-style--1 .thumbnail a::after {
    background: linear-gradient(to bottom, #861dec 0, #000000 100%);
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 1;
    opacity: 0;
}
.blog-style--1 .content::before {
    position: absolute;
    content: "";
    background: linear-gradient(to bottom, transparent 0, #000000 70%);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: -1;
}

.blog-style--1 .content {
    position: absolute;
    bottom: -92px;
    width: 100%;
    padding: 50px 35px;
    z-index: 3;
}
.blog-single-page-title {
    position: relative;
}

.blog-single-page-title h2 {
    font-weight: 700;
    line-height: 90px;
    font-size: 72px;
}
.blog-single-page-title ul.blog-meta {
    margin: 0 -15px;
    flex-wrap: wrap;
    position: absolute;
    width: 100%;
    bottom: -135px;
}

.blog-single-page-title ul.blog-meta li {
    font-size: 16px;
    color: #c6c9d8;
    margin: 0 15px;
    margin-bottom: 13px;
}

.blog-single-page-title ul.blog-meta li svg {
    margin-right: 13px;
    font-size: 22px;
}

.rn-blog-details .inner-wrapper .inner {
    padding: 0 110px;
}

.rn-blog-details .inner-wrapper .inner p {
    font-size: 18px;
    line-height: 30px;
    color: rgba(29, 29, 36, 0.75);
    margin-bottom: 40px;
}

.agency-list ul li {
    font-size: 18px;
    line-height: normal;
}
.agency-support {
    padding-bottom: 120px !important;
}

.rn-blog-details .inner-wrapper .inner .thumbnail {
    margin: 0 -110px;
}
@media only screen and (max-width: 767px) {
    .blog-single-page-title h2 {
        line-height: 62px;
        font-size: 40px;
    }
    .production-tab-videos ul{
        grid-template-columns: repeat(1,1fr);
    }
}

@media only screen and (max-width: 767px) {
    .blog-single-page-title ul.blog-meta li {
        font-size: 14px;
    }
}

@media only screen and (max-width: 1370px) {
    .header-logo-wrap .header-phone  {
        margin-left: 20px;
    }
    .header-logo-wrap .logo img {
        width: 210px;
    }
    /* .header-right .mainmenunav ul.mainmenu > li {
        margin: 0 10px;
    } */
    .header-phone img {
        max-width: 160px;
    }
    header.header-area.header--transparent{
        padding-left: 40px;
        padding-right: 40px;
    }
    header .mainmenunav ul.mainmenu > li > a img {
        max-width: 135px;
    }

}
@media only screen and (max-width: 1199px) {
     .mainmenunav ul.mainmenu > li > a img {
        width: 105px !important;
    }
    .header-area .header-wrapper .logo a img {
        width: 200px;
    }
    
    
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-blog-details .inner-wrapper .inner {
        padding: 0 40px;
    }
    .portfolio-video ul li{
        width: 48% !important;
    }
    .header-star {
        margin-left: 20px !important;
    }
    h1{
        font-size: 50px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-blog-details .inner-wrapper .inner {
        padding: 0 40px;
    }
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .inner {
        padding: 0 10px;
    }
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .inner p {
        margin-bottom: 20px;
    }
}


@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .inner .thumbnail {
        margin: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-blog-details .inner-wrapper .inner .thumbnail {
        margin: 0;
    }
}



@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-blog-details .inner-wrapper .inner .rn-blog-quote {
        padding: 0 4%;
        margin-top: 40px;
        margin-bottom: 40px;
    }
  
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-blog-details .inner-wrapper .inner .rn-blog-quote {
        padding: 0 4%;
        margin-top: 40px;
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .inner .rn-blog-quote {
        padding: 0 4%;
        margin-top: 40px;
        margin-bottom: 40px;
        font-size: 20px;
        line-height: 33px;
    }
}

@media only screen and (max-width: 575px) {
    .rn-blog-details .inner-wrapper .inner .rn-blog-quote {
        padding: 0;
        margin-top: 20px;
        margin-bottom: 20px;
        font-size: 16px;
        line-height: 29px;
    }
}

.rn-blog-details .inner-wrapper .inner .rn-blog-quote::before {
    position: absolute;
    width: 234px;
    height: 121%;
    left: 50%;
    top: 2px;
    background-image: url(../images/client/image-1.png);
    content: "";
    opacity: 1;
    background-repeat: no-repeat;
    z-index: -1;
    transform: translateX(-50%);
}

.rn-blog-details .inner-wrapper .blog-single-list-wrapper {
    margin-right: -110px;
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper {
        margin-right: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper {
        margin-right: 0;
    }
}

.rn-blog-details .inner-wrapper .blog-single-list-wrapper .thumbnail {
    width: 55%;
    padding-right: 30px;
    margin-right: 0;
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper .thumbnail {
        width: 100%;
        padding-right: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper .thumbnail {
        width: 100%;
        padding-right: 0;
    }
}

.rn-blog-details .inner-wrapper .blog-single-list-wrapper .thumbnail img {
    width: 100%;
}

.rn-blog-details .inner-wrapper .blog-single-list-wrapper .thumbnail span {
    color: rgba(29, 29, 36, 0.75);
    font-size: 14px;
    display: block;
    text-align: left;
    padding-top: 10px;
    padding-left: 110px;
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper .thumbnail span {
        font-size: 13px;
        padding-left: 0;
        margin-bottom: 23px;
    }
}

.rn-blog-details .inner-wrapper .blog-single-list-wrapper h4.title {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper h4.title {
        margin-bottom: 16px;
    }
}

.rn-blog-details .inner-wrapper .blog-single-list-wrapper .content {
    width: 45%;
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper .content {
        width: 100%;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper .content {
        width: 100%;
    }
}

.rn-blog-details .inner-wrapper .blog-single-list-wrapper .content ul.list-style {
    margin-bottom: 50px;
}

@media only screen and (max-width: 767px) {
    .rn-blog-details .inner-wrapper .blog-single-list-wrapper .content ul.list-style {
        margin-bottom: 25px;
    }
}

/*------------------------
    BLog Contact Form  
--------------------------*/
.blog-comment-form .inner .rnform-group {
    margin-bottom: 20px;
}

.blog-comment-form .inner .rnform-group input {
    border: 2px solid #e9e9e9;
    border-radius: 4px;
    height: 50px;
    font-size: 16px;
}

.blog-comment-form .inner .rnform-group textarea {
    min-height: 193px;
    border: 2px solid #e9e9e9;
    border-radius: 4px;
    resize: none;
    padding: 15px;
    font-size: 16px;
}

/*====================
    Breadcrump Area 
======================*/
@media (min-width: 1200px) {
    .container {
        max-width: 1260px;
    }
}

.breadcrumb-inner {
    text-align: center;
}

.breadcrumb-inner h2.title {
    background: #0096d1;
    background: linear-gradient(145deg, #0096d1 0%, #861dec 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.breadcrumb-inner ul.page-list li {
    display: inline-block;
    color: #fff;
}

.breadcrumb-inner ul.page-list li a {
    color: #fff;
}

.breadcrumb-inner ul.page-list li.breadcrumb-item.active {
    color: #861dec;
}

.breadcrupm-style--2 h2.title {
    text-transform: uppercase;
    font-size: 72px;
}

@media only screen and (max-width: 767px) {
    .breadcrupm-style--2 h2.title {
        font-size: 40px;
        line-height: 59px;
    }
}

.breadcrupm-style--2 span {
    font-size: 22px;
    color: #c6c9d8;
}

.rn-page-title h2.title {
    font-size: 72px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-page-title h2.title {
        font-size: 56px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-page-title h2.title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .rn-page-title h2.title {
        font-size: 40px;
        line-height: 59px;
    }
}

.rn-page-title p {
    font-size: 22px;
    line-height: 27px;
    color: #c6c9d8;
}

.backto-top > div {
    z-index: 999;
    width: 50px;
    height: 50px;
    line-height: 49px;
    border-radius: 50%;
    background-color: #ffffff;
    text-align: center;
    overflow: hidden;
    z-index: 999 !important;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
}
.backto-top > div.show{
    visibility: visible !important;
    opacity: 1 !important;
}

.backto-top svg {
    font-size: 14px !important;
    color: #222222;
    width: 27px;
    height: 27px;
}

/*===================
Button Area 
====================*/
a.btn-transparent {
    color: #1f1f25;
    font-size: 16px;
    font-weight: 500;
    position: relative;
    display: inline-block;
    padding-bottom: 3px;
}

a.btn-transparent:hover {
    color: #0096d1;
}

a.btn-transparent::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background: #0096d1;
    opacity: 0.75;
}

a.btn-transparent:hover::after {
    width: 100%;
}

a.rn-btn,
button.rn-btn {
    padding: 0 23px;
    height: 40px;
    display: inline-block;
    line-height: 34px;
    border: 2px solid #0096d1;
    border-radius: 4px;
    font-size: 14px;
    position: relative;
    z-index: 2;
    color: #0096d1;
    letter-spacing: 0.2px;
    text-transform: uppercase;
}

a.rn-btn:hover,
  button.rn-btn:hover {
    border: 2px solid #0096d1;
    transform: translateY(-3px);
    color: #ffffff;
    background: #0096d1;
}

a.rn-btn.btn-white,
  button.rn-btn.btn-white {
    border: 2px solid #ffffff;
    color: #ffffff;
}

a.rn-btn.btn-white:hover,
    button.rn-btn.btn-white:hover {
    border-color: #0096d1;
}

button.rn-button-style--2,
a.rn-button-style--2 {
    color: #1d1d24;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
    border: 2px solid #1d1d24;
    padding: 15px 40px;
    border-radius: 6px;
    display: inline-block;
    font-weight: 500;
    transition: 0.3s;
}
a.rn-button-style--2:hover, button.rn-button-style--2:hover {
    background: transparent;
    color: #861dec;
    box-shadow: 0 10px 15px 0 rgba(0,0,0,.1);
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
}
@media only screen and (max-width: 767px) {
    button.rn-button-style--2,
    a.rn-button-style--2 {
        padding: 9px 25px;
    }
}

button.rn-button-style--2.rn-btn-dark,
  a.rn-button-style--2.rn-btn-dark {
    border: 2px solid #1f1f25;
    color: #1f1f25;
}

button.rn-button-style--2.rn-btn-dark:hover,
    a.rn-button-style--2.rn-btn-dark:hover {
    background: #1f1f25;
    color: #fff;
}

button.rn-button-style--2.border-opacity-half,
  a.rn-button-style--2.border-opacity-half {
    border-color: rgba(31, 31, 37, 0.1);
}

button.rn-button-style--2.rn-btn-small,
  a.rn-button-style--2.rn-btn-small {
    padding: 10px 20px;
}

button.rn-button-style--2.btn-primary-color:hover,
  a.rn-button-style--2.btn-primary-color:hover {
    border: 2px solid #0096d1;
    background: #0096d1;
    color: #ffffff;
}

button.rn-button-style--2.btn-solid,
  a.rn-button-style--2.btn-solid {
    border: 2px solid #0096d1;
    background: #df1000;
    color: #ffffff;
}

button.rn-button-style--2.btn-solid,
  a.rn-button-style--2.btn-solid {
    background: #df1000;
    color: #ffffff;
}

button.rn-button-style--2:hover,
  a.rn-button-style--2:hover {
    background: transparent;
    /* color: #861dec; */
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

/*----------------------------
    Video Popup Styles 
-------------------------------*/
button.video-popup {
    display: block;
    position: relative;
    margin: 0 auto;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: #fff;
    -webkit-transition: all 1s cubic-bezier(0, 0, 0.2, 1);
    -o-transition: all 1s cubic-bezier(0, 0, 0.2, 1);
    transition: all 1s cubic-bezier(0, 0, 0.2, 1);
    -webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2);
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2);
}

button.video-popup::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    -webkit-transform: translate(-6px, -9px);
    -ms-transform: translate(-6px, -9px);
    transform: translate(-6px, -9px);
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 15px solid #0096d1;
}

button.video-popup:hover {
    -webkit-transform: scale3d(1.15, 1.15, 1.15);
    transform: scale3d(1.15, 1.15, 1.15);
}

button.video-popup.position-top-center {
    position: absolute;
    top: 50%;
    left: 50%;
    border: 0 none;
    width: 110px;
    height: 110px;
    margin-left: -55px;
    margin-top: -55px;
    transition: all 1s cubic-bezier(0, 0, 0.2, 1);
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2);
}

@media only screen and (max-width: 767px) {
    button.video-popup.position-top-center {
        width: 70px;
        height: 70px;
        margin-left: -35px;
        margin-top: -35px;
    }
}

button.video-popup.position-top-center:hover {
    transform: scale3d(1.15, 1.15, 1.15);
}

button.video-popup.position-top-center.md-size {
    width: 80px;
    height: 80px;
    margin-left: -40px;
    margin-top: -40px;
}

button.video-popup.theme-color {
    background: #0096d1;
    border-color: #0096d1;
}

button.video-popup.theme-color::before {
    border-left: 15px solid #ffffff;
}

button.video-popup.black-color {
    background: #000000;
    border-color: #000000;
}

button.video-popup.black-color::before {
    border-left: 15px solid #ffffff;
}

/*--------------------
Footer Styles 
----------------------*/
.footer-wrapper {
    position: relative;
}

.footer-left {
    background: linear-gradient(145deg, #0096d1 0%, #861dec 100%);
    padding: 120px 120px;
    position: relative;
    z-index: 2;
    margin-right: -15px;
    border-top-right-radius: 6px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .footer-left {
        padding: 120px 80px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .footer-left {
        padding: 60px 70px;
    }
}

@media only screen and (max-width: 767px) {
    .footer-left {
        padding: 60px 30px;
    }
}

.footer-left::before {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-image: url("../images/pattern-1.png");
    content: "";
    z-index: 1;
    opacity: 0.5;
    border-top-right-radius: 6px;
}

.footer-left .inner {
    z-index: 5;
    position: relative;
}

.footer-left .inner::after {
    content: url(../images/logo/big-logo.png);
    position: absolute;
    right: 0;
    top: 50%;
    z-index: -1;
    font-size: 240px;
    font-weight: 900;
    color: rgba(0, 0, 0, 0.1);
    transform: translateY(-50%);
    width: 295px;
    height: 301px;
}

.footer-left .inner > span {
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 4px;
    display: block;
    margin-bottom: 9px;
}

@media only screen and (max-width: 575px) {
    .footer-left .inner > span {
        letter-spacing: 1px;
        margin-bottom: 9px;
    }
}

.footer-left .inner h2 {
    color: #ffffff;
    font-size: 75px;
    font-weight: 900;
    font-family: 'Montserrat', sans-serif;
    line-height: 90px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .footer-left .inner h2 {
        font-size: 50px;
        line-height: 61px;
    }
}

@media only screen and (max-width: 767px) {
    .footer-left .inner h2 {
        font-size: 45px;
        line-height: 51px;
    }
}

.footer-left .inner a.rn-button-style--2 {
    margin-top: 30px;
    border-color: #ffffff;
    color: #ffffff;
}

@media only screen and (max-width: 767px) {
    .footer-left .inner a.rn-button-style--2 {
        margin-top: 10px;
        padding: 10px 23px;
    }
}

@media only screen and (max-width: 575px) {
    .footer-left .inner a.rn-button-style--2 {
        padding: 7px 16px;
    }
}

.footer-left .inner a.rn-button-style--2:hover {
    background: #fff;
    border-color: #fff;
    color: #0096d1;
}

.footer-right {
    background-image: url(../images/bg/bg-image-8.jpg);
    padding: 150px 70px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
    padding: 150px 70px 150px 120px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .footer-right {
        padding: 119px 21px;
        padding-left: 70px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .footer-right {
        padding: 60px 70px;
    }
}

@media only screen and (max-width: 767px) {
    .footer-right {
        padding: 60px 30px;
    }
}

.footer-right .footer-link h4 {
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 30px;
   /* opacity: 0.75;*/
    background: #3bb14e;
    display: inline-block;
    padding: 0 20px;
    text-transform: capitalize;
}

@media only screen and (max-width: 767px) {
    .footer-right .footer-link h4 {
        margin-bottom: 14px;
    }
}

.footer-right .footer-link ul.ft-link {
    padding: 0;
    margin: 0;
    list-style: none;
}

.footer-right .footer-link ul.ft-link li a {
    color: #c6c9d8;
    font-size: 16px;
    opacity: 0.75;
}

.footer-right .footer-link ul.ft-link li:hover a {
    color: #0096d1;
}

.footer-right .footer-link ul.ft-link li + li {
    margin-top: 13px;
}

@media only screen and (max-width: 767px) {
    .footer-right .footer-link ul.ft-link li + li {
        margin-top: 8px;
    }
}

/* Footer Style Two  */
.footer-style-2 p {
    color: #c6c9d8;
    font-size: 14px;
    opacity: 0.75;
}

.copyright-text {
    position: absolute;
    bottom: -114px;
}

@media only screen and (max-width: 767px) {
    .copyright-text {
        position: static;
        bottom: 0;
        padding-top: 33px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .copyright-text {
        position: static;
        bottom: 0;
        padding-top: 33px;
    }
}

.copyright-text p {
    color: #c6c9d8;
    font-size: 14px;
    opacity: 0.75;
}

/*===================
    Section Title 
====================*/
.section-title {
    margin-top: -20px;
}

.section-title h2.title {
    font-size: 60px;
    margin-bottom: 8px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title h2.title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .section-title h2.title {
        font-size: 36px;
        margin-bottom: 7px;
    }
}

.section-title p {
    font-size: 18px;
    line-height: 30px;
    color: rgba(29, 29, 36, 0.75);
}

.section-title p a {
    color: #1d1d24;
    font-weight: 500;
}

.section-title p a:hover {
    color: #0096d1;
}

@media only screen and (max-width: 767px) {
    .section-title p br {
        display: none;
    }
}

.section-title h3 {
    font-size: 36px;
    line-height: 26px;
}

@media only screen and (max-width: 767px) {
    .section-title h3 {
        font-size: 26px;
        margin-bottom: 8px;
    }
}

.section-title .service-btn {
    margin-top: 36px;
}

@media only screen and (max-width: 767px) {
    .section-title .service-btn {
        margin-top: 12px;
    }
}

.section-title.service-style--2 h2,
  .section-title.service-style--2 h3 {
    color: #ffffff;
}

.section-title.service-style--2 p {
    padding: 0 21%;
    font-weight: 300;
    color: #ffffff;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title.service-style--2 p {
        padding: 0 7%;
    }
}

@media only screen and (max-width: 767px) {
    .section-title.service-style--2 p {
        padding: 0;
    }
}

.section-title.service-style--3 p {
    padding: 0 21%;
    font-weight: 300;
    color: #717173;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title.service-style--3 p {
        padding: 0 7%;
    }
}

@media only screen and (max-width: 767px) {
    .section-title.service-style--3 p {
        padding: 0;
    }
}

.section-title.service-style--3.text-left p {
    padding: 0 3% 0 0;
}

.section-title-default h2.title {
    line-height: 1.34;
    font-size: 48px;
}

@media only screen and (max-width: 767px) {
    .section-title h2 {
        font-size: 36px;
        margin-bottom: 7px;
    }
}
/*===============================
    Color Variation 
=================================*/
/* container 450px*/
/* container 300px*/
/* Social icon Styles  */
ul.social-share {
    padding: 0;
    margin: 0;
    margin: -6px;
}

ul.social-share li {
    margin: 6px;
}

ul.social-share li a {
    width: 40px;
    display: inline-block;
    height: 40px;
    border: 2px solid rgba(198, 201, 216, 0.75);
    line-height: 35px;
    color: rgba(198, 201, 216, 0.75);
    border-radius: 100%;
    text-align: center;
    font-size: 14px;
}

ul.social-share li:hover a {
    background: #0096d1;
    border-color: #0096d1;
    color: #ffffff;
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.1);
    transform: translateY(-3px);
}

ul.social-share.color-theme li a {
    border-color: #0096d1;
    color: #0096d1;
}

ul.social-share.color-theme li a:hover {
    background: #0096d1;
    border-color: #0096d1;
    color: #ffffff;
}

ul.social-share.rn-lg-size {
    margin-top: 0 !important;
}

ul.social-share.rn-lg-size li a {
    width: 50px;
    height: 50px;
    line-height: 44px;
    font-size: 16px;
}

ul.social-share.social-style--2 li a {
    border: 0 none;
    width: 30px;
    height: auto;
    text-align: left;
    line-height: inherit;
    font-size: 16px;
}

ul.social-share.social-style--2 li:hover a {
    background: transparent;
    box-shadow: none;
}

ul.social-share.social-style--2.color-theme li a {
    color: #0096d1;
}

ul.social-share.social-style--2.color-theme li a:hover {
    color: currentColor;
}

ul.social-share.social-style--2.color-black li a {
    color: #1d1d24;
    opacity: 0.8;
}

ul.social-share.social-style--2.color-black li a:hover {
    color: #0096d1;
    opacity: 1;
}

/*=====================
    Header Area 
=======================*/
.header-area.header--transparent {
    /*position: absolute;*/
    top: 0;
    left: 0;
    right: 0;
    width: auto;
    padding-left: 50px;
    padding-right: 50px;
    z-index: 999;
    background-color: #ff0000;
}



@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-area.header--transparent {
        padding-left: 30px;
        padding-right: 30px;
    }
}

@media only screen and (max-width: 767px) {
    .header-area.header--transparent {
        padding-left: 15px;
        padding-right: 15px;
    }
}

.header-area .header-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*padding: 50px 0;*/
    flex-wrap: wrap;
     padding: 20px 0;
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper {
        padding: 15px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper {
        padding: 30px 0 20px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-area .header-wrapper {
        padding: 30px 0;
    }
}

.header-area .header-wrapper .header-hamberger {
    display: flex;
    align-items: center;
}

.header-area .header-wrapper .header-hamberger .hamberger {
    margin-right: 27px;
}

.header-area .header-wrapper a.rn-btn {
padding: 0 25px;
    height: 46px;
    display: inline-block;
    line-height: 42px;
    border: 2px solid #0096d1;
    background-color: #0096d1;
    border-radius: 6px;
    color: #fff;
    font-size: 14px;
    position: relative;
    z-index: 2;
}
.header-area .header-wrapper a.rn-btn:hover {
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
    color: #0096d1;
    background: transparent;
    border-radius: 6px;
}
.header-area .header-wrapper a.rn-btn.theme-color {
    border-color: #0096d1;
    color: #0096d1;
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper a.rn-btn {
        padding: 0 11px;
        height: 39px;
        line-height: 33px;
        font-size: 12px;
    }
}

@media only screen and (max-width: 575px) {
    .header-area .header-wrapper a.rn-btn {
        height: 34px;
        line-height: 29px;
    }
}

.header-area .header-wrapper a.rn-btn::before {
    display: none;
}


@media only screen and (max-width: 767px) {
    .header-area .header-wrapper a.rn-btn {
        display: none;
    }
}

.header-area.color-white a.rn-btn {
    border: 2px solid #ffffff;
    color: #ffffff;
}

.header-area.color-black a.rn-btn {
    border: 2px solid rgba(29, 29, 36, 0.5);
    color: #1d1d24;
}

.header-area.header--static {
    padding: 0 50px;
}

.header-area.header--static .header-wrapper {
    padding: 7px 0;
}

@media only screen and (max-width: 767px) {
    .header-area.header--static .header-wrapper .logo a img {
        width: auto;
    }
}

.header-area.header--fixed {
    position: absolute;
    top: 0;
    z-index: 999;
    padding-left: 50px;
    padding-right: 50px;
    width: 100%;
    background: transparent;
    transition: 0.3s;
}

.header-logo-wrap {
    display: flex;
    align-items: center;
}
.header-phone {
    margin-left: 30px;
    max-width: 250px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-area.header--fixed {
        padding-left: 30px;
        padding-right: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area.header--fixed {
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
      .header-area .header-wrapper .logo a img {
        width: 220px;
    }
}

@media only screen and (max-width: 767px) {
    .header-area.header--fixed {
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .header-phone {
        margin-left: 10px;
    }
    .header-phone img {
        max-width: 110px;
    }
}

.header-area.header--fixed .header-wrapper {
    padding: 20px 0;
    transition: 0.3s;
}

.header-area.header--fixed .header-wrapper .logo a img {
    transition: 0.5s;
}

.header-area.header--fixed .header-wrapper .logo a img.logo-1 {
    display: block;
}

.header-area.header--fixed .header-wrapper .logo a img.logo-2 {
    display: none;
}

.header-area.header--fixed .header-wrapper .mainmenunav ul.mainmenu > li > a {
    position: relative;
}

.header-area.header--fixed .header-wrapper .mainmenunav ul.mainmenu > li > a::after {
    position: absolute;
    content: "";
    left: 0;
    width: 0;
    height: 3px;
    background: #0096d1;
    transition: 0.3s;
    bottom: 0;
}

.header-area.header--fixed .header-wrapper .mainmenunav ul.mainmenu > li.is-current a {
    color: #0096d1;
}

.header-area.header--fixed .header-wrapper .mainmenunav ul.mainmenu > li.is-current a::after {
    width: 100%;
}

.header-area.header--fixed.default-color.sticky .mainmenunav ul.mainmenu > li > a {
    color: #1f1f25;
}

.header-area.header--fixed.default-color.sticky .mainmenunav ul.mainmenu > li.is-current a {
    color: #0096d1;
}

.header-area.header--fixed.default-color.sticky .mainmenunav ul.mainmenu > li.is-current a::after {
    width: 100%;
}

.header-area.header--fixed.sticky {
    position: fixed;
    background: #ffffff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.header-area.header--fixed.sticky .header-wrapper {
    padding: 0px;
}

.header-area.header--fixed.sticky .header-wrapper a.rn-btn {
    color: #1f1f25;
    border-color: #1f1f25;
}

.header-area.header--fixed.sticky .header-wrapper a.rn-btn:hover {
    color: #ffffff;
    border-color: #0096d1;
}

.header-area.header--fixed.sticky .logo a img {
    height: 50px;
}

.header-area.header--fixed.sticky .logo a img.logo-1 {
    display: none;
}

.header-area.header--fixed.sticky .logo a img.logo-2 {
    display: block;
}

.header-area.header--fixed.sticky .humberger-menu span.text-white {
    color: #1f1f25 !important;
}

.header-area.color-black .humberger-menu span.text-white {
    color: #1f1f25 !important;
}

.header-area.logoresize .logo a img {
    height: 58px;
    width: auto !important;
}

@media only screen and (max-width: 575px) {
    .header-area.logoresize .logo a img {
        height: auto;
    }
}

.header-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.header-right .header-btn {
    margin-left: 50px;
}

@media only screen and (max-width: 575px) {
    .header-right .header-btn {
        margin-left: 0;
    }
}

/*-----------------------------
    MObile Menu Style Css 
-------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav {
        position: absolute;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav {
        position: absolute;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu {
        width: 60vw;
        height: 100vh;
        position: fixed;
        top: 0;
        right: -61vw;
        z-index: 99;
        padding: 55px;
        background: #ffffff;
        -webkit-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        -o-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        display: block;
        overflow-y: auto;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu {
        width: 60vw;
        height: 100vh;
        position: fixed;
        top: 0;
        right: -61vw;
        z-index: 99;
        padding: 55px;
        background: #ffffff;
        -webkit-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        -o-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        display: block;
        overflow-y: auto;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li {
        margin: 0;
        padding: 10px 0;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li {
        margin: 0;
        padding: 10px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown {
        position: relative;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown {
        position: relative;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a {
        position: relative;
    }

    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a::after {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 7px 7px 0 7px;
        border-color: #1f1f25 transparent transparent transparent;
        position: absolute;
        content: "";
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a.open {
        color: #0096d1;
    }

    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a.open::after {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 7px 7px 7px;
        border-color: transparent transparent #0096d1 transparent;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a {
        position: relative;
    }

    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a::after {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 7px 7px 0 7px;
        border-color: #1f1f25 transparent transparent transparent;
        position: absolute;
        content: "";
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    }

    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a.open {
        color: #0096d1;
    }

    .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a.open::after {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 7px 7px 7px;
        border-color: transparent transparent #0096d1 transparent;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li a {
        padding: 0;
        display: block;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li a {
        padding: 0;
        display: block;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu {
        position: relative;
        height: 0;
        transition: 0.3s;
        padding: 0;
        opacity: 0;
        visibility: hidden;
        background: transparent;
        box-shadow: inherit;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu {
        position: relative;
        height: 0;
        transition: 0.3s;
        padding: 0;
        opacity: 0;
        visibility: hidden;
        background: transparent;
        box-shadow: inherit;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu li {
        padding: 3px 0;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu li {
        padding: 3px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu li a {
        padding: 2px 10px;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu li a {
        padding: 2px 10px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu.active {
        height: 100%;
        padding: 12px 0;
        opacity: 1;
        visibility: visible;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li ul.submenu.active {
        height: 100%;
        padding: 12px 0;
        opacity: 1;
        visibility: visible;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li a {
        color: #1f1f25;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper .mainmenunav ul.mainmenu li a {
        color: #1f1f25;
    }
}

.header-area .header-wrapper .close-menu {
    position: fixed;
    top: 12px;
    opacity: 0;
    visibility: hidden;
    right: 29px;
    z-index: -10;
}

.header-area .header-wrapper.menu-open .close-menu {
    opacity: 1;
    visibility: visible;
    z-index: 9999;
}

.header-area .header-wrapper.menu-open .close-menu span {
    color: #000000;
    font-size: 30px;
    cursor: pointer;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area .header-wrapper.menu-open .mainmenunav ul.mainmenu {
        right: 0;
    }
}

@media only screen and (max-width: 767px) {
    .header-area .header-wrapper.menu-open .mainmenunav ul.mainmenu {
        right: 0;
    }
}

@media only screen and (max-width: 575px) {
    .header-area .header-wrapper.menu-open .mainmenunav ul.mainmenu {
        width: 86vw;
        padding: 54px 20px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area.header-style-two .header-wrapper {
        padding: 30px 0;
    }
}

@media only screen and (max-width: 767px) {
    .header-area.header-style-two .header-wrapper {
        padding: 15px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-area.header-style-two .header-wrapper .logo a img {
        width: auto;
    }
}

@media only screen and (max-width: 767px) {
    .header-area.header-style-two .header-wrapper .logo a img {
        width: auto;
    }
}

@media only screen and (max-width: 767px) {
    .header-area.header-style-two .header-wrapper ul.social-share li {
        margin: 0;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-style-two .header-right .header-btn {
        margin-left: 7px;
    }
}

/*------------------------
    Hamberger Menu  
---------------------------*/
.humberger-menu span {
    cursor: pointer;
}

@media only screen and (max-width: 767px) {
    .humberger-menu span {
        font-size: 28px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .humberger-menu span {
        font-size: 28px;
    }
}

.header-wrapper.menu-open .humberger-menu span {
    opacity: 0;
}
/*====================
Mainmenu Area 
=====================*/
.mainmenunav ul.mainmenu {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    align-items: center;
}

.mainmenunav ul.mainmenu > li {
    /* margin: 0 15px; */
    margin: 0 5px;
    position: relative;
}

.mainmenunav ul.mainmenu > li > a {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    padding: 20px 0;
    display: inline-block;
}

.mainmenunav ul.mainmenu > li > ul.submenu {
    min-width: 240px;
    height: auto;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 90;
    opacity: 0;
    visibility: hidden;
    background-color: #fff;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
    text-align: left;
    padding: 12px 0;
    border-radius: 4px;
}

.mainmenunav ul.mainmenu > li > ul.submenu li a {
    font-size: 16px;
    font-weight: 500;
    padding: 5px 20px;
    font-size: 14px;
    display: block;
    color: #1f1f25;
    margin: 0 10px;
    border-radius: 3px;
}

.mainmenunav ul.mainmenu > li > ul.submenu li:hover a {
    color: #0096d1;
    background: rgba(249, 0, 77, 0.07);
}

.mainmenunav ul.mainmenu > li:hover > ul.submenu {
    opacity: 1;
    visibility: visible;
}

.mainmenunav ul.mainmenu > li:hover > a {
    color: #0096d1;
}

.mainmenunav ul.mainmenu > li:first-child {
    margin-left: 0;
}

.mainmenunav ul.mainmenu > li:last-child {
    margin-right: 0;
}

.humberger-menu span.text-white {
    color: #c6c9d8 !important;
}

.color-white .mainmenunav ul.mainmenu > li > a {
    color: #ffffff;
}

.color-white .mainmenunav ul.mainmenu > li:hover > a {
    color: rgba(255, 255, 255, 0.6);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .color-white .mainmenunav ul.mainmenu > li:hover > a {
        color: #0096d1;
    }
}

@media only screen and (max-width: 767px) {
    .color-white .mainmenunav ul.mainmenu > li:hover > a {
        color: #0096d1;
    }
}

.color-black .mainmenunav ul.mainmenu > li > a {
    color: #1d1d24;
}

.color-black .mainmenunav ul.mainmenu > li:hover > a {
    color: #0096d1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-style-two .humberger-menu span.text-white {
        color: #1d1d24 !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-style-two .humberger-menu span.text-white {
        color: #1d1d24 !important;
    }
}

@media only screen and (max-width: 767px) {
    .header-style-two .humberger-menu span.text-white {
        color: #1d1d24 !important;
    }
}
/*====================
    About Area 
======================*/
.rn-finding-us-area .inner {
    position: relative;
    padding-left: 240px;
    padding-top: 110px;
    padding-bottom: 110px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-finding-us-area .inner {
        padding-left: 0;
        padding-top: 0;
        padding-bottom: 0;
        display: flex;
        flex-direction: column-reverse;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-finding-us-area .inner {
        padding-left: 0;
        padding-top: 0;
        padding-bottom: 0;
        display: flex;
        flex-direction: column-reverse;
    }
}

@media only screen and (max-width: 767px) {
    .rn-finding-us-area .inner {
        padding-left: 0;
        padding-top: 0;
        padding-bottom: 0;
        display: flex;
        flex-direction: column-reverse;
    }
}

.rn-finding-us-area .inner .content-wrapper .content {
    background: #272527;
    padding: 120px 100px;
    position: relative;
    z-index: 2;
    width: 800px;
    border-radius: 10px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-finding-us-area .inner .content-wrapper .content {
        padding: 60px 50px;
        width: 100%;
        border-radius: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-finding-us-area .inner .content-wrapper .content {
        padding: 60px 50px;
        width: 100%;
        border-radius: 0;
    }
}

@media only screen and (max-width: 767px) {
    .rn-finding-us-area .inner .content-wrapper .content {
        padding: 30px 30px;
        width: 100%;
        border-radius: 0;
    }
}

.rn-finding-us-area .inner .content-wrapper .content h4 {
    color: #ffffff;
    font-size: 36px;
    font-weight: 500;
    margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
    .rn-finding-us-area .inner .content-wrapper .content h4 {
        font-size: 26px;
        margin-bottom: 12px;
    }
}

.rn-finding-us-area .inner .content-wrapper .content p {
    font-size: 18px;
    color: #ffffff;
    font-weight: 300;
    margin-bottom: 41px;
    padding-right: 10%;
}

@media only screen and (max-width: 767px) {
    .rn-finding-us-area .inner .content-wrapper .content p {
        margin-bottom: 24px;
        padding-right: 0;
    }
}

.rn-finding-us-area .inner .thumbnail {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-finding-us-area .inner .thumbnail {
        position: static;
        height: 100%;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-finding-us-area .inner .thumbnail {
        position: static;
        height: 100%;
    }
}

@media only screen and (max-width: 767px) {
    .rn-finding-us-area .inner .thumbnail {
        position: static;
        height: 100%;
    }
}

.rn-finding-us-area .inner .thumbnail img {
    border-radius: 10px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-finding-us-area .inner .thumbnail img {
        border-radius: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-finding-us-area .inner .thumbnail img {
        border-radius: 0;
    }
}

@media only screen and (max-width: 767px) {
    .rn-finding-us-area .inner .thumbnail img {
        border-radius: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .about-inner {
        padding-top: 40px;
    }
}

@media only screen and (max-width: 767px) {
    /*.about-inner {*/
    /*    padding-top: 40px;*/
    /*}*/
}

.about-inner .section-title h2.title {
    margin-bottom: 8px;
}

.about-inner .section-title p.description {
    font-weight: 400;
    color: #1d1d24;
}

.about-inner .section-title p.description a {
    color: #1d1d24;
}

.about-inner .section-title p.description a:hover {
    color: #0096d1;
}

.about-wrapper .thumbnail {
    position: relative;
    z-index: 2;
}

.about-wrapper .thumbnail img {
    border-radius: 8px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .about-position-top {
        padding-top: 120px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .about-position-top {
        padding-top: 80px;
    }
}

@media only screen and (max-width: 767px) {
    .about-position-top {
        padding-top: 60px;
    }
}

.about-position-top .thumbnail {
    margin-top: -130px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .about-position-top .thumbnail {
        margin-top: 0;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .about-position-top .thumbnail {
        margin-top: -89px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .about-position-top .thumbnail {
        margin-top: 0;
    }
}

@media only screen and (max-width: 767px) {
    .about-position-top .thumbnail {
        margin-top: 0;
    }
}

.about-us-list {
    margin-top: 15px;
}

.about-us-list h3.title {
    font-size: 30px;
    margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
    .about-us-list h3.title {
        font-size: 26px;
        margin-bottom: 8px;
    }
}

.about-us-list p {
    font-weight: 300;
    color: rgba(29, 29, 36, 0.75);
}

.rn-content-box-style--1 .content {
    text-align: left;
    padding: 0 120px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-content-box-style--1 .content {
        padding: 0 60px;
    }
}

@media only screen and (max-width: 767px) {
    .rn-content-box-style--1 .content {
        padding: 0 40px;
    }
}

.rn-content-box-style--1 .content p.subtitle {
    color: #1f1f25;
    font-size: 16px;
    font-weight: 400;
    background: rgba(255, 26, 80, 0.03);
    padding: 8px 25px;
    display: inline-block;
    border-radius: 4px;
}

.rn-content-box-style--1 .content p.subtitle span {
    color: #f9004d;
}

.rn-content-box-style--1 .content h2 {
    margin-top: 30px;
    margin-bottom: 20px;
    font-size: 36px;
    line-height: 50px;
    font-weight: 500;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-content-box-style--1 .content h2 {
        margin-top: 7px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-content-box-style--1 .content h2 {
        margin-top: 7px;
    }
}

@media only screen and (max-width: 767px) {
    .rn-content-box-style--1 .content h2 {
        margin-top: 7px;
    }
}

.rn-content-box-style--1 .content p {
    color: rgba(29, 29, 36, 0.75);
    font-size: 18px;
    line-height: 30px;
}

/*--------------------------
    Color Darker Version  
----------------------------*/
.active-dark {
    background: #101010;
}

.active-dark [data-overlay="6"]:before,
  .active-dark [data-black-overlay="6"]:before,
  .active-dark [data-white-overlay="6"]:before {
    display: none;
}

.active-dark [data-overlay]:before,
  .active-dark [data-black-overlay]:before,
  .active-dark [data-white-overlay]:before {
    display: none;
}

.active-dark .service-white .service__style--1 .content h4.title {
    color: #ffffff;
}

.active-dark .bg_image--3,
  .active-dark .bg_image--1,
  .active-dark .rn-testimonial-content .inner p::before,
  .active-dark .rn-testimonial-content .inner p::after,
  .active-dark .footer-right {
    background-image: inherit !important;
}

.active-dark .bg_color--1,
  .active-dark .brand-separation {
    background: #191919;
}

.active-dark .bg_color--5,
  .active-dark .footer-right {
    background: #101010;
}

.active-dark ul.brand-style-2 img {
    filter: invert(1);
}

.active-dark h1, .active-dark h2, .active-dark h3, .active-dark h4, .active-dark h5, .active-dark h6, .active-dark .h1, .active-dark .h2, .active-dark .h3, .active-dark .h4, .active-dark .h5, .active-dark .h6 {
    color: #ffffff;
}

.active-dark a.btn-transparent {
    color: #ffffff;
}

.active-dark .section-title p,
  .active-dark .about-us-list p,
  .active-dark .about-inner .section-title p.description,
  .active-dark .service.service__style--2 .content p,
  .active-dark .counterup_style--1 p.description,
  .active-dark .rn-testimonial-content .author-info h6,
  .active-dark .slide.slider-style-3 .inner > span,
  .active-dark .single-tab-content ul li a,
  .active-dark .single-tab-content ul li {
    color: rgba(198, 201, 216, 0.75);
}

.active-dark ul.tab-style--1 li::before {
    background: rgba(198, 201, 216, 0.75);
}

.active-dark ul.tab-style--1 li.react-tabs__tab--selected {
    color: #0096d1;
}

.active-dark ul.tab-style--1 li.react-tabs__tab--selected::before {
    background: currentColor;
}

.active-dark .service.service__style--2:hover .content h3.title,
  .active-dark .service.service__style--2:hover .content p,
  .active-dark .rn-testimonial-content .author-info h6 span,
  .active-dark .rn-testimonial-content .inner p,
  .active-dark .section-title p a,
  .active-dark .slide.slider-style-3 .inner h1.title,
  .active-dark .color-black .mainmenunav ul.mainmenu > li > a,
  .active-dark ul.social-share.social-style--2.color-black li a,
  .active-dark .header-area.color-black a.rn-btn,
  .active-dark ul.tab-style--1 li {
    color: #ffffff;
}

.active-dark .portfolio-sacousel-inner .slick-dots li button::after,
  .active-dark .rn-slick-dot .slick-dots li button::after {
    background: #ffffff;
    box-shadow: inset 0 0 0 5px #ffffff;
}

.active-dark .creative-service-wrapper .row.creative-service .service.service__style--2 {
    background: #191919;
}

.active-dark .contact-form--1 input, .active-dark .contact-form--1 textarea,
  .active-dark .header-area.color-black a.rn-btn {
    border: 2px solid rgba(255, 255, 255, 0.2);
}

.active-dark .header-area.color-black a.rn-btn:hover {
    border-color: #0096d1;
}

.active-dark .header-area.header--fixed.sticky {
    background: #191919;
}

.active-dark .header-area.header--fixed.sticky .header-wrapper a.rn-btn {
    color: #ffffff;
    border-color: #ffffff;
}

.active-dark .header-area.header--fixed.sticky .header-wrapper a.rn-btn:hover {
    color: #ffffff;
    border-color: #0096d1;
}

.active-dark .bg_image--25 {
    background-color: #101010;
    background-image: url(../images/bg/bg-image-28.jpg) !important;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.active-dark .backto-top > div {
    background-color: #000;
}

.active-dark .backto-top svg {
    color: #fff;
}

.active-dark .contact-form--1 input,
  .active-dark .contact-form--1 textarea {
    color: rgba(198, 201, 216, 0.75);
}

.active-dark .personal-portfolio-slider::before {
    display: none;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .active-dark .header-style-two .humberger-menu span.text-white {
        color: #c6c9d8 !important;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu {
        background: #101010;
    }

    .active-dark .header-area .header-wrapper.menu-open .close-menu span {
        color: #c6c9d8 !important;
    }

    .active-dark .header-area.header--fixed.sticky .humberger-menu span.text-white {
        color: #c6c9d8 !important;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu li a {
        color: #ffffff;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a::after {
        border-color: #ffffff transparent transparent transparent;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a.open::after {
        border-color: transparent transparent #0096d1 transparent;
    }
}

@media only screen and (max-width: 767px) {
    .active-dark .header-style-two .humberger-menu span.text-white {
        color: #c6c9d8 !important;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu {
        background: #101010;
    }

    .active-dark .header-area .header-wrapper.menu-open .close-menu span {
        color: #c6c9d8 !important;
    }

    .active-dark .header-area.header--fixed.sticky .humberger-menu span.text-white {
        color: #c6c9d8 !important;
    }

    .active-dark .service.service__style--2 .content p {
        color: #ffffff;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu li a {
        color: #ffffff;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a::after {
        border-color: #ffffff transparent transparent transparent;
    }

    .active-dark .header-area .header-wrapper .mainmenunav ul.mainmenu li.has-droupdown > a.open::after {
        border-color: transparent transparent #0096d1 transparent;
    }
}

/*-----------------------------
    Portfolio Details Styles 
-------------------------------*/
.portfolio-thumb-inner .thumb {
    position: relative;
}

.portfolio-thumb-inner .thumb .video-popup {
    position: absolute;
    top: 50%;
    left: 50%;
    border: 0 none;
    width: 110px;
    height: 110px;
    background: #0096d1;
    margin-left: -35px;
    margin-top: -35px;
}

@media only screen and (max-width: 767px) {
    .portfolio-thumb-inner .thumb .video-popup {
        width: 70px;
        height: 70px;
    }
}

.portfolio-thumb-inner .thumb .video-popup::before {
    border-left: 15px solid #ffffff;
}

.portfolio-thumb-inner .thumb .video-popup span {
    font-size: 18px;
    line-height: 28px;
    display: inline-block;
    color: #292642;
    font-weight: 500;
}

.portfolio-thumb-inner .thumb .video-popup:hover {
    transform: scale3d(1.15, 1.15, 1.15);
}

.portfolio-details .inner {
    padding: 0 210px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-details .inner {
        padding: 0 100px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-details .inner {
        padding: 0 50px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio-details .inner {
        padding: 0 30px;
    }
}

@media only screen and (max-width: 575px) {
    .portfolio-details .inner {
        padding: 0px;
    }
}

.portfolio-details .inner h2 {
    line-height: 27px;
    display: block;
    margin-bottom: 0;
    padding-bottom: 43px;
    border-bottom: 1px solid #e1e1e1;
}

.portfolio-details .inner p {
    font-size: 18px;
    line-height: 30px;
    color: rgba(29, 29, 36, 0.75);
    margin-bottom: 30px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-details .inner p {
        margin-bottom: 22px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-details .inner p {
        margin-bottom: 22px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio-details .inner p {
        margin-bottom: 22px;
    }
}

.portfolio-details .inner p.subtitle {
    color: #1f1f25;
    font-size: 23px;
    line-height: 44px;
    margin-top: 28px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-details .inner p.subtitle {
        font-size: 20px;
        line-height: 38px;
        margin-top: 24px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-details .inner p.subtitle {
        font-size: 18px;
        line-height: 38px;
        margin-top: 24px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio-details .inner p.subtitle {
        font-size: 18px;
        line-height: 38px;
        margin-top: 24px;
    }
}

.portfolio-details .inner .portfolio-view-list {
    margin: 0 -40px;
}

.portfolio-details .inner .portfolio-view-list .port-view {
    margin: 0 40px;
}

.portfolio-details .inner .portfolio-view-list .port-view span {
    font-size: 16px;
    color: rgba(29, 29, 36, 0.75);
    display: block;
    margin-bottom: 10px;
    font-weight: 500;
}

.portfolio-details .inner .portfolio-view-list .port-view h4 {
    font-size: 22px;
    font-weight: 500;
}

.related-work .thumb a img {
    width: 100%;
}

.related-work .inner {
    padding-top: 25px;
}

.related-work .inner h4 {
    font-size: 24px;
    line-height: 39px;
    margin-bottom: 7px;
}

.related-work .inner h4 a {
    color: #1f1f25;
}

.related-work .inner h4:hover a {
    color: #0096d1;
}

.related-work .inner span.category {
    color: rgba(29, 29, 36, 0.75);
    font-size: 16px;
    font-weight: 500;
}

/* Previe Styles  */
.main-wrapper {
    position: relative;
    background: #ffffff;
}

.prv-header-area {
    padding: 18px 85px;
    padding-top: 18px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .fullscreen.empty-div {
        display: none;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .fullscreen.empty-div {
        display: none;
    }
}

.with-particles {
    position: relative;
    z-index: 3;
}

.with-particles .frame-layout__particles {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
}

@media only screen and (max-width: 575px) {
    .with-particles .frame-layout__particles {
        display: none;
    }
}

.with-particles .inner {
    position: relative;
    z-index: 3;
}

.gradient-overlay {
    position: relative;
}

.gradient-overlay::before {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    content: "";
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+7,000000+100&0+50,0.5+100 */
    background: -moz-linear-gradient(-45deg, transparent 7%, transparent 50%, rgba(0, 0, 0, 0.5) 100%);
  /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, transparent 7%, transparent 50%, rgba(0, 0, 0, 0.5) 100%);
  /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, transparent 7%, transparent 50%, rgba(0, 0, 0, 0.5) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */;
}

.prv-banner-wrapper {
    min-height: 100vh;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    display: flex;
    align-items: center;
    position: fixed;
    width: 100%;
    top: 0px;
    left: 0px;
}

@media only screen and (max-width: 767px) {
    .prv-banner-wrapper {
        min-height: auto;
        position: static;
        padding: 60px 0;
        background-image: none !important;
        background-color: #f6f6f6;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .prv-banner-wrapper {
        min-height: auto;
        position: static;
        padding: 80px 0;
        background-image: none !important;
        background-color: #f6f6f6;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .prv-banner-wrapper {
        min-height: auto;
        position: static;
        padding: 80px 0;
        background-image: none !important;
        background-color: #f6f6f6;
    }
}

.prv-banner-wrapper .inner {
    padding: 35px;
    position: relative;
    z-index: 1;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .prv-banner-wrapper .inner {
        padding: 35px 0;
    }
}

@media only screen and (max-width: 767px) {
    .prv-banner-wrapper .inner {
        padding: 0;
    }
}

.prv-banner-wrapper .inner .logo img {
    max-height: 70px;
}

.prv-banner-wrapper .inner .title {
    font-size: 23px;
    color: #515462;
    line-height: 42px;
    margin: 30px 0 50px 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .prv-banner-wrapper .inner .title {
        font-size: 20px;
        line-height: 36px;
        margin: 24px 0 40px 0;
    }
}

@media only screen and (max-width: 767px) {
    .prv-banner-wrapper .inner .title {
        margin: 32px 0 20px 0;
    }
}

.prv-banner-wrapper .inner .purshase-btn {
    margin-left: -15px;
    margin-right: -15px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .prv-banner-wrapper .inner .purshase-btn {
        margin-left: -10px;
        margin-right: -10px;
    }
}

@media only screen and (max-width: 767px) {
    .prv-banner-wrapper .inner .purshase-btn {
        margin-left: -5px;
        margin-right: -5px;
    }
}

.prv-banner-wrapper .inner .purshase-btn a {
    margin-left: 15px;
    margin-right: 15px;
}

@media only screen and (max-width: 767px) {
    .prv-banner-wrapper .inner .purshase-btn a {
        margin-left: 5px;
        margin-right: 5px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .prv-banner-wrapper .inner .purshase-btn a.rn-button-style--2 {
        padding: 10px 25px;
    }
}

@media only screen and (max-width: 767px) {
    .prv-banner-wrapper .inner .purshase-btn a.rn-button-style--2 {
        padding: 9px 12px;
        font-size: 14px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .prv-banner-wrapper .inner .purshase-btn a {
        margin-left: 10px;
        margin-right: 10px;
    }
}

@media only screen and (max-width: 479px) {
    .prv-banner-wrapper .inner .purshase-btn a + a {
        margin-top: 10px;
    }
}

/*---------------------
    Demo Area  
-----------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .home-demo-area .wrapper {
        padding: 0 30px !important;
    }
}

@media only screen and (max-width: 767px) {
    .home-demo-area .wrapper {
        padding: 0 30px !important;
    }
}

.home-demo-area .section-title.text-white h2 {
    color: #c6c9d8;
    margin-bottom: 9px;
}

.home-demo-area .section-title.text-white p {
    color: #c6c9d8;
    opacity: 0.75;
    font-weight: 300;
}

.bg_color--7 .single-demo {
    position: relative;
}

.bg_color--7 .single-demo a > span {
    display: block;
    text-align: center;
    padding: 20px 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: 20px;
    font-weight: 500;
    transition: 0.3s ease-in-out;
    letter-spacing: .20px;
}

.single-demo {
    padding: 0 30px;
    margin: 45px 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .single-demo {
        padding: 0px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-demo {
        padding: 0px;
    }
}

@media only screen and (max-width: 767px) {
    .single-demo {
        padding: 0px;
        margin: 20px 0;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .single-demo {
        padding: 0px;
    }
}

.single-demo a {
    display: block;
    position: relative;
    z-index: 2;
}

.single-demo a img {
    box-shadow: 3px 4px 20px 0 rgba(0, 0, 0, 0.1);
    transition: 0.7s cubic-bezier(0.26, 0.76, 0.3, 0.75);
    width: 100% !important;
    border-radius: 6px;
}

.single-demo a .title {
    display: block;
    text-align: left;
    padding: 25px 0 10px 0;
    color: #1f1f25;
    font-size: 20px;
    font-weight: 500;
    transition: 0.3s ease-in-out;
    letter-spacing: .20px;
    margin: 0;
}

.single-demo a .info {
    display: block;
    padding: 0;
    color: rgba(29, 29, 36, 0.75);
    font-size: 14px;
    font-weight: 300;
    transition: 0.3s ease-in-out;
    line-height: 25px;
}

.single-demo a > span.number {
    display: none;
    position: absolute;
    color: #f6f6f6;
    z-index: -1;
    font-size: 81px;
    bottom: -55px;
    line-height: inherit;
    font-weight: 300;
    letter-spacing: 11px;
}

.single-demo a:hover img {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
    box-shadow: 0 50px 80px -10px rgba(0, 0, 0, 0.17);
}

.single-demo a .label-new {
    position: absolute;
    top: 5px;
    background: #f81f01;
    background: linear-gradient(145deg, #f81f01 0%, #ee076e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f81f01', endColorstr='#ee076e',GradientType=1 );
    padding: 9px 14px;
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1;
    right: 5px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 500;
}

/*-------------------
Faq Area  
----------------------*/
.pv-feaq-area .accodion-style--1 .accordion__item + .accordion__item {
    margin-top: 20px;
}

.pv-feaq-area .accodion-style--1 .accordion__item .accordion__heading .accordion__button {
    font-size: 18px;
    padding: 10px 0;
}

.pv-feaq-area .accodion-style--1 .accordion__item .accordion__heading {
    width: 100%;
}

.pv-feaq-area .accodion-style--1 .accordion__item .accordion__heading .accordion__button::after {
    width: 100%;
}

.pv-feaq-area .accodion-style--1 .accordion__item .accordion__heading .accordion__button::after {
    height: 1px;
}

/*-------------------
    Tab BUtton  
---------------------*/
.tablist-inner {
    display: inline-block;
}

.pv-tab-button {
    display: flex;
    justify-content: center;
    list-style: none;
    background: rgba(255, 26, 80, 0.03);
    min-width: 570px;
    margin: 0 auto;
    border-radius: 6px;
    margin-bottom: 30px;
    margin-top: 35px;
    flex-wrap: wrap;
    padding: 0;
    padding: 0 36px;
    outline: none;
}

@media only screen and (max-width: 767px) {
    .pv-tab-button {
        margin-bottom: 18px;
        margin-top: 5px;
        padding: 8px 15px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .pv-tab-button {
        padding: 0 15px;
    }
}

@media only screen and (max-width: 767px) {
    .pv-tab-button {
        min-width: auto;
    }
}

.pv-tab-button .label {
    position: relative;
}

.pv-tab-button .label::after {
    position: absolute;
    top: 0;
}

.pv-tab-button li {
    padding: 0 14px;
    color: #101010;
    font-size: 16px;
    cursor: pointer;
    outline: none;
}

@media only screen and (max-width: 575px) {
    .pv-tab-button li {
        padding: 0 11px;
    }
}

.pv-tab-button li span {
    position: relative;
    display: block;
    padding: 20px 0;
    cursor: pointer;
}

@media only screen and (max-width: 575px) {
    .pv-tab-button li span {
        padding: 11px 0;
    }
}

.pv-tab-button li span::after {
    position: absolute;
    left: 0;
    background: #0096d1;
    bottom: 0;
    height: 3px;
    content: "";
}

.pv-tab-button li.react-tabs__tab--selected span {
    color: #0096d1;
}

.pv-tab-button li.react-tabs__tab--selected span::after {
    width: 100%;
}

/*-----------------------
Footer Style  
-------------------------*/
.prv-footer .inner h2.title {
    color: #1f1f25;
    font-size: 60px;
    font-weight: 500;
    margin-bottom: 65px;
}

a.purchase-btn {
    display: inline-block;
    padding: 0 75px;
    height: 70px;
    line-height: 70px;
    border-radius: 43px;
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    transition: 0.4s ease-in-out;
    color: #ffffff;
    background: #1f1f25;
    border: 1px solid #1f1f25;
}

a.purchase-btn:hover {
    color: #1f1f25;
    border: 1px solid #1f1f25;
    background: transparent;
}

/* Feature Area */
.prv-feature .content h3.title {
    color: #c6c9d8;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .prv-feature .content h3.title {
        margin-bottom: 13px;
        font-size: 20px;
    }
}

@media only screen and (max-width: 767px) {
    .prv-feature .content h3.title {
        margin-bottom: 13px;
        font-size: 20px;
    }
}

.prv-feature .content p.subtitle {
    color: #c6c9d8;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .prv-feature .content p.subtitle {
        font-size: 16px;
        line-height: 28px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .prv-feature .content p.subtitle {
        font-size: 16px;
        line-height: 26px;
    }
}

@media only screen and (max-width: 767px) {
    .prv-feature .content p.subtitle {
        font-size: 16px;
        line-height: 28px;
        color: #ffffff;
    }
}

.text-white-wrapper a.rn-button-style--2 {
    border: 2px solid #fff;
    color: #fff;
}
/*--------------------------
    Service Details Styles 
-----------------------------*/
.service-details-inner .page-title {
    padding-left: 105px;
}

.service-details-inner .page-title h2.title {
    font-size: 40px;
    line-height: 51px;
    margin-bottom: 14px;
}

.service-details-inner .page-title p {
    font-size: 24px;
    line-height: 30px;
    color: rgba(29, 29, 36, 0.75);
    margin-bottom: 0;
}

.service-details-inner .sercice-details-content .thumb .video-popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 0 none;
}

.service-details-inner .sercice-details-content .details p {
    color: rgba(29, 29, 36, 0.75);
    font-size: 18px;
    line-height: 30px;
    margin-bottom: 0;
}

.service-details-inner .sercice-details-content .details p + p {
    margin-top: 30px;
}

.service-details-inner .sercice-details-content .details h4.title {
    font-size: 36px;
    line-height: 30px;
    font-weight: 500;
    margin-top: 40px;
    margin-bottom: 27px;
}

@media only screen and (max-width: 767px) {
    .service-details-inner .sercice-details-content .details h4.title {
        font-size: 26px;
        line-height: 38px;
        margin-top: 26px;
        margin-bottom: 18px;
    }
}

.service-details-inner .sercice-details-content .details ul.liststyle li {
    font-size: 18px;
    line-height: 30px;
    color: rgba(29, 29, 36, 0.75);
    position: relative;
    padding-left: 30px;
}

.service-details-inner .sercice-details-content .details ul.liststyle li::before {
    position: absolute;
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background: rgba(29, 29, 36, 0.75);
    left: 0;
    top: 10px;
}

.service-details-inner .sercice-details-content .details ul.liststyle li + li {
    margin-top: 8px;
}

/*===================
    Section Title 
====================*/
.section-title {
    margin-top: -20px;
}

.section-title h2.title {
    font-size: 60px;
    margin-bottom: 8px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title h2.title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .section-title h2.title {
        font-size: 36px;
        margin-bottom: 7px;
    }
}

.section-title p {
    font-size: 18px;
    line-height: 30px;
    color: #1d1d24;
}
.section-title h1.title {
    font-size: 25px;
    font-weight: 600;
}
.section-title p a {
    color: #1d1d24;
    font-weight: 500;
}

.section-title p a:hover {
    color: #0096d1;
}

@media only screen and (max-width: 767px) {
    .section-title p br {
        display: none;
    }
}

.section-title h3 {
    font-size: 36px;
    line-height: 26px;
}

@media only screen and (max-width: 767px) {
    .section-title h3 {
        font-size: 26px;
        margin-bottom: 8px;
    }
}

.section-title .service-btn {
    margin-top: 36px;
}

@media only screen and (max-width: 767px) {
    .section-title .service-btn {
        margin-top: 12px;
    }
}

.section-title.service-style--2 h2,
  .section-title.service-style--2 h3 {
    color: #ffffff;
}

.section-title.service-style--2 p {
    padding: 0 21%;
    font-weight: 300;
    color: #ffffff;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title.service-style--2 p {
        padding: 0 7%;
    }
}

@media only screen and (max-width: 767px) {
    .section-title.service-style--2 p {
        padding: 0;
    }
}

.section-title.service-style--3 p {
    padding: 0 21%;
    font-weight: 300;
    color: #717173;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title.service-style--3 p {
        padding: 0 7%;
    }
}

@media only screen and (max-width: 767px) {
    .section-title.service-style--3 p {
        padding: 0;
    }
}

.section-title.service-style--3.text-left p {
    padding: 0 3% 0 0;
}

.section-title-default h2.title {
    line-height: 1.34;
    font-size: 48px;
}

@media only screen and (max-width: 767px) {
    .section-title h2 {
        font-size: 36px;
        margin-bottom: 7px;
    }
}

/*----------------------
    Error Area  
------------------------*/
.error-page-inner {
    height: calc(100vh - 120px);
    display: flex;
    align-items: center;
    min-height: 700px;
}

.error-page-inner .inner {
    text-align: center;
}

.error-page-inner .inner h1.title {
    font-size: 180px;
    line-height: 1;
    margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
    .error-page-inner .inner h1.title {
        font-size: 107px;
    }
}

.error-page-inner .inner .sub-title {
    margin-bottom: 0;
    font-weight: 400;
    font-size: 48px;
    color: #ffffff;
}

@media only screen and (max-width: 767px) {
    .error-page-inner .inner .sub-title {
        font-size: 40px;
    }
}

.error-page-inner .inner span {
    font-size: 16px;
    margin-top: 10px;
    color: #c6c9d8;
    opacity: .75;
    font-weight: 300;
    display: block;
    margin-bottom: 28px;
}
.accodion-style--1 .accordion__item {
    border: none !important;
    overflow: hidden;
}

.accodion-style--1 .accordion__item .accordion__heading {
    display: inline-block;
    position: relative;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

.accodion-style--1 .accordion__item .accordion__heading .accordion__button {
    background: none;
    color: #1f1f25;
    font-size: 16px;
    font-weight: 500;
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
    border: none;
    box-shadow: none;
}

.accodion-style--1 .accordion__item .accordion__heading .accordion__button[aria-disabled="true"]::after, .accodion-style--1 .accordion__item .accordion__heading .accordion__button[aria-expanded="true"]::after {
    width: 100%;
    background: #0096d1;
}

.accodion-style--1 .accordion__item .accordion__heading .accordion__button::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 50px;
    height: 2px;
    background: rgba(0, 0, 0, 0.2);
    transition: 0.3s;
}

.accodion-style--1 .accordion__item .accordion__heading .accordion__button::before {
    display: none;
    border: none !important;
}

.accodion-style--1 .accordion__item .accordion__heading .accordion__button:focus {
    outline: none;
}

.accodion-style--1 .accordion__item .accordion__panel {
    background: none;
    border: none;
    padding: 0 0 15px 0;
    margin: 0;
    font-weight: 300;
    color: #717173;
    animation: fadeInUp 0.1s;
}

.accodion-style--1 .accordion__item + .accordion__item {
    margin-top: 10px;
}
/* Brand Area */
ul.brand-list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    border-left: 1px solid rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

@media only screen and (max-width: 767px) {
    ul.brand-list {
        border-left: 0 none;
        border-bottom: 0 none;
    }
}

ul.brand-list li {
    flex-basis: 50%;
    text-align: center;
    height: 214px;
    line-height: 214px;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    border-right: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer;
}

@media only screen and (max-width: 767px) {
    ul.brand-list li {
        border-top: 0 none;
        border-right: 0 none;
        height: auto;
        line-height: 10;
    }
}

ul.brand-list li img {
    opacity: 0.7;
    transition: 0.3s;
    max-height: 110px;
    max-width: 150px;
}

@media only screen and (max-width: 767px) {
    ul.brand-list li img {
        max-width: 100px;
        height: auto;
    }
}

ul.brand-list li:hover {
    background-color: #0096d1;
    transform: scale(1.1);
    border-radius: 6px;
}

ul.brand-list li:hover img {
    opacity: 1;
    filter: brightness(0) invert(1);
}

ul.brand-list.branstyle--2 li {
    flex-basis: 33.33%;
}

ul.brand-style-2 {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

@media only screen and (max-width: 575px) {
    ul.brand-style-2 {
        margin: 0 -15px;
    }
}

ul.brand-style-2 li {
    padding: 25px;
    flex-basis: 20%;
    text-align: center;
}

@media only screen and (max-width: 767px) {
    ul.brand-style-2 li {
        flex-basis: 33.33%;
        padding: 17px 10px;
    }
}

@media only screen and (max-width: 575px) {
    ul.brand-style-2 li {
        flex-basis: 33.33%;
        padding: 0 15px;
        margin-bottom: 16px;
    }
}

ul.brand-style-2 img {
    opacity: 0.7;
    transition: 0.3s;
    max-height: 110px;
    max-width: 150px;
    cursor: pointer;
}

@media only screen and (max-width: 767px) {
    ul.brand-style-2 img {
        max-height: 60px;
        max-width: 90px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    ul.brand-style-2 img {
        max-width: 129px;
    }
}

@media only screen and (max-width: 575px) {
    ul.brand-style-2 img {
        max-height: initial;
        max-width: 100%;
    }
}

ul.brand-style-2 img:hover {
    transform: scale(1.1);
    opacity: 1;
}

.react-parallax-content .brand-style-2 a img {
    filter: brightness(0) invert(1);
}

.react-parallax-content .brand-style-2 a:hover img {
    filter: brightness(1) invert(0);
}

.brand-separation {
    position: relative;
    padding-bottom: 217px;
    margin-bottom: -117px;
    padding-top: 60px;
    background: #fff;
}

@media only screen and (max-width: 767px) {
    .brand-separation {
        margin-bottom: 0;
        padding-bottom: 60px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .brand-separation {
        margin-bottom: 0;
        padding-bottom: 60px;
    }
}
/*--------------------------
Call To Action Wrapper 
-----------------------------*/
.call-to-action {
    background: linear-gradient(145deg, #0096d1 0%, #861dec 100%);
    position: relative;
    z-index: 2;
}

.call-to-action::before {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-image: url(../images/pattern-1.png);
    content: "";
    z-index: -1;
    opacity: 0.5;
}

.call-to-action .inner > span {
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 4px;
    display: block;
    margin-bottom: 9px;
}

.call-to-action .inner h2 {
    color: #ffffff;
    font-size: 75px;
    font-weight: 900;
    font-family: 'Montserrat', sans-serif;
    line-height: 90px;
}

@media only screen and (max-width: 767px) {
    .call-to-action .inner h2 {
        font-size: 47px;
        line-height: 70px;
    }
}

.call-to-action .inner a.rn-button-style--2 {
    margin-top: 30px;
}

.call-to-action .inner a.rn-button-style--2:hover {
    background: #ffffff;
    border-color: #ffffff;
    color: #0096d1;
}

.call-to-action.bg_image::before {
    display: none;
}
/*-------------------
    Column Area  
---------------------*/
.single-column h4.tilte {
    margin-bottom: 6px;
}

.single-column p {
    font-size: 16px;
    line-height: 28px;
}

.single-column.custom-color {
    background: #0096d1;
    padding: 37px 29px;
}

.single-column.custom-color h4.tilte {
    color: #ffffff;
}

.single-column.custom-color p {
    color: #ffffff;
}

.single-column.custom-color.custom-color--1 {
    background: #001c43;
}

.single-column.custom-color.custom-color--2 {
    background: #c93ec7;
}
.contact-form--1 label {
    display: block;
    margin-bottom: 0;
}

.contact-form--1 input,
.contact-form--1 textarea {
    display: block;
    width: 100%;
    padding: 0 20px;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    transition: all 0.3s ease;
    height: 50px;
    line-height: 46px;
    margin-bottom: 20px;
    outline: none;
    color: #1f1f25;
    font-size: 15px;
    letter-spacing: 0.1px;
}

.contact-form--1 input:focus,
  .contact-form--1 textarea:focus {
    border-color: #0096d1;
}

.contact-form--1 textarea {
    height: 120px;
}

/*==========================
    Contact Address 
============================*/
.rn-address {
    margin-top: 30px;
    border: 1px solid #ebebeb;
    padding: 40px;
    border-radius: 10px;
    padding-top: 54px;
    background: #fff;
    padding-bottom: 50px;
}

.rn-address .icon {
    border: 1px solid #ebebeb;
    width: 78px;
    height: 78px;
    color: #0096d1;
    line-height: 73px;
    text-align: center;
    border-radius: 100%;
    background: #ffffff;
    font-size: 28px;
    position: absolute;
    top: -13px;
    left: 47px;
}

.rn-address .inner h4.title {
    font-size: 18px;
    font-weight: 700;
}

.rn-address .inner p {
    font-size: 18px;
    margin-bottom: 0;
    color: rgba(29, 29, 36, 0.75);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-address .inner p {
        font-size: 16px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-address .inner p {
        font-size: 16px;
    }
}

@media only screen and (max-width: 767px) {
    .rn-address .inner p {
        font-size: 16px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-address .inner p br {
        display: none;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-address .inner p br {
        display: none;
    }
}

@media only screen and (max-width: 767px) {
    .rn-address .inner p br {
        display: none;
    }
}

.rn-address .inner p a {
    color: rgba(29, 29, 36, 0.75);
}

.rn-address .inner p a:hover {
    color: #0096d1;
}

.rn-address:hover .icon {
    background: #0096d1;
    border-color: #0096d1;
    color: #fff;
}

.blog-comment-form .inner .rnform-group input:focus,
.blog-comment-form .inner .rnform-group textarea:focus {
    border-color: #0096d1;
}
/*========================
    Counterup Area 
==========================*/
.counterup_style--1 {
    text-align: center;
    margin-top: 40px;
}

.counterup_style--1 h5.counter {
    font-size: 72px;
    line-height: 80px;
    display: inline-block;
    margin-bottom: 17px;
    position: relative;
    display: inline-block;
    color: #0096d1;
    margin-left: -20px;
}

@media only screen and (max-width: 767px) {
    .counterup_style--1 h5.counter {
        font-size: 45px;
        line-height: 56px;
        margin-bottom: 5px;
        margin-left: -11px;
    }
}

.counterup_style--1 h5.counter::after {
    right: -26px;
    position: absolute;
    top: -17px;
    font-size: 40px;
    content: "+";
}

.counterup_style--1 p.description {
    font-size: 18px;
    line-height: 30px;
    padding: 0 5%;
    color: rgba(29, 29, 36, 0.75);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .counterup_style--1 p.description {
        font-size: 16px;
        line-height: 28px;
        padding: 0;
    }
}

@media only screen and (max-width: 767px) {
    .counterup_style--1 p.description {
        font-size: 16px;
        line-height: 28px;
        padding: 0;
    }
}

.rn-paralax-counterup .counterup_style--1 {
    text-align: center;
}

.rn-paralax-counterup .counterup_style--1 h5.counter {
    color: #0096d1;
}

.rn-paralax-counterup .counterup_style--1 p.description {
    color: #ffffff;
}

.counterup_style--2 {
    text-align: center;
}

.counterup_style--2 h5.counter {
    font-size: 50px;
    line-height: 60px;
    color: #0096d1;
    display: inline-block;
    margin-bottom: 10px;
}

.counterup_style--2 h4.description {
    font-size: 16px;
    line-height: 30px;
    padding: 0 10%;
    margin-bottom: 0;
}

.theme-text-white .counterup_style--1 h5.counter {
    color: #ffffff;
}

.theme-text-white .counterup_style--1 p.description {
    color: #ffffff;
}
/*----------------------
    List Style  
------------------------*/
.list-style--1 li {
    color: #7e7e7e;
    font-weight: 400;
    font-size: 16px;
    line-height: inherit;
    margin-bottom: 10px;
}

.list-style--1 li i,
  .list-style--1 li svg {
    color: #0096d1;
    margin-right: 5px;
}

.list-style--1.text-white li {
    color: #ffffff;
}

ul.list-style li {
    position: relative;
    padding-left: 16px;
    color: rgba(29, 29, 36, 0.75);
    font-size: 18px;
    line-height: 25px;
}

@media only screen and (max-width: 767px) {
    ul.list-style li {
        font-size: 16px;
        line-height: 22px;
    }
}

ul.list-style li::before {
    position: absolute;
    width: 6px;
    height: 6px;
    background: rgba(29, 29, 36, 0.75);
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    content: "";
    border-radius: 100%;
}

ul.list-style li + li {
    margin-top: 10px;
}
/*==================
    Portfolio Area 
==================*/
.portfolio {
    position: relative;
    min-height: 600px;
    width: 100%;
    padding-top: 35%;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .portfolio {
        min-height: 500px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio {
        min-height: 500px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio {
        min-height: 450px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio {
        min-height: 400px;
    }
}

.portfolio .thumbnail-inner {
    transition: transform .28s ease;
    z-index: 9;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    border-radius: 5px;
    cursor: pointer;
}

.portfolio .thumbnail-inner::before {
    background-color: #861dec;
    background-image: linear-gradient(#861dec 10%, #000000 100%);
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    opacity: 0;
}

.portfolio .thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    border-radius: 5px;
    background-color: #0a0a0a;
    background-image: url(../images/portfolio/portfolio-1.jpg);
    transform: scale(1.13) translateZ(0);
    backface-visibility: hidden;
    transition: transform .28s ease;
    z-index: 4;
}

.portfolio .thumbnail.image-1 {
    background-image: url(../images/portfolio/portfolio-1.jpg);
}

.portfolio .thumbnail.image-2 {
    background-image: url(../images/portfolio/portfolio-2.jpg);
}

.portfolio .thumbnail.image-3 {
    background-image: url(../images/portfolio/portfolio-3.jpg);
}

.portfolio .thumbnail.image-4 {
    background-image: url(../images/portfolio/portfolio-4.jpg);
}

.portfolio .thumbnail::after {
    background-color: rgba(45, 45, 45, 0.35);
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    content: ' ';
    z-index: 1;
    display: block;
    border-radius: 5px;
    background-color: rgba(25, 25, 25, 0.37);
}

.portfolio .bg-blr-image {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-color: #0a0a0a;
    background-image: url(../images/portfolio/portfolio-1.jpg);
    transform: translateY(38px);
    opacity: 0;
    z-index: 1;
}

.portfolio .bg-blr-image.image-1 {
    background-image: url(../images/portfolio/portfolio-1.jpg);
}

.portfolio .bg-blr-image.image-2 {
    background-image: url(../images/portfolio/portfolio-2.jpg);
}

.portfolio .bg-blr-image.image-3 {
    background-image: url(../images/portfolio/portfolio-1.jpg);
}

.portfolio .bg-blr-image.image-4 {
    background-image: url(../images/portfolio/portfolio-1.jpg);
}

.portfolio .content {
    position: absolute;
    bottom: 40px;
    left: 40px;
    right: 40px;
    max-width: 100% !important;
    z-index: 10;
    padding: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio .content {
        left: 20px;
        right: 20px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio .content {
        left: 20px;
        right: 20px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio .content {
        left: 20px;
        right: 20px;
    }
}

.portfolio .content .inner p {
    color: #c6c9d8;
    font-size: 14px;
}

.portfolio .content .inner h4 {
    font-size: 24px;
    line-height: 36px;
}

.portfolio .content .inner h4 a {
    color: #ffffff;
}

.portfolio .content .inner .portfolio-button {
    margin-top: 35px;
    transition: 0.7s;
}

@media only screen and (max-width: 575px) {
    .portfolio .content .inner .portfolio-button {
        margin-top: 25px;
    }
}

.portfolio .content .inner .portfolio-button a.rn-btn {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}

.portfolio .content .inner .portfolio-button a.rn-btn:hover {
    border-color: #0096d1;
}

.portfolio.portfolio-interior-design .thumbnail.image-1 {
    background-image: url(../images/portfolio/interior/portfolio-1.jpg);
}

.portfolio.portfolio-interior-design .thumbnail.image-2 {
    background-image: url(../images/portfolio/interior/portfolio-2.jpg);
}

.portfolio.portfolio-interior-design .thumbnail.image-3 {
    background-image: url(../images/portfolio/interior/portfolio-3.jpg);
}

.portfolio.portfolio-interior-design .thumbnail.image-4 {
    background-image: url(../images/portfolio/interior/portfolio-4.jpg);
}

.portfolio.portfolio-interior-design .thumbnail.image-5 {
    background-image: url(../images/portfolio/interior/portfolio-5.jpg);
}

.portfolio.portfolio-interior-design .thumbnail.image-6 {
    background-image: url(../images/portfolio/interior/portfolio-6.jpg);
}

.portfolio.portfolio-interior-design .thumbnail.image-7 {
    background-image: url(../images/portfolio/interior/portfolio-7.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image {
    background-image: url(../images/portfolio/interior/portfolio-1.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image.image-1 {
    background-image: url(../images/portfolio/interior/portfolio-1.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image.image-2 {
    background-image: url(../images/portfolio/interior/portfolio-2.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image.image-3 {
    background-image: url(../images/portfolio/interior/portfolio-3.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image.image-4 {
    background-image: url(../images/portfolio/interior/portfolio-4.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image.image-5 {
    background-image: url(../images/portfolio/interior/portfolio-5.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image.image-6 {
    background-image: url(../images/portfolio/interior/portfolio-6.jpg);
}

.portfolio.portfolio-interior-design .bg-blr-image.image-7 {
    background-image: url(../images/portfolio/interior/portfolio-7.jpg);
}

.portfolio.text-center .content {
    position: absolute;
    bottom: 40px;
    left: 40px;
    max-width: 80% !important;
    z-index: 10;
    padding: 0;
    right: 40px;
    margin: 0 auto;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio.text-center .content {
        left: 20px;
        right: 20px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio.text-center .content {
        left: 15px;
        right: 15px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio.text-center .content {
        left: 10px;
        right: 10px;
    }
}

.portfolio:hover .thumbnail-inner {
    transform: scale(1.08) translateZ(0);
}

.portfolio:hover .thumbnail-inner::before {
    opacity: 0.85;
}

.portfolio:hover .thumbnail {
    transform: scale(1) translateZ(0);
}

.portfolio:hover .thumbnail::after {
    background-color: rgba(25, 25, 25, 0.24);
}

.portfolio:hover .bg-blr-image {
    opacity: 0;
    z-index: 9;
}

.portfolio.portfolio-style--2 .inner {
    margin: 0 20px;
}

.portfolio-tilthover .portfolio {
    margin-top: 30px;
}

@media only screen and (max-width: 767px) {
    .portfolio-tilthover .portfolio {
        min-height: 400px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-tilthover .portfolio {
        min-height: 400px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-tilthover .portfolio {
        min-height: 400px;
    }
}

.portfolio-tilthover .portfolio .thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    border-radius: 5px;
    background-color: #0a0a0a;
    background-image: url(../images/portfolio/portfolio-static-01.jpg);
    transform: scale(1.13) translateZ(0);
    backface-visibility: hidden;
    transition: transform .28s ease;
    z-index: 4;
}

@media only screen and (max-width: 575px) {
    .portfolio-tilthover .portfolio .thumbnail {
        transform: scale(1) translateZ(0);
    }
}

.portfolio-tilthover .portfolio .thumbnail.image-1 {
    background-image: url(../images/portfolio/portfolio-static-01.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-2 {
    background-image: url(../images/portfolio/portfolio-static-02.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-3 {
    background-image: url(../images/portfolio/portfolio-static-03.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-4 {
    background-image: url(../images/portfolio/portfolio-static-04.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-5 {
    background-image: url(../images/portfolio/portfolio-static-05.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-6 {
    background-image: url(../images/portfolio/portfolio-static-06.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-7 {
    background-image: url(../images/portfolio/portfolio-static-07.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-8 {
    background-image: url(../images/portfolio/portfolio-static-08.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-9 {
    background-image: url(../images/portfolio/portfolio-static-09.jpg);
}

.portfolio-tilthover .portfolio .thumbnail.image-10 {
    background-image: url(../images/portfolio/portfolio-static-10.jpg);
}

.portfolio-tilthover .portfolio .thumbnail::after {
    display: none;
}

@media only screen and (max-width: 575px) {
    .portfolio-tilthover .portfolio .thumbnail-inner {
        transform: scale(1) translateZ(0);
    }

    .portfolio-tilthover .portfolio .thumbnail-inner::before {
        opacity: 0.85;
    }
}

.portfolio-tilthover .portfolio .bg-blr-image {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-color: #0a0a0a;
    background-image: url(../images/portfolio/portfolio-static-01.jpg);
    transform: translateY(38px);
    opacity: 0;
    z-index: 1;
}

@media only screen and (max-width: 575px) {
    .portfolio-tilthover .portfolio .bg-blr-image {
        opacity: 0;
        z-index: 9;
    }
}

.portfolio-tilthover .portfolio .bg-blr-image.image-1 {
    background-image: url(../images/portfolio/portfolio-static-01.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-2 {
    background-image: url(../images/portfolio/portfolio-static-03.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-3 {
    background-image: url(../images/portfolio/portfolio-static-03.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-4 {
    background-image: url(../images/portfolio/portfolio-static-04.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-5 {
    background-image: url(../images/portfolio/portfolio-static-05.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-6 {
    background-image: url(../images/portfolio/portfolio-static-06.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-7 {
    background-image: url(../images/portfolio/portfolio-static-07.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-8 {
    background-image: url(../images/portfolio/portfolio-static-08.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-9 {
    background-image: url(../images/portfolio/portfolio-static-09.jpg);
}

.portfolio-tilthover .portfolio .bg-blr-image.image-10 {
    background-image: url(../images/portfolio/portfolio-static-10.jpg);
}

.portfolio-tilthover .portfolio .content {
    opacity: 0;
}

@media only screen and (max-width: 575px) {
    .portfolio-tilthover .portfolio .content {
        opacity: 1;
    }
}

.portfolio-tilthover .portfolio:hover .content {
    opacity: 1;
}

.portfolio-tilthover .portfolio:hover .thumbnail-inner {
    transform: scale(1) translateZ(0);
}

.portfolio-tilthover .portfolio:hover .thumbnail-inner::before {
    opacity: 0.85;
}

.portfolio-tilthover .portfolio:hover .thumbnail {
    transform: scale(1) translateZ(0);
}

.portfolio-tilthover .portfolio:hover .thumbnail::after {
    background-color: rgba(25, 25, 25, 0.24);
}

.portfolio-tilthover .portfolio:hover .bg-blr-image {
    opacity: 0;
    z-index: 9;
}

.portfolio-tilthover .portfolio.designer-project .thumbnail {
    background-image: url(../images/portfolio/dp-portfolio-01.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-1 {
    background-image: url(../images/portfolio/dp-portfolio-01.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-2 {
    background-image: url(../images/portfolio/dp-portfolio-02.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-3 {
    background-image: url(../images/portfolio/dp-portfolio-03.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-4 {
    background-image: url(../images/portfolio/dp-portfolio-04.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-5 {
    background-image: url(../images/portfolio/dp-portfolio-05.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-6 {
    background-image: url(../images/portfolio/dp-portfolio-06.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-7 {
    background-image: url(../images/portfolio/dp-portfolio-07.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-8 {
    background-image: url(../images/portfolio/dp-portfolio-08.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-9 {
    background-image: url(../images/portfolio/dp-portfolio-09.jpg);
}

.portfolio-tilthover .portfolio.designer-project .thumbnail.image-10 {
    background-image: url(../images/portfolio/dp-portfolio-10.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image {
    background-image: url(../images/portfolio/dp-portfolio-01.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-1 {
    background-image: url(../images/portfolio/dp-portfolio-01.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-2 {
    background-image: url(../images/portfolio/dp-portfolio-02.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-3 {
    background-image: url(../images/portfolio/dp-portfolio-03.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-4 {
    background-image: url(../images/portfolio/dp-portfolio-04.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-5 {
    background-image: url(../images/portfolio/dp-portfolio-05.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-6 {
    background-image: url(../images/portfolio/dp-portfolio-06.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-7 {
    background-image: url(../images/portfolio/dp-portfolio-07.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-8 {
    background-image: url(../images/portfolio/dp-portfolio-08.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-9 {
    background-image: url(../images/portfolio/dp-portfolio-09.jpg);
}

.portfolio-tilthover .portfolio.designer-project .bg-blr-image.image-10 {
    background-image: url(../images/portfolio/dp-portfolio-10.jpg);
}

.portfolio-sacousel-inner .slick-list {
    margin-left: -200px;
    margin-right: -200px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-sacousel-inner .slick-list {
        margin-left: 15px;
        margin-right: 15px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-sacousel-inner .slick-list {
        margin-left: 15px;
        margin-right: 15px;
    }
    
}

@media only screen and (max-width: 767px) {
    .portfolio-sacousel-inner .slick-list {
        margin-left: 10px;
        margin-right: 10px;
    }
}

.portfolio-sacousel-inner .slick-slide {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: -10px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-sacousel-inner .slick-slide {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-sacousel-inner .slick-slide {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio-sacousel-inner .slick-slide {
        padding-left: 10px;
        padding-right: 10px;
    }
}

.portfolio-sacousel-inner .slick-list {
    overflow: visible;
}

.portfolio-sacousel-inner .slick-dots,
.rn-slick-dot .slick-dots {
    bottom: -60px;
}

@media only screen and (max-width: 575px) {
    .portfolio-sacousel-inner .slick-dots,
    .rn-slick-dot .slick-dots {
        bottom: -50px;
    }
}

.portfolio-sacousel-inner .slick-dots li,
  .rn-slick-dot .slick-dots li {
    width: 30px;
    margin: 0;
    opacity: .35;
    position: relative;
}

.portfolio-sacousel-inner .slick-dots li button::before,
    .rn-slick-dot .slick-dots li button::before {
    display: none;
}

.portfolio-sacousel-inner .slick-dots li button::after,
    .rn-slick-dot .slick-dots li button::after {
    background: #333;
    width: 100%;
    display: block;
    content: '';
    position: absolute;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-left: 11px;
    background-color: transparent;
    box-shadow: inset 0 0 0 5px #000;
}

.portfolio-sacousel-inner .slick-dots li.slick-active,
    .rn-slick-dot .slick-dots li.slick-active {
    opacity: 1;
}

.portfolio-sacousel-inner .slick-dots li.slick-active button::after,
      .rn-slick-dot .slick-dots li.slick-active button::after {
    -webkit-transform: scale(2);
    transform: scale(2);
    box-shadow: inset 0 0 0 1px #0096d1;
    background-color: transparent;
    background-color: transparent !important;
}

.portfolio-sacousel-inner.dot-light .slick-dots li button::after,
.rn-slick-dot.dot-light .slick-dots li button::after {
    background: #ffffff;
    box-shadow: inset 0 0 0 5px #ffffff;
}

.portfolio-sacousel-inner.dot-light .slick-dots li.slick-active,
.rn-slick-dot.dot-light .slick-dots li.slick-active {
    opacity: 1;
}

.portfolio-sacousel-inner.dot-light .slick-dots li.slick-active button::after,
  .rn-slick-dot.dot-light .slick-dots li.slick-active button::after {
    -webkit-transform: scale(2);
    transform: scale(2);
    box-shadow: inset 0 0 0 1px #0096d1;
    background-color: transparent;
    background-color: transparent !important;
}

/* Slick Arrow Button  */
.portfolio-slick-activation {
    position: relative;
}

.portfolio-slick-activation button.slick-arrow {
    position: absolute;
    z-index: 3;
    background: transparent;
    font-size: 20px;
    width: 253px;
    height: 101%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-slick-activation button.slick-arrow {
        width: 136px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-slick-activation button.slick-arrow {
        width: 100px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio-slick-activation button.slick-arrow {
        width: 100px;
        display: none !important;
    }
}

.portfolio-slick-activation button.slick-arrow::before {
    line-height: 1;
    opacity: 0.75;
    font-size: 30px;
    position: relative;
    top: -14px;
    transition: 0.5s;
}

.portfolio-slick-activation button.slick-arrow.slick-prev {
    left: 0;
    background: -moz-linear-gradient(left, black 0%, transparent 100%);
    background: -webkit-linear-gradient(left, black 0%, transparent 100%);
    background: linear-gradient(to right, black 0%, transparent 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 );
}

.portfolio-slick-activation button.slick-arrow.slick-prev::before {
    content: url(../images/icons/slick-arrow-left.png);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-slick-activation button.slick-arrow.slick-prev {
        display: none !important;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-slick-activation button.slick-arrow.slick-prev {
        display: none !important;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .portfolio-slick-activation button.slick-arrow.slick-prev {
        display: none !important;
    }
}

.portfolio-slick-activation button.slick-arrow.slick-next {
    right: 0;
    background: -moz-linear-gradient(right, black 0%, transparent 100%);
    background: -webkit-linear-gradient(right, black 0%, transparent 100%);
    background: linear-gradient(to left, black 0%, transparent 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 );
}

.portfolio-slick-activation button.slick-arrow.slick-next::before {
    content: url(../images/icons/slick-arrow-right.png);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-slick-activation button.slick-arrow.slick-next {
        display: none !important;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-slick-activation button.slick-arrow.slick-next {
        display: none !important;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .portfolio-slick-activation button.slick-arrow.slick-next {
        display: none !important;
    }
}

.portfolio-slick-activation button.slick-arrow:hover.slick-prev {
    padding-right: 50px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-slick-activation button.slick-arrow:hover.slick-prev {
        padding-right: 10px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio-slick-activation button.slick-arrow:hover.slick-prev {
        padding-right: 10px;
    }
}

.portfolio-slick-activation button.slick-arrow:hover.slick-next {
    padding-left: 50px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-slick-activation button.slick-arrow:hover.slick-next {
        padding-right: 10px;
    }
}

@media only screen and (max-width: 767px) {
    .portfolio-slick-activation button.slick-arrow:hover.slick-next {
        padding-right: 10px;
    }
}

.portfolio-slick-activation button.slick-arrow:hover::before {
    opacity: 1;
}

/* Slick Gutter Space  */
.slick-space-gutter--15 {
    margin-left: -15px;
    margin-right: -15px;
}

.slick-space-gutter--15 .slick-slide {
    padding-left: 15px;
    padding-right: 15px;
}

.slick-space-gutter--15 .portfolio {
    margin: 40px 0;
}

.slickdot--20 .slick-dots {
    bottom: -20px;
}

/*-----------------------------
Portfolio Style Three  
--------------------------------*/
.portfolio-style--3 {
    position: relative;
    margin-bottom: 40px;
    overflow: hidden;
    border-radius: 6px;
}

.portfolio-style--3 .thumbnail a {
    display: block;
    position: relative;
    z-index: 1;
}

.portfolio-style--3 .thumbnail a::after {
    background: linear-gradient(to bottom, #861dec 0, #000000 100%);
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 1;
    opacity: 0;
}

@media only screen and (max-width: 575px) {
    .portfolio-style--3 .thumbnail a::after {
        opacity: 0.85;
        top: 0;
    }
}

.portfolio-style--3 .content {
    position: absolute;
    bottom: -92px;
    width: 100%;
    padding: 50px 35px;
    z-index: 3;
}

@media only screen and (max-width: 575px) {
    .portfolio-style--3 .content {
        bottom: 0;
    }
}

@media only screen and (max-width: 575px) {
    .portfolio-style--3 .content {
        padding: 30px 20px;
    }
}

.portfolio-style--3 .content::before {
    position: absolute;
    content: "";
    background: linear-gradient(to bottom, transparent 0, #000000 70%);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: -1;
}

@media only screen and (max-width: 575px) {
    .portfolio-style--3 .content::before {
        opacity: 0;
    }
}

.portfolio-style--3 .content p.portfoliotype {
    font-size: 14px;
    margin-bottom: 5px;
    color: #c6c9d8;
}

.portfolio-style--3 .content h4.title {
    margin-bottom: 0;
}

.portfolio-style--3 .content h4.title a {
    color: #ffffff;
    font-size: 24px;
    font-weight: 500;
    line-height: 36px;
}

.portfolio-style--3 .content .portfolio-btn {
    margin-top: 35px;
    transition: 0.7s;
    opacity: 0;
    visibility: hidden;
}

@media only screen and (max-width: 575px) {
    .portfolio-style--3 .content .portfolio-btn {
        margin-top: 22px;
    }
}

@media only screen and (max-width: 575px) {
    .portfolio-style--3 .content .portfolio-btn {
        opacity: 1;
        visibility: visible;
    }
}

.portfolio-style--3:hover .content {
    bottom: 0;
}

.portfolio-style--3:hover .content::before {
    opacity: 0;
}

.portfolio-style--3:hover .thumbnail a img {
    transform: scale(1.1);
}

.portfolio-style--3:hover .thumbnail a::before {
    opacity: 0;
}

.portfolio-style--3:hover .thumbnail a::after {
    opacity: 0.85;
    top: 0;
}

.portfolio-style--3:hover .content .portfolio-btn {
    opacity: 1;
    visibility: visible;
}

.row--5 .portfolio-style--3 {
    margin-bottom: 10px;
}

/* Portfolio Style Static */
.item-portfolio-static {
    margin-top: 60px;
}

@media only screen and (max-width: 767px) {
    .item-portfolio-static {
        margin-top: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .item-portfolio-static {
        margin-top: 30px;
    }
}

.item-portfolio-static .inner {
    padding-top: 20px;
}

.item-portfolio-static .inner p {
    margin-bottom: 5px;
    font-size: 16px;
}

.item-portfolio-static .inner h4 a {
    color: #1f1f25;
    transition: 0.3s;
}

.item-portfolio-static .inner h4 a:hover {
    color: #0096d1;
}

.item-portfolio-static:hover .thumbnail a img {
    transform: translate3d(0, -10px, 0);
    box-shadow: 0 50px 80px -10px rgba(0, 0, 0, 0.17);
}
/*-------------------------------
    Pricing Area  
--------------------------------*/
.rn-pricing {
    border: 2px solid #0096d1;
    border-radius: 5px;
    transition: all 0.6s cubic-bezier(0.33, 0.84, 0.31, 0.98);
    transform-style: preserve-3d;
    position: relative;
    z-index: 2;
}

.rn-pricing::before {
    z-index: -1;
    display: inline-block;
    content: '';
    -webkit-transition: all 0.6s cubic-bezier(0.33, 0.84, 0.31, 0.98);
    transition: all 0.6s cubic-bezier(0.33, 0.84, 0.31, 0.98);
    opacity: 0;
    border-radius: 5px;
    background-color: #0096d1;
    background-image: linear-gradient(145deg, #0096d1 0%, #861dec 100%);
    position: absolute;
    top: -2px;
    right: -2px;
    bottom: -2px;
    left: -2px;
}

.rn-pricing .pricing-table-inner {
    padding: 40px;
}

.rn-pricing .pricing-table-inner .pricing-header {
    margin-bottom: 30px;
    padding-bottom: 30px;
    text-align: center;
    border-bottom: 1px solid rgba(248, 31, 1, 0.1);
}

.rn-pricing .pricing-table-inner .pricing-header h4.title {
    margin-bottom: 30px;
}

.rn-pricing .pricing-table-inner .pricing-header .pricing span {
    display: block;
}

.rn-pricing .pricing-table-inner .pricing-header .pricing span.price {
    font-size: 100px;
    color: #0096d1;
    line-height: 1;
}

.rn-pricing .pricing-table-inner .pricing-header .pricing span.subtitle {
    font-size: 14px;
    color: #0096d1;
}

.rn-pricing .pricing-table-inner .pricing-body {
    text-align: left;
    margin-bottom: 48px;
}

.rn-pricing .pricing-table-inner .pricing-footer {
    text-align: center;
}

.rn-pricing:hover::before, .rn-pricing.active::before {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.rn-pricing:hover .pricing-table-inner .pricing-header, .rn-pricing.active .pricing-table-inner .pricing-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.rn-pricing:hover .pricing-table-inner .pricing-header h4.title, .rn-pricing.active .pricing-table-inner .pricing-header h4.title {
    color: #ffffff;
}

.rn-pricing:hover .pricing-table-inner .pricing-header .pricing span, .rn-pricing.active .pricing-table-inner .pricing-header .pricing span {
    display: block;
}

.rn-pricing:hover .pricing-table-inner .pricing-header .pricing span.price, .rn-pricing.active .pricing-table-inner .pricing-header .pricing span.price {
    color: #ffffff;
}

.rn-pricing:hover .pricing-table-inner .pricing-header .pricing span.subtitle, .rn-pricing.active .pricing-table-inner .pricing-header .pricing span.subtitle {
    color: #ffffff;
}

.rn-pricing:hover .pricing-table-inner .pricing-body ul.list-style--1 li, .rn-pricing.active .pricing-table-inner .pricing-body ul.list-style--1 li {
    color: #ffffff;
}

.rn-pricing:hover .pricing-table-inner .pricing-body ul.list-style--1 li svg, .rn-pricing.active .pricing-table-inner .pricing-body ul.list-style--1 li svg {
    color: #ffffff;
}

.rn-pricing:hover .pricing-table-inner .pricing-footer, .rn-pricing.active .pricing-table-inner .pricing-footer {
    text-align: center;
}

.rn-pricing:hover .pricing-table-inner .pricing-footer a.rn-btn, .rn-pricing.active .pricing-table-inner .pricing-footer a.rn-btn {
    background: #ffffff;
    color: #0096d1;
    border-color: #ffffff;
}
/*==========================
Progressbar Area 
============================*/
.rn-progress-bar .single-progress {
    position: relative;
    margin-top: 38px;
}

.rn-progress-bar .single-progress .title {
    font-size: 15px;
    color: #1f1f25;
    margin-bottom: 10px;
}

.rn-progress-bar .single-progress .progress {
    height: 4px;
    border-radius: 4px;
    box-shadow: none;
    background-color: #f5f7fd;
    overflow: visible;
}

.rn-progress-bar .single-progress .progress .progress-bar {
    background-color: #0096d1;
    background-image: linear-gradient(-224deg, #0096d1 0, #861dec 100%);
    position: relative;
    color: #861dec;
}

.rn-progress-bar .single-progress .label {
    position: absolute;
    right: 0;
    top: 0;
    color: #1f1f25;
    font-size: 15px;
}

@media only screen and (max-width: 767px) {
    .rn-progress-bar .single-progress .label {
        top: -8px;
    }
}

.rn-progress-bar .single-progress.custom-color--1 .progress .progress-bar {
    color: #61fded;
    background-color: #0d8abc;
    background-image: linear-gradient(-224deg, #0d8abc 0px, #61fded 100%);
}

.rn-progress-bar .single-progress.custom-color--2 .progress .progress-bar {
    color: #eece90;
    background-color: #d45529;
    background-image: linear-gradient(-224deg, #d45529 0px, #eece90 100%);
}

.rn-progress-bar .single-progress.custom-color--3 .progress .progress-bar {
    color: #5c51ff;
    background-color: #f646a9;
    background-image: linear-gradient(-224deg, #f646a9 0px, #5c51ff 100%);
}

.rn-progress-bar .single-progress.custom-color--4 .progress .progress-bar {
    color: #e5529a;
    background-color: #e77654;
    background-image: linear-gradient(-224deg, #e77654 0px, #e5529a 100%);
}

.rn-progress-bar.progress-bar--2 .single-progress .progress {
    height: 1px;
    border-radius: 1px;
}

.rn-progress-bar.progress-bar--3 .single-progress .progress {
    height: 20px;
    border-radius: 0;
}

.rn-progress-bar.style-dots .single-progress .progress {
    height: 32px;
    border: 2px solid #f2f2f2;
    padding: 4px;
    border-radius: 30px;
    box-shadow: none;
    background: none;
    overflow: visible;
}

.rn-progress-bar.style-dots .single-progress .progress .progress-bar {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    background-color: transparent !important;
    background-size: 25px 25px;
    background-repeat: repeat-x;
    background-position: -3px center;
    background-image: radial-gradient(ellipse at center, #5945e6 50%, transparent 55%);
}

.rn-progress-bar.style-dots .single-progress .progress .progress-bar::before, .rn-progress-bar.style-dots .single-progress .progress .progress-bar::after {
    display: none;
}

.rn-progress-bar.style-solid .single-progress .progress {
    height: 32px;
    padding: 6px;
    border-radius: 30px;
    box-shadow: none;
    background-color: #f2f2f2;
}

.rn-progress-bar.style-solid .single-progress .progress .progress-bar {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    border-radius: inherit;
    background-color: #f81f01;
    background-image: linear-gradient(-224deg, #f81f01 0, #ee076e 100%);
}

.rn-progress-bar.style-solid .single-progress .progress .progress-bar::before, .rn-progress-bar.style-solid .single-progress .progress .progress-bar::after {
    display: none;
}

.rn-progress-bar.style-solid .single-progress.custom-color--1 .progress .progress-bar {
    color: #61fded;
    background-color: #0d8abc;
    background-image: linear-gradient(-224deg, #0d8abc 0px, #61fded 100%);
}

.rn-progress-bar.style-solid .single-progress.custom-color--2 .progress .progress-bar {
    color: #eece90;
    background-color: #d45529;
    background-image: linear-gradient(-224deg, #d45529 0px, #eece90 100%);
}

.rn-progress-bar.style-solid .single-progress.custom-color--3 .progress .progress-bar {
    color: #5c51ff;
    background-color: #f646a9;
    background-image: linear-gradient(-224deg, #f646a9 0px, #5c51ff 100%);
}

.rn-progress-bar.style-solid .single-progress.custom-color--4 .progress .progress-bar {
    color: #e5529a;
    background-color: #e77654;
    background-image: linear-gradient(-224deg, #e77654 0px, #e5529a 100%);
}
/*==========================
    Service Area 
===========================*/
.service.service__style--1 {
    padding: 40px 0;
    z-index: 2;
}

@media only screen and (max-width: 767px) {
    .service.service__style--1 {
        padding: 15px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--1 {
        padding: 20px 0;
    }
}

.service.service__style--1 .icon img {
    margin-bottom: 34px;
}

@media only screen and (max-width: 767px) {
    .service.service__style--1 .icon img {
        margin-bottom: 14px;
        height: 53px;
    }
}

@media only screen and (max-width: 575px) {
    .service.service__style--1 .icon img {
        margin-bottom: 13px;
        height: 45px;
    }
}

.service.service__style--1 .content h4.title {
    margin-bottom: 20px;
    font-weight: 400;
    font-size: 24px;
}

@media only screen and (max-width: 767px) {
    .service.service__style--1 .content h4.title {
        margin-bottom: 12px;
        font-weight: 400;
        font-size: 20px;
    }
}

@media only screen and (max-width: 575px) {
    .service.service__style--1 .content h4.title {
        margin-bottom: 9px;
        font-size: 18px;
    }
}

.service.service__style--1 .content p {
    opacity: 0.75;
    font-weight: 300;
}

.service.service__style--2 {
    padding: 30px 35px;
    z-index: 2;
    border-radius: 10px;
    position: relative;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .service.service__style--2 {
        padding: 30px 28px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--2 {
        padding: 30px 25px;
    }
}

@media only screen and (max-width: 767px) {
    .service.service__style--2 {
        padding: 30px 14px;
    }
}

@media only screen and (max-width: 575px) {
    .service.service__style--2 {
        padding: 30px 18px;
        margin-top: 30px;
    }
}

.service.service__style--2::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background-image: linear-gradient(to right, #0096d1, #861dec);
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    border-radius: 10px;
}
.service.service__style--2:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background-image: -webkit-gradient(linear,left top,right top,from(#0096d1),to(#861dec));
    background-image: -webkit-linear-gradient(left,#0096d1,#861dec);
    background-image: linear-gradient(90deg,#0096d1,#861dec);
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    border-radius: 10px;
}
@media only screen and (max-width: 575px) {
    .service.service__style--2::before {
        opacity: 1;
        visibility: visible;
    }
}

.service.service__style--2 .icon {
    font-size: 54px;
    font-weight: 400;
    margin-bottom: 23px;
    display: inline-flex;
    color: #0096d1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--2 .icon {
        margin-bottom: 11px;
    }
}

@media only screen and (max-width: 575px) {
    .service.service__style--2 .icon {
        color: #ffffff;
    }
}

.service.service__style--2 .icon svg {
    stroke-width: 1 !important;
}

.service.service__style--2 .content h3.title {
    margin-bottom: 19px;
    font-weight: 500;
        color: #1f1f25;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .service.service__style--2 .content h3.title {
        font-size: 19px;
    }
}

@media only screen and (max-width: 767px) {
    .service.service__style--2 .content h3.title {
        font-size: 20px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .service.service__style--2 .content h3.title {
        margin-bottom: 8px;
    }
}

@media only screen and (max-width: 575px) {
    .service.service__style--2 .content h3.title {
        color: #ffffff;
    }
}

.service.service__style--2 .content h3.title a {
    color: inherit;
}

@media only screen and (max-width: 575px) {
    .service.service__style--2 .content h3.title a {
        color: #ffffff;
    }
}

.service.service__style--2 .content p {
    color: rgba(29, 29, 36, 0.75);
}

@media only screen and (max-width: 575px) {
    .service.service__style--2 .content p {
        color: #ffffff;
    }
}

.service.service__style--2:hover {
    box-shadow: 0 10px 25px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(-5px);
}

.service.service__style--2:hover::before {
    opacity: 1;
    visibility: visible;
}

.service.service__style--2:hover .icon {
    color: #ffffff;
}

.service.service__style--2.service-left-align {
    display: flex;
    padding: 50px 24px;
}

.service.service__style--2.service-left-align .icon {
    padding-right: 20px;
}

/* ---------------------------
    Standard Service  
-------------------------------*/
.standard-service .thumbnai img {
    border-radius: 5px;
}

.standard-service .content h3 {
    font-size: 19px;
    margin-top: 30px;
    margin-bottom: 10px;
    font-weight: 600;
}

.standard-service .content h3 a {
    color: #1f1f25;
}

.standard-service .content h3 a:hover {
    color: #0096d1;
}

.standard-service .content p {
    font-size: 15px;
    line-height: 24px;
}

.text-center .service.service__style--2,
.text-left .service.service__style--2 {
    padding: 60px 45px;
}

@media only screen and (max-width: 767px) {
    .text-center .service.service__style--2,
    .text-left .service.service__style--2 {
        padding: 30px 14px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .text-center .service.service__style--2,
    .text-left .service.service__style--2 {
        padding: 30px 14px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .text-center .service.service__style--2,
    .text-left .service.service__style--2 {
        padding: 30px 14px;
    }
}

.service-white .service__style--1 {
    z-index: 2;
}

.service-white .service__style--1 .content h4.title {
    color: #c6c9d8;
}

.service-white .service__style--1 .content p {
    color: #c6c9d8;
}

/*---------------------------
    Paralax Service Style  
-----------------------------*/
.rn-paralax-service .service__style--2 {
    z-index: 2;
    padding: 40px 40px;
    background: rgba(255, 255, 255, 0.3);
    margin-top: 40px;
    overflow: hidden;
    border: 2px solid transparent;
}

@media only screen and (max-width: 767px) {
    .rn-paralax-service .service__style--2 {
        padding: 30px 20px;
        background: transparent;
        margin-top: 30px;
    }
}

.rn-paralax-service .service__style--2 .icon {
    color: #ffffff;
}

.rn-paralax-service .service__style--2 .content h3.title {
    font-size: 19px;
    color: #ffffff;
}

.rn-paralax-service .service__style--2 .content p {
    color: rgba(255, 255, 255, 0.75);
}

.rn-paralax-service .service__style--2:hover {
    border: 2px solid #0096d1;
}

.rn-paralax-service .service__style--2:hover::before {
    border-radius: 0;
}

/* Creative Agency Service  */
.creative-service-wrapper .row.creative-service a {
    display: flex;
    height: 100%;
}

.creative-service-wrapper .row.creative-service .service.service__style--2 {
    margin-top: 30px;
    background: #f6f6f6;
    width: 100%;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .service-one-wrapper {
        margin: 0 -40px;
    }
}
/*====================
    Slider Area 
======================*/
@media only screen and (max-width: 767px) {
    .bg_image--31 {
        background-position: 67% center !important;
    }

    .bg_image--32 {
        background-position: 27% center !important;
    }
}

.slider-fixed--height {
    min-height: 1080px;
    width: 100%;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slider-fixed--height {
        min-height: 900px;
    }
}

@media only screen and (max-width: 767px) {
    .slider-fixed--height {
        min-height: auto;
        padding: 60px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slider-fixed--height {
        min-height: auto;
        padding: 80px 0;
        padding-bottom: 60px;
    }
}

/*----------------------
Slider Default Style 
------------------------*/
.slide .inner {
    padding-top: 100px;
}

@media only screen and (max-width: 767px) {
    .slide .inner {
        padding-top: 70px;
    }
}

@media only screen and (max-width: 575px) {
    .slide .inner {
        padding-top: 30px;
    }
}

.slide .inner h1.title {
    font-size: 125px;
    font-weight: 900;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    line-height: 130px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slide .inner h1.title {
        font-size: 100px;
        line-height: 112px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide .inner h1.title {
        font-size: 90px;
        line-height: 103px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide .inner h1.title {
        font-size: 70px;
        line-height: 82px;
        margin-bottom: 0;
    }
}

@media only screen and (max-width: 767px) {
    .slide .inner h1.title {
        font-size: 50px;
        line-height: 70px;
        margin-bottom: 0;
    }
}

@media only screen and (max-width: 575px) {
    .slide .inner h1.title {
        font-size: 40px;
        line-height: 50px;
        margin-bottom: 20px;
    }
}

.slide.slide-style-1 .inner {
    padding-top: 100px;
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-1 .inner {
        padding-top: 70px;
    }
}

@media only screen and (max-width: 575px) {
    .slide.slide-style-1 .inner {
        padding-top: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-1 .inner {
        padding-top: 50px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-1 .inner h1.title {
        font-size: 70px;
        line-height: 82px;
        margin-bottom: 26px;
    }
}

.slide.slide-style-2 {
    padding-top: 230px;
    padding-bottom: 284px;
    overflow: hidden;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slide.slide-style-2 {
        padding-top: 150px;
        padding-bottom: 150px;
    }
}

.slide.slide-style-2.fullscreen {
    min-height: 950px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slide.slide-style-2.fullscreen {
        padding-top: 160px;
        padding-bottom: 160px;
        min-height: auto;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.slide-style-2.fullscreen {
        min-height: auto;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-2.fullscreen {
        min-height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2.fullscreen {
        min-height: auto;
    }
}

.slide.slide-style-2.slider-box-content {
    height: 650px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.slide-style-2.slider-box-content {
        height: auto;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-2.slider-box-content {
        height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2.slider-box-content {
        height: auto;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.slide-style-2 {
        padding-top: 160px;
        padding-bottom: 170px;
        min-height: auto;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-2 {
        padding-top: 150px;
        padding-bottom: 150px;
        min-height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 {
        padding-top: 150px;
        padding-bottom: 150px;
        min-height: auto;
    }
}

.slide.slide-style-2 .inner {
    position: relative;
    z-index: 2;
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 .inner {
        padding-top: 0;
        text-align: center !important;
    }
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 .inner.text-right {
        text-align: right !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-2 .inner {
        padding-top: 30px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.slide-style-2 .inner {
        padding-top: 30px;
    }
}

.slide.slide-style-2 .inner > span {
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 4px;
    display: block;
    margin-bottom: 9px;
}

.slide.slide-style-2 .inner h1.title {
    color: #ffffff;
    font-size: 100px;
    font-weight: 900;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.slide-style-2 .inner h1.title {
        font-size: 72px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-2 .inner h1.title {
        font-size: 60px;
        margin-bottom: 18px;
    }
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 .inner h1.title {
        font-size: 36px;
        line-height: 64px;
    }
}

.slide.slide-style-2 .inner p.description {
    color: #c6c9d8;
    font-size: 24px;
    line-height: 40px;
    margin: 0;
    padding: 0 16%;
    font-weight: 300;
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 .inner p.description {
        padding: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-2 .inner p.description {
        padding: 0 10%;
    }
}

.slide.slide-style-2 .inner .slide-btn {
    margin-top: 50px;
}

.slide.slide-style-2 .inner.text-left p {
    padding: 0 37% 0 0;
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 .inner.text-left p {
        padding: 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slide-style-2 .inner.text-left p {
        padding: 0 3% 0 0;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.slide-style-2 .inner.text-left p {
        padding: 0 20% 0 0;
    }
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 .inner.text-left p {
        padding: 0 0 0% 0;
    }
}

.slide.slide-style-2 .inner.text-right p {
    padding: 0 0 0% 46%;
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2 .inner.text-right p {
        padding: 0 0 0% 0;
    }
}

.slide.slide-style-2.without-overlay .inner p.description {
    color: #fff;
    opacity: 0.7;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slide.slide-style-2.slider-paralax {
        height: auto;
        padding-top: 150px;
        padding-bottom: 150px;
    }
}

.slide.slider-style-3 .inner > span {
    color: #1f1f25;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 4px;
    display: block;
    margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
    .slide.slider-style-3 .inner > span {
        font-size: 13px;
        margin-bottom: 10px;
    }
}

.slide.slider-style-3 .inner h1.title {
    color: #1f1f25;
    font-size: 75px;
    font-weight: 900;
    font-family: 'Montserrat', sans-serif;
    line-height: 90px;
    text-transform: inherit;
    width: 70%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.slider-style-3 .inner h1.title {
        font-size: 70px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.slider-style-3 .inner h1.title {
        font-size: 60px;
        line-height: 77px;
        width: 85%;
    }
}

@media only screen and (max-width: 767px) {
    .slide.slider-style-3 .inner h1.title {
        font-size: 42px;
        line-height: 57px;
        width: 100%;
    }
}

.slide.slider-style-3 .inner h1.title span {
    color: #0096d1;
}

.slider-wrapper.color-white .inner p.description {
    color: #ffffff;
}

@media only screen and (max-width: 767px) {
    .slider-wrapper .service-wrapper {
        margin-bottom: -20px;
    }
}

.react-parallax img {
    object-fit: cover;
}

/*-------------------------
Personal Portfolio  
--------------------------*/
.personal-portfolio-slider {
    position: relative;
}

@media only screen and (max-width: 767px) {
    .personal-portfolio-slider::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background: #ffffff;
        opacity: 0.7;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .personal-portfolio-slider::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background: #ffffff;
        opacity: 0.7;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .personal-portfolio-slider::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background: #ffffff;
        opacity: 0.7;
    }
}

@media only screen and (max-width: 767px) {
    .slide.personal-portfolio-slider.slider-style-3, .slide.designer-portfolio.slider-style-3 {
        padding: 100px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.personal-portfolio-slider.slider-style-3, .slide.designer-portfolio.slider-style-3 {
        padding: 150px 0;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.personal-portfolio-slider.slider-style-3, .slide.designer-portfolio.slider-style-3 {
        padding: 150px 0;
        min-width: auto;
        height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner, .slide.designer-portfolio.slider-style-3 .inner {
        padding-top: 56px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner, .slide.designer-portfolio.slider-style-3 .inner {
        padding-top: 76px;
    }
}

@media only screen and (max-width: 767px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h1.title, .slide.designer-portfolio.slider-style-3 .inner h1.title {
        font-size: 32px;
        line-height: 49px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h1.title, .slide.designer-portfolio.slider-style-3 .inner h1.title {
        font-size: 53px;
        line-height: 70px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h1.title, .slide.designer-portfolio.slider-style-3 .inner h1.title {
        font-size: 58px;
        line-height: 75px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h1.title, .slide.designer-portfolio.slider-style-3 .inner h1.title {
        font-size: 54px;
        line-height: 68px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h2, .slide.designer-portfolio.slider-style-3 .inner h2 {
        font-size: 54px;
        line-height: 1.3;
    }
}

@media only screen and (max-width: 767px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h2, .slide.designer-portfolio.slider-style-3 .inner h2 {
        font-size: 32px;
        line-height: 1.3;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h2, .slide.designer-portfolio.slider-style-3 .inner h2 {
        font-size: 53px;
        line-height: 70px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.personal-portfolio-slider.slider-style-3 .inner h2, .slide.designer-portfolio.slider-style-3 .inner h2 {
        font-size: 58px;
        line-height: 75px;
    }
}

.slide.designer-portfolio {
    height: 700px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.designer-portfolio {
        height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .slide.designer-portfolio {
        height: auto;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide.designer-portfolio.slider-style-3 {
        height: auto;
        padding: 100px 0;
    }
}

@media only screen and (max-width: 767px) {
    .slide.designer-portfolio.slider-style-3 {
        height: auto;
        padding: 100px 0;
    }
}

.slide.designer-portfolio.slider-style-3 .inner {
    padding: 0;
}

.slide.designer-portfolio.slider-style-3 .inner h1.title {
    width: 100%;
}

.slide.designer-portfolio.slider-style-3 .designer-thumbnail img {
    border-radius: 100%;
    padding: 0;
    border: 14px solid #fff;
    width: 394px;
    height: 394px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1), 0 20px 40px rgba(255, 255, 255, 0.15);
}

@media only screen and (max-width: 575px) {
    .slide.designer-portfolio.slider-style-3 .designer-thumbnail img {
        width: auto;
        height: auto;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide.designer-portfolio.slider-style-3 .designer-thumbnail img {
        width: auto;
        height: auto;
    }
}

/*--------------------------
    Slider Digital Agency  
----------------------------*/
.slider-digital-agency a.rn-button-style--2 {
    color: #fff;
    border-color: #fff;
}

/* ----------------------
    Slider Videi Bg 
------------------------*/
.slider-video-bg {
    position: relative;
    z-index: 2;
}

.slider-video-bg .video-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.slider-video-bg .inner {
    position: relative;
    z-index: 2;
}

.slider-video-bg[data-black-overlay]::before {
    z-index: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slider-video-bg .video-inner button.video-popup {
        margin: 0;
        margin-top: 28px;
    }
}

@media only screen and (max-width: 767px) {
    .slider-video-bg .video-inner button.video-popup {
        margin: 0;
        margin-top: 28px;
    }
}

@media only screen and (max-width: 767px) {
    .slider-video-bg .video-inner button.video-popup {
        width: 70px;
        height: 70px;
        margin: 0 auto;
        margin-top: 30px;
    }
}

.slide.slide-style-2.slider-video-bg .inner .title {
    font-size: 60px;
    line-height: 80px;
    margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
    .slide.slide-style-2.slider-video-bg .inner .title {
        font-size: 44px;
        line-height: 60px;
        margin-bottom: 13px;
    }
}

@media only screen and (max-width: 575px) {
    .slide.slide-style-2.slider-video-bg .inner .title {
        font-size: 36px;
        line-height: 53px;
    }
}

/* ---------------------------
    Slider Creative Agency
------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slider-creative-agency .slider-paralax {
        height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .slider-creative-agency .slider-paralax {
        height: auto;
    }
}

.slider-creative-agency.with-particles {
    position: relative;
}

.slider-creative-agency.with-particles .frame-layout__particles {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
}

.slider-creative-agency.with-particles .frame-layout__particles canvas {
    position: absolute;
    z-index: 1;
}

.slider-creative-agency.with-particles .inner {
    position: relative;
    z-index: 4;
}

/*-------------------------
For Slider Service 
---------------------------*/
.slide .service {
    margin-top: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slide .service {
        margin-top: 20px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slide .service {
        margin-top: 0px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slide .service {
        margin-top: 20px;
    }
}

@media only screen and (max-width: 767px) {
    .slide .service {
        margin-top: 20px;
    }
}

@media only screen and (max-width: 575px) {
    .slide .service {
        margin-top: 0;
    }
}

/*=======================
    Slider Paralax 
=========================*/
.slider-paralax,
.rn-paralax {
    height: 950px;
}

@media only screen and (max-width: 767px) {
    .slider-paralax,
    .rn-paralax {
        height: auto;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .slider-paralax,
    .rn-paralax {
        height: auto;
        padding-top: 150px;
        padding-bottom: 150px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slider-paralax,
    .rn-paralax {
        height: auto;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slider-paralax,
    .rn-paralax {
        height: auto;
    }
}

/*--------------------------
Slick Animation For Slider  
-----------------------------*/
.slick-slide.slick-current .slide.slide-style-2 .inner h1.title {
    -webkit-animation: 800ms ease-in-out 0s normal none 1 running customOne;
    animation: 800ms ease-in-out 0s normal none 1 running customOne;
}

.slick-slide.slick-current .slide.slide-style-2 .inner p.description {
    -webkit-animation: 1000ms ease-in-out 0s normal none 1 running customOne;
    animation: 1000ms ease-in-out 0s normal none 1 running customOne;
}

.slick-slide.slick-current .slide.slide-style-2 .inner .slide-btn {
    -webkit-animation: 1200ms ease-in-out 0s normal none 1 running customOne;
    animation: 1200ms ease-in-out 0s normal none 1 running customOne;
}

@media only screen and (max-width: 767px) {
    .bg_image--16 {
        background-position: 71% center;
    }
}

/*--------------------------------------
Slider Default Button And Dot STyle
---------------------------------------*/
.slider-activation {
    position: relative;
}

.slider-activation .slick-dots {
    bottom: 60px;
}

@media only screen and (max-width: 767px) {
    .slider-activation .slick-dots {
        bottom: 88px;
    }
}

.slider-activation button.slick-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    transition: 0.5s;
    opacity: 1;
    font-size: 0;
    width: 68px;
    height: 68px;
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 100%;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .slider-activation button.slick-arrow {
        display: none !important;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .slider-activation button.slick-arrow {
        display: none !important;
    }
}

@media only screen and (max-width: 767px) {
    .slider-activation button.slick-arrow {
        display: none !important;
    }
}

.slider-activation button.slick-arrow:hover {
    background: #0096d1;
    border-color: #0096d1;
}

.slider-activation button.slick-arrow::before {
    line-height: 1;
    opacity: 0.4;
    position: relative;
    top: -2px;
    transition: 0.5s;
    z-index: 2;
}

.slider-activation button.slick-arrow.slick-prev {
    left: 50px;
}

@media only screen and (max-width: 767px) {
    .slider-activation button.slick-arrow.slick-prev {
        left: 10px;
    }
}

.slider-activation button.slick-arrow.slick-prev::before {
    content: url(../images/icons/slick-arrow-left-small.png);
}

.slider-activation button.slick-arrow.slick-prev:hover {
    left: 30px;
}

@media only screen and (max-width: 767px) {
    .slider-activation button.slick-arrow.slick-prev:hover {
        left: 20px;
    }
}

.slider-activation button.slick-arrow.slick-prev:hover::before {
    opacity: 1;
}

.slider-activation button.slick-arrow.slick-next {
    left: auto;
    right: 50px;
}

@media only screen and (max-width: 767px) {
    .slider-activation button.slick-arrow.slick-next {
        right: 10px;
    }
}

.slider-activation button.slick-arrow.slick-next::before {
    content: url(../images/icons/slick-arrow-right-small.png);
}

.slider-activation button.slick-arrow.slick-next:hover {
    right: 30px;
}

@media only screen and (max-width: 767px) {
    .slider-activation button.slick-arrow.slick-next:hover {
        right: 20px;
    }
}

.slider-activation button.slick-arrow.slick-next:hover::before {
    opacity: 1;
}
/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}

.slick-dots li button:after {
    background: #333;
    width: 100%;
    display: block;
    content: "";
    position: absolute;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-left: 11px;
    background-color: #616b75;
    box-shadow: inset 0 0 0 1px #616b75;
    -webkit-transition: all .25s;
-moz-transition: all .25s;
-ms-transition: all .25s;
-o-transition: all .25s;
transition: all .25s;
}
.slick-dots li.slick-active button:after {
     box-shadow: inset 0 0 0 1px #0096d1;
    -webkit-transform: scale(2);
    transform: scale(2);   
    background-color: transparent;
}


/*--------------------
Custom Animation  
----------------------*/
@-webkit-keyframes customOne {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 50%, 0);
        transform: translate3d(0, 50%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes customOne {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 50%, 0);
        transform: translate3d(0, 50%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.customOne {
    -webkit-animation-name: customOne;
    animation-name: customOne;
}

.theme-gradient {
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.thumbnail img {
    border-radius: 5px;
    box-shadow: 0 25px 65px rgba(0, 0, 0, 0.1);
}

/*---------------------
    Box Model  
----------------------*/
.box-model .service-wrapper {
    background-image: url(../images/bg/bg-image-1.jpg);
    padding: 10px 50px;
    border-radius: 6px;
    position: relative;
}

.box-model .service-wrapper .service {
    margin: 0;
}

.box-model .service-wrapper .service .icon {
    margin: auto;
    text-align: center;
}

.box-model .service-wrapper .service .content {
    text-align: center;
}

.box-model .service-wrapper:before {
    width: 90%;
    height: 80%;
    position: absolute;
    left: 0;
    bottom: -30px;
    content: "";
    background-color: #0096d1;
    z-index: -1;
    margin: auto;
    right: 0;
    border-radius: 20%;
    background-image: linear-gradient(145deg, #0096d1 0%, #0096d1 100%);
    filter: blur(30px);
}

.box-model .inner {
    text-align: center;
    margin-bottom: 60px;
}
/* Tab Style  */
ul.tab-style--1 {
    display: flex;
    margin: 0 -20px;
    flex-wrap: wrap;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    ul.tab-style--1 {
        margin: 0 -10px;
    }
}

ul.tab-style--1 li {
    position: relative;
    margin: 0 20px;
    display: inline-block;
    padding-bottom: 4px;
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    outline: none;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    ul.tab-style--1 li {
        margin: 0 10px;
        font-size: 17px;
    }
}

@media only screen and (max-width: 767px) {
    ul.tab-style--1 li {
        margin-bottom: 10px;
    }
}

ul.tab-style--1 li::before {
    position: absolute;
    content: "";
    width: 30px;
    background: rgba(0, 0, 0, 0.2);
    transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    height: 2px;
    bottom: 0;
}

ul.tab-style--1 li.react-tabs__tab--selected {
    color: #0096d1;
}

ul.tab-style--1 li.react-tabs__tab--selected::before {
    width: 100%;
    background: currentColor;
}

.single-tab-content {
    padding-top: 20px;
}

.single-tab-content p {
    font-weight: 300;
    color: #717173;
    font-size: 18px;
    line-height: 30px;
}

.single-tab-content ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.single-tab-content ul.list-style--1 li {
    margin-bottom: 10px;
}

.single-tab-content ul li {
    color: #7e7e7e;
    font-size: 16px;
    line-height: inherit;
    margin-bottom: 15px;
    font-weight: 300;
}

.single-tab-content ul li a {
    font-weight: 500;
    display: block;
    color: #717173;
}

.single-tab-content ul li a span {
    font-weight: 300;
}
/*------------------------
    Team Styles 
----------------------*/
.team {
    margin-top: 30px;
    overflow: hidden;
    border-radius: 6px;
    position: relative;
}

.team .thumbnail {
    display: block;
    position: relative;
    z-index: 1;
}

.team .thumbnail img {
    width: 100%;
}

.team .thumbnail::after {
    background: linear-gradient(to bottom, #0096d1 0, #000000 100%);
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 1;
    opacity: 0;
}

.team .content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 35px 40px;
    z-index: 2;
}

.team .content h4.title {
    color: #ffffff;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transition-delay: 0.25s;
    transform: translateY(10px);
    transition: all 0.45s cubic-bezier(0.23, 0.88, 0.34, 0.99);
}

.team .content h4.title a {
    color: #ffffff;
}

.team .content p.designation {
    color: #c6c9d8;
    font-size: 14px;
    line-height: 34px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.45s cubic-bezier(0.23, 0.88, 0.34, 0.99);
    transform: translateY(10px);
}

.team ul.social-icon {
    position: absolute;
    top: 25px;
    left: 35px;
    padding: 0;
    z-index: 2;
    list-style: none;
    display: flex;
    margin: 0 -10px;
}

.team ul.social-icon li {
    margin: 0 10px;
    transform: translateY(8px) scale(0.8);
    opacity: 0;
    visibility: hidden;
    transition: all 0.45s cubic-bezier(0.23, 0.88, 0.34, 0.99);
}

.team ul.social-icon li a {
    color: #ffffff;
    font-size: 15px;
    transition: 0.3s;
}

.team ul.social-icon li a svg {
    transition: 0.3s;
}

.team ul.social-icon li a:hover svg {
    transform: scale(1.3);
}

.team.team-style--bottom ul.social-icon {
    top: auto;
    left: 40px;
    bottom: 105px;
}

.team.team-style--bottom .content h4.title {
    margin-bottom: 1px;
}

.team:hover .content h4.title {
    transition-delay: 0.25s;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.team:hover .content p.designation {
    transition-delay: 0.33s;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.team:hover .thumbnail::after {
    opacity: 0.85;
    top: 0;
}

.team:hover ul.social-icon li {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.team:hover ul.social-icon li:nth-child(1) {
    -webkit-transition-delay: .07692s;
    transition-delay: .07692s;
}

.team:hover ul.social-icon li:nth-child(2) {
    -webkit-transition-delay: .15385s;
    transition-delay: .15385s;
}

.team:hover ul.social-icon li:nth-child(3) {
    -webkit-transition-delay: .23077s;
    transition-delay: .23077s;
}

.team:hover ul.social-icon li:nth-child(4) {
    -webkit-transition-delay: .33077s;
    transition-delay: .23077s;
}

.team:hover ul.social-icon li:nth-child(5) {
    -webkit-transition-delay: .43077s;
    transition-delay: .23077s;
}

.team:hover .content {
    opacity: 1;
    visibility: visible;
}

/*-------------------
    Team Static  
---------------------*/
.team-static .inner {
    padding-top: 17px;
}

.team-static .inner .content .title {
    margin-bottom: 2px;
    font-size: 16px;
}

.team-static .inner .content p.designation {
    margin-bottom: 5px;
    font-size: 15px;
    font-weight: 300;
}

/*----------------------
    Social Share 
------------------------*/
ul.social-transparent {
    margin: -8px;
}

ul.social-transparent li {
    margin: 8px;
}

ul.social-transparent li a {
    width: auto;
    display: inline-block;
    height: auto;
    border: 0 none;
    line-height: initial;
    color: #000;
    border-radius: 100%;
    text-align: center;
    font-size: 14px;
    transition: 0.3s;
}

ul.social-transparent li a:hover {
    color: #0096d1;
}
/* ---------------------------
Testimonial Styles 
------------------------------*/
.react-tabs__tab-panel.react-tabs__tab-panel--selected .rn-testimonial-content {
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.rn-testimonial-content {
    -webkit-filter: blur(30px);
    filter: blur(30px);
    opacity: 0;
    -webkit-transform: scale(0.2);
    -ms-transform: scale(0.2);
    transform: scale(0.2);
    -webkit-transition: opacity 0.4s cubic-bezier(0.82, 0, 0.12, 1) 0.2s, -webkit-filter 0.3s cubic-bezier(0.82, 0, 0.12, 1) 0.1s, -webkit-transform 0.6s cubic-bezier(0.82, 0, 0.12, 1);
    transition: opacity 0.4s cubic-bezier(0.82, 0, 0.12, 1) 0.2s, -webkit-filter 0.3s cubic-bezier(0.82, 0, 0.12, 1) 0.1s, -webkit-transform 0.6s cubic-bezier(0.82, 0, 0.12, 1);
    transition: filter 0.3s cubic-bezier(0.82, 0, 0.12, 1) 0.1s, transform 0.6s cubic-bezier(0.82, 0, 0.12, 1), opacity 0.4s cubic-bezier(0.82, 0, 0.12, 1) 0.2s;
    transition: filter 0.3s cubic-bezier(0.82, 0, 0.12, 1) 0.1s, transform 0.6s cubic-bezier(0.82, 0, 0.12, 1), opacity 0.4s cubic-bezier(0.82, 0, 0.12, 1) 0.2s, -webkit-filter 0.3s cubic-bezier(0.82, 0, 0.12, 1) 0.1s, -webkit-transform 0.6s cubic-bezier(0.82, 0, 0.12, 1);
}

.rn-testimonial-content .inner {
    padding-bottom: 62px;
}

@media only screen and (max-width: 767px) {
    .rn-testimonial-content .inner {
        padding-bottom: 20px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-testimonial-content .inner {
        padding-bottom: 30px;
    }
}

.rn-testimonial-content .inner p {
    font-size: 36px;
    line-height: 58px;
    color: #18181b;
    font-weight: 500;
    padding: 0 9%;
    margin-bottom: 0;
    margin-top: -16px;
    position: relative;
    z-index: 2;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .rn-testimonial-content .inner p {
        font-size: 32px;
        line-height: 53px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-testimonial-content .inner p {
        font-size: 28px;
        line-height: 48px;
        padding: 0;
    }
}

@media only screen and (max-width: 767px) {
    .rn-testimonial-content .inner p {
        font-size: 17px !important;
        line-height: 30px !important;
        padding: 0;
        font-weight: 400;
    }
}

.rn-testimonial-content .inner p::before {
    position: absolute;
    width: 197px;
    height: 100%;
    left: 25%;
    top: -50px;
    background-image: url(../images/client/image-1.png);
    content: "";
    opacity: 1;
    background-repeat: no-repeat;
    z-index: -1;
}

@media only screen and (max-width: 767px) {
    .rn-testimonial-content .inner p::before {
        top: -15px;
        background-size: 100px;
        left: 50%;
        right: 0;
        width: 100%;
        margin-left: -48px;
    }
}

.rn-testimonial-content .inner p::after {
    position: absolute;
    width: 197px;
    height: 202px;
    right: 25%;
    bottom: -115px;
    background-image: url(../images/client/image-2.png);
    content: "";
    opacity: 1;
    background-repeat: no-repeat;
    z-index: -1;
}

@media only screen and (max-width: 767px) {
    .rn-testimonial-content .inner p::after {
        display: none;
    }
}

.rn-testimonial-content .author-info {
    margin-bottom: 50px;
}

@media only screen and (max-width: 767px) {
    .rn-testimonial-content .author-info {
        margin-bottom: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .rn-testimonial-content .author-info {
        margin-bottom: 30px;
    }
}

.rn-testimonial-content .author-info h6 {
    font-size: 18px;
    line-height: 50px;
    color: #8c8c8c;
    font-weight: 300;
}

@media only screen and (max-width: 767px) {
    .rn-testimonial-content .author-info h6 {
        line-height: 20px;
        font-size: 14px;
    }
}

.rn-testimonial-content .author-info h6 span {
    color: #18181b;
    text-transform: uppercase;
}

.rn-testimonial-light .rn-testimonial-content .inner p {
    color: #c6c9d8;
}

.rn-testimonial-light .rn-testimonial-content .author-info h6 {
    color: #ffffff;
}

.rn-testimonial-light .rn-testimonial-content .author-info h6 span {
    color: #c6c9d8;
    text-transform: uppercase;
}

.rn-paralax-testimonial .rn-testimonial-content .inner p {
    color: #ffffff;
}

.rn-paralax-testimonial .rn-testimonial-content .inner p::before, .rn-paralax-testimonial .rn-testimonial-content .inner p::after {
    opacity: 0.1;
}

/* ------------------------------
Testimonial Thumbnail 
-------------------------------- */
ul.testimonial-thumb-wrapper {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 510px;
    margin: 0px auto;
    margin-bottom: -30px;
    outline: none;
}

@media only screen and (max-width: 575px) {
    ul.testimonial-thumb-wrapper {
        margin-bottom: -10px;
    }
}

ul.testimonial-thumb-wrapper li {
    padding-left: 15px;
    padding-right: 15px;
    flex-basis: 20%;
    margin-bottom: 30px;
    outline: none;
    cursor: pointer;
}

@media only screen and (max-width: 767px) {
    ul.testimonial-thumb-wrapper li {
        flex-basis: 20%;
        margin-bottom: 14px;
        padding-left: 7px;
        padding-right: 7px;
    }
}

@media only screen and (max-width: 575px) {
    ul.testimonial-thumb-wrapper li {
        flex-basis: 25%;
        padding-left: 5px;
        padding-right: 5px;
        margin-bottom: 10px;
    }
}

ul.testimonial-thumb-wrapper li .thumb {
    position: relative;
    display: inline-block;
    width: 100%;
}

ul.testimonial-thumb-wrapper li .thumb img {
    border-radius: 6px;
    width: 100%;
}

ul.testimonial-thumb-wrapper li .thumb img:hover {
    transform: scale(1.1);
    object-fit: contain;
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.1);
}

ul.testimonial-thumb-wrapper li .thumb::after {
    width: 13px;
    height: 13px;
    background: #861dec;
    right: -8.5px;
    top: -8.5px;
    position: absolute;
    content: "";
    border-radius: 100%;
    opacity: 0;
    transform: scale(0);
}

ul.testimonial-thumb-wrapper li.react-tabs__tab--selected .thumb::after {
    opacity: 1;
    transform: scale(1);
}

ul.testimonial-thumb-wrapper li.react-tabs__tab--selected .thumb img {
    transform: scale(1.1);
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.1);
}


.two-videos .col-lg-6 .modal-video {
    display: none;
}
.two-videos .col-lg-6:first-child .thumb > img + .modal-video {
    display: block;
}
.two-videos .col-lg-6:last-child .thumb > img + .modal-video {
    display: block;
}
a.rn-button-style--2.btn-primary-color {
    border: 2px solid #0096d1;
    background: #0096d1;
    color: #ffffff;
}

.dd-abt-text{
    text-align: center;
    font-weight: 300;
    color: #717173;
    background-color: #f6f6f6;
}
.dd-abt-text a {
    color: #4a53e0;
    text-decoration: underline;
}
.about-us-list ul li {
    font-size: 16px;
    color: #717173;
}
.footer-right .footer-link ul.ft-link li+li {
    color: rgba(198, 201, 216, 0.75);
}

.error {
    position: relative;
    bottom: 20px;
    color: red;
}
.animation-explainer-video-banner,
.why-choose-us-banner,
.trusted-brands-banner,
.video-production-thumbanail,
.get-in-touch,
.video-production-contact {
    margin-bottom: 80px;
}
.footer-left{
    background-image: url(../images/ready-to-get-to-work1.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: bottom center;
}
.footer-left .inner{
    opacity: 0;
    visibility: hidden;
}
@media screen and (min-width: 1200px) and (max-width: 1500px) {
    .footer-right {
        padding: 80px 50px;
    }
    .copyright-text {
        position: relative;
        bottom: -30px;
    }

}

@media screen and (min-width: 992px) and (max-width: 1499px) {
.footer-right {
    padding: 60px 20px;
    padding-left: 50px;
}
.copyright-text {
    position: relative;
    bottom: -30px;
}
}

@media screen and (min-width: 1200px) {
    
}


@media screen and (min-width: 768px) {
    .about-us-list ul {
        column-count: 2;
    }
}
@media only screen and (max-width: 767px) {
    .header-area .header-wrapper a.rn-btn {
        display: block;
    }
    .service-testimonial{
        margin-top: 0 !important;
    }
}

=================================*/
@keyframes modal-video {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes modal-video-inner {
    from {
        transform: translate(0, 100px);
    }

    to {
        transform: translate(0, 0);
    }
}

.modal-video {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000000;
    cursor: pointer;
    opacity: 1;
    animation-timing-function: ease-out;
    animation-duration: 0.3s;
    animation-name: modal-video;
    -webkit-transition: opacity 0.3s ease-out;
    -moz-transition: opacity 0.3s ease-out;
    -ms-transition: opacity 0.3s ease-out;
    -o-transition: opacity 0.3s ease-out;
    transition: opacity 0.3s ease-out;
}

.modal-video-effect-exit {
    opacity: 0;
}

.modal-video-effect-exit .modal-video-movie-wrap {
    -webkit-transform: translate(0, 100px);
    -moz-transform: translate(0, 100px);
    -ms-transform: translate(0, 100px);
    -o-transform: translate(0, 100px);
    transform: translate(0, 100px);
}

.modal-video-body {
    max-width: 940px;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    display: table;
}

.modal-video-inner {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    height: 100%;
}

.modal-video-movie-wrap {
    width: 100%;
    height: 0;
    position: relative;
    padding-bottom: 56.25%;
    background-color: #333;
    animation-timing-function: ease-out;
    animation-duration: 0.3s;
    animation-name: modal-video-inner;
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -ms-transition: -ms-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
}

.modal-video-movie-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.modal-video-close-btn {
    position: absolute;
    z-index: 2;
    top: -35px;
    right: -35px;
    display: inline-block;
    width: 35px;
    height: 35px;
    overflow: hidden;
    border: none;
    background: transparent;
}

.modal-video-close-btn:before {
    transform: rotate(45deg);
}

.modal-video-close-btn:after {
    transform: rotate(-45deg);
}

.modal-video-close-btn:before, .modal-video-close-btn:after {
    content: '';
    position: absolute;
    height: 2px;
    width: 100%;
    top: 50%;
    left: 0;
    margin-top: -1px;
    background: #fff;
    border-radius: 5px;
    margin-top: -6px;
}
.bg_color--4 {
    background: #1a1b1f;
}
video.video-block {
    display: inline-block;
    width: 100%;
    /* height: 100%; */
}
button:focus {
    outline: none !important;
}
.contact-img img {
    width: 100%;
}
.page-banner {
    background-image: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.page-banner .video-block {
    /* width: 100%;
    height: 56.25%;
    line-height: 0;
    overflow: hidden; */
    width: 100%;
    height: 100%;
    line-height: 0;
    overflow: hidden;
    position: relative;
    padding-bottom: 56.25%;
}
.page-banner .banner-content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
}
.page-banner .video-block video {
    /* height: 100%;
    width: 100%;
    object-fit: cover; */
    height: 100%;
    width: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}
.why-choose-section ul{
    list-style-type: disc;
}
.why-choose-section ul li {
    font-size: 28px;
    margin: 0 0 36px;
    font-weight: 700;
    line-height: 1.4;
}
.banner-img-wrap::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 20%);
    top: 0;
    left: 0;
}
.contact-detail-sec a.email-btn {
    background-color: #00A1FF;
    color: #fff;
    font-size: 26px;
    padding: 8px 20px 8px 80px;
    position: relative;
    margin: 8px 0 8px 4px;
    display: inline-block;
    line-height: normal;
}
.contact-detail-sec a.email-btn:after{
    content: "";
    position: absolute;
    left: -4px;
    top: -8px;
    height: calc(100% + 16px);
    width: 100%;
    background-image: url(../images/email.png);
    background-repeat: no-repeat;
    background-position: left center;
     background-size: contain;
}
.contact-detail-sec .call-btn {
    display: inline-block;
    background-color: #60d937;
    padding: 8px 20px 8px 80px;
    position: relative;
    margin: 8px 0 8px 4px;
    line-height: normal;
    min-width: 406px;
}
.contact-detail-sec .call-btn a{
    color: #fff;
    font-size: 20px;
    display: block;
    line-height: 1.3;
}
.contact-detail-sec .call-btn:after{
    content: "";
    position: absolute;
    left: -8px;
    top: -8px;
    height: calc(100% + 16px);
    width: 100%;
    background-image: url(../images/call-btn-green.png);
    background-repeat: no-repeat;
    background-position: left center;
     background-size: contain;
}
.banner-img-wrap img {
    width: 100%;
}
.banner-img-wrap {
    position: relative;
}

/* contact us form */

.contact-us-form {
    background: #ea1404;
    padding: 40px;
    border-radius: 20px;
    margin-top: 50px;
}
.contact-us-form h2 {
    text-align: center;
    color: #fff;
}
.contact-us-form label {
    color: #fff;
    font-weight: 900;
    font-size: 16px;
    text-align: center;
}
.contact-us-form input,textarea {
    background: #fff;
    border: none;
    outline: none;
    border-radius: unset;
    margin-bottom: 5px;
    height: 40px;
}
.contact-us-form .submit-btn .rn-button-style--2 {
    font-size: 23px;
    padding: 3.5px 30px;
    border-radius: 20px;
    font-weight: bold;
    border: #f8f9fa;
    border: transparent;
    border: 4px solid white;
}
.contact-us-form textarea {
    margin: 0;
    border-radius: unset;
}
.contact-us-form .submit-btn {
    margin-top: 5px;
}
.contact-form--1 .row {
    padding-left: 15px;
    padding-right: 15px;
}

.mainmenunav ul.mainmenu > li > a img {
    /* max-width: 140px;
    height: 40px; */
    max-width: 190px;
    /* height: 50px; */    
    border-radius: 100px;
}
/* .mainmenunav ul.mainmenu > li > a img[src="assets/images/contact.png"] {
    border-radius: 0;
    height: 60px;
} */

/*mobile menu*/
.mobile-selector {
    width: 100%;
    position: relative;
    cursor: pointer;
    border: 1px solid transparent;
    display: flex;
    justify-content: space-between;
    height: 55px;
    line-height: 55px;
    background-color: #f9f9f9;
    border-color: #dadada;
    color: #333333;
    font-size: 14px;
    padding: 0;
}
.mobile-selector span.menutext {font-size: 14px;margin-left: 20px;margin-right: 10px;}
.selector-down svg {
    fill: #333c4e;
    stroke: #333c4e;
    width: 50px;
    height: 28px;
}
.selector-down {
    line-height: calc(55px - 2px);
    height: calc(55px - 2px);
    border-left: 1px solid #dadada;
    width: 50px;
    text-align: center;
}
.phonenumber-wrap {
    text-align: center;
}




.contactportfolioWrap {
    display: flex;
    flex-wrap: wrap;
    margin: 40px 0;
    gap: 20px;
}
.contactportfolioWrap a > img {
    max-width: 280px;
    width: 100%;
}

/*new footer css 20-02-2023*/
.footernew .footer-wrapper {
    background: #ea1404;
    padding: 50px 0;
}
.footernew .footer-left {
    background: transparent;
    padding: 0;
    margin: 0;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.footernew .footer-left::before {
    background: transparent;
    opacity: 1;
    display: none;
}
.footernew .footer-left .inner {
    opacity: 1;
    visibility: visible;
}
.footernew .footer-left .inner::after {
    display: none;
}
.footernew .footer-right {
    padding: 0;
    background: transparent;
    text-align: center;
    padding-top: 18px;
}
.footernew .footer-right::before {
    display: none;
}
.footercontactbtn img {
    max-width: 280px;
    margin: 0 auto;
}
.footercontactbtn {
    text-align: center;
    display: block;
}
.footermailphonelinks {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
    font-size: 18px;
    color: #fff;
    font-weight: 600;
}
.footer-address {
    display: flex;
    justify-content: center;
    align-items: center;
}
.footer-address p{
    color: #fff;
    font-weight: 600;
}
.footermailphonelinks a {
    color: #fff;
}
.footermailphonelinks > div:after {
    content: "|";
    padding: 0 5px;
    position: absolute;
    right: -8px;
}
.footermailphonelinks > div:last-child:after {
    display: none;
}
.footermailphonelinks > div {
    position: relative;
    padding: 0 10px;
}
.footer-link ul.ft-link {
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer-link ul.ft-link li {
    margin-bottom: 10px;
}
.footer-link ul.ft-link li a {
    font-size: 18px;
    color: #fff;
}
.footer-link ul.ft-link li a:hover, .footermailphonelinks a:hover {
    color: #000;
}
.copyright-text {
    position: relative;
    bottom: 0;
    text-align: center;
}
.copyright-text p {
    color: #fff;
    opacity: 1;
}

.rn-about-wrapper .row {
    flex-direction: column-reverse;
}
.service-testimonial {
    margin-top: 50px;
    margin-bottom: 50px;
}
.about-testimonials {
    padding-top: 60px;
}


.header-star img {
    max-width: 150px;
}


/* animation-explainer-video */
.desc-block h4 {
    margin-bottom: 15px;
    font-size: 25px;
    line-height: normal;
}
ul.inner-section-desc {
    padding: 0;
    list-style-type: none;
}



ul.inner-section-desc li {
    font-size: 18px;
    line-height: normal;
    padding-bottom: 10px;
    position: relative;
    padding-left: 15px;
}

ul.inner-section-desc li::before {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 50px;
    background: black;
    position: absolute;
    top: 10px;
    left: 0;
    /* transform: translateY(-50%); */
}
.desc-block {
    margin-bottom: 30px;
}
.film-production-video {
    margin-bottom: 30px;
}
.desc-block.without-dots ul li {
    list-style-type: none;
}
.desc-block.without-dots ul{
    margin: 0;
    padding-left: 0;
}
.about-inner .section-title .portfolio-video ul li {
    width: 32%;
}
.about-inner .section-title .portfolio-video ul{
    justify-content: space-between;
}
.about-inner .section-title .portfolio-video {
    padding: 30px 0 0 0;
}
.contact-us-box {
    background-image: url("../images/BG.png");
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    background-size: cover;
    margin: 80px 0;
    min-height: 927px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
.contact-us {
    background: white;
    max-width: 650px;
    width: 100%;
    margin: 0 auto;
    border-radius: 10px;
    padding: 60px 30px 100px;
    text-align: center;
}
.contact-us h3 {
    margin-bottom: 70px;
}
.form-block input,
.form-block textarea {
    outline: 0;
    border-left: 0;
    border-right: 0;
    border-top: 0;
    padding: 0;
    width: 100%;
    border-bottom: 1px solid;
}
.form-block textarea {
    height: 80px;
}
.form-block.btn-submit input[type="submit"] {
    border: 0;
    width: auto;
    background: linear-gradient(91deg, #D80975 0.7%, #E4333B 99.77%);
    color: #fff;
    display: inline-block;
    font-weight: 600;
    padding: 8px 41px;
    line-height: normal;
}
.contact-us .form-block:last-child {
    margin-bottom: 0;
}
.contact-us .form-block {
    margin-bottom: 30px;
}
.banner-contact {
    margin-top: 70px;
}
.banner-img img {
    width: 100%;
}
.video-production-why-choose-us img {
    max-width: 1000px;
    margin: 0 auto;
    width: 100%;
}
.trusted-brands-img img{
    width: 100%;
}
.video-production-why-choose-us {
    text-align: center;
}
.content-style {
    box-shadow: 1em 1em 2.4em rgba(0,0,0,0.25);
    padding: 30px;
}

.content-style h1 {
    font-size: 60px;
    color: #ea1404;
    margin-bottom: 30px;
}

.content-style ul {
    margin: 0;
    padding: 0;
}
.site-map {
    padding: 80px 0;
}
.content-style ul li a {
    color: #1f1f25;
}
.content-style ul li {
    font-size: 25px;
    position: relative;
    list-style-type: none;
    padding-left: 40px;
    text-align: left;
}

.content-style ul li::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #1f1f25;
    border-radius: 50px;
    position: absolute;
    left: 10px;
    top: 15px;
}
.pb-80{
    padding-bottom: 80px;
}
/* .ptb--120{
    padding-bottom: 0;
} */

/*media*/
@media screen and (max-width:1700px){
    .mainmenunav ul.mainmenu > li > a img {
        max-width: 180px;
    }
}
@media screen and (max-width:1600px){
    .mainmenunav ul.mainmenu > li > a img {
        max-width: 145px;
    }
}

@media only screen and (max-width: 1370px){
    h2, .h2 {
        font-size: 44px;
    }
}

@media only screen and (max-width: 1370px){
    .header-phone img {
        max-width: 160px;
    }
}

@media only screen and (min-width: 1601px){
    .header-star img {
        max-width: 100px;
    }
    
}

@media only screen and (min-width: 1801px) and (max-width: 1815px){
    .logo img {
        width: 200px;
    }
    .header-phone img {
        max-width: 200px;
    }
}

@media only screen and (min-width: 1601px) and (max-width: 1800px){
    .logo img {
        width: 230px;
    }
    .header-phone img {
        max-width: 230px;
    }
}

@media only screen and (min-width: 1501px) and (max-width: 1600px){
    .logo img {
        width: 240px;
    }
    .header-phone img {
        max-width: 240px;
    }
    .header-star img {
        max-width: 130px;
    }
}   

@media only screen and (min-width: 1371px) and (max-width: 1500px){
    .logo img {
        width: 250px;
    }
    .header-phone img {
        max-width: 250px;
    }
    .header-star img {
        max-width: 100px;
    }
    .header-star {
        margin-left: 20px;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1365px){
    .contactportfolioWrap a > img {
        max-width: 270px;
    }
    .header-star img {
        max-width: 100px;
    }
    .portfolio-video ul li{
        width: 48% !important;
    }
}

@media screen and (max-width:1199px){
    .modal-video-close-btn{right:0;}
    .service-details-inner img{max-width: 100% !important;}
    .header-right .mainmenunav ul.mainmenu > li {
        margin: 0;
    }
    h2,
    .h2 {
        font-size: 40px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px){
    .contactportfolioWrap a > img {
        max-width: 210px;
    }
    .header-star img {
        max-width: 100px;
    }
}

@media only screen and (max-width: 991px) {
    h2,
    .h2 {
        font-size: 35px;
    }
    .header-area .header-wrapper {
        padding: 0 0 20px;
    }
    header.header-area.header--transparent {
        padding-top: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid #dedede;
        margin-bottom: 0;
    }
    header.header-area.header--transparent ul.mainmenu {
        margin: 0;
        padding: 0;
        list-style: none;
        border: 1px solid #dadada;
        border-top: 0;
    }
    header.header-area.header--transparent ul.mainmenu li a{
        padding: 15px 20px;
        border-bottom: 1px solid #dadada;
        background-color: #f9f9f9;
        display: block;
        color: #333333;
        text-transform: uppercase;
    }
    
    header.header-area.header--transparent ul.mainmenu li:last-child a{
        border-bottom: 0;
    }



    .rn-service-area .row {
        flex-direction: column-reverse;
    }
    .rn-service-area .row .col-lg-5 {
        margin-top: 30px;
    }


    /* animation-explainer-video */
    .about-inner .section-title .portfolio-video ul li {
        width: 48%;
    }


}

@media only screen and (max-width: 767px) {
    h1,
    .h1 {
        font-size: 40px;
    }
    .content-style h1{
        font-size: 50px;
    }
    h2,
    .h2 {
        font-size: 30px;
    }
    h3,
    .h3 {
        font-size: 22px;
    }
    header.header-area.header--transparent {
        padding-left: 20px;
        padding-right: 20px;
    }
    .contact-detail-sec a.email-btn{
        font-size: 16px;
        padding: 8px 20px 8px 70px;
    }
    .contact-detail-sec .call-btn{
        min-width: 270px;
    }
    .contact-detail-sec .call-btn a{
        font-size: 16px;
    }


    .footernew .footer-left .inner img {
        max-width: 170px;
    }
    
    .footernew .footer-left .inner {
        text-align: center;
    }
    
    .footernew .footer-left {
        margin-bottom: 30px;
        gap: 20px;
    }
    
    .footercontactbtn img {
        max-width: 240px;
    }
    
    .footermailphonelinks {
        font-size: 16px;
        margin-top: 10px;
    }
    
    .footer-center {
        margin-bottom: 30px;
    }
    
    .footer-link ul.ft-link {
        text-align: center;
    }
    .copyright-text {
        padding-top: 20px;
    }
    .copyright-text p {
        font-size: 14px !important;
    }
    .footer-link ul.ft-link li a {
        font-size: 16px;
    }
    .header-star img {
        max-width: 100px;
    }

    /* animation-explainer-video */
    .desc-block h4 {
        font-size: 20px;
    }
    .about-inner .section-title .portfolio-video ul li {
        width: 100%;
    }
    .contact-us h3 {
        margin-bottom: 50px;
    }
    .contact-us {
        max-width: 100%;
        padding: 30px;
    }
    .contact-us-box {
        min-height: 600px;
        padding: 0 20px;
    }

}

@media only screen and (max-width: 575px){
    h1,
    .h1 {
        font-size: 30px;
    }
    .section-title h1.title {
        font-size: 30px;
    }
        .blog-style--1 .content .blog-btn {
        opacity: 1;
        visibility: visible;
    }
        .blog-style--1 .content .blog-btn {
        margin-top: 22px;
    }
        .blog-style--1 .content::before {
        opacity: 0;
    }
        .blog-style--1 .content .blog-btn {
        margin-top: 22px;
    }
        .blog-style--1 .content {
        padding: 30px 20px;
    }
        .blog-style--1 .content {
        bottom: 0;
    }
        .blog-style--1 .thumbnail a::after {
        opacity: 0.85;
        top: 0;
    }
        .container {
        width: 450px;
    }
    .header-star img {
        max-width: 70px;
    }
}
@media only screen and (max-width: 479px) {
    .container {
        width: auto;
        margin: 0 auto;
        padding: 0 15px;
    }

}
.g-recaptcha {
    transform: scale(0.77);
    -webkit-transform: scale(0.77);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
}
/*nitin 27-04-2022*/

/* jay 17-08-2022 */
.cnt-page {
    padding-bottom: 120px;
}
span.color-choice {
    color: #a63bbd;
    font-weight: 500;
    font-size: 18px;
    line-height: normal;
}
.mb-30 {
    margin-bottom: 30px;
    display: inline-block;
}
.desc-block.desk-list ul {
    list-style-type: none;
    padding: 0;
    margin-bottom: 0;
    margin-top: 20px;
}
.mt-20 {
    margin-top: 20px;
}
.mb-20 {
    margin-bottom: 20px;
}
.desc-block.desk-list ul li {
    position: relative;
    font-size: 18px;
    line-height: normal;
    padding-bottom: 10px;
    padding-left: 15px;
}

.desc-block.desk-list ul li:last-child {
    padding-bottom: 0;
}

.desc-block.desk-list ul li::before {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    background: #000;
    border-radius: 50px;
    position: absolute;
    top: 10px;
    left: 0;
}
.desc-block h3 {
    font-size: 25px;
    margin-bottom: 20px;
    display: inline-block;
}
b.big-fo {
    font-size: 30px;
    color: #000;
    line-height: normal;
}
p.bg-red {
    /* background: red; */
    color: rgba(29, 29, 36, 0.75);
    /* padding: 5px 10px; */
    font-weight: 700;
}
.cont-first {
    padding: 120px 0 40px 0;
}
.portfolio-video ul {
    display: flex;
    grid-column-gap: 24px;
    flex-wrap: wrap;
    padding: 0;
    margin-bottom: -30px;
}
.portfolio-video ul li {
    list-style-type: none;
    width: 49%;
    margin-bottom: 30px;
    position: relative;
    cursor: pointer;
}
.portfolio-video ul li .play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}
.portfolio-video ul li p.video-size video {
    min-height: 100%;
    height: 100%;
    object-fit: cover;
}
.portfolio-video ul li.slick-slide {
    margin: 0 15px;
}
.portfolio-video ul.slick-slider {
    margin: 0 -15px;
}
.portfolio-video {
    position: relative;
}
.portfolio-video button.slick-next {
    font-size: 0;
    border: 1px solid #858DA3;
    border-radius: 100%;
    background-image: url("../images/next.png");
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: center;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 50%;
    right: -100px;
    transform: translateY(-50%);
}
.portfolio-video button.slick-prev:hover {
    border: 1px solid #0096d1;
    background-color: #0096d1;
    background-image: url("../images/back-hover.png");
}
.portfolio-video button.slick-prev {
    font-size: 0;
    border: 1px solid #858DA3;
    border-radius: 100%;
    background-image: url("../images/back.png");
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: center;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -100px;
    transform: translateY(-50%);
    z-index: 1;
}
.portfolio-video button.slick-next:hover {
    border: 1px solid #0096d1;
    background-color: #0096d1;
    background-image: url("../images/next.png");
}
.header-star {
    margin-left: 15px;
}
/* video::-webkit-media-controls {
    display: none;
} */

.home-desktop-banner {
    position: relative;
    padding-bottom: 43%;
}
.home-desktop-banner img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.home-mobile-banner {
    display: none;
}


@media only screen and (max-width: 767px){
    .cnt-page {
    padding-bottom: 50px;
    margin-top: 0;
}
.cont-first {
    padding-bottom: 40px !important;
}
.portfolio-video button.slick-prev {
    left: 30%;
    top: auto;
    bottom: -25%;
}
.portfolio-video button.slick-next {
    right: 30%;
    top: auto;
    bottom: -25%;
}
.portfolio-video ul li {
    width: 100%;
    margin-bottom: 30px;
}
.portfolio-video ul li:last-child {
    margin-bottom: 0;
}
.portfolio-video {
    padding: 20px 0 0 0;
    margin-bottom: 50px;
}
.portfolio-video ul.slick-slider {
    margin: 0;
}
.portfolio-video ul li.slick-slide {
    margin: 0;
    height: 420px;
    object-fit: cover;
}
.banner-img {
    position: relative;
    padding-bottom: 45%;
}
.banner-img.mob-diff-img {
    padding-bottom: 74.4%;
    margin-bottom: 50px;
}
.banner-img.mob-diff-img img.mob-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.banner-img img {
    min-height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}
.animation-explainer-video-banner,
.why-choose-us-banner,
.trusted-brands-banner,
.video-production-thumbanail,
.get-in-touch,
.video-production-contact {
    margin-bottom: 40px;
}


.home-mobile-banner {
    display: block;
    position: relative;
    padding-bottom: 150%;
}
.home-mobile-banner img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.home-desktop-banner{
    display: none;
}

}

@media only screen and (min-width: 768px) and (max-width: 991px){
   .cnt-page {
    padding-bottom: 60px;
    margin-top: -30px;
}
.cont-first {
    padding-bottom: 40px !important;
}
.portfolio-video ul li {
    width: 100%;
    margin-bottom: 20px;
}
.portfolio-video ul {
    flex-wrap: wrap;
}
.portfolio-video ul li p.video-size video {
    min-height: 100% !important;
}

.portfolio-video {
    padding: 30px 0 0 0;
}
h1{
    font-size: 45px;
}


}

@media only screen and (min-width: 768px) and (max-width: 1024px){
    .portfolio-video button.slick-prev{
        left: 0;
    }
    .portfolio-video button.slick-next{
        right: 0;
    }
    .portfolio-video ul li p.video-size video {
        min-height: 100%;
        height: 100%;
        object-fit: cover;
    }
    .portfolio-video ul li{
        width: 48%;
    }
}
@media only screen and (min-width: 1025px) and (max-width: 1440px){
    .portfolio-video button.slick-prev{
        left: 0;
    }
    .portfolio-video button.slick-next{
        right: 0;
    }
}



.thank-you-mess h2 {
    color: #155724;
}
.get-in-touch-banner img {
    width: 100%;
}
.header-top-inner-img img{
    width: 100%;
}
body.video-production-page header {
    display: none;
}

.our-client-banner,
.contact-us-banner {
    position: relative;
    width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-top: 50px;
    margin-bottom: 50px;
}
.our-client-banner img,
.contact-us-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.production-tab p {
    text-align: left;
}
.production-tab{
    padding-bottom: 40px;
}

.production-tab-inner-video {
    position: relative;
    padding-bottom: 56.25%;
}

.production-tab-inner-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.production-tab-videos ul li {
    list-style-type: none;
}
.production-tab-videos ul {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 30px;
    padding: 0;
    margin-bottom: 0;
    padding: 0 20px;
}
.video-production-title-video .inner-title-video h1 {
    text-align: center;
}
.video-production-body-text {
    padding: 120px 0;
}
.video-production-title-video .inner-video {
    padding: 40px 0 0 0;
}
.video-production-tabs .production-tab h3 {
    text-align: center;
}
.video-production-title-video {
    padding-bottom: 60px;
}
.video-production-tabs {
    padding-bottom: 60px;
}
.video-production-tabs:last-child {
    padding-bottom: 0;
}
.video-production-tabs.explainer-video .production-tab {
    padding-bottom: 0;
}
.affa-panel .panel .panel-body ul {
    padding: 0;
    margin: 0;
}
.affa-panel .panel .panel-body ul li {
    list-style-type: none;
    font-size: 18px;
    line-height: 30px;
    color: #555;
    position: relative;
    padding-left: 15px;
}
.affa-panel .panel .panel-body ul li::before {
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 50px;
    background: #555;
    position: absolute;
    top: 12px;
    left: 0;
    transition: .5s;
}
.add-quick-quote-btn {
    margin-bottom: 40px;
}
.add-quick-quote-btn img {
    max-width: 300px;
    width: 100%;
}
.inner-add-quick-btn a {
    display: inline-block;
}
.inner-add-quick-btn {
    text-align: center;
}

.video-quote-modal .modal-dialog .modal-content .modal-header {padding: 0;text-align: center;justify-content: center;display: block;border: 0;position: relative;}
.video-quote-modal .modal-dialog .modal-content .modal-header h5 {
    text-transform: uppercase;
    font-size: 35px;
    line-height: 100%;
    color: #fff;
    padding-bottom: 30px;
}
.video-quote-modal .modal-dialog .modal-content {
    background-color: #ea3223;
    border: 0;
    border-radius: 0;
    padding: 50px 80px 30px;
}
.video-quote-modal .modal-dialog .modal-content .modal-header button.close {
    padding: 0;
    margin: 0;
    position: absolute;
    right: 10px;
    top: 0;
}
.video-quote-modal .modal-dialog {
    max-width: 800px;
}
.pop-form-block input[type="text"],
.pop-form-block input[type="email"],
.pop-form-block input[type="tel"] {
    background: #fff;
    border: 0;
    font-size: 16px;
    line-height: 100%;
    color: #000;
    height: unset;
    padding: 15px 20px;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
}
.pop-form-block textarea{
    background: #fff;
    border: 0;
    font-size: 16px;
    line-height: 100%;
    color: #000;
    height: 200px;
    padding: 15px 20px;
    display: inline-block;
    width: 100%;
    margin-bottom: 0;
    box-sizing: border-box;
}
.pop-form-block {
    margin-bottom: 20px;
}
.pop-form-block:last-child {
    margin-bottom: 0;
}
.pop-form-block input[type="submit"] {
    margin: 0;
    font-size: 20px;
    line-height: 100%;
    text-transform: uppercase;
    font-weight: 500;
    color: #fff;
    height: unset;
    border: 1px solid #fff;
    transition: .5s;
    width: auto;
    border-radius: 5px;
    padding: 10px 50px 10px 30px;
}
.pop-form-block.submit-btn span {
    background: #fff;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}
.pop-form-block.submit-btn span img {
    width: 100%;
    height: 100%;
    transition: .5s;
    padding: 3px;
}
.pop-form-block.submit-btn {
    text-align: center;
}
.inner-submit-btn {
    display: inline-block;
    position: relative;
}
.video-quote-modal .modal-dialog .modal-content .modal-body {
    padding: 0;
}
form#contactForm .success-message {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
    text-align: center;
    padding: 5px;
}
.pop-form-block input[type="text"]::-webkit-input-placeholder,
.pop-form-block input[type="email"]::-webkit-input-placeholder,
.pop-form-block input[type="tel"]::-webkit-input-placeholder,
.pop-form-block textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    font-size: 23px;
  }
  .pop-form-block input[type="text"]::-moz-placeholder,
  .pop-form-block input[type="email"]::-moz-placeholder
  .pop-form-block input[type="tel"]::-moz-placeholder
  .pop-form-block textarea::-moz-placeholder { /* Firefox 19+ */
    font-size: 23px;
  }
  .pop-form-block input[type="text"]:-ms-input-placeholder,
  .pop-form-block input[type="email"]:-ms-input-placeholder,
  .pop-form-block input[type="tel"]:-ms-input-placeholder,
  .pop-form-block textarea:-ms-input-placeholder { /* IE 10+ */
    font-size: 23px;
  }
  .pop-form-block input[type="text"]:-moz-placeholder,
  .pop-form-block input[type="email"]:-moz-placeholder,
  .pop-form-block input[type="tel"]:-moz-placeholder,
  .pop-form-block textarea:-moz-placeholder { /* Firefox 18- */
    font-size: 23px;
  }

@media only screen and (max-width: 1199px) {
    .production-tab-videos ul{
        grid-template-columns: repeat(2,1fr);
    }
}

@media only screen and (max-width: 991px) {
    .production-tab-videos ul{
        grid-template-columns: repeat(1,1fr);
    }
    .video-production-body-text {
        padding: 90px 0;
    }
}
@media only screen and (max-width: 767px) {
    .video-production-body-text {
        padding: 60px 0;
    }
    .video-quote-modal .modal-dialog .modal-content {
        padding: 30px 20px;
    }
    .video-quote-modal .modal-dialog .modal-content .modal-header h5 {
        font-size: 20px;
    }
    .video-quote-modal .modal-dialog .modal-content .modal-header button.close {
        right: 0;
        top: 0;
    }
}







/* 6-8-2024 */
.header-new-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.header-new-menu ul li {
    display: inline-block;
    padding: 0px 12px;
    margin: 0px !important;
}

.header-new-menu .mainmenunav ul.mainmenu > li > a {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
    color: #000;
    display: inline-block;
    transition: 0.5s;
    padding: 0px;
}

.header-new-menu .mainmenunav ul.mainmenu > li > a:hover {
    color:#ff0000;
}

.header-new-menu .mainmenunav ul.mainmenu > li:last-child a {
    padding:10px 15px;
    color: #fff;
    background-color: #ff0000;
}

.header-new-menu .mainmenunav ul.mainmenu > li:last-child a:hover {
    background-color: #000;
}

.header-new-menu .mainmenunav ul.mainmenu > li:last-child {
    padding-left: 30px;
    padding-right: 0px;
}

.header-new-menu .logo a {
    display: inline-block;
    position: relative;
    z-index: 9;
}

.header-new-menu .logo img {
    width: 300px;
}

.header-area.header--transparent.default-color {
    background-color: #fff;
    position: relative;
    z-index: 99;
}

/* .contact-menu-disabel {
    display: none !important;
} */

@media only screen and (max-width: 1199px) {
    .header-new-menu ul li {
        padding: 0px 10px;
    }
    .header-new-menu .mainmenunav ul.mainmenu > li:last-child {
        padding-left: 20px;
        padding-right: 0px;
    }
}

@media only screen and (max-width:991px){
    .header-area .header-wrapper{
        justify-content: center;
    }
}




/* footer new css */

.footer-top {
    background-color: #ececee;
    padding: 5px 0px;
}
.footer-info .footermailphonelinks {
    font-size: 17px;
}
.footer-info .footermailphonelinks > div:last-child {
    padding-right: 0px;
} 
.footer-wrapper .row > div:nth-child(2) img {
    width: 250px;
    margin-top: 20px;
}
.social-icon ul {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.social-icon ul li {
    list-style-type: none;
}

.social-icon ul li a {
    width: 50px;
    height: 50px;
    display: inline-block;
}

.social-icon ul li a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0) saturate(100%) invert(99%) sepia(92%) saturate(0%) hue-rotate(148deg) brightness(110%) contrast(100%);
}

.social-icon {
    padding-top: 20px;
}
.footer-info-img {
    text-align: center;
}

.footer-info .copyright-text {
    margin-top: 20px;
}

.footer-link ul li {
    position: relative;
    padding-left: 20px;
}

.footer-link ul li:last-child a {
    text-transform: capitalize;
}

.footer-link ul li:before {
    content: "";
    font-size: 16px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background-image: url(../images/footer-star-icon.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 8px;
    height: 8px;
}

.footer-link {
    margin-left: 20%;
}
@media (max-width:1399px)  {
    .footer-link {
        margin-left: 10%;
    }
}
@media (max-width:1199px) { 
    .footer-wrapper .row > div:nth-child(2) img {
        margin-top: 0px;
    }
    .footer-link {
        margin-left: 0px;
    }
}
@media (max-width:991px) {
    .footer-info .copyright-text {
        margin-top: 0px;
    }
    .footer-info {
        margin-bottom: 30px;
    }
    .footer-link ul.ft-link {
        text-align: left;
    }

    .footer-info-img {
        text-align: left;
    }
    .footermailphonelinks {
        justify-content: start;
    }
    .copyright-text {
        text-align: left;
    }
    .footer-wrapper .row > div:nth-child(2) img , .footer-info-img img {
        width: 180px;
    }

}

@media (max-width:767px) {
    .footer-info-img img {
        width: 250px;
    }
}

@media (max-width:575px) {
    .footer-wrapper .row > div:nth-child(2) img , .footer-info-img img {
        width: 100%;
    }
}



.production-tab ul {
    list-style: disc;
    margin: 0;
    padding: 0;
    padding-left: 20px;
    font-size: 16px;
}
.desc-block ul{
    list-style: disc;
    padding: 0;
    padding-left: 20px;
    font-size: 16px;
}
.production-tab ul li , .desc-block ul li {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 30px;
}

.production-tab ul li:last-child , .desc-block ul li:last-child {
    margin-bottom: 0px;
}

@media (max-width:1399px) {
    .video-production-tabs {
        padding-bottom:40px;
    }
}


/* further information page css */
.further-information-main {
    padding: 120px 0px;
}
.further-information-box a {
    display: block !important;
    width: 100%;
}
.mt-50 {
    margin-top: 50px;
}
.mobile-contact-bannr-img {
    display: none;
}

@media (max-width:767px) {
    .mobile-contact-bannr-img {
        display: block;
    }
    .social-icon {
        padding-bottom: 40px;
    }
}



/* accordian css */
#tabs {
    /* padding: 50px 0px; */
    padding-bottom: 50px;
}

.affa-panel .panel .panel-heading h4 {
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    margin: 0;
}

.affa-panel .panel .panel-heading h4 a {
    display: block;
    position: relative;
    color: #FFF;
    background-color: #2b8dd6;
    padding: 17px 30px 17px 70px;
}

.affa-panel .panel .panel-heading h4 a.collapsed {
    /* color: rgba(255,255,255,.7);
    background-color: #253c58; */
    color: #1f1f25;
    background-color: #ececee;
}

.affa-panel .panel:first-child .panel-heading h4 a {
    border-radius: 4px 4px 0 0;
}
#tabs .container {
    padding: 0;
}
.affa-panel .panel .panel-heading h4 a:before {
    position: absolute;
    left: 30px;
    top: 17px;
    font-size: 24px;
    line-height: 1;
    content: '\2013';
}

.affa-panel .panel .panel-heading h4 a.collapsed:before {
    content: '+';
}

.affa-panel .panel .panel-body {
    color: #555;
    background-color: #FFF;
    padding: 30px 30px 20px;
    border: 1px solid #EEE;
    border-top: 0;
    border-bottom-width: 0;
}

.affa-panel .panel .panel-heading h4 a {
    display: block;
    position: relative;
    color: #FFF;
    /* background-color: #2b8dd6; */
    background-color: #ea1404;
    /* background-color: #0025f0; */
    padding: 17px 30px 17px 70px;
}

.affa-panel .panel:first-child .panel-heading h4 a {
    border-radius: 4px 4px 0 0;
}


@media (max-width: 767px) {

    .affa-panel .panel .panel-heading h4 a {
        padding-right: 20px;
        padding-left: 50px;
    }

    .affa-panel .panel .panel-heading h4 a:before {
        left: 20px;
    }

}