@charset "utf-8";
 
/** 
* 
* -----------------------------------------------------------------------------
*
* Template : Braintech - Technology & IT Solutions HTML Template
* Author : rs-theme
* Author URI : http://www.rstheme.com/ 
*
* -----------------------------------------------------------------------------
* 
**/   
 
/* TABLE OF CONTENT
---------------------------------------------------------
    01. General CSS
    02. Global Class CSS
    03. Header Section CSS
    04. Sticky Menu CSS
    05. About Section CSS
    06. Banner Section CSS
    07. Breadcrumbs Section CSS
    08. Slider Section CSS    
    09. Video Section CSS
    10. Faq Section CSS
    11. Counter Section CSS
    12. Contact Section CSS
    13. Cta Section CSS
    14. Skill-bar Section CSS
    15. Choose Section CSS
    16. Team Section CSS
    17. Services Section CSS
    18. Process Section CSS
    19. Pricing Section CSS
    20. Technology Section CSS
    21. Industry Section CSS
    22. Project Section CSS
    23. Progress Section CSS
    24. Case Study Section CSS
    25. Blog Section CSS
    26. Features Section CSS
    27. Call Action Section CSS
    28. Partner Section CSS
    29. Testimonial Section CSS
    30. Shop Section CSS
    31. Single Shop Section CSS
    32. Cart Section CSS
    33. Checkout Section CSS
    34. Account Section CSS
    35. Footer Section CSS
    36. Error Page CSS
    37. Scroll Up CSS
    38. Preloader CSS
    39. Animation Part CSS



--------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Livvic:ital,wght@0,300;0,400;0,500;0,600;0,700;0,900;1,400&display=swap');
@body-font:         'Livvic', sans-serif;
@title-font:        'Livvic', sans-serif;
@transition:        all .3s ease;
@primary-color:     #106EEA;
@secondary-color:   #03228f;
@orange-color:      #f2541b;
@orange-color2:     #FF7045;
@title-color:       #101010;
@title-color2:      #0a0a0a;
@title-color3:      #102B3E;
@white-color:       #ffffff;
@body-color:        #454545;
@body-color2:       #363636;



/* -----------------------------------
    01. General CSS
-------------------------------------*/
html,
body {
  font-size: 16px;
  color: @body-color;
  font-family: @body-font;
  vertical-align: baseline;
  line-height: 26px;
  font-weight: 400;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}
p {
  margin: 0 0 26px;
  line-height: 1.8;
} 
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: @title-font;
  color: @title-color;
  margin: 0 0 26px;
  line-height: 1.2;
}
h1 {
  font-size: 70px;
  font-weight: 700;
}
h2 {
  font-size: 36px;
  font-weight: 700;
}
h3 {
  font-size: 28px;
  font-weight: 700;
}
h4 {
  font-size: 24px;
  font-weight: 700;
}
h5 {
  font-size: 18px;
  font-weight: 700;
}
h6 {
  font-size: 16px;
  font-weight: 700;
}
.pb-230{
    padding-bottom: 230px;
}
.pb-435{
    padding-bottom: 435px;
}
.pr-220 {
    padding-right: 220px;
}

.offwrap {
    cursor: url(assets/images/close.png), auto;
    width: 100%;
    left: 100%;
    transition: all 0.8s ease-out 0s;
    position: fixed;
    background: rgba(255, 255, 255, 0.3);
    height: 100vh;
    top: 0;
    bottom: 0;
    z-index: 999;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
.home11{
    background: #000000;
}

body.nav-expanded .offwrap {
    left: 0%;
    transition: all 0.8s ease-out 0s;
}
.home-style2 {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
      color: @title-color2;
    }
}

.no-border{
    border: none !important;
}.uppercase{
    text-transform: uppercase !important;
}
.capitalize{
    text-transform: capitalize !important;
}
.bold-text {
    font-size: 20px;
    font-weight: bold;
    font-family: @title-font;
}
.extra-bold {
    font-weight: 800 !important;
}
.gray-color{
    background-color: #F6F7F9;
}
.gray-bg2{
    background: #f7f9ff;
}
.gray-bg3{
    background: #F5F6FE;
}
.black-dark{
    background: #131313 !important;
}
.gray-color-important{
    background-color: #F6F7F9 !important;
}
.primary-background{
    background-color: @primary-color;
}
.white-bg{
    background: @white-color;
}
.white-color{
    color: @white-color !important;
}
.pt-255{
    padding-top: 255px;
}
.pb-390{
    padding-bottom: 390px;
}
.md-pt-215{
    padding-top: 215px;
}
.pb-215{
    padding-bottom: 215px;
}
.rs-call-us{
    .image-part{
        img{
            max-height: 585px;
        }
    }
}
.text-right {
    text-align: right;
}

a {
    color: @primary-color;
    transition: @transition;
    text-decoration: none !important;
    outline: none !important;
}
a:active,
a:hover {
    text-decoration: none;
    outline: 0 none;
    color: @primary-color;
}
ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.clear {
    clear: both;
}
::-moz-selection {
    background: @primary-color;
    text-shadow: none;
    color: #ffffff;
}
::selection {
    background: @primary-color;
    text-shadow: none;
    color: #ffffff;
}

.bg1 {
    background: url(assets/images/bg/testimonial-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #000060;
}
.bg2 {
    background: url(assets/images/bg/counter-bg.png);
    background-color: #fff;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: -1px 21px 25px 0px rgba(0, 0, 0, 0.12);
    border-radius: 10px 10px 10px 10px;
    padding: 40px 40px 40px 40px;
    z-index: 10;
    
}
.bg3 {
    background: url(assets/images/bg/process-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #03228F;
    margin: 0px 31px 0px 0px;
    padding: 80px 40px 75px 40px;
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    border-radius: 10px 10px 10px 10px;
}
.bg4 {
    background: url(assets/images/bg/about-2.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.bg5{
    background: url(assets/images/bg/project-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-color: #000060;
}
.bg6{
    background: url(assets/images/bg/project-bg.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-color: #000060;
}
.bg7{
    background: url(assets/images/bg/cta-bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.bg8{
    background: url(assets/images/bg/call-action.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.bg9{
    background: url(assets/images/bg/work-bg.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    padding: 100px 60px 100px 50px;
    border-radius: 10px 10px 10px 10px;
}
.bg10{
    background: url(assets/images/bg/testi-home7.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    padding: 100px 90px 100px 90px;
    border-radius: 5px 5px 5px 5px;
}
.bg11{
    background: url(assets/images/bg/index-bg.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    background-color: #0C54B8;
}
.bg12{
    background: url(assets/images/bg/case-study.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    padding: 110px 160px 185px 90px;
    &.mod {
        padding: 113px 160px 194px 90px;
    }
}
.bg13{
    background: url(assets/images/bg/services-bg.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}
.bg14{
    background: url(assets/images/bg/choose-bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.bg15{
    background: url(assets/images/bg/steps-area.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-color: #F3F7FF;
}
.bg16{
    background: url(assets/images/bg/tech-bg.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-color: #020E38;
}
.bg17{
    background: url(assets/images/bg/call-to-action2.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.bg18{
    background: url(assets/images/bg/shape-bg2.png);
    background-repeat: no-repeat;
    background-size: cover;
}
.bg19{
    background: url(assets/images/bg/3counter-.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    padding: 80px 60px 70px 60px;
}
.bg20{
    background: url(assets/images/bg/services-bg-shape.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.bg21{
    background: url(assets/images/bg/home13/counter-bg.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.bg22{
    background: url(assets/images/bg/testi12-bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.bg23{
    background: url(assets/images/bg/call-action3.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.bg24{
    background: url(assets/images/bg/cta-bg13.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.bg25{
    background: url(assets/images/bg/skill-bg16.jpg);
    background-position: center left;
    background-repeat: no-repeat;
    background-size: cover;
}
.bg26{
    background: url(assets/images/bg/service-bg16.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.bg27{
    background: url(assets/images/bg/counter-bg16.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0px 460px 0px;
}
.bg28{
    background: url(assets/images/bg/testi-bg16.jpg);
    background-position: center right;
    background-repeat: no-repeat;
}
.bg29{
    background: url(assets/images/bg/cta-bg16.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.bg30{
    background: url(assets/images/bg/counter-bg16.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.rs-step{
    background: url(assets/images/bg/steps-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 10px 10px 10px 10px;
    padding: 258px 0;

}

.shape-part{
    .right-side,
    .left-side{
        position: absolute;
        bottom: 0px;
        left: 0;
    }
    .right-side{
        left: auto;
        right: 0;
    }
}

.bg-unset{
    background: unset !important;
}
.rs-menu-toggle{
    color: @primary-color;
    text-align: right;
}
button{
    cursor: pointer;
}
.glyph-icon:before{
    margin: 0;
}
.z-index-1{
    position: relative;
    z-index: 1;
}
ul.services-list{
    li{
        a{
            display: block;
            border: 2px solid #e8e8e8;
            padding: 16px 18px;
            transition: all .5s ease;
            border-radius: 5px;
            position: relative;
            font-size: 16px;
            font-weight: 700;
            color: @title-color;
            margin-bottom: 15px;
            &:before{
                content: "\f113";
                position: absolute;
                right: 12px;
                top: 16px;
                font-family: Flaticon;
                color: #1c1b1b;
            }
            &:hover,
            &.active {
                background-image: linear-gradient(250deg, #1273eb 19%, #03228f 100%);
                color: #ffffff;
                border-radius: 5px;
                border-color: #1273eb;
                &:before{
                    color: @white-color;
                }
            }
        }
    }
}
ul.listing-style {
    li {
        margin-bottom: 7px;
        i{
            color: #03228F;
            font-size: 24px;
            line-height: 31px;
            margin-right: 10px;
        }
    }
}
ul.rs-features-list{
    li{
        margin: 0px 0px 21px 0px;
        i{
            color: #fff;
            background-color: transparent;
            background-image: linear-gradient(180deg, #DD4C23 0%, #F27C1E 100%);
            padding: 10px 10px 10px 10px;
            margin: 0px 20px 0px 0px;
            border-radius: 50px 50px 50px 50px;
        }
        span{
            color: #575757;
            font-size: 18px;
            font-weight: 600;
            text-decoration: underline;
            &:hover{
                color: #FC4F29;
            }
        }
    }
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none !important;
}


.pagination-part{
    display: inline-block;
    border: 1px solid #f9f9f9;
    padding: 11px 0;
    border-radius: 3px;
    box-shadow: 0 0 30px rgba(0,0,0,.05);
    background: #fff;
    li{
        padding: 2px 20px 0 21px;
        line-height: 23px;
        font-size: 18px;
        text-decoration: none;
        transition: all .4s ease-in-out 0s;
        text-align: center;
        background: 0 0;
        color: #000;
        display: inline-block;
        vertical-align: top;
        border-right: 1px solid #e6e6e6;
        a{
            color: @body-color;
        }
        &:last-child{
            border-right: unset;
        }
    }
    .next-page{
        position: relative;
        transition: all .4s ease-in-out 0s;
        padding-right: 12px;
        &:before, &:after {
            content: "\f105";
            position: absolute;
            top: 6px;
            right: 0;
            color: @body-color;
            line-height: 16px;
            font-family: fontawesome;
            font-size: 12px;
        }
        &:before {
            right: 4px;
        }            
    }
    .active{
        a{
            color: @primary-color;
        }
    }
}

.gridFilter {
    button {
        font-size: 16px;
        background: 0 0!important;
        color: #0a0a0a;
        display: inline-block;
        transition: .4s;
        outline: 0;
        -webkit-transition: .4s;
        -ms-transition: .4s;
        position: relative;
        padding: 5px 20px;
        border-radius: 30px;
        border: 0;
        border-radius: 3px;
        &.active {
            background: #fff;
            color: #ff5421;
            box-shadow: 0 0 30px #eee;
        }
        + button {
            margin-left: 20px;
        }
    }
}

blockquote {
    margin: 35px 0px;
    padding: 40px 60px;
    color: #666;
    position: relative;
    background: rgba(0, 0, 0, 0.01);
    font-weight: normal;
    font-style: italic;
    text-align: left;
    clear: both;
    font-weight: 400;
    border-radius: 8px;
    &:before{
        content: "\f129";
        font-size: 35px;
        color: #0b70e1;
        padding-bottom: 0;
        display: inline-block;
        font-family: flaticon;
        font-weight: 400;
        text-align: center;
        top: 0;
        background: 0 0;
        transform: rotate(180deg);
    }
    cite{
        font-size: 15px;
        display: block;
        margin-top: 10px;
        &:before{
            content: "";
            font-size: 28px;
            color: #ff5421;
            padding-bottom: 0px;
            display: inline-block;
            background: #0b70e1;
            height: 2px;
            width: 40px;
            font-weight: 400;
            text-align: center;
            top: -4px;
            margin-right: 10px;
            position: relative;
        }
    }
}
.dots{
    list-style: disc;
    margin: 0 0 1.5em 3em;
}

.arrow-btn {
    position: absolute;
    top: 90%;
    left: 50%;
    transform: translate(-50%, -15%);
    a {
        font-weight: 400;
        font-size: 17px;
        border-color: @orange-color;
        border-style: solid;
        border-width: 1px;
        margin: 0px;
        border-radius: 23px;
        padding: 12px 15px;
        color: @orange-color;
        span{
            position: absolute;
            display: block;
            top: 50%;
            left: 50%;
            width: 8px;
            height: 8px;
            margin: -4px 0 0 -4px;
            border-radius: 50%;
            background: @orange-color;
        }                   
    }
}

.rs-carousel {
    &.nav-style1 {
        position: relative;
        .owl-nav {
            display: block;
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                width: 42px;
                height: 42px;
                line-height: 42px;
                border-radius: 50%;
                background: @primary-color;
                text-align: center;
                color: @white-color;
                transition: all 0.5s;
                transition-delay: 0.70s;
                opacity: 0;
                visibility: hidden;
                i {
                    &:before {
                        content: "\f138";
                        font-family: Flaticon;
                    }
                }
            }
            .owl-next {
                right: 30px;
                left: unset;
                i {
                    &:before {
                        content: "\f137";
                    }
                }
            }
        }
        &:hover {
            .owl-nav {
                .owl-next,
                .owl-prev {
                    left: -50px;
                    transition-delay: 0s;
                    visibility: visible;
                    opacity: 1;
                }
                .owl-next {
                    right: -50px;
                    left: unset;
                }
            }
        }
    }
    &.nav-style2 {
        position: relative;
        .owl-nav {
            display: block;
            position: absolute;
            top: -80px;
            right: 0;
            .owl-prev,
            .owl-next {
                display: inline-block;
                i {
                    transition: @transition;
                    &:before {
                        font-family: Flaticon;
                        font-size: 22px;
                    }
                }
                &:hover {
                    i {
                        color: @primary-color;
                    }
                }
            }
            .owl-prev {
                i {
                    &:before {
                        content: "\f134";
                    }
                }
                &:after {
                    content: "/";
                    padding: 0 5px 0 5px;
                    position: relative;
                    top: -3px;
                }
            }
            .owl-next {
                i {
                    &:before {
                        content: "\f133";
                    }
                }
            }
        }
    }
    .owl-dots {
        text-align: center;
        margin: 40px auto 0;
        line-height: 15px;
        display: block;
        .owl-dot {
            width: 30px;
            height: 10px;
            display: inline-block;
            margin: 0 6px;
            padding: 3px 0;
            border-radius: 30px;
            border: 1px solid @primary-color;
            background: transparent;
            opacity: 0.7;
            cursor: pointer;
            &:hover {
                background: @primary-color;
            }
        }
        .active {
            background: @primary-color;
            opacity: 1;
        }
    }
} 

/* ------------------------------------
    02. Global Class CSS
---------------------------------------*/
.y-middle {
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;
   -ms-flex-wrap: wrap;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
   -ms-flex-align: center;
   -webkit-align-items: center;
   align-items: center;
}
.y-bottom {
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;
   -ms-flex-wrap: wrap;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
   -ms-flex-align: flex-end;
   -webkit-align-items: flex-end;
   align-items: flex-end;
}
.project-item .vertical-middle {
    position: relative;
    z-index: 9;
}
.vertical-middle {
    display: table;
    height: 100%;
    width: 100%;
}
.vertical-middle-cell {
    display: table-cell;
    vertical-align: middle;
}

.readon {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: all 0.4s;
    z-index: 1;
    background-color: transparent;
    &.learn-more{
        padding: 14px 40px 14px 40px;
        background-image: linear-gradient(250deg, #4E95ED 19%, #03228F 100%);
        border-radius: 30px 30px 30px 30px;
        &:hover{
            background-image: linear-gradient(180deg, #03228F 19%, #4E95ED 100%);
            color: @white-color;
        }
        &.sub-con{
            background-image: linear-gradient(250deg, #4E95ED 0%, #03228F 100%);
            padding: 18px 36px 16px 36px;
            font-size: 14px;
            font-weight: 500;
            &:hover{
                background-image: linear-gradient(250deg, #03228F 0%, #4E95ED 100%);
                color: @white-color;
            }
        }
        &.submit{
            background-image: linear-gradient(90deg, #03228F 0%, #4E95ED 100%);
            padding: 16px 40px 16px 40px;
            font-weight: 500;
            font-size: 16px;
            &:hover{
                background-image: linear-gradient(200deg, #03228F 0%, #4E95ED 100%);
                color: @white-color;
            }
        }
       
        &.post{
            background-image: linear-gradient(50deg, #03228f 10%, #0e73e4 100%);
            padding: 12px 30px;
            font-size: 14px;
            font-weight: 500;
            &:hover{
                background-image: linear-gradient(50deg, #0e73e4 10%, #03228f 100%);
                color: #fff;
            }
        }
        &.pdf{
            i{
                margin-left: 10px;
            }
        }
        &.contact-us{
            border-radius: 8px 8px 8px 8px !important;
        }
        &.learn-btn{
            background-image: linear-gradient(90deg, #03228F 0%, #1D62F0 100%);
            border-radius: 3px 3px 3px 3px !important;
            &:hover{
                background-image: linear-gradient(180deg, #03228F 19%, #4E95ED 100%);
            }
        }
        &.slider-btn{
            background: @white-color;
            color: @primary-color;
            padding: 15px 37px;
            border-radius: 8px 8px 8px 8px !important;
            &:hover{
                background-image: linear-gradient(250deg, #4E95ED 19%, #03228F 100%);
                color: @white-color;
            }
        }
    }
    &.started{
        padding: 14px 40px 14px 40px;
        background-image: linear-gradient(220deg, #F27C1E 0%, #DD4C23 79%);
        border-radius: 30px 30px 30px 30px;
        &:hover{
            background-image: linear-gradient(180deg, #DD4C23 19%, #F27C1E 100%);
            color: @white-color;
        }      
        &.get-new{
            &:hover{
                background: rgba(0, 0, 0, 0) linear-gradient(79deg, rgb(221, 76, 35) 
                0%, rgb(242, 124, 30) 63%, rgb(242, 124, 30));
            }
        }
        &.get-ready{
            background-image: linear-gradient( 90deg,#03228f 0,#0e73e4 100%);
            border-radius: 3px;
            text-transform: uppercase;
            &:hover{
                opacity: 0.9;
            }
        }
        &.get-ready2{
            border-radius: 5px 5px 5px 5px;
        } 
        &.get-ready3{
            border-radius: 5px 5px 5px 5px;
            text-transform: uppercase;
            font-weight: 500;
        }
        &.get-ready4{
            background-image: linear-gradient( 80deg , #6E71DB 0%, #9C9FF9 100%);
            padding: 18px 40px 18px 40px;
            font-size: 16px;
            font-weight: 600;
            text-transform: uppercase;
            border-radius: 3px 3px 3px 3px;
            &:hover{
                background-image: linear-gradient( 120deg , #9C9FF9 0%, #6E71DB 100%);
            }
        }
        &.get-ready5{
            background-image: linear-gradient( 250deg , #F18E27 19%, #F14D1A 100%);
            text-transform: uppercase;
            border-radius: 5px 5px 5px 5px;
            &:hover{
                background-image: linear-gradient( 270deg , #F14D1A 20%, #F18E27 100%);
            }
        }
        &.more{
            background-image: linear-gradient( 250deg , #B22AF3 19%, #1742FD 100%);
            color: @white-color;
            text-transform: uppercase;
            border-radius: 5px 5px 5px 5px;
            &:hover{
                background-color: transparent;
                background-image: linear-gradient( 270deg , #1742FD 20%, #B22AF3 100%);
            }
        }

    }
    &.lets-talk{
        padding: 14px 40px 14px 40px;
        background-image: linear-gradient(250deg, #4E95ED 19%, #03228F 100%);
        border-radius: 30px 30px 30px 30px;
        &:hover{
            background-image: linear-gradient(180deg, #03228F 19%, #4E95ED 100%);
            color: @white-color;
        }
    }
    &.buy-now{
        padding: 10px 40px 10px 40px;
        background-image: linear-gradient(170deg, #03228F 0%, #4E95ED 100%);
        border-radius: 30px 30px 30px 30px;
        text-transform: uppercase;
        position: relative;
        top: 25px;
       &:hover{
            background-image: linear-gradient(360deg, #03228F 0%, #4E95ED 100%);
            color: @white-color;
        }
        &.get-in{
            padding: 15px 34px;
            border: 1px solid #fff;
            color: @white-color;
            background: transparent;
            &:hover{
                background: #03228F;
                color: @white-color;
                border: 1px solid #03228F;
            }
        }
        &.table-btn{
            background-image: linear-gradient(90deg, #032390 0%, #032390 100%);
            color: @white-color;
            border-radius: 3px 3px 3px 3px;
            font-weight: 500;
            &:hover{
                background-image: linear-gradient(90deg, #0D6ADA 0%, #0D6ADA 100%);
            }
        }
        &.sl-btn{
            background: rgba(0, 0, 0, 0) linear-gradient(90deg, rgb(3, 34, 143) 0%, rgb(29, 98, 240) 100%);
            color: @white-color;
            border-radius: 4px;
            font-weight: 500;
            font-size: 18px;
            text-transform: capitalize;
            padding: 17px 28px;
            &:hover{
                background-image: linear-gradient(90deg, #0D6ADA 0%, #0D6ADA 100%);
            }
        }
        &.price{
            background-image: linear-gradient(170deg, #03228F 0%, #4E95ED 100%);
            border-radius: 8px 8px 8px 8px;
            &:hover{
                background-image: linear-gradient(200deg, #03228F 0%, #4E95ED 100%);
            }
        }
        &.pricing{
            &:hover{
               background-image: linear-gradient(170deg, #03228F 0%, #4E95ED 100%);
                color: @white-color;
            }
        }

    }
    &.view-more{
        padding: 12px 25px 12px 25px;
        font-size: 14px;
        font-weight: 500;
        text-transform: uppercase;
        color: #111111;
        background-color: #FFFFFF;
        border-radius: 30px 30px 30px 30px;
    }
    &.discover{
        font-size: 16px;
        font-weight: 500;
        color: #032491;
        padding: 17px 30px 17px 30px;
        background: transparent;
        background-image: linear-gradient(90deg, #FFFFFF 19%, #FFFFFF 100%);
        border-radius: 4px 4px 4px 4px;
        &.started{
            padding: 16px 30px 16px 30px;
            &:hover{
                background-image: linear-gradient(90deg, #F6F7F9 19%, #F6F7F9 100%);
                color: #032491;
            }
        }
        &:hover{
            background-image: linear-gradient(90deg, #F6F7F9 19%, #F6F7F9 100%);
        }
    
        &.more{
            background-image: linear-gradient(90deg, #032491 19%, #032491 100%);
            padding: 16px 30px 16px 30px;
            color: @white-color;
            &:hover{
                background-image: linear-gradient(90deg, #0D6ADA 19%, #0D6ADA 100%);
                color: @white-color;
            }
        }
    }
    &.qoute-btn{
        font-size: 16px;     
        padding: 15px 32px;
        border-radius: 3px;
        color: #fff;
        font-weight: 500;
        text-transform: uppercase;
        color: @title-color;
        border: 1px solid @orange-color;
        background: transparent;
        &:hover{
            color: @white-color;
            background-image: linear-gradient( 150deg , #dd4c23 19%, #f27c1e 100%);
        }
    }
    &.reply{
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
        padding: 3px 20px 6px;
        line-height: 22px;
        border-radius: 30px;
        font-size: 13px;
        font-weight: 500;
        color: #ffffff !important;
        background-image: linear-gradient(50deg, #03228f 10%, #0e73e4 100%);
        z-index: 1;
        border: none;
        &:hover{
            background-image: linear-gradient(50deg, #0e73e4 10%, #03228f 100%);
            color: #ffffff;
            opacity: 0.99;
        }
    }
    &.more-about{
        font-size: 16px;
        font-weight: 600;
        text-transform: uppercase;
        padding: 16px 47px 16px 30px;
        color: @white-color;
        background-color: transparent;
        background-image: linear-gradient( 110deg , #6E71DB 0%, #9C9FF9 100%);
        border-radius: 3px 3px 3px 3px;
        &:before{
            content: "\f113";
            position: absolute;
            font-family: flaticon;
            font-size: 10px;
            top: 17px;
            right: 24px;
            transition: all 0.3s;
            color: #fff;
        }
        &:hover{
            background-color: transparent;
            background-image: linear-gradient( 240deg , #6E71DB 0%, #9C9FF9 100%);
        }
    }
}
/*-- Services Button Css --*/
.services-button{
   a{
        position: relative;
        display: inline-block;
        transition: all ease .3s;
        padding: 18px 0px 0px 0px;
        font-size: 16px;
        font-weight: 500;
        color: #101010;
        &:after{
            content: "\f113";
            font-family: Flaticon;
            font-size: 10px;
            position: relative;
            right: 0;
            top: 0;
            display: inline-block;
            margin-left: 15px;
            transition: all ease .4s;
            color: @title-color;
        }
    }
}

/*-- Services-btn--*/
.services-btn2{
    a{
        position: relative;
        display: inline-block;
        transition: all ease .3s;
        font-weight: 500;
        color: #032390;
        &:after{
            position: absolute;
            width: 30px;
            height: 1px;
            background: #0b70e1;
            content: '';
            top: 50%;
            transform: translateY(-50%);
            right: 0px;
            transition: 0.4s;
            opacity: 0;
        }
        &:hover{
            &:after{
                right: -40px;
                opacity: 1;
            }
        }
    }
}

/*-- Services-btn--*/
.services-btn3{
    a{
        position: relative;
        color: @title-color;
        display: inline-block;
        transition: all 0.9s ease;
        text-decoration: underline !important;
        &:after{
            position: absolute;
            right: 0;
            top: 50%;
            font-size: 15px;
            font-weight: 500;
            color: @orange-color;
            font-family: "Flaticon";
            transform: translateY(-50%);
            transition: all 0.2s ease;
        }
        &:hover{
            color: @orange-color;
            &:after{
                right: -28px;
                content: "\f110";
                transition: all 0.9s ease;
            }
        }
    }
}

/*-- Blog Button Css --*/
.blog-button{
    a{
        position: relative;
        display: inline-block;
        color: #061340;
        font-size: 16px;
        font-weight: 600;
        transition: all ease .4s;
        &:after{
            content: "\f113";
            font-family: Flaticon;
            font-size: 8px;
            position: relative;
            right: 0;
            top: 0;
            display: inline-block;
            margin-left: 8px;
            transition: all ease .4s;
            color: @title-color;
        }
        &:hover{
            color: @primary-color;
            &:after{
                transform: translateX(10px);
                color: @primary-color;
            }
        }
    }
    &.style2{
        a{
         
            &:hover{
                color: #FF5600;
                &:after{
                    color: #FF5600;
                }
            }
        }
    }
    &.style3{
        a{
            color: #061340;
            &:hover{
                color: #787cf2;
                &:after{
                    color: #787cf2;
                }
            }
        }
    }
    &.inner-blog{
        a{
            text-align: center;
            display: inline-block;
            color: #0b70e1;
            padding-right: 25px;
            position: relative;
            z-index: 1;
            font-family: 'Livvic', sans-serif;
            font-weight: 500;
            font-size: 15px;
            transition: all 0.3s;
            &:after{
                content: "\f114";
                position: absolute;
                font-family: flaticon;
                font-size: 15px;
                top: 1px;
                right: 0;
                opacity: 1;
                transition: all 0.3s;
                color: #0b70e1;
            }
            &:hover{
                color: #0B70E1;
                &:after{
                   right: -5px;
                   opacity: 1;
                   transform: unset;
                }
            }
        }
    }
}

/*-- Submit Button Css --*/
.submit-btn{
    box-shadow: 0 28px 50px 0 rgba(0,0,0,.05);
    outline: 0;
    border: none;
    padding: 18px 18px 18px 18px;
    border-radius: 3px;
    font-size: 16px;
    display: inline-block;
    text-transform: capitalize;
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
    color: #fff;
    background-image: linear-gradient(160deg, #03228F 0%, #0B70E1 77%);
    transition: all .3s ease;
    position: relative;
    overflow: hidden;
    width: 100%;
    cursor: pointer;
    &:hover{
        opacity: 0.9;
    }
    &.orange-btn{
        background-image: linear-gradient(160deg, #F27C1E 0%, #DD4C23 79%);
    }
}
.submit{
    color: #FFFFFF;
    background-color: transparent;
    background-image: linear-gradient(95deg, #03228F 0%, #4E95ED 100%);
    padding: 18px 40px 17px 40px;
    font-size: 15px;
    line-height: 1;
    border-radius: 30px 30px 30px 30px;
    border: none;
    &:hover{
        opacity: 0.99;
    }
    &.sub-small{
        padding: 17px 40px 17px 40px;
        &:hover{
            color: @white-color;
            background-image: linear-gradient(290deg, #03228F 0%, #4E95ED 100%);
            opacity: unset;
        }
    }
}

/*-- Add Cart Button Css --*/
.add-btn{
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
    padding: 10px 40px;
    border-radius: 3px;
    font-size: 16px;
    font-weight: 500;
    background-image: linear-gradient(90deg, #03228f 0%, #0e73e4 100%);
    color: #ffffff;
    z-index: 1;
    border: none;
    &:hover{
        color: #fff;
        background-image: linear-gradient(90deg, #0e73e4 19%, #03228f 100%);
        z-index: 1;
    }
}

/*Video Icon*/
.media-icon {
    position: relative;
    display: inline-block;
    z-index: 1;
    .popup-videos {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        color: @white-color;
        background: @primary-color;
        width: 70px;
        height: 70px;
        border-radius: 100%;
        text-align: center;
        &:before {
            content: "";
            position: absolute;
            z-index: 0;
            left: 50%;
            top: 50%;
            transform: translateX(-50%) translateY(-50%);
            display: block;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            animation: pulse-border 1500ms ease-out infinite;
            background-color: #1042C0;
            transition: 0.3s ease all;
        }
        i {
            &:before {
                font-size: 30px;
                line-height: 70px;
                transition: 0.3s ease all;
            }
        }
        &:hover {            
            &:before {
                background: @primary-color;
            }
        }
    }
    &.video-item{
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
}
.slider-video{
    .popup-videos {        
        display: inline-block;
        position: relative;
        height: 70px;
        width: 70px;
        line-height: 70px;
        border-radius: 100%;
        text-align: center;
        background: @primary-color;
        i{
            text-align: center;
            color: @white-color;
            border-radius: 100%;
            font-size: 25px;
            position: relative;
            line-height: 70px;
            z-index: 9;
            width: 100%;
            vertical-align: middle;
            margin-left: 0;
            height: auto;
        }
        &:before{
            content: "";
            position: absolute;
            z-index: 0;
            left: 50%;
            top: 50%;
            transform: translateX(-50%) translateY(-50%);
            display: block;
            width: 70px;
            height: 70px;
            border-radius: 50%;
            animation: pulse-border 3000ms ease-out infinite;
            background: @primary-color;
        }
    }
}
.address-item{
    .address-icon{
        display: inline-block;
        position: relative;
        height: 70px;
        width: 70px;
        line-height: 70px;
        border-radius: 100%;
        text-align: center;
        background: @white-color;
        i{
            text-align: center;
            color: @primary-color;
            border-radius: 100%;
            font-size: 25px;
            position: relative;
            line-height: 70px;
            z-index: 9;
            width: 100%;
            vertical-align: middle;
            margin-left: 0;
            height: auto;
        }
        &:before{
            content: "";
            position: absolute;
            z-index: 0;
            left: 50%;
            top: 50%;
            transform: translateX(-50%) translateY(-50%);
            display: block;
            width: 70px;
            height: 70px;
            border-radius: 50%;
            animation: pulse-border 1500ms ease-out infinite;
            background: @white-color;
        }
    }
}
.tab-videos{
    .popup-videos{
        color: #de5022;
        display: flex;
        overflow: hidden;
        i{
            width: 35px;
            height: 35px;
            line-height: 32px;
            border: 2px solid #de5022;
            border-radius: 50%;
            text-align: center;
            font-size: 14px;
            float: left;
            margin-right: 18px;
        }
        &:hover{
            color: #de5022;
        }
        .title{
            font-size: 22px;
            line-height: 34px;
            font-weight: 600;
            color: @title-color3;
            &:hover{
                color: @orange-color;
            }
        }
    }
}
.rs-videos{
    .animate-border{
        .popup-border{
            background-image: linear-gradient(180deg, #03228F 0%, #0B70E1 100%);
            width: 80px;
            height: 80px;
            line-height: 80px;
            text-align: center;
            display: inline-block;
            border-radius: 50%;
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            i{
                font-size: 20px;
                line-height: 80px;
                display: block;
                color: @white-color;
            }
            &:before{
                content: "";
                border: 2px solid @primary-color;
                position: absolute;
                z-index: 0;
                left: 50%;
                top: 50%;
                transform: translateX(-50%) translateY(-50%);
                display: block;
                width: 180px;
                height: 180px;
                border-radius: 50%;
                animation: zoomBig 3.25s linear infinite;  
                -webkit-animation-delay: .75s;
                animation-delay: .75s;                      
            }
            &:after{
                content: "";
                border: 2px solid @primary-color;
                position: absolute;
                z-index: 0;
                left: 50%;
                top: 50%;
                transform: translateX(-50%) translateY(-50%);
                display: block;
                width: 180px;
                height: 180px;
                border-radius: 50%;
                animation: zoomBig 3.25s linear infinite; 
                -webkit-animation-delay: 0s;
                animation-delay: 0s;                       
            }
        }
        &.main-home{
            .popup-border{
                left: 8%;
            }
            &.style2{
                .popup-border{
                    left: 50%;
                }
            }   
        }
        &.white-color{
            .popup-border{
                background: @white-color;
                bottom: -14px;
                left: 44%;
                i{
                    color: @secondary-color;
                }
                &:before{
                    border: 2px solid @white-color;
                  
                }
                &:after{
                    border: 2px solid @white-color;
                }
            }
            &.style3{
                .popup-border{
                    bottom: 362px;
                    left: 10%; 
                }
            }
        }  
    }
}

@keyframes zoomBig {
  0% {
    transform: translate(-50%, -50%) scale(0.5);
    opacity: 1;
    border-width: 3px;
  }
  40% {
    opacity: .5;
    border-width: 2px;
  }
  65% {
    border-width: 1px;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
    border-width: 1px;
  }
}


@keyframes zoomBig {
  0% {
    transform: translate(-50%, -50%) scale(0.5);
    opacity: 1;
    border-width: 3px;
  }
  40% {
    opacity: .5;
    border-width: 2px;
  }
  65% {
    border-width: 1px;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
    border-width: 1px;
  }
}


.margin-remove {
    margin: 0 !important;
}
.no-gutter {
    margin-left: 0;
    margin-right: 0;
    [class*="col-"] {
        padding-left: 0;
        padding-right: 0;
    }
}
[class^="flaticon-"]:before,
[class*=" flaticon-"]:before,
[class^="flaticon-"]:after,
[class*=" flaticon-"]:after {
    margin: 0;
}
.container-fluid {
    padding-left: 60px;
    padding-right: 60px;
}
.display-table {
    display: table;
    height: 100%;
    width: 100%;
}
.display-table-cell {
    display: table-cell;
    vertical-align: middle;
}
.relative {
    position: relative;
}


.sec-title {
    position: relative;
    .sub-text{
        position: relative;
        padding-left: 95px;
        display: inline-block;
        line-height: 28px;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 400;
        color: #03228F;
        text-transform: uppercase;
        margin-bottom: 10px;
        &:after{
            content: "";
            position: absolute;
            border: 0;
            height: 4px;
            width: 50px;
            background-color: #03228F;
            z-index: 1;
            margin-left: 0;
            left: 24px;
            top: 12px;
        }
        &:before{
            content: '';
            position: absolute;
            left: 0;
            top: 12px;
            height: 4px;
            width: 12px;
            background-color: #03228F;
        }
        &.new{
            color: @white-color;
            font-size: 15px;
            padding-left: 0;
            &:before{
                display: none;
            }
            &:after{
                display: none
            }
        }
        &.new-text{
            padding-left: 0;
            margin-bottom: 7px;
            color: @white-color;
            &:before{
                display: none;
            }
            &:after{
                display: none
            }
        }
        &.style2{
            &:after{
                background-color: @primary-color;
            }
            &:before{
                background-color: @primary-color;
            }
        }
        &.style-bg{
            background-color: #1273EB17;
            display: inline-block;
            padding: 6px 25px;
            color: #1273eb;
            border-radius: 30px;
            text-transform: uppercase;
            &:before{
                display: none;
            }
            &:after{
                display: none
            }
        }  
        &.style4-bg{
            color: #03228F;
            &:before{
                background-color: #FD6509;
            }
            &:after{
                background-color: #FD6509;
            }
        }
        &.choose{
            font-size: 16px;
            font-weight: 500;
        } 
    }
    .title{
        font-size: 36px;
        font-weight: 700;
        line-height: 46px;
        color: @title-color;
        margin: 0;
        &.white-color{
            color: @white-color;
        }
    }
    .desc{
        font-size: 18px;
        font-weight: 400;
        margin: 0;
        &.white-color{
            color: #fff;
        }
    }
    .desc-big{
        font-size: 28px;
        line-height: 48px;
        font-weight: 500;
        margin: 0;
    }

}
.sec-title2{
    position: relative;
    .sub-text{
        margin: 0 0 10px;
        display: block;
        line-height: 28px;
        font-family: 'Livvic', sans-serif;
        font-size: 14px;
        font-weight: 400;
        color: #03228F;
        text-transform: uppercase;
        &.white-color{
            color: @white-color;
        }
        &.gold-color{
            font-weight: 600;
            color: #F27C1E;
        }
        &.contact{
           color: #1273EB;
        }
        &.orange-color{
            color: @orange-color !important;
        }
        &.style-bg{
            background-color: #1273EB17;
            display: inline-block;
            padding: 6px 25px;
            color: #1273eb;
            border-radius: 30px;
            text-transform: uppercase;
            &.white-color{
                color: @white-color;
            }
            &.con-bg{
                background-color: #03228F;
            }
        }
    }
    .title{
        font-size: 36px;
        font-weight: 700;
        line-height: 1.4;
        color: @title-color2;
        max-width: 490px;
        margin: 0 auto;
        &.white-color{
            color: @white-color;
        }
        &.testi-title{
            max-width: unset;
            &.new{
                color: #102B3E; 
            }
        }
        &.title2{
            max-width: 550px;
        }
        &.title3{
            color: #102B3E;
            max-width: 430px;
            margin: 0;
        }
        &.title4{
            max-width: 660px;
        }
        &.title5{
           color: #102B3E; 
        }
        &.title6{
            font-weight: 600;
            max-width: unset;
        }
        &.title7{
            color: #102B3E;
            max-width: unset; 
        }
        &.orange-color{
            color: @orange-color !important;
        }
    }
    .heading-line{
        position: relative;
        background-color: #03228F;
        height: 5px;
        width: 90px;
        border-radius: 30px;
        margin: 20px auto;
        &:before{
            background-color: #1940AA;
            content: '';
            position: absolute;
            left: 0;
            top: -2.7px;
            height: 10px; 
            width: 10px;
            border-radius: 50%;
            -webkit-animation-duration: 3s;
            animation-duration: 3s;
            -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
            -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
            animation-direction: alternate-reverse;
            -webkit-animation-direction: alternate-reverse;
            -webkit-animation-name: watermark-animate;
            animation-name: watermark-animate;
        }
    }
    .desc{
        font-size: 18px;
        line-height: 31px;
        font-weight: 400;
        color: #454545;
        max-width: 429px;
        margin:  13px auto 0;
        &.desc-text{
            max-width: 540px;
        }
        &.white-color{
            color: #fff;
        }
        &.desc2{
            max-width: 700px;
            margin: 0;
        }
        &.desc3{
            max-width: 930px;
        }
    }
    .desc-big{
        font-size: 18px;
        line-height: 31px;
        color: @white-color;
    }
}
.sec-title3{
    .sub-text{
        font-size: 19px;
        line-height: 1.4;
        font-weight: 700;
        color: @white-color;
        display: block;
        margin-bottom: 20px;
        &.style2{
            font-size: 16px;
            line-height: 26px;
            font-weight: 600;
            text-transform: uppercase;
            margin-bottom: 8px;
        }
    }
    .title{
        font-size: 42px;
        font-weight: 700;
        color: #fff;
        line-height: 40px;
        margin-bottom: 30px;
        &.title2{
            margin: 0;
            line-height: 52px;
        }
    }
    .desc{
        font-size: 19px;
        font-weight: 500;
        color: #fff;
        margin: 0;
    }
}
.sec-title4{
    .title-img{
        img{
            margin: 0px 0px 0px 15px;
        }
    }
    .sub-title{
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;
        color: #787BF2;
        display: block;
        margin: -26px 0px 10px 0px;
    }
    .sub-text{
        font-size: 16px;
        line-height: 1.4;
        font-weight: 500;
        color: #03228F;
        margin: 0 0 10px;
        display: block;
        text-transform: uppercase;
    }
    .title{
        font-size: 36px;
        line-height: 1.3;
        font-weight: 700;
        color: @title-color;
        margin: 0 0 17px;
    }
    .heading-line{
        height: 5px;
        width: 90px;
        background: #B9C7F6;
        margin: 0px;
        position: relative;
        border-radius: 30px;
        &:before{
            content: '';
            position: absolute;
            left: 0;
            top: -2.7px;
            height: 10px;
            width: 10px;
            border-radius: 50%;
            background-color: #0D66D5;
            -webkit-animation-duration: 3s;
            animation-duration: 3s;
            -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
            -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
            animation-direction: alternate-reverse;
            -webkit-animation-direction: alternate-reverse;
            -webkit-animation-name: watermark-animate;
            animation-name: watermark-animate;
        }
    }
    .desc{
        margin: 0;
        &.desc-big{
            font-size: 20px;
            line-height: 30px;
            margin: 26px 0px 30px 0px;
        }
    }
}
.sec-title5{
    .logo-icon{
        margin-bottom: 15px;
        img{
            width: 71px;
        }
    }
    .title{
        font-size: 36px;
        line-height: 1.4;
        font-weight: 700;
        color: #102B3E;
        margin-bottom: 10px;
        span{
            color: #F9780F;
        }
        &.title2{
            font-size: 30px;
            line-height: 40px;
            font-weight: 700;
            color: #0a0a0a;
            margin-bottom: 0;
        }
    }
    .desc{
        font-size: 18px;
        line-height: 26px;
        font-weight: 400;
        color: @body-color;
        max-width: 626px;
        margin: 0 auto;
    }
    .desc2{
        font-size: 15px;
        line-height: 26px;
        font-weight: 400;
        color: @body-color;
        max-width: 507px;
        margin: 0;
    }
}
.pt-relative{
    position: relative !important;
}
.sec-title6{
    .sub-text{
        font-size: 18px;
        font-weight: 600;
        text-transform: uppercase;
        line-height: 32px;
        color: #F24C1A;
        display: block;
        margin-bottom: 5px;
        &.new-text{
            margin-bottom: 10px;
        }
        &.new-text-style{
            font-size: 14px;
            color: @white-color;
            font-weight: 500;
        }
    }
    .title{
        font-size: 36px;
        font-weight: 700;
        line-height: 1.4;
        color: #102B3E;
        margin-bottom: 5px;
        &.new-title{
            max-width: 700px;
            margin: 0 auto;
        }
        span{
            color: @orange-color2;
        }
    }
    .desc{
        padding-right: 125px;
    }
}
.sec-right{
    position: absolute;
    right: -17%;
    top: 45%;
    transform: rotate(90deg);
    z-index: 1;
    .title{
                
        font-size: 36px;
        line-height: 46px;
        font-weight: 700;
        color: @title-color;
        letter-spacing: 2px;
        margin-bottom: 20px;
    }
}
.sec-left{
    transform: rotate(-90deg) translatex(-50%);
    transform-origin: left;
    position: absolute;
    left: -2%;
    top: 46%;
    z-index: 1;
    .title{   
        font-size: 36px;
        line-height: 46px;
        font-weight: 700;
        color: @title-color;
        letter-spacing: 2px;
        margin-bottom: 20px;
    }
}

.check-square{
    li{
        position: relative;
        padding-left: 17px;
        line-height: 35px;
        border: none;
        font-size: 15px;
        font-weight: 500;
        color: #454545;
        &:before{
           position: absolute;
               left: 0;
               z-index: 0;
               content: "\f058";
               font-weight: 400;
               font-family: fontawesome;
               color: rgb(120, 124, 242);
        }
    }
}

/* -----------------------
    03. Header Section CSS
--------------------------*/
.full-width-header{
    position: relative;
    .rs-header{  
        position: relative;
        .topbar-area {
            padding-top: 20px;
            padding-bottom: 10px;
           .rs-contact-info{
               .contact-part{
                    display: inline-block;
                    padding-right: 25px;
                    padding-left: 25px;
                    border-right: 1px solid #eee;
                    font-size: 14px;
                    i{
                        float: left;
                        margin-right: 15px;
                        line-height: 38px;
                        &:before{
                            font-size: 26px;
                            color: @primary-color;
                        }
                    }
                    .contact-info{
                        float: left;
                        text-align: left;
                        display: block;
                        span{
                            color: @title-color2;
                            display: block;
                            text-align: left;
                            font-size: 15px;
                            padding: 0;
                            font-weight: 600;
                            line-height: 1;
                            margin-bottom: 0;
                        }
                        a{
                            color: @body-color;
                            font-size: 14px;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
               }
           }
           &.style2{
                background-image: linear-gradient(90deg, #03228f 10%, #0e73e4 100%);
                padding-top: 0px;
                padding-bottom: 0px;
                .topbar-contact {
                    li {
                        display: inline-block;
                        color: @white-color;
                        font-size: 14px;
                        line-height: 50px;
                        i {
                            margin-right: 5px;
                            &:before {
                                font-size: 14px;
                                color: @white-color;
                            }
                        }
                        a {
                            color: @white-color;
                            font-size: 14px;
                            margin-right: 20px;
                            padding-right: 20px;
                            border-right: 1px solid #2a8af5;
                            &:hover {
                                color: #ccc;
                            }
                        }
                        &:last-child {
                            margin: 0;
                            border: none;
                        }
                    }
                }
                .toolbar-sl-share {
                    ul{
                        .opening{
                            color: @white-color;
                           em{
                                border-right: 1px solid #2a8af5;
                                margin-right: 5px;
                                padding-right: 20px;
                                font-style: normal;
                                i{
                                    margin-right: 8px;
                                    &:before{
                                        font-size: 15px;
                                        font-weight: 600;
                                        color: @white-color;
                                    }
                                }
                            }
                        }
                        li{
                            display: inline-block;
                            font-size: 14px;
                            line-height: 50px;
                            margin-right: 12px;
                            a{
                                font-size: 14px;
                                color: @white-color;              
                                &:hover {
                                    color: #ccc;
                                }
                            }
                            &:last-child {
                                margin: 0;
                            }
                        }
                    }
                }
                &.modify1{
                    background: transparent;
                    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
                    .topbar-contact {
                        li {
                            border-right: 1px solid rgba(255, 255, 255, 0.2);
                            margin-right: 20px;
                            padding-right: 20px;
                            a {
                                border-right: unset;
                            }
                            &:last-child {
                                margin: 0;
                                border: none;
                            }
                        }
                    }
                    .toolbar-sl-share {
                        ul{
                            .opening{
                                border-right: 1px solid rgba(255, 255, 255, 0.2);
                               em{
                                    border-right: unset;
                                }
                            }
                        }
                    }
                }   
           }
        }
        .menu-area {
            transition: @transition;
            background-image: linear-gradient(90deg, #03228f 10%, #0e73e4 100%);
            .logo-area{
                a{
                    img{
                        transition: 0.4s;
                        max-height: 40px;
                    }
                    .sticky-logo{
                        display: none;
                    }
                }
            }
            .rs-menu-area {
                align-items: center;
                justify-content: flex-end;
                float: left;
            }
            .main-menu{
                .rs-menu{ 
                    ul{
                       &.nav-menu{
                           li{
                               display: inline-block;
                               margin-right: 52px;
                               padding: 0;
                               a {
                                   transition: @transition;
                                   font-size: 15px;
                                   font-weight: 600;
                                   margin-right: 10px;
                                   height: 65px;
                                   line-height: 65px;
                                   padding: 0;
                                   color: @white-color;
                                   position: relative;
                                   font-family: Livvic;                                                                      
                                   &:hover{
                                       color: #bbb;
                                    }                                   
                                }
                                &.menu-item-has-children {
                                    > a {
                                        padding-right: 17px;
                                       &:before {
                                            content: "+";
                                            position: absolute;
                                            left: auto;
                                            right: 0;
                                            top: 50%;
                                            text-align: center;
                                            z-index: 9999;
                                            font-size: 16px;
                                            display: block;
                                            cursor: pointer;
                                            transform: translateY(-50%);
                                            font-weight: 400;
                                       }
                                   }
                                   &:hover {
                                       > a {
                                           &:before {
                                               content: "-";
                                           }
                                       }
                                   }
                                }
                                &.current-menu-item {
                                    > a {
                                       color: #bbb;
                                    }
                                }
                                &:last-child{
                                    margin-right: 0!important;
                                    a {
                                       margin-right: 0!important;
                                    }
                                    i{
                                       margin: 0;
                                    }
                                }                                
                            }
                        }
                        &.sub-menu{
                            background: @white-color;
                            margin: 0;
                            padding: 20px 0;
                            border-radius: 0 0 5px 5px;
                            li{
                                margin: 0 !important;
                                border: none;
                                a{
                                    line-height: 25px;
                                    padding-top: 10px;
                                    padding-bottom: 10px;
                                    padding-left: 30px;
                                    padding-right: 30px;
                                    margin: 0;
                                    font-size: 14px;
                                    font-weight: 500;
                                    color: @title-color;
                                    height: unset;
                                    line-height: 16px;
                                    &:before {
                                        right: 30px !important;
                                    }
                                    &:hover{
                                        color: @primary-color;
                                    }
                                }
                                &.menu-item-has-children {
                                    a {
                                       &:before {
                                            // display: none;
                                       }
                                    }
                                }
                                &.current-menu-item,
                                &.active {
                                    > a {
                                        color: @primary-color !important;
                                    }
                                }
                                &:last-child{
                                    margin: 0;
                                }
                            }
                            &.left{
                                left: auto;
                                right: 100%;
                            }    
                        }
                        &.mega-menu{
                            position: absolute;
                            left: 0;
                            min-width: 1210px;
                            box-shadow: 0 0 5px rgba(0,0,0,.15);
                            .mega-menu-container{
                                float:left;
                                width:100%;
                                position:relative;
                                padding: 0;
                                margin: 0 !important;
                                .single-megamenu {
                                    width: 25%;
                                    float: left;
                                    .sub-menu {
                                        position:relative;
                                        padding: 30px 35px 35px;
                                        border-radius: 0;
                                        box-shadow: none;
                                        .menu-title {
                                            color: @title-color;  
                                            padding: 10px 30px;
                                            font-size: 17px;
                                            font-weight: 600;
                                            padding: 10px 30px;
                                            text-align: left;
                                            text-transform: capitalize;
                                            transition: @transition;
                                        }
                                        li {
                                            width:100%;
                                            a {
                                                width:100%;
                                                padding: 10px 30px;
                                            }
                                        }
                                    }
                                    &:hover {
                                        .sub-menu {
                                            .menu-title {
                                                color: @primary-color;
                                            }
                                        }
                                    }
                                }
                            }
                            &.two-column {
                                min-width: 650px;
                                .mega-menu-container{
                                    .single-megamenu {
                                        width: 50%;
                                    }
                                }
                            }
                            &.three-column {
                                .mega-menu-container{
                                    .single-megamenu {
                                        width: 33.33%;
                                    }
                                }
                            }
                        }
                    }
                    ul li a:hover,
                    ul li.active a,
                    ul li.current-menu-item > a{
                        color: #fff; 
                    }
                }
            }          
            &.sticky {
                background: #fff;
                .logo-area{
                    display: inline-block;
                    top: 18px;
                    a{
                        .sticky-logo{
                            display: block;
                            max-height: 30px;
                        }
                    }
                }
                .rs-menu-area {
                    float: right;
                }
                .main-menu {
                    .rs-menu {
                        ul {
                            &.nav-menu {
                                > li {
                                    > a {
                                        color: #0a0a0a;
                                        &:hover {
                                            color: @primary-color;
                                        }
                                    }
                                    &.current-menu-item {
                                        > a {
                                           color: @primary-color;
                                        }
                                    }
                                }
                            }
                            &.mega-menu {
                                left: unset;
                                right: 0;
                            }
                        }
                    }
                }
                .expand-btn-inner {
                    line-height: unset;
                    height: unset;
                    &.search-icon{
                        .sidebarmenu-search > a{
                            color: @title-color;
                        }
                    }
                    li {
                        .cart-icon {
                            .cart-count {
                                background: @primary-color;
                                color: @white-color;
                            }
                        }
                        > a {
                            color: #494949;
                            &:hover {
                                color: @primary-color;
                            }
                        }
                    }
                    &.hidden-sticky {
                        display: none;
                    }
                }
            }
        }
        .expand-btn-inner{
            display: flex;
            align-items: center;
            justify-content: flex-end;
            line-height: 65px;
            height: 65px;
            position: relative;
            .sidebarmenu-search{
                > a {
                        color: @white-color;
                        border-right: 1px solid #fff;
                        padding-right: 20px;              
                    i {
                        &:before {
                            font-size: 15px;
                            font-weight: 600;
                        }
                        &.flaticon-shopping-bag-1 {
                            &:before {
                                font-weight: normal;
                            }
                        }
                    }
                    &:hover {
                        color: @white-color;
                    }
                }
            }
            .toolbar-sl-share{
                padding-left: 25px;
                .social{
                    li{
                        display: inline-block;
                        margin-right: 14px;
                        a{
                            color: @white-color;
                            font-size: 14px;
                            &:hover{
                                opacity: 0.8;
                            }
                        }
                        &:last-child{
                            margin-right: 0;
                        }
                    }
                }
            }
        }
        &.style2{
            .menu-area {
                background: @white-color;
                .logo-part {
                    img{
                        transition: 0.4s;
                        max-height: 40px;
                    }
                    .dark {
                        display: none;
                    }
                    .light {
                        display: inherit;
                    }
                }
               .rs-menu-area {
                    display: flex;
                    width: 100%;
                    position: relative;
                    align-items: center;
                    justify-content: flex-end;
                }
               .main-menu{
                   .rs-menu{ 
                       ul{
                            &.nav-menu{
                                li{
                                    display: inline-block;
                                    margin-right: 32px;
                                    padding: 0;
                                    a {
                                        color: @title-color;
                                        line-height: 100px;
                                        height: 100px;
                                        &:hover{
                                            color: @primary-color;
                                        }     
                                    }
                                   &.menu-item-has-children {
                                       > a {
                                        
                                      }
                                      &:hover {
                                          > a {
                                              &:before {
                                                  content: "-";
                                              }
                                          }
                                      }
                                   }
                                   &.current-menu-item {
                                       > a {
                                          color: @primary-color;
                                       }
                                   }                               
                               }
                           }
                            &.sub-menu{
                               li{
                                   margin: 0;
                                   border: none;
                                   a{
                                       height: unset;
                                       line-height: 16px;
                                       &:hover{
                                           color: @primary-color;
                                       }
                                   }
                                   &.menu-item-has-children {
                                       a {
                                          &:before {
                                               display: none;
                                          }
                                       }
                                   }
                                   &.active{
                                       a {
                                           color: @primary-color;
                                       }                                
                                   }
                                }
                            }
                            &.mega-menu{
                                left: unset;
                                right: -45px;
                            }
                        }
                    }
                }
                &.sticky{
                    .expand-btn-inner{
                        ul{
                            display: flex;
                            li{
                                margin-left: 25px;
                                .quote-btn{
                                    font-size: 14px;
                                    background-image: linear-gradient(90deg, #03228f 0%, #0e73e4 100%);
                                    padding: 13px 22px;
                                    border-radius: 3px;
                                    color: #fff;
                                    font-weight: 500;
                                    &:hover{
                                        color: @white-color;
                                        background-image: linear-gradient(90deg, #0e73e4 0%, #03228f 100%);
                                    }    
                                }
                            }
                        }
                    }
                }
            }
            .expand-btn-inner{
                .sidebarmenu-search{
                    > a {
                            color: @title-color;
                        i {
                            &:before {
                                font-size: 15px;
                                font-weight: 600;
                            }
                            &.flaticon-shopping-bag-1 {
                                &:before {
                                    font-weight: normal;
                                }
                            }
                        }
                        &:hover {
                            color: @primary-color;
                        }
                    }
                }
               li{
                    .humburger {
                        max-width: 45px;
                        display: flex !important;
                        flex-wrap: wrap;
                        margin: -5px;
                       span {
                           height: 5px;
                           width: 5px;
                           display: block;
                           background: @title-color2;
                           border-radius: 50%;
                           transition: none;
                           list-style: none;
                           transition: @transition;
                           margin: 4px 5px;
                           &.dot2,
                           &.dot4,
                           &.dot6,
                           &.dot8 {
                               background: @primary-color;
                            }
                        }
                    }
                }
                ul{
                    display: flex;
                    li{
                        margin-left: 25px;
                        .quote-btn{
                            font-size: 14px;
                            background-image: linear-gradient(90deg, #03228f 0%, #0e73e4 100%);
                            padding: 13px 22px;
                            border-radius: 3px;
                            color: #fff;
                            font-weight: 500;
                            &:hover{
                                color: @white-color;
                                background-image: linear-gradient(90deg, #0e73e4 0%, #03228f 100%);
                            }    
                        }
                    }
                }
            }
            &.btn-style {
                .menu-area {
                    .main-menu{
                       .rs-menu{ 
                            ul{
                                &.mega-menu{
                                    right: -215px;
                                }
                            }
                        }
                    }
                }
            }
        }
        &.style3{
            .menu-area {
                background: transparent;
                padding: 13px 0;
                 .logo-part {
                    a{
                        .sticky-logo{
                            display: none;
                        }
                    }
                    img{
                        transition: 0.4s;
                        -webkit-transition: 0.4s;
                        max-height: 40px;
                       
                    }
                    .dark {
                        display: none;
                    }
                    .light {
                        display: inherit;
                    }
                }
                .rs-menu-area {
                    display: flex;
                    width: 100%;
                    position: relative;
                    align-items: center;
                    justify-content: flex-end;
                }
                .main-menu{
                    .rs-menu{ 
                        ul{
                           &.nav-menu{
                               li{
                                   display: inline-block;
                                   padding: 0;
                                    &.menu-item-has-children {
                                        > a {
                                         
                                       }
                                       &:hover {
                                           > a {
                                               &:before {
                                                   content: "-";
                                               }
                                           }
                                       }
                                    }                               
                                }
                            }
                            &.sub-menu{
                                li{                             
                                    a{
                                        line-height: 16px;
                                        height: unset;
                                    }
                                    &.menu-item-has-children {
                                        a {
                                           &:before {
                                                display: none;
                                           }
                                        }
                                    }
                                }    
                            }
                            &.mega-menu{
                                left: unset;
                                right: -15px;
                            }
                        }
                    }
                }
                &.sticky {
                    background: @white-color;
                    .logo-part{
                        a{
                            .sticky-logo{
                                display: block;
                            } 
                            .normal-logo{
                                display: none;
                            }
                        }
                    }
                    .main-menu {
                        .rs-menu {
                            ul {
                                &.nav-menu {
                                   li{
                                        a {
                                            color: @title-color;
                                            &:hover{
                                                color: @primary-color;
                                            }
                                        }
                                        &.current-menu-item {
                                            > a {
                                               color: @primary-color;
                                            }
                                        }
                                   }
                                }
                            }
                        }
                    }
                }
            }
            .expand-btn-inner{
                ul{
                    display: flex;
                    align-items: center;
                    .sidebarmenu-search{
                        > a {
                            border: unset;
                            padding-right: unset;
                        }
                    }
                    li{                        
                        .humburger {
                            max-width: 45px;
                            display: flex;
                            flex-wrap: wrap;
                            margin: -5px;
                            span {
                                height: 5px;
                                width: 5px;
                                display: block;
                                background: @white-color;
                                border-radius: 50%;
                                transition: none;
                                list-style: none;
                                transition: @transition;
                                 margin: 3px 4px;
                                &.dot2,
                                &.dot4,
                                &.dot6,
                                &.dot8 {
                                    background: #6394bf;
                                }
                            }
                        }
                    }
                }
            }
            &.modify1{
               .menu-area {
                   .main-menu{
                       .rs-menu{ 
                           ul{
                              &.nav-menu{
                                  li{
                                      display: inline-block;
                                      padding: 0;
                                      a {
                                            color: @title-color;
                                            &:hover{
                                                color: @primary-color;
                                            }     
                                      }
                                       &.menu-item-has-children {
                                           > a {
                                            
                                          }
                                          &:hover {
                                              > a {
                                                  &:before {
                                                      content: "-";
                                                  }
                                              }
                                          }
                                       }
                                       &.current-menu-item {
                                           > a {
                                              color: @primary-color;
                                           }
                                       }                               
                                   }
                               }
                               &.sub-menu{
                                   li{
                                
                                       a{
                                           color: @title-color;
                                           &:hover{
                                               color: @primary-color;
                                           }
                                       }
                                       &.menu-item-has-children {
                                           a {
                                              &:before {
                                                   display: none;
                                              }
                                           }
                                       }
                                       &.active{
                                           a {
                                               color: @primary-color;
                                           }                                
                                       }
                                   }    
                               }
                                &.mega-menu{
                                    right: -75px;
                                    margin-top: 13px;
                                }
                           }
                       }
                   }
               } 
               .expand-btn-inner{
                   ul{
                        .sidebarmenu-search{
                            a{
                                i{
                                    color: @title-color;
                                }
                            }
                        }
                       li{
                           margin-right: 30px;
                           .humburger {
                               span {
                                   background: @title-color;
                                   &.dot2,
                                   &.dot4,
                                   &.dot6,
                                   &.dot8 {
                                       background: #6394bf;
                                   }
                               }
                           }
                           &:last-child {
                                margin-right: 0;
                           }
                       }
                   }
                }
            }
            &.modify2{
                .menu-area {
                    .main-menu{
                       .rs-menu{ 
                           ul{
                                &.mega-menu{
                                    right: -75px;
                                    margin-top: 13px;
                                }
                            }
                        }
                    }
                    &.sticky{
                        .expand-btn-inner{
                            ul{
                                li{
                                    .humburger {
                                        span {
                                            background: #0e44dd;
                                            &.dot2,
                                            &.dot4,
                                            &.dot6,
                                            &.dot8 {
                                                background: #333333;
                                            }
                                        }
                                    }                                    
                                }
                            }
                        }
                    }
                } 
                .expand-btn-inner{
                    ul{
                        li{
                            margin-right: 30px;
                            .humburger {
                                span {
                                    background: @white-color;
                                    &.dot2,
                                    &.dot4,
                                    &.dot6,
                                    &.dot8 {
                                        background: #6394bf;
                                    }
                                }
                            }
                            &:last-child {
                                margin-right: 0;
                            }
                        }
                    }
                }
            }
            &.modify3{
                .menu-area {
                    padding: 0;
                    .row-table{
                        display: flex;
                        width: 100%;
                        position: relative;
                        align-items: center;
                        justify-content: space-between;
                        .main-menu{
                            .rs-menu{ 
                                ul{
                                   &.nav-menu{
                                       li{
                                           display: inline-block;
                                           padding: 0;
                                           margin-right: 20px;
                                           a {
                                               color: @white-color;                                                                     
                                               &:hover{
                                                   color: #101010;
                                                }                                   
                                            }
                                            &.menu-item-has-children {
                                                > a {

                                               }
                                               &:hover {
                                                   > a {
                                                       &:before {
                                                           content: "-";
                                                       }
                                                   }
                                               }
                                            }
                                            &.current-menu-item {
                                                > a {
                                                   color: #101010;
                                                }
                                            }                               
                                        }
                                    }
                                    &.sub-menu{
                                        li{
                                            a{
                                                line-height: 16px;
                                                height: unset;
                                                color: @title-color3;
                                                &:hover{
                                                    color: #787cf2;
                                                }
                                            }
                                            &.menu-item-has-children {
                                                a {
                                                   &:before {
                                                        display: none;
                                                   }
                                                }
                                            }
                                            &.current-menu-item,
                                            &.active {
                                                > a {
                                                    color: #787cf2 !important;
                                                }
                                            }
                                        }    
                                    }
                                    &.mega-menu{
                                        right: -310px;
                                    }
                                }
                                ul li a:hover,
                                ul li.active a,
                                ul li.current-menu-item > a{
                                    color: #787cf2; 
                                }
                            }
                        }
                    }
                    &.sticky{
                        .main-menu {
                            .rs-menu {
                                ul {
                                    &.nav-menu {
                                        > li {
                                            > a {
                                                color: #101010;
                                                &:hover {
                                                    color: #787cf2;
                                                }
                                            }
                                            &.current-menu-item {
                                                > a {
                                                   color: #787cf2;
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                        .expand-btn-inner{
                            ul{
                                .sidebarmenu-search{
                                    > a {
                                       
                                        &:hover {
                                            color: #787cf2;
                                        }
                                    }
                                }
                                li{
                                    .humburger {
                                       span {
                                           background: #787cf2;
                                           margin: 2px 4px;
                                           &.dot2,
                                           &.dot4,
                                           &.dot6,
                                           &.dot8 {
                                               background: #101010;
                                           }
                                       }
                                    }                                    
                                }
                            }
                        }
                    }
                } 
                .expand-btn-inner{
                    ul{
                        .sidebarmenu-search{
                            > a {
                                    color: @white-color;
                                i {
                                    &:before {
                                        font-size: 18px;
                                        font-weight: 600;
                                    }
                                }
                                &:hover {
                                    color: #101010;
                                }
                            }
                        }
                        li{
                            margin-right: 30px;
                            .humburger {
                                span {
                                    background: @white-color;
                                    margin: 2px 4px;
                                    &.dot2,
                                    &.dot4,
                                    &.dot6,
                                    &.dot8 {
                                        background: #101010;
                                    }
                                }
                            }
                            &:last-child {
                                margin-right: 0;
                            }
                        }
                    }
                }
                &.home14-style{
                    .expand-btn-inner ul .sidebarmenu-search > a:hover,
                    .menu-area .row-table .main-menu .rs-menu ul.nav-menu li a:hover {
                        color: @orange-color2;
                    }
                    .menu-area .main-menu .rs-menu ul.mega-menu .mega-menu-container .single-megamenu:hover .sub-menu .menu-title {
                        color: @orange-color2;
                    }
                    .menu-area .row-table .main-menu .rs-menu ul.sub-menu li.active > a{
                        color: @orange-color2 !important;
                    }
                    .menu-area .row-table .main-menu .rs-menu ul.nav-menu li.current-menu-item > a {
                        color: @orange-color2;
                        line-height: 100px;
                        height: 100px;
                    } 
                    .menu-area .row-table .main-menu .rs-menu .nav-menu.onepage-menu li a {
                        line-height: 100px;
                        height: 100px;
                    }
                    .menu-area{
                        &.sticky{
                            .expand-btn-inner{
                                ul{
                                    .sidebarmenu-search{
                                        > a {
                                           
                                            &:hover {
                                                color: @orange-color2;
                                            }
                                        }
                                    }
                                    li{
                                        .humburger {
                                           span {
                                               background: @orange-color2;
                                               &.dot2,
                                               &.dot4,
                                               &.dot6,
                                               &.dot8 {
                                                   background: #787cf2;
                                               }
                                           }
                                        }                                    
                                    }
                                }
                            }
                        }
                    }
                    .expand-btn-inner{
                        ul{
                            li{
                                margin-right: 30px;
                                .humburger {
                                    span {
                                        background: @white-color;
                                        margin: 2px 4px;
                                        &.dot2,
                                        &.dot4,
                                        &.dot6,
                                        &.dot8 {
                                            background: @orange-color2;
                                        }
                                    }
                                }
                                &:last-child {
                                    margin-right: 0;
                                }
                            }
                        }
                    }
                }
            }
        }
        &.style4{
           .menu-area {
               transition: @transition;
               background-image: linear-gradient(90deg, #03228f 10%, #0e73e4 100%);
               .main-menu{
                   .rs-menu{ 
                        ul{
                            &.nav-menu {
                                li {
                                    margin-right: 32px;
                                }
                            }
                            &.sub-menu{
                               li{
                                   a{
                                       line-height: 16px;
                                       height: unset;
                                   }
                                   &:last-child{
                                       margin: 0;
                                   }
                               }
                            }
                            &.mega-menu{
                                min-width: 1240px;
                                left: unset;
                                right: -340px;
                            }
                       }
                   }
               }
                &.sticky {
                    .main-menu{
                       .rs-menu{ 
                            ul{
                                &.mega-menu{
                                    min-width: 1170px;
                                    right: -300px;
                                }
                            }
                        }
                    }
                }
           }
           .expand-btn-inner{
               display: flex;
               align-items: center;
               justify-content: flex-end;
               line-height: 50px;
               height: 50px;
               position: relative;
               .sidebarmenu-search{
                   > a {
                         border-right: 1px solid #fff;
                         padding-right: 20px;                       
                    }
                }
            }
            &.modify1{
                .menu-area{
                    background: unset;
                    .box-layout{
                        background: @white-color;
                        margin-top: 50px;
                        padding: 0 40px;
                        z-index: 1;
                        border-radius: 5px;
                    }
                    .rs-menu-area {
                        display: flex;
                        align-items: center;
                        justify-content: flex-end;
                        width: 100%;
                    }
                    .main-menu{
                        .rs-menu{ 
                            ul{
                               &.nav-menu{
                                   li{
                                        a {
                                            font-size: 16px;
                                            color: @body-color;
                                            height: 110px;
                                            line-height: 110px;                          
                                            &:hover{
                                                color: @orange-color;
                                             }                                   
                                         }
                                        &.menu-item-has-children {
                                            > a {
                                                color: @title-color2;   
                                                &:hover{
                                                    color: @orange-color;
                                                }   
                                           }
                                        }
                                        &.current-menu-item {
                                            > a {
                                               color: @orange-color;
                                            }
                                        }                               
                                    }
                                }
                                &.sub-menu{
                                    li{
                                        a{
                                            line-height: 16px;
                                            height: unset;
                                            &:hover{
                                                color: @orange-color;
                                            }
                                        }
                                        &.current-menu-item,
                                        &.active {
                                            > a {
                                                color: @orange-color !important;
                                            }
                                        }
                                        &:last-child{
                                            margin: 0;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    &.sticky {
                        .box-layout{
                            margin-top: unset;
                        }
                    }
                }
                .expand-btn-inner{
                    ul{
                        display: flex;
                        align-items: center;
                        justify-content: flex-end;
                        position: relative;
                        .sidebarmenu-search{
                            > a {
                                  border-right: 1px solid #ccc;
                                  padding-right: 20px;
                                  i{
                                    color: @title-color;
                                  }
                            }
                            &:hover {
                                color: @primary-color;
                            }
                        }
                        li{
                              i{
                                &:before{
                                    font-size: 15px;
                                    font-weight: 600;
                                    color: @title-color;
                                    padding-left: 20px;
                                }
                            }

                        }
                        .quote-btn{
                            a{
                                font-size: 14px;                                
                                background-image: linear-gradient( 150deg , #dd4c23 19%, #f27c1e 100%);
                                padding: 16px 26px;
                                border-radius: 3px;
                                color: #fff;
                                font-weight: 500;
                                padding-right: 30px;
                                text-transform: uppercase;
                                &:hover{
                                    background-image: linear-gradient(90deg, #e45d21 19%, #e45d21 100%);
                                    color: #ffffff;
                                }

                            }

                        }              
                    }
                } 
            }
        }
        &.style5{
            .menu-area{
                .row-table{
                    display: flex;
                        width: 100%;
                        position: relative;
                        align-items: center;
                        justify-content: space-between;
                }
            }
        } 
        &.header-transparent{
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 999;
        }
    }
    .mobile-menu{
        display: none;
        .mobile-logo {
            float: left;
            img {
                max-height: 30px;
            }
        }
        .rs-menu-toggle{
            color: @white-color;
            float: right;
            &:hover {
                opacity: 0.8;
            }
            &.primary {
                color: @primary-color;
            }
            &.secondary {
                color: @secondary-color;
            }
        }
    }
    .right_menu_togle{
        background-image: linear-gradient( 90deg, #e2e9f7 0%, #ffffff 100%);
        padding: 50px;
        width: 500px;
        right: -500px;
        z-index: 999999;
        transition: @transition;
        position: fixed;
        .close-btn{
            overflow: visible;
            .nav-link{
                position: absolute;
                right: 25px;
                top: 25px;
                .humburger {
                    max-width: 45px;
                    display: flex !important;
                    flex-wrap: wrap;
                    margin: -5px;
                   span {
                       height: 5px;
                       width: 5px;
                       display: block;
                       background: @title-color2;
                       border-radius: 50%;
                       transition: none;
                       list-style: none;
                       transition: @transition;
                       margin: 4px 5px;
                       &.dot2,
                       &.dot4,
                       &.dot6,
                       &.dot8 {
                           background: @primary-color;
                        }
                    }
                }
            }
        }
        .canvas-logo{
            padding-left: 0;
            padding-bottom: 25px;
            img {
                max-height: 36px;
            }
        }
        .sidebarnav_menu{
            li{
                a{
                    font-size: 17px;
                    color: #222;
                    padding-left: 0;
                    &:hover{
                        color: @primary-color;
                    }
                }
            }
        }
        .canvas-contact{
            padding: 25px 0 0;
            .address-area{
                .address-list{
                    display: flex;
                    margin-top: 18px;
                    .info-icon{
                        i{
                            &:before{
                                margin: 0 20px 0 0;
                                font-size: 25px;
                                color: #0b70e1;
                            }
                        }
                    }
                    .info-content{
                        .title{
                            font-size: 16px;
                            line-height: 26px;
                            font-weight: 600;
                            color: @title-color;
                            margin-bottom: 5px;
                        }
                        em{
                            display: block;
                            font-style: normal;
                            line-height: 22px;
                            font-size: 15px;
                            a{
                                color: #333333;
                            }
                        }
                    }
                }
            }
            .social{
                margin: 50px 0 0;
                li{
                    display: inline-block;
                    padding-right: 10px;
                    a{
                        i{
                            font-size: 15px;
                            color: #fff;
                            text-align: center;
                            background: #032390;
                            width: 35px;
                            height: 35px;
                            line-height: 35px;
                            border-radius: 3px;
                        }
                        &:hover{
                            opacity: 0.82;
                        }
                    }
                    &:last-child{
                        padding: 0;
                    }
                }
            }
        }
        &.home14-style-togle{
            .canvas-contact .address-area .address-list .info-content em a:hover {
                color: @orange-color2;
            }
            .canvas-contact .social li a i {
                background: @orange-color2;
            }
        }
    }
} 
body {
    .search-modal {
        background: #0B70E1;
        position: fixed;
        top: 0;
        bottom: 0;
        background: rgba(16, 110, 234, 0.98);
        width: 100%;
        height: 100%;
        z-index: 9999;
        left: 0;
        .modal-content {
            position: initial;
            border: 0;
            background: transparent;
        }
        .search-block {
            input {
                height: 60px;
                line-height: 60px;
                padding: 0 15px;
                background: transparent;
                border-width: 0 0 1px 0;
                border-radius: 0;
                border-color: rgba(255,255,255,0.4);
                box-shadow: none;
                color: #ffffff;
                font-weight: 600;
                font-size: 18px;                
            }
            ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
                color: #ffffff;
                opacity: 1;
            }
            ::-moz-placeholder { /* Firefox 19+ */
                color:#ffffff;
                opacity: 1;
            }
            :-ms-input-placeholder { /* IE 10+ */
                color: #ffffff;
                opacity: 1;
            }
            :-moz-placeholder { /* Firefox 18- */
                color: #ffffff;
                opacity: 1;
            }
        }
        .close {
            position: fixed;
            right: 50px;
            top: 50px;
            background: #ffffff;
            color: #0a0a0a;
            width: 40px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            cursor: pointer;
            border: none;
            border-radius: 50%;
            transition: all .5s ease;
            font-size: 18px;
            span::before {
                font-size: 18px;
            }
            &:hover {
                opacity: 0.8;
            }            
        }
    }
   
}
/*------------------------------------
    04. Sticky Menu CSS
--------------------------------------*/
.menu-sticky{
    background: #fff;
    margin: 0;
    z-index: 999;
    width: 100%;
    top: 0;
    position: relative;
}
@-webkit-keyframes sticky-animation {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@keyframes sticky-animation {
  0% {
    opacity: 0;
    transform: translateY(-100%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}


/* ------------------------------------
    05. About Section CSS
---------------------------------------*/
.rs-about{
    .rs-animation-shape{
        position: relative;
        z-index: 1;
        .pattern{
            position: absolute;
            top: 22px;
        }
        .middle{
            position: absolute;
            left: -165px;
            top: -56px;
            z-index: -1;
        }
        .bottom-shape{
            position: absolute;
            left: -165px;
            top: 395px;
            z-index: -1;
        }
        .middle-image2{
            position: absolute;
            top: -80px;
            left: -25px;
            z-index: -1;
        }
    }
    .shape-image{
        position: relative;
        .top{
            position: absolute;
            right: 51%;
            top: -125px;
        }
        .bottom{
            position: absolute;
            right: 0;
            top: 145px;
        }
    }
    &.style2{
        background-color: #F6F7F9;
        border-radius: 0px 270px 0px 0px;
        position: relative;
        .image-part{
            position: absolute;
            left: 35px;
            img{
                max-width: 50%;
            }
        }
        &.modify1{
            background-color: unset;
            border-radius: unset;
            position: unset;
            .images{
                left: unset;
                position: unset;
                img{
                    max-width: 600px;
                }
            }
        }
        &.modify2{
            border-radius: unset;
            position: relative;
            .about-img{
                img{
                    max-width: 690px;
                }
            }
        }
    }
    &.style3{
        position: relative;
        .rs-animation-image{
            position: relative;
            .pattern-img{
                text-align: center;
                z-index: -1;
            }
            .middle-img{
                position: absolute;
                left: 10px;
                top: -30px
            }
        }
    }
    &.style4{
        .about-content{
            .logo-img{
                margin-bottom: 15px;
                img{
                    width: 71px;
                }
            }
            .title{
                font-size: 36px;
                line-height: 46px;
                font-weight: 700;
                color: #102B3E;
                margin-bottom: 30px;
                padding-right: 24px;
                span{
                    color: #F9780F;
                }
            }
            p{
                padding-right: 121px;
                margin-bottom: 40px;
            }
        }
    }
    &.style5{
        position: relative;
        z-index: 1;
        .about-bg{
            background-color: #F5F6FE;
            opacity: 0.8;
            .about-animate{
                position: absolute;
                bottom: 0;
                right: 0;
                z-index: -11;
            }
        }
    }
    &.home14-about-style{
        .about-bottom-section{
            position: relative;
            z-index: 9;
            .addon-services{
                margin: -88px 26px 0px -20px;
                padding: 15px 20px 15px 20px;
                background-image: linear-gradient( 120deg, #1642FD 0%, #B12BF3 100%);
                border-radius: 10px 10px 10px 10px;
                display: flex;
                align-items: center;
                .icon-images{
                    img{
                        max-width: unset;
                        width: 50px;
                        height: 50px;
                    }
                }
                .services-text{
                    margin: 0px 0px 0px 20px;
                    .title{
                        font-size: 16px;
                        font-weight: 500;
                        line-height: 1.4em;
                        color: @white-color;
                        margin: 0 0 10px;
                    }
                }
            }
        }
    }
    .software-img{
        img{
            max-width: 600px;
        }
    }
}

/* ------------------------------------
    06. Banner Section CSS
---------------------------------------*/
.rs-banner  {
    &.main-home {
        background: url(assets/images/banner/banner-1.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        min-height: 765px;
        .content-wrap{
            position: relative;
            padding-top: 40px;
            .it-title{
                font-size: 52px;
                line-height: 1.3;
                font-weight: 700;
                color: @white-color;
                margin: 0;
                padding-bottom: 20px;
            }
            .description{
                .desc{
                    font-size: 20px;
                    line-height: 30px;
                    font-weight: 500;
                    color: @white-color;
                    margin: 0;
                    padding-bottom: 40px;
                }
            }
        }
    }
    &.style2{
        background: url(assets/images/banner/banner-2.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: left top;
        .banner-content{
            padding: 210px 0 210px;
            .sub-title{
                font-size: 20px;
                line-height: 30px;
                font-weight: 500;
                color: @white-color;
                text-transform: uppercase;
                margin-bottom: 20px;
            }
            .title{
                font-size: 55px;
                line-height: 65px;
                font-weight: 700;
                color: @white-color;
                text-transform: uppercase;
                margin-bottom: 20px;
            }
            .title-small{
                font-size: 32px;
                line-height: 40px;
                font-weight: 700;
                color: @white-color;
                text-transform: uppercase;
                margin-bottom: 20px;
            }
        }
    }
    &.style3{
        background-image: linear-gradient(100deg, #03228F 34%, #0E73E4 100%);
        border-radius: 0px 0px 0px 270px;
        transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
        padding: 300px 0px 270px 0px;
        position: relative;
        .banner-content{
            position: relative;
            z-index: 1;
            .sub-title{
                font-size: 18px;
                line-height: 28px;
                font-weight: 600;
                color: @white-color;
                text-transform: uppercase;
                margin-bottom: 15px;
            }
            .title{
                font-size: 52px;
                line-height: 68px;
                font-weight: 700;
                color: @white-color;
                margin-bottom: 20px;
            }
            .desc{
                font-size: 20px;
                line-height: 34px;
                font-weight: 500;
                color: @white-color;
                margin-bottom: 55px;
            }
            .banner-btn{
                li{
                    display: inline-block;
                }
            }
        }
        .images-part{
            position: absolute;
            right: 3%;
            top: 55%;
            transform: translateY(-50%);
            max-width: 48%;
        }
        &.modify1{
            border-radius: unset;
            padding: 400px 0px 190px 0px;
            .banner-content{
                .title{
                    font-size: 42px;
                    line-height: 59px;
                }
                .desc{
                    margin-bottom: 35px;
                }
                .banner-btn{
                    li{
                        display: unset;
                    }
                }
            }
            .images-part{
                position: absolute;
                right: 80px;
                top: 50%;
                transform: translateY(-50%);
                z-index: 2;
                img{
                    max-width: 900px;
                }
            }
        }
        &.modify2{
            background: unset;
            border-radius: unset;
            padding: 130px 0px 100px 0px;
            .banner-content{
                .title{
                    color: @title-color;
                }
                .desc{
                    color: @body-color;
                    margin-bottom: 35px;
                }
                .banner-btn{
                    position: relative;
                    li{
                        display: unset;
                        .rs-videos{
                           .animate-border{
                                a{
                                    left: 50%;
                                    top: 50%;
                                    transform: translate(-50%,-50%);
                                }
                           } 
                        }
                    }
                }
            }
            .banner-img{
                img{
                   max-width: 850px;
                }
            }
            .rs-animation{
                position: absolute;
                left: 0;
                top: 90px;
            }
        }
    }
    &.style4{
        background: url(assets/images/banner/banner-6.jpg);
        background-size: cover;
        background-position: top right;
        background-repeat: no-repeat;
        .banner-content{
            padding: 250px 0 250px;
            max-width: 572px;
            .sub-title{
                font-size: 14px;
                font-weight: 400;
                text-transform: uppercase;
                color: @white-color;
                display: block;
                margin-bottom: 15px;
            }
            .title{
                font-size: 60px;
                line-height: 68px;
                font-weight: 700;
                color: @white-color;
                margin-bottom: 25px;
            }
            .desc{
                font-size: 20px;
                line-height: 34px;
                font-weight: 500;
                color: @white-color;
                margin-bottom: 55px;
            }
            .banner-btn{
                position: relative;
                li{
                    display: unset;
                    .rs-videos{
                       .animate-border{
                            a{
                                left: 50%;
                                top: 50%;
                                transform: translate(-50%,-50%);
                            }
                       } 
                    }
                }
            }
        }
    }
    &.style5{
        background: url(assets/images/banner/style2/banner-9.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        position: relative;
        .banner-content{
            padding: 250px 0 200px;
            .icon-seller{
                img{
                    width: 80px;
                }
            }
            .title{
                font-size: 52px;
                line-height: 70px;
                font-weight: 700;
                color: @title-color;
                span{
                    color: #f24c1a;
                }
            }
            .desc{
                font-size: 20px;
                line-height: 30px;
                font-weight: 500;
                color: @body-color;
                margin-bottom: 40px;
                padding-right: 188px;
            }
        }
        .banner-img{
            .images-part{
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                right: 5.6%;
                max-width: 40%;
                img {
                    animation: move-y 2s alternate infinite;
                }
            }
            .layer-img{
                position: absolute;
                left: 58%;
                transform: translateX(-50%);
                bottom: 30px;
            }  
        }
    }
    &.style6{
        position: relative;
        .banner-content{
            padding: 170px 0 200px;
            .sub-text{
                font-size: 17px;
                line-height: 30px;
                font-weight: 600;
                color: #f24c1a;
                display: block;
                text-transform: uppercase;
                margin-bottom: 14px;
            }
            .title{
                font-size: 52px;
                line-height: 70px;
                font-weight: 700;
                color: @title-color;
                .blue-color{
                    color: #0073ff;
                }
                .pink-color{
                    color: #f24c1a;
                }
            }
            .desc{
                font-size: 20px;
                line-height: 30px;
                font-weight: 500;
                color: #454545;
                margin-bottom: 40px;
                padding-right: 68px;
            }
        }
        .images-part{
            position: absolute;
            right: 10%;
            top: 50%;
            transform: translateY(-50%);
            max-width: 670px;
            img {
                animation: move-y 2s alternate infinite;
            }
        }
    }
    &.style7{
        background: url(assets/images/banner/style3/home-11.jpg);
        background-color: #03228F;
        background-repeat: no-repeat;
        background-size: cover;
        .banner-content{
            padding: 208px 0 200px;
            .sub-title{
                font-size: 14px;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 1.1px;
                color: #FD6509;
                display: block;
                margin: 0px 0px 15px 0px;
            }
            .title{
                font-size: 45px;
                font-weight: 700;
                line-height: 1.3em;
                color: #fff;
                margin: 0px 0px 20px 0px;
            }
            .desc{
                font-size: 20px;
                font-weight: 500;
                line-height: 34px;
                color: @white-color;
                margin: 0px 40px 54px 0px;
            }
        }
    }
    &.style8{
        background: url(assets/images/banner/home-12.jpg);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        .banner-content{
            padding: 320px 0 360px;
            .sub-title{
                font-size: 18px;
                line-height: 32px;
                text-transform: uppercase;
                font-weight: 500;
                color: #f24c1a;
                display: block;
                margin: 0px 0px 15px 0px;
            }
            .title{
                font-size: 52px;
                font-weight: 700;
                line-height: 70px;
                color: @title-color3;
                max-width: 820px;
                margin: 0 auto 40px;
                span{
                    color: #f24c1a; 
                }
            }
           .banner-btn{
                li{
                    display: inline-block;
                    margin-right: 25px;
                    &:last-child{
                        margin-right: 0;
                    }
                }
            }
        }
    }
    &.style9{
        background: url(assets/images/banner/style4/banner-bg.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        position: relative;
        z-index: 1;
        .banner-content{
            padding: 300px 0 235px;
            .sub-text{
                font-size: 18px;
                line-height: 28px;
                font-weight: 500;
                color: @white-color;
                display: block;
                margin-bottom: 10px;
            }
            .title{
                font-size: 58px;
                line-height: 73px;
                font-weight: 700;
                color: @white-color;
                margin-bottom: 25px;
            }
            .desc{
                font-size: 18px;
                line-height: 31px;
                font-weight: 400;
                color: @white-color;
                margin-bottom: 40px;
            }
        }
        .images-part{
            img{
                position: relative;
                right: 3%;
                max-width: 650px;
                transform: translateY(20%);
            }
        }
        .banner-animation{
            .bnr-animate{
                position: absolute;
                bottom: 0;
                z-index: -11;
               &.one{
                    left: 48%;
                    top: 19%;
               }
               &.two{
                   left: 9%;
                   top: 17%;
                }
               &.three{
                    left: 31%;
                    bottom: 28%;
                }
               &.four{
                   right: 14%;
                   bottom: 28%;
                }
               &.five{
                  left: 36%;
                  bottom: 9%;
               }
               &.six{
                  left: 45%;
                  bottom: 4%;
               }
            }
        }
    }
    &.style10{
        background-image: url(assets/images/banner/banner14.jpg);
        background-repeat: no-repeat;
        .banner-content{
            padding: 305px 0 350px;
            .sub-text{
                font-size: 14px;
                line-height: 28px;
                font-weight: 500;
                letter-spacing: 1px;
                text-transform: uppercase;
                color: @white-color;
                display: block;
                margin: 0px 0px 15px 0px;
            }
            .title{
                font-size: 56px;
                font-weight: 700;
                line-height: 1.3;
                color: @white-color;
                max-width: 820px;
                margin: 0 auto 48px;
                span{
                    color: @orange-color2;
                }
            }
            .banner-btn li {
                display: inline-block;
                margin-right: 25px;
                &:last-child{
                    margin-right: 0;
                }
            }
        }
    }
}

/* ------------------------------------
    07. Breadcrumbs Section CSS
---------------------------------------*/
.rs-breadcrumbs {
    background-repeat: no-repeat !important;
    background-size: cover !important;
    .breadcrumbs-inner {
        padding: 140px 0 150px;   
        .page-title {
            font-size: 48px;
            font-weight: 700;
            line-height: 56px;
            margin-bottom: 5px;
            color: @white-color;
            &.new-title{
                margin: 0 auto;
                max-width: 850px;
            }
        }
        ul {
            padding: 0;
            li {
                color: @white-color;
                display: inline-block;
                font-size: 14px;
                font-weight: 400;
                a {
                    position: relative;
                    padding-right: 22px;
                    -webkit-transition: 0.3s;
                    transition: 0.3s;
                    color: @white-color;
                    &:before{
                        background-color: #fff;
                        content: "";
                        height: 15px;
                        width: 1px;
                        position: absolute;
                        right: 9px;
                        top: 2px;
                        transform: rotate(26deg);
                    }
                }
            }
        }   
    }
    &.img1{
        background: url(assets/images/breadcrumbs/1.jpg);
        background-position: center top;
    }
    &.img2{
        background: url(assets/images/breadcrumbs/2.jpg);
    }
    &.img3{
        background: url(assets/images/breadcrumbs/3.jpg);
    }
    &.img4{
        background: url(assets/images/breadcrumbs/4.jpg);
    }
}

/* ------------------------------------
    08. Slider Section CSS
---------------------------------------*/
.rs-slider{
    &.style1{
        .slider-content{
            padding: 260px 0 260px;
            .sl-sub-title{
                font-size: 40px;
                line-height: 45px;
                font-weight: 600;
                color: @white-color;
                margin-bottom: 25px;
            }
            .sl-title{
                font-size: 100px;
                line-height: 84px;
                font-weight: 700;
                color: @white-color;
                margin-bottom: 40px;
            }
            .sl-desc{
                font-size: 20px;
                line-height: 28px;
                font-weight: 500;
                color: @white-color;
                margin-bottom: 40px;
            }
            .slider-btn{
                li{
                    display: inline-block;
                    margin-right: 30px;
                    &:last-child{
                        margin-right: 0;
                    }
                }
            }
            &.slide1 {
                background: url(assets/images/slider/slider-1-1.jpg);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
                padding: 260px 0 270px;
            }
            &.slide2 {
                background: url(assets/images/slider/slider-2.jpg);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                width: 60px;
                height: 60px;
                line-height: 60px;
                border-radius: 50%;
                background: @white-color;
                text-align: center;
                color: @title-color;
                transition: all 0.5s;
                transition-delay: 0.70s;
                opacity: 0;
                visibility: hidden;
                i {
                    &:before {
                        content: "\f112";
                        font-family: Flaticon;
                    }
                }
                &:hover {
                    background: @primary-color;
                    color: @white-color;
                }
            }
            .owl-next {
                right: 30px;
                left: unset;
                i {
                    &:before {
                        content: "\f113";
                    }
                }
            }
        }
        &:hover {
            .owl-nav {
                .owl-next,
                .owl-prev {
                    left: 50px;
                    transition-delay: 0s;
                    visibility: visible;
                    opacity: 1;                 
                }
                .owl-next {
                    right: 50px;
                    left: unset;
                }
            }
        }       
    }
    &.style2{
        .slider-content{
            padding: 140px 0 200px;
            .sl-img {
                margin-bottom: 20px;
                img{
                    width: 90px;
                    height: 90px;
                }
            }
            .sl-title{
                font-size: 78px;
                line-height: 80px;
                font-weight: 700;
                color: @white-color;
                letter-spacing: 4px;
                margin-bottom: 20px;
            }
            .sl-title2{
                font-size: 73px;
                line-height: 80px;
                font-weight: 900;
                color: @white-color;
                margin-bottom: 30px;
            }
            .sl-desc{
                font-size: 18px;
                line-height: 28px;
                font-weight: 400;
                color: @white-color;
                max-width: 600px;
                margin-bottom: 20px;
            }
            &.slide1 {
                background: url(assets/images/slider/style2/2.jpg);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
            }
            &.slide2 {
                background: url(assets/images/slider/style2/1.jpg);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                width: 60px;
                height: 60px;
                line-height: 60px;
                border-radius: 50%;
                background: @white-color;
                text-align: center;
                color: @title-color;
                transition: all 0.5s;
                transition-delay: 0.70s;
                opacity: 0;
                visibility: hidden;
                i {
                    &:before {
                        content: "\f112";
                        font-family: Flaticon;
                    }
                }
                &:hover {
                    background: @primary-color;
                    color: @white-color;
                }
            }
            .owl-next {
                right: 30px;
                left: unset;
                i {
                    &:before {
                        content: "\f113";
                    }
                }
            }
        }
        &:hover {
            .owl-nav {
                .owl-next,
                .owl-prev {
                    left: 50px;
                    transition-delay: 0s;
                    visibility: visible;
                    opacity: 1;                 
                }
                .owl-next {
                    right: 50px;
                    left: unset;
                }
            }
        }       
    }
    &.style3{
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                left: 30px;
                transform: translateY(-50%);
                border: 1px solid #eaecf1;
                background: rgba(117, 117, 117, 0.1);
                width: 50px;
                height: 50px;
                border-radius: 50%;
                color: #787cf2;
                transition: @transition;
                margin: 0 auto;
                text-align: center;
                overflow: hidden;
                i {
                    margin-top: 15px;
                  &:before {
                      content: "\f112";
                      font-family: Flaticon;
                      font-size: 18px;
                      line-height: 18px;
                      font-weight: 400;
                  }
                }
                &:hover {
                    background: #fff;
                    color: #787cf2;
                    border: 1px solid @body-color;
                    box-shadow: 0 0 10px #eee;
                }
            }
            .owl-next {
                right: -75px;
                left: unset;
                i {
                    &:before {
                        content: "\f113";
                        font-size: 18px;
                        font-weight: 400;
                    }
                }
            }
            .owl-prev {
                right: unset;
                left: -105px;
                i {
                    &:before {
                        content: "\f112";
                        font-size: 18px;
                        font-weight: 400;
                    }
                }
            }
        }
    }
}

/*------------------------------------
    09. Video Section CSS
------------------------------------*/
.rs-video-wrap{
    margin-top: -125px;
    z-index: -111;
    .video-item{
        position: relative;
        background: url(assets/images/video/video.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center top;
        padding: 280px 0 395px;
    }
    .rs-requset{
        padding: 90px 60px 90px 60px;
        background: #f4f7ff;
       .from-control{
            width: 100%;
            max-width: 100%;
            opacity: 1;
            padding: 10px 18px;
            border: 1px solid #F1F5FB;
        }
        textarea {
            height: 120px;
        }
        ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
          color: #454545;
          opacity: 1;
        }
        ::-moz-placeholder { /* Firefox 19+ */
          color: #454545;
          opacity: 1;
        }
        :-ms-input-placeholder { /* IE 10+ */
          color: @white-color;
          opacity: 1;
        }
        :-moz-placeholder { /* Firefox 18- */
          color: #454545;
          opacity: 1;
        } 
    }
    &.style2{
        margin-top: -380px;
        z-index: -111;
        .rs-requset{
            padding: 160px 60px 160px 60px;
        }
    }
    &.style3{
        margin-top: unset;
        z-index: unset;
        .grdiant-bg{
            background-image: linear-gradient(160deg, #03228F 0%, #4E95ED 100%);
        }
        .rs-requset{
            padding: 40px 60px;
            background: transparent;
           .from-control{
                padding: 15px 15px 15px 15px;
                border-radius: 5px 5px 5px 5px;
                color: #666666;
                border-style: solid;
                border-width: 0px 0px 0px 0px;
                border-color: #EFEFEF;
                background-color: #FFFFFF;
            }
            textarea {
                height: 120px;
            }
            ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
              color: #666666;
              opacity: 1;
            }
            ::-moz-placeholder { /* Firefox 19+ */
              color: #666666;
              opacity: 1;
            }
            :-ms-input-placeholder { /* IE 10+ */
              color: #666666;
              opacity: 1;
            }
            :-moz-placeholder { /* Firefox 18- */
              color: #666666;
              opacity: 1;
            } 
        }
    }
}

/* ------------------------------------
    10. Faq Section CSS
---------------------------------------*/
.rs-faq{
    .faq-content{
        .accordion{
            border-width: 12px;
            .card{
                margin-bottom: 15px;
                border: none;
                background-color:#fff;
                border-radius: 30px;
                &:last-child {
                    margin-bottom: 0;
                }
                .card-header{
                    display: flex;
                    align-items: center;
                    padding: 0 !important;
                    border: none;
                    background-color:#fff;
                    box-shadow: unset; 
                    .card-link{
                        position: relative;
                        display: block;
                        width: 100%;
                        padding: 20px 30px 0 30px;
                        height: 65px;
                        line-height: 1.3;
                        font-size: 18px;
                        font-weight: 600;
                        background: @white-color;
                        color: @title-color;
                        border-radius:30px 30px 0 0;
                        &:after {
                            position: absolute;
                            font-family: FontAwesome;
                            content: "\f068";
                            right: 20px;
                            top: 50%;
                            transform: translateY(-50%);
                            text-align: center;
                            font-size: 12px;
                            color: @white-color;
                            background-image: linear-gradient(250deg, #4E95ED 0%, #03228F 100%);
                            width: 35px;
                            height: 35px;
                            line-height: 35px;
                            border-radius: 100%;
                        }
                        &.collapsed {
                            border-radius: 30px 30px 30px 30px;
                            &:after {
                                color: @white-color;
                                content: "\f067";
                            }
                        }
                    }
                }
                .card-body{
                    color: @title-color;
                    border-radius: 0 0 30px 30px;
                    padding: 0 30px 30px 30px !important;
                    width: 100%;
                    background: @white-color;
                }
            }
        }
    }  
}


/* ------------------------------------
    11. Counter Section CSS
---------------------------------------*/
.rs-counter{
    margin-top: -78px;
    position: absolute;
    min-width: 860px;
    right: 100px;
    .counter-top-area{
        .counter-list{
            .counter-text{
                .count-number{
                    margin-bottom: 7px;
                    .rs-count{
                        color: #03228F;
                        font-size: 48px;
                        font-weight: 900;
                        position: relative;
                        &.plus{
                            padding-right: 30px !important;
                            &:before{
                                content: '+';
                                position: absolute;
                                right: 0;
                            }
                        }
                        &.k{
                            padding-right: 30px !important;
                            &:before{
                                content: 'k';
                                position: absolute;
                                right: 0;
                            }
                        }
                    }
                }
                .title{
                    font-size: 19px;
                    line-height: 29px;
                    color: #333333;
                    font-weight: 600;
                    margin: 0;
                }
            }
        }
    }
    &.style2{
        margin-top: unset;
        position: unset;
        min-width: unset;
        right: unset;
        .counter-top-area{
            .counter-list{
                display: flex;
                align-items: center;
                .count-icon{
                    width: 80px;
                    display: inline-block;
                    padding-right: 15px;
                    img{

                    }
                }
                .counter-text{
                    .count-number{
                        margin-bottom: 7px;
                        .rs-count{
                            color: #FFFFFF;
                            font-size: 53px;
                            font-weight: 700;
                            -webkit-text-fill-color: #042BA1;
                            -webkit-text-stroke-width: 1px;
                            position: relative;
                            &.plus{
                                padding-right: 22px;
                                &:before{
                                    content: '+';
                                    position: absolute;
                                    right: 0;
                                    top: 25px;
                                    font-size: 35px;
                                }
                            }
                            &.k{
                                padding-right: 22px;
                                &:before{
                                    content: 'k';
                                    position: absolute;
                                    right: 0;
                                    top: 25px;
                                    font-size: 35px;
                                }
                            }
                        }
                    }
                    .title{
                        color: #FFFFFF;
                        font-size: 18px;
                        font-weight: 700;
                        text-transform: uppercase;
                        margin: 0;
                    }
                }
            }
        }
    }
    &.style3{
        margin-top: unset;
        position: unset;
        min-width: unset;
        right: unset;
        .counter-top-area{
            .counter-list{
                .counter-text{
                    .count-number{
                        .rs-count{
                            color: #03228F;
                            font-size: 45px;
                            font-weight: 700;
                            padding: 0px 0px 0px 0px;
                            &.orange-color{
                                color: #DD4C23;
                            }
                        }
                    }
                    .title{
                        font-size: 18px;
                        font-weight: 600;
                        color: @title-color;
                    }
                }
            }
        }
        &.modify1{
            background-image: linear-gradient(180deg, #03228F 0%, #4E95ED 100%);
            .counter-top-area{
                text-align: center;
                .counter-list{
                    .counter-text{
                        .count-number{
                            .rs-count{
                                color: @white-color;
                            }
                            .prefix{
                                font-size: 16px;
                                color: @white-color;
                                font-weight: 700;
                            }
                        }
                        .title{
                            color: @white-color;
                        }
                    }
                }
            }
        }
        &.modify2{
            .counter-top-area{
                text-align: center;
                .counter-list{
                    .counter-text{
                        .count-number{
                            padding: 0px 0px 10px 0px;
                            .rs-count{
                                &.purple-color{
                                    color: #7D88FC;
                                }
                                &.blue-color{
                                    color: #0073FF;
                                }
                                &.pink-color{
                                    color: #F1491A;
                                }
                                &.paste-color{
                                    color: #39EBE6;
                                }
                            }
                        }
                        .title{
                            color: #454545;
                            font-size: 20px;
                            font-weight: 600;
                        }
                    }
                }
            }
        }
        &.modify3{
            margin-top: -210px;
            .counter-top-area{
                text-align: center;
                background: #fff;
                box-shadow: 0px 0px 20px 0px #eee;
                padding: 70px 20px 90px 20px;
                .counter-list{
                    .counter-text{
                        position: relative;
                        z-index: 1;
                        .count-number{
                            padding: 0px 0px 10px 0px;
                            .rs-count{
                                font-size: 40px;
                                font-weight: 700;
                                line-height: 48px;
                                color: #787CF2;
                                padding: 0px 0px 12px 0px;
                            }
                        }
                        .title{
                            font-size: 16px;
                            line-height: 18px;
                            font-weight: 600;
                            color: #454545;
                            margin: 0;
                        }
                        &:before{
                            content: '';
                            position: absolute;
                            right: 76px;
                            top: -16px;
                            width: 85px;
                            height: 137px;
                            background: #f9f9f9;
                            z-index: -11;
                        }
                    }
                }
            }
        }
    }
    &.style4{
        margin-top: -130px;
        position: unset;
        min-width: unset;
        right: unset;
        .counter-top-area{
            text-align: center;
            .counter-list{
                .counter-text{
                    .count-number{
                        margin-bottom: 7px;
                        .rs-count{
                            color: #fff;
                            font-size: 52px;
                            font-weight: 700;
                            &.plus{
                                padding-right: 30px !important;
                                &:before{
                                    content: '+';
                                    position: absolute;
                                    right: 0;
                                }
                            }
                            &.k{
                                padding-right: 30px !important;
                                &:before{
                                    content: 'k';
                                    position: absolute;
                                    right: 0;
                                }
                            }
                        }
                    }
                    .title{
                        color: #fff;
                        font-size: 20px;
                        font-weight: 400;
                    }
                }
            }
        }
    }
    &.style5{
        margin-top: unset;
        position: relative;
        min-width: unset;
        right: unset;
        margin: unset;
        .counter-top-area{
            padding: 15px;
            .images-part{
                img{
                    border-radius: 10px 10px 10px 10px;
                }
            }
            .counter-list{
                margin: -186px -20px 0px 20px;
                padding: 215px 30px 25px 20px;
                background-color: #663DEC;
                border-radius: 10px 10px 10px 10px;
                .counter-text{
                    .count-number{
                        margin-bottom: 7px;
                        .rs-count{
                            color: #FF7045;
                            font-weight: 700;
                        }
                    }
                    .title{
                        font-size: 20px;
                        line-height: 20px;
                        color: @white-color;
                    }
                }
                &:hover{
                    background-image: linear-gradient(180deg, #343DFB 0%, #932FF5 100%);
                }
            }
        }
    }
}


/* ------------------------------------
    12. Contact Section CSS
---------------------------------------*/
.rs-contact{
    .contact-wrap{
        background: @white-color;
        padding: 25px 40px 50px;
        border-radius: 10px 10px 10px 10px;
        .content-part{
            text-align: center;
            .title{
              font-size: 24px;
              line-height: 40px;
              font-weight: 700;
              color: @title-color2;
              margin: 0; 
            }
            .desc{
                margin: 0;
            }
        }
        .from-control{
            padding: 12px 16px 12px 16px;
            border-radius: 5px 5px 5px 5px;
            border-style: solid;
            border-color: #02010100;
            background-color: #F6F7F9;
            color: @body-color;
            width: 100%;
            opacity: 4;
        }
        ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
          color: #454545;
          opacity: 1;
        }
        ::-moz-placeholder { /* Firefox 19+ */
          color:#454545;
          opacity: 1;
        }
        :-ms-input-placeholder { /* IE 10+ */
          color: #454545;
          opacity: 1;
        }
        :-moz-placeholder { /* Firefox 18- */
          color: #454545;
          opacity: 1;
        } 
    }
    .contact-box{
        background-image: linear-gradient(250deg, #4E95ED 0%, #03228F 100%);
        padding: 80px 30px 80px 30px;
        border-radius: 5px 5px 5px 5px;
        .address-box{
            display: flex;
            .address-icon{
                background-image: linear-gradient(275deg, #FFFFFF 0%, #FCFCFF 100%);
                min-width: 48px;
                height: 48px;
                line-height: 48px;
                text-align: center;
                width: 40px;
                border-radius: 50%;
                margin-right: 23px;
                i{
                    font-size: 20px;
                    line-height: 20px;
                    color: #03228F;
                }           
            }
            .address-text{
                .label{
                    font-size: 16px;
                    font-weight: 600;
                    color: @white-color;
                    display: block;
                    margin-bottom: 5px;
                }
                a{
                   color: @white-color;
                   &:hover{
                        color: #ccc;
                    } 
                }
                .desc{
                    color: @white-color;
                }
            }
        }
        &.onepage-box{
            background-image: linear-gradient( 220deg , #f27c1e 0%, #dd4c23 79%);
            .address-box{
                .address-icon{
                    background: white-color;
                    i{
                        color: @orange-color;
                    }           
                }
            }
            &.modify1{
                background-image: linear-gradient(  250deg , #9C9FF9 0%, #6E71DB 100%);
                .address-box{
                    .address-icon{
                        background: white-color;
                        i{
                            color: #787cf2;
                        }           
                    }
                }
            }
            &.home14-onepage-style{
                background-image: linear-gradient( 250deg, #932FF5 0%, #343DFB 100%);
            }
        }
    }
    .contact-widget{
        .from-control{
            padding: 20px 20px 20px 20px;
            border-radius: 5px 5px 5px 5px;
            border-style: solid;
            border-width: 0px 0px 0px 0px;
            background-color: #F6F7F9;
            width: 100%;
            max-width: 100%;
        }
        textarea {
            height: 120px;
        }
        ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
          color: #454545;
          opacity: 1;
        }
        ::-moz-placeholder { /* Firefox 19+ */
          color: #454545;
          opacity: 1;
        }
        :-ms-input-placeholder { /* IE 10+ */
          color: #454545;
          opacity: 1;
        }
        :-moz-placeholder { /* Firefox 18- */
          color: #454545;
          opacity: 1;
        }
        &.onepage-style{
            .from-control{
                background: #fff;
            }
        } 
    }
    .map-canvas{
        overflow: hidden;
        iframe {
            float: left;
            width: 100%;
            height: 620px;
            border: unset;
        }
    }
    &.style2{
        .contact-box-wrap{
            background-image: linear-gradient(270deg, #4E95ED 0%, #03228F 100%);
            border-radius: 5px 5px 5px 5px;
            padding: 90px 60px 60px 60px;
            .from-control{
                padding: 16px 16px 16px 16px;
                border-radius: 5px 5px 5px 5px;
                border-style: solid;
                border-width: 1px 1px 1px 1px;
                border-color: #F1F5FB;
                width: 100%;
                max-width: 100%;
            }
            textarea {
                height: 120px;
            }
            ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
              color: #454545;
              opacity: 1;
            }
            ::-moz-placeholder { /* Firefox 19+ */
              color: #454545;
              opacity: 1;
            }
            :-ms-input-placeholder { /* IE 10+ */
              color: #454545;
              opacity: 1;
            }
            :-moz-placeholder { /* Firefox 18- */
              color: #454545;
              opacity: 1;
            } 
        }
    }
    &.negative-margin{
        margin-top: -315px;
    }
}

/* ------------------------------------
    13. Cta Section CSS
---------------------------------------*/
.rs-cta{
    &.style1{
        .title-wrap{
            .epx-title{
                font-size: 36px;
                font-weight: 700;
                line-height: 46px;
                color: #fff;
                margin: 0px;
            }
        }
        span{
            font-weight: 500;
            margin: 0 0 10px;
            display: block;
            line-height: 28px;
            font-family: 'Livvic', sans-serif;
            font-size: 14px;
            letter-spacing: 1px;
            text-transform: uppercase;
            color: #FFFFFF;
        }
        &.bg-widget{
            background-image: linear-gradient(150deg, #03228f 46%, #0e73e4 100%)
        }
    }
}

/* ------------------------------------
    14. Skill-bar Section CSS
---------------------------------------*/
.rs-skillbar{
   &.style1{
       .cl-skill-bar{
            .skillbar-title {
                font-weight: 500;
                color: #212121;
                font-size: 14px;
                color: #212121;
            }
            .skillbar{
                background: #eeeeee;
                height: 7px;
                margin: 10px 0 24px;
                position: relative;
                width: 100%;
                .skillbar-bar{
                background: @primary-color;
                width: 0;
                margin-bottom: 0;              
                height: 7px;
                line-height: 7px;
                background-color: transparent;
                background-image: linear-gradient(190deg, #105AAD 0%, #4E95ED 100%);
                background-size: 1rem 1rem;
                }
                .skill-bar-percent {
                  height: 30px;
                  line-height: 30px;
                  position: absolute;
                  right: 0;
                  top: -38px;
                  font-size: 16px;
                  font-weight: 700;
                  color: #0a0a0a;
                }
            }
        }
        &.modify1{
            .cl-skill-bar{  
                .skillbar-title {
                   text-transform: uppercase;
                }           
                .skillbar{
                    background-color: #DFEDFE;
                    .skillbar-bar{
                        background: @secondary-color;
                    }
                    .skill-bar-percent {
                        height: 30px;
                        line-height: 30px;
                        position: absolute;
                        right: 0;
                        top: -38px;
                        font-size: 16px;
                        font-weight: 700;
                        color: #0a0a0a;
                        &.white-color{
                            color: #fff;
                        }
                    }
                }
            } 
        }
        &.modify2{
           .cl-skill-bar{  
               .skillbar-title {
                  text-transform: uppercase;
               }           
               .skillbar{
                   background: #fff;    
                   border: 1px solid #0B70E1;
                   height: 9px;
                   border-radius: 0;
                   overflow: visible;
                   padding: 1px;
                   .skillbar-bar{
                        background: #007bff;
                        background-image: linear-gradient(250deg, #0b70e1 19%, #03228f 100%);
                        height: 5px;
                    }
                   .skill-bar-percent {
                        right: 70px;
                        color: #454545;
                        font-weight: 400;
                    }
                }
            }  
        }
        &.modify3{
            padding: 0 120px 0 0;
            .cl-skill-bar{ 
               .skillbar{
                    height: 8px;
                    line-height: 8px;
                    padding: 1px 1px 1px 1px;
                    border-style: solid;
                    border-width: 1px 1px 1px 1px;
                    border-color: #FF571C;
                    background-color: #BF1F1F00;
                    border-radius: 3px 3px 3px 3px;
                   .skillbar-bar{
                      height: 100%;
                      background: #FF571C;
                    }
                   .skill-bar-percent {
                        right: 70px;
                        color: #454545;
                        font-weight: 400;
                    }
                    &.purple-style{
                        border-color: #7E06E4;
                        .skillbar-bar{
                           background: #7E06E4;
                        }
                    }
                    &.blue-style{
                        border-color: #0073FF;
                        .skillbar-bar{
                           background: #0073FF;
                        }
                    }
                }
            }
            &.skillbar-home14{
                padding: 0 0px 0 0;
                .cl-skill-bar .skillbar-title {
                    font-weight: 400;
                    font-size: 16px;
                }
                .cl-skill-bar{ 
                   .skillbar{
                        border-color: #FF571C;
                       .skillbar-bar{
                          background: #FF7045;
                        }
                       .skill-bar-percent {
                            right: 70px;
                            color: #454545;
                            font-weight: 400;
                        }
                        &.purple-style{
                            border-color: #0073FF;
                            .skillbar-bar{
                               background: #0073FF;
                            }
                        }
                        &.blue-style{
                            border-color: #39ECE6;
                            .skillbar-bar{
                               background: #39ECE6;
                            }
                        }
                    }
                }
            }  
        }
        &.home4{
            .skillbar{
                .skillbar-bar{
                    background-color:  #FD6509;
                    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 
                    25%, transparent 25%, transparent 50%,
                    rgba(255, 255, 255, 0.15) 
                    50%, rgba(255, 255, 255, 0.15) 75%, 
                    transparent 75%, transparent);
                    &.paste-bg{
                        background-color: #03DEA8;
                    }
                    &.blue-bg{
                        background-color:  #0A99FD;
                    }
                    &.pink-bg{
                        background-color: #F00674;
                    }
                }
            }
        }
    }
}

/* ------------------------------------
    15. Choose Section CSS
---------------------------------------*/
.rs-why-choose{
    .services-wrap{
        display: flex;
        align-items: center;
        .services-icon{
            padding: 5px 5px 0 0;
            img{
                height: 55px;
            }
        }
        .services-text{
            padding: 0px 0px 0px 15px;
            .title{
                font-size: 20px;
                line-height: 30px;
                font-weight: 600;
                margin-bottom: 10px;
                a{
                    color: @title-color2;
                    &:hover{
                        color: @primary-color;
                    }
                }
            }
            .services-txt{
                margin: 0;
            }
        }
    }
    &.style1{
        .services-wrap{
            .services-text{
                .title{
                    a{
                        color: @white-color;
                        &:hover{
                            color: #ec6f22;
                        }
                    }
                }
                .services-txt{
                    color: @white-color;
                }
            }
        }
    }
    .animation{
        .top-shape{
            position: absolute;
            top: 0;
            z-index: -111;
        }
        .bottom-shape{
            position: absolute;
            bottom: -70px;
            right: 0;
            z-index: -111;
        }
        &.style2{
            .top-shape{
                top: -30px;
                z-index: -111;
            }
            .bottom-shape{
                bottom: 0px;
                right: 30px;
                z-index: -111;
            }
        }
    }
    .image-part{
        position: relative;
        z-index: 1;
    }
    .shape-animate{
       .top-shape{
            position: absolute;
            top: -30px;
       }
       .bottom-shape{
            position: absolute;
            bottom: 0px;
            right: 30px;
       }
    }
    &.style2{
        .services-wrap{
            display: flex;
            align-items: center;
            .services-icon{
                padding: 5px 5px 0 0;
                img{
                    height: 55px;
                }
            }
            .services-text{
                padding: 0px 0px 0px 15px;
                .title{
                    font-size: 22px;
                    line-height: 32px;
                    font-weight: 600;
                    margin-bottom: 10px;
                    a{
                        color: @title-color2;
                        &:hover{
                            color: @primary-color;
                        }
                    }
                }
                .services-txt{
                    margin: 0;
                }
            }
        }
        &.modify1{
            .services-wrap{
                .services-text{
                    .title{
                        a{
                            color: @white-color;
                        }
                    }
                    .services-txt{
                       color: @white-color;
                       &:hover{
                           color: #ec6f22;
                       }
                    }
                }
            }
        }
    }
    &.style3{
        .features-content{
            .features-list{
                li{
                    margin: 0px 0px 17px 0px;
                    display: flex;
                    align-items: center;
                    i{
                        font-size: 30px;
                        width: 40px;
                        margin-right: 10px;
                        color: #0b70e1
                    }
                    span{
                        color: #fff;
                        font-size: 22px;
                        font-weight: 500;
                        display: block;
                    }
                }
            }
        }
        .features-wrap{
            .sub-title{
                font-size: 19px;
                line-height: 40px;
                font-weight: 700;
                color: #fff;
                margin-bottom: 25px;
            }
            .title{
                font-size: 44px;
                line-height: 40px;
                font-weight: 700;
                color: #fff;
                margin-bottom: 35px;
            }
            .desc{
                font-size: 19px;
                line-height: 27px;
                font-weight: 400;
                color: @white-color;
                margin-bottom: 45px;
            }
        }
    }
}

/* ------------------------------------
    16. Team Section CSS
---------------------------------------*/
.rs-team{
    background: url(assets/images/bg/team-bg.png);
    background-position: center center;
    background-size: cover;
    background-color: #000060;
    .team-item-wrap{
        .team-wrap{
            padding: 9px 35px 25px 20px;
            background: url(assets/images/team/ngbng.png);
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
            .image-inner{
                overflow: hidden;
                border-radius: 50%;
                a{
                    img{
                transform: scale(1);
                -webkit-transition: 0.3s ease-in-out;
                transition: 0.3s ease-in-out;
                    }
                }
            }
        }
        .team-content{
            padding: 20px 20px 20px;
            .person-name{
                font-size: 22px;
                font-weight: 600;
                line-height: 44px;
                margin-bottom: 5px; 
                a{
                    color: @white-color;
                }                
            }
            .designation{
                display: block;
                font-size: 15px;
                font-weight: 400;
                line-height: 26px;
                color: @white-color;
                margin-bottom: 15px;             
            }
            .team-social{
                li{
                    display: inline-block;
                    margin-right: 10px;
                    a{
                        i{
                            font-size: 15px;
                            line-height: 14px;
                            font-weight: 400;
                            color: @white-color;                                 
                        }
                    }
                    &:last-child{
                        margin-right: 0;
                    }
                }
            }
        }
        &:hover{
            .team-wrap{
                .image-inner{
              
                    a{
                        img{
                                transform: scale(1.3);
                        }
                    }
                }
            }
        }
    }
    .owl-dots {
        text-align: center;
        .owl-dot{
            width: 25px;
            height: 8px;
            display: inline-block;
            margin: 0 6px;
            padding: 3px 0;
            border-radius: 30px;
            border: none;
            transition: @transition;
            background: #0B70E1;
            box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
            &:hover,
            &.active {
              width: 40px;
              background: #0B70E1;
              opacity: 1;
            }
        }
    }
    .owl-stage-outer {
        padding: 10px;
        margin: -10px;
    }
    &.onepage-team{
        background: url(assets/images/bg/team-bg.png);
        background-color: #F6F7F9;
        .team-item-wrap{
            .team-content{
                padding: 20px 20px 20px;
                .person-name{
                    a{
                        color: @title-color;
                    }                
                }
                .designation{
                    color: @title-color;           
                }
                .team-social{
                    li{
                        a{
                            i{
                                color: @body-color;                                
                            }
                        }
                    }
                }
            }
        }
        &.change-bg{
           background-color: #F5F5F5;
        }
        &.modify1{
            background-color: #000000;
            .team-item-wrap{
                .team-content{
                    padding: 20px 20px 20px;
                    .person-name{
                        a{
                            color: @white-color;
                        }                
                    }
                    .designation{
                        color: @white-color;           
                    }
                    .team-social{
                        li{
                            a{
                                i{
                                    color: @white-color;                                
                                }
                            }
                        }
                    }
                }
            }
            .owl-dots {
                text-align: center;
                .owl-dot{
                    width: 25px;
                    height: 8px;
                    display: inline-block;
                    margin: 0 6px;
                    padding: 3px 0;
                    border-radius: 30px;
                    border: none;
                    transition: @transition;
                    background: #0B70E1;
                    box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
                    &:hover,
                    &.active {
                      width: 40px;
                      background: #FD6509;
                      opacity: 1;
                    }
                }
            }
        }
    }
    &.onepage-style2{
        border-radius: 270px 0px 0px 0px;
    }
    &.modify1{
        background: unset;
        .team-item-wrap{
            .team-content{
                .person-name{
                    a{
                        color: @title-color;
                    }                
                }
                .designation{
                    color: @title-color;            
                }
                .team-social{
                    li{
                        a{
                            i{
                                color: @body-color;                                 
                            }
                        }
                    }
                }
            }
        }
    }
    &.style2{
        background: unset;
        .team-item{
            .images-part{
                position: relative;
                overflow: hidden;
                .social-icon{
                    position: absolute;
                    bottom: 0;
                    right: -50px;
                    width: 50px;
                    background: @secondary-color;
                    padding: 12px 6px 12px;
                    transition: all 0.3s ease 0s;
                    visibility: hidden;
                    opacity: 0;
                    a{

                      i{
                            font-size: 15px;
                            line-height: 35px;
                            width: 35px;
                            height: 35px;
                            color: @white-color;
                            background: @secondary-color;
                            text-align: center;
                            border-radius: 50%;
                            transition: all 0.3s ease 0s;
                            margin: 0;
                        }
                    }                  
                }              
            }
            .team-content{
                box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.05);
                background-color: #FFFFFF;
                text-align: center;
                margin: 0;
                padding: 20px;
                .person-name{
                    font-weight: 600;
                    font-size: 20px;
                    margin-bottom: 2px;
                    text-transform: capitalize;
                    line-height: 1.3;
                    a{
                       color: #0A0A0A;
                       &:hover{
                            color: @primary-color;
                       }
                    }
                }    
                .designation{                        
                    font-size: 14px;
                    font-weight: 400;
                    text-transform: uppercase;
                    color: #555555;
                    display: block;
                }
            }
            &:hover {
                .images-part {
                    .social-icon {
                        right: 0;
                        width: 50px;
                        opacity: 1;
                        visibility: visible;
                    }
                }
            }
        }
        &.onepage-style3{
            .team-item{
                .images-part{
                    .social-icon{
                        background: #F9780F;
                        a{

                          i{
                                background: #F9780F;
                            }
                        }                  
                    }              
                }
                .team-content{
                    .person-name{
                        a{
                           &:hover{
                                color: #F9780F;
                           }
                        }
                    }  
                }
            }
        }
        &.onepage-style4{
            background: #f5f6fe;
            .owl-stage-outer {
                padding: unset;
                margin: unset;
            }
            .team-item{
                .images-part{
                    img{
                        border-radius: 5px 5px 0 0;
                    }
                }
                .team-content{
                    .person-name{
                        font-size: 20px;
                        font-weight: 700;
                        margin-bottom: 8px;
                        a{
                           &:hover{
                                color: #787cf2;
                           }
                        }
                    }
                    .designation{
                        font-size: 15px;
                        text-transform: capitalize;
                    }  
                }
            }
            .owl-dots {
                text-align: center;
                .owl-dot{
                    width: 25px;
                    height: 8px;
                    display: inline-block;
                    margin: 0 6px;
                    padding: 3px 0;
                    border-radius: 30px;
                    border: none;
                    transition: @transition;
                    background: #787cf2;
                    box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
                    &:hover,
                    &.active {
                      width: 40px;
                      background: #787cf2;
                      opacity: 1;
                    }
                }
            }
        }
    }
    &.home14-team-style{
        background: unset;
        .team-top-section{
            padding: 0% 0% 0% 20.5%;
            .team-item-wrap{
                padding: 0 35px 0 15px;
                min-height: 500px;
                .images-wrap{
                    img{
                        border-radius: 10px;
                    }
                }
                .team-content{
                    background-image: linear-gradient(110deg, #483AFA 0%, #982EF5 100%);
                    text-align: center;
                    color: #fff;
                    margin: -310px -20px 0px 20px;
                    padding: 332px 35px 0 35px;
                    border-radius: 10px;
                    .title-name{
                        font-size: 22px;
                        line-height: 32px;
                        font-weight: 700;
                        margin-bottom: 0;
                        a{
                            color: @white-color;
                            &:hover{
                                color: @orange-color2;
                            }
                        }
                    }
                    .team-title{
                        color: @white-color;
                        display: block;
                        font-weight: 500;
                        margin: 0;
                    }
                    .footer-social{
                        margin-top: 20px;
                        transform: scaleY(0);
                        transition: .5s;
                        height: 0;
                        li{
                            display: inline;
                            margin-right: 8px;
                            a{
                                display: inline-block;
                                width: 35px;
                                height: 35px;
                                line-height: 35px;
                                border-radius: 5px;
                                color: @white-color;
                                background: #7e52f8;
                                text-align: center;
                                font-size: 15px;
                                transition: all .8s ease;
                                &:hover{
                                    background: @orange-color2;
                                }
                            }
                            &:last-child{
                                margin-right: 0;
                            }
                        }
                    }
                }
                &.slick-current:not(:hover),
                &:hover{
                    .team-content{
                        .footer-social{
                            transform: scaleY(1);
                            height: 68px;
                        } 
                    }
                }
            }
            .slick-arrow{
                position: absolute;
                font-size: 0;
                background-image: linear-gradient( 90deg,#483afa 0%,#982ef5 100%);
                border: none;
                color: @white-color;
                width: 50px;
                height: 50px;
                line-height: 50px;                    
                border-radius: 50%;
                z-index: 1;
                top: -23%;
                &:before {
                    content: "\f115";
                    font-family: Flaticon;
                    font-size: 18px;
                    font-weight: 400;
                }
                &.slick-prev{
                    right: 27%;
                }
                &.slick-next{
                    right: 22.5%;
                    &:before {
                        content: "\f114";
                    }
                }
            }  
        }
    }
}
.rs-team-Single{
    .btm-info-team{
        position: relative;
        box-shadow: 0px 0px 32px 0px rgba(7, 28, 31, 0.05);
        background: #fff;
        margin-bottom: 70px;
        padding: 40px;
        .images-part{
            padding: 0 30px 0 0;
            img{
                border-radius: 50%;
            }
        }
        .con-info{
            position: relative;
            .designation-info{
                font-size: 16px;
                line-height: 27px;
                font-weight: 400;
                color: #0B70E1;
                display: block;
                text-transform: uppercase;
            }
            .title{
                font-size: 36px;
                line-height: 46px;
                font-weight: 700;
                color: @title-color;
                margin-bottom: 10px;
            }
            .short-desc{
                font-size: 16px;
                line-height: 26px;
                font-weight: 400;
                color: @body-color;
                margin-bottom: 25px;
                padding-right: 50px;
            }
            .ps-informations{
                .personal-info{
                    li{
                        margin: 5px 0 10px;
                        padding: 0;
                        display: block;
                        span{
                            i{
                                &:before{
                                    color: #0b70e1;
                                    margin-right: 18px;
                                    position: relative;
                                    top: 2px;
                                    font-weight: 500;
                                    display: inline-block;
                                    text-align: center;
                                }
                            }
                        }
                        a{
                            color: #555;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                }
                .social-info{
                    margin-top: 15px;
                    li{
                        display: inline-block;
                        margin-right: 18px;
                        a{
                            color: #555;
                        }
                        &:last-child{
                            margin-right: 0;
                        }
                    }
                }
            }
            &:before{
                content: "\f10b";
                font-size: 250px;
                position: absolute;
                right: 130px;
                color: #0a0a0a;
                font-family: "Flaticon";
                height: 100%;
                top: 250px;
                opacity: 0.02;
            }
        }
    }
}

/* ------------------------------------
    17. Services Section CSS
---------------------------------------*/
.rs-services{
    &.main-home{
        .services-item{
            margin: 0px 0px 0px 0px;
            padding: 60px 25px 50px 35px;
            background-color: #FFFFFF;
            border-radius: 10px 10px 10px 10px;
            .services-icon{
                margin-bottom: 30px;
                .image-part{
                    img{
                        width: 80px;
                        height: 80px;
                    }
                }
            }
            .services-content{
                .services-text{
                    .services-title{
                        font-size: 22px;
                        font-weight: 600;
                        line-height: 30px;
                        margin-bottom: 10px;
                        a{
                            color: @title-color;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                }
                .services-desc{
                    p{
                        color: #444;
                        margin: 0;
                    }
                }
            }
        }
        &.style1{
            position: relative;
            z-index: 111;
            margin-top: -200px;
            .services-item{
                text-align: center;
                background-color: #FFFFFF;
                border-radius: 10px 10px 10px 10px;
                box-shadow: 0px 0px 48px 0px rgba(162, 162, 162, 0.5);
                margin: 0px -10px 0px 0px;
                padding: 40px;
                .services-icon{
                    margin-bottom: 15px;
                    .image-part{
                        img{
                            width: 80px;
                            height: 80px;
                        }
                    }
                }
                .services-content{
                    .services-text{
                        .services-title{
                            margin-bottom: 5px;
                        }
                    }
                }
            }
        }
        &.style2{
            .services-item{
                padding: 65px 35px 35px 35px;
                margin: 0px -10px 0px 0px;
                text-align: center;
                border-radius: unset;
                .services-icon{
                    position: relative;
                    border-radius: 100%;
                    width: 100px;
                    height: 100px;
                    line-height: 100px;
                    margin: 0 auto 42px;
                    position: relative;
                    background-color: #FFFFFF;
                    box-shadow: 0 28px 28px 0 rgba(108, 88, 250, 0.2);
                    z-index: 1;
                    &:before{
                        position: absolute;
                        content: '';
                        right: -1px;
                        bottom: -2px;
                        width: 112px;
                        height: 112px;
                        border-radius: 100%;
                        border: 1px solid;
                        transition: all 0.3s ease 0s;
                        z-index: 0;
                        border-color: #1443C61C;
                    }
                }
                .shape-part{
                    position: absolute;
                    top: 30px;
                    right: 76px;
                    opacity: 0;
                    visibility: hidden;
                }
                .services-content{
                    .services-text{
                        .services-title{
                            a{
                                &:hover{
                                    color: #061340;
                                }
                            }
                        }
                    }
                }
                &.active{
                   box-shadow: 3px 7px 25px 0px rgba(0, 0, 0, 0.05);
                   background: @white-color; 
                }
                &:hover{
                    box-shadow: 3px 7px 25px 0px rgba(0, 0, 0, 0.05);
                    background: @white-color;
                    .services-icon{
                        position: relative;
                        &:before{
                            display: none;
                        }
                    }
                    .shape-part{
                        opacity: 1;
                        visibility: visible;
                    }
                }
            }
        }
        &.style3{
            .services-item{
                padding: 50px 50px 50px 50px;
                background-color: #F3F7FF;
                border-radius: 10px 10px 10px 10px;
                box-shadow: unset;
                margin: 0px -10px 0px 0px;
                .services-content{
                    padding: unset;
                    position: unset;
                }
                &:hover{
                    background-color: #FFFFFF;
                    .services-content{
                       padding: unset;
                       position: unset;
                       .services-desc{
                            p{
                                color: @body-color;
                            }
                       }
                    }
                }
            }
        }
    }
    .bg-section{
        background: @white-color;
        .shape-part{
            .left-side{
                position: absolute;
                bottom: 0px;

            }
            .right-side{
                position: absolute;
                bottom: 0px;
                right: 0;
            }
        }
    }
    &.style2{
        .flip-box-inner{
            position: relative;
            z-index: 1;
            margin: 0;
            padding: 0;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            perspective: 1000px;
            .flip-box-wrap{
                .front-part{
                    .front-content-part{
                        background-color: #FFFFFF;
                        text-align: center;
                        padding: 50px 40px 50px 40px;
                        border-style: solid;
                        border-width: 0px 0px 0px 0px;
                        border-radius: 10px 10px 10px 10px;
                        box-shadow: 3px 7px 25px 0px rgba(0, 0, 0, 0.05);
                        .front-icon-part{
                            margin-bottom: 15px;
                            .icon-part{
                                img{
                                    width: 60px;
                                    height: 60px;
                                }
                            }
                        }
                        .front-title-part{
                            .title{
                                font-size: 20px;
                                font-weight: 700;
                                line-height: 30px;
                                margin-bottom: 10px;
                                a{
                                    color: @title-color;
                                    &:hover{
                                        color: @primary-color;
                                    }
                                }
                            }
                        }
                        .front-desc-part{
                            p{
                               color: #444;
                               margin: 0; 
                            }
                        }
                    }
                }
                .back-front{
                    transform: rotateX(180deg);
                    position: absolute;
                    z-index: -1;
                    padding: 30px;
                    border-radius: 5px;
                    background-color: #562dd4;
                    top: 0;
                    right: 0;
                    left: 0;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    align-items: center;
                    -ms-flex-align: center;
                    height: 300px;
                    background-color: transparent;
                    background-position: center;
                    background-clip: padding-box;
                    background-size: cover;
                    background-repeat: no-repeat;
                    text-align: center;
                    -webkit-backface-visibility: hidden;
                    backface-visibility: hidden;
                    -webkit-perspective: 1000px;
                    perspective: 1000px;
                    -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                    transition: -webkit-transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                    transition: transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                    transition: transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275), 
                    -webkit-transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                    .back-front-content{
                        .back-title-part{
                            .back-title{
                                font-size: 20px;
                                line-height: 30px;
                                font-weight: 600;
                                margin-bottom: 15px;
                                a{
                                    color: @white-color;
                                }
                            }
                        }
                    }
                }
            }
            &:hover{
                .flip-box-wrap{
                    .back-front{
                       transform: rotateX(0);
                       z-index: 1;
                       background-image: linear-gradient(90deg, #1672DE 0%, #071F6B 58%);
                       .back-front-content{
                            .back-title-part{
                                .back-title{
                                    color: @white-color;
                                }
                            }
                            .back-desc-part{
                                .back-desc{
                                    color: @white-color;
                                }
                            }
                       }
                    }
                }
            }
        }
        &.modify1{
           .flip-box-inner{
               .flip-box-wrap{
                   .front-part{
                       .front-content-part{                            
                            height: 350px;
                           .front-icon-part{
                               margin-bottom: 15px;
                               .icon-part{
                                   img{
                                       width: 60px;
                                       height: 60px;
                                   }
                               }
                           }
                           .front-title-part{
                               .title{
                                   font-size: 20px;
                                   font-weight: 700;
                                   line-height: 30px;
                                   margin-bottom: 10px;
                                   a{
                                       color: @title-color;
                                       &:hover{
                                           color: @primary-color;
                                       }
                                   }
                               }
                           }
                           .front-desc-part{
                               p{
                                  color: #444;
                                  margin: 0; 
                               }
                           }
                           
                           &.purple-bg {
                                background: url(assets/images/services/main-home/icons/bg-box.png);
                           }
                           &.gold-bg {
                                background: url(assets/images/services/main-home/icons/bg-box-2.png);
                           }
                           &.blue-bg {
                                background: url(assets/images/services/main-home/icons/bg-box-3.png);
                           }
                           &.purple-bg,
                           &.gold-bg,
                           &.blue-bg{
                                background-size: cover;
                                background-position: center center;
                           }
                       }
                   }
                   .back-front{
                       transform: rotateX(180deg);
                       position: absolute;
                       z-index: -1;
                       padding: 30px;
                       border-radius: 5px;
                       background-color: #562dd4;
                       top: 0;
                       right: 0;
                       left: 0;
                       display: -webkit-box;
                       display: -webkit-flex;
                       display: -ms-flexbox;
                       display: flex;
                       -webkit-box-align: center;
                       -webkit-align-items: center;
                       align-items: center;
                       -ms-flex-align: center;
                       height: 350px;
                       background-color: transparent;
                       background-position: center;
                       background-clip: padding-box;
                       background-size: cover;
                       background-repeat: no-repeat;
                       text-align: center;
                       -webkit-backface-visibility: hidden;
                       backface-visibility: hidden;
                       -webkit-perspective: 1000px;
                       perspective: 1000px;
                       -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                       transition: -webkit-transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                       transition: transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                       transition: transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275), 
                       -webkit-transform 0.6s cubic-bezier(0.2, 0.85, 0.4, 1.275);
                       .back-front-content{
                           .back-title-part{
                               .back-title{
                                   color: @white-color;
                                   font-size: 20px;
                                   line-height: 30px;
                                   font-weight: 600;
                                   margin-bottom: 15px;
                               }
                           }
                       }
                   }
               }
               &:hover{
                   .flip-box-wrap{
                       .back-front{
                            transform: rotateX(0);
                            z-index: 1;
                            background-image: linear-gradient(90deg, #1672DE 0%, #071F6B 58%);
                            &.purple-bg{
                                background: #7218f9;
                            }
                            &.gold-bg{
                                background: #fc821b;
                            }
                        }
                    }
               }
           } 
        }
    }
    &.style3{
        .services-item{
            padding: 50px 28px 50px 28px;
            background-color: #FFFFFF;
            border-radius: 10px 10px 10px 10px;
            box-shadow: 0px 0px 50px 11px rgba(94.71195652173914, 138.17261342155012, 235.5, 0.05);
            position: relative;
            text-align: left;
            .services-icon{
                position: relative;
                transition: all .3s ease;
                .image-part{
                    .main-img{
                        height: 70px;
                        width: 70px;
                    }
                    .hover-img{
                        height: 70px;
                        width: 70px;
                        position: absolute;
                        left: 0;
                        top: 0;
                        visibility: hidden;
                        opacity: 0;
                        transform: scale(0);
                        transition: all .3s ease;
                    }
                }
            }
            .services-content{
                padding: 33px 0px 0px 0;
                position: relative;
                .services-text{
                    .title{
                        font-size: 20px;
                        font-weight: 600;
                        line-height: 30px;
                        margin-bottom: 13px;
                        a{
                            color: #1c1b1b;
                        }
                    }
                }
                .services-desc{
                    p{
                      margin: 0;
                    }
                }
                .serial-number{
                    position: absolute;
                    right: 15px;
                    top: -113px;
                    font-size: 70px;
                    font-weight: 600;
                    line-height: 119px;
                    color: #02010108;
                    margin-bottom: 10px;
                }
            }
            &:hover{
                background-color: #FD660A;
                &.pink-bg{
                    background: #F30876;
                }
                &.aqua-bg{
                    background: #05DBEE;
                }
                &.paste-bg{
                    background: #13E1AF;
                }
                &.purple-bg{
                    background:  #780FDA;
                }
                &.green-bg{
                    background: #0A99FD;
                }
                &.blue-bg{
                    background: #2c44e4;
                }
                &.gold-bg{
                    background: #f5be18;
                }  
                &.cyan-bg{
                    background: #14d2f5;
                }
                &.orange-bg{
                    background: #FD660A;
                }
                &.light-purple-bg{
                    background-image: linear-gradient( 90deg, #6E71DB 41%, #9C9FF9 100%);
                }
                .services-icon{
                    position: relative;
                    transition: all .3s ease;
                    .image-part{
                        .main-img{
                            transform: scale(0);
                        }
                        .hover-img{
                            visibility: visible;
                            opacity: 1;
                            transform: scale(1);
                        }
                    }
                }
                .services-content{
                    padding: 33px 0px 0px 0;
                    position: relative;
                    .services-text{
                        .title{
                            a{
                                color: @white-color;
                            }
                        }
                    }
                    .services-desc{
                        p{
                           color: @white-color;
                        }
                    }
                    .serial-number{
                        color: #FFFFFF26;
                    }
                }
            }
            &.services-item{
                padding: 50px 36px 50px 36px;
            }
        }
        &.modify1{
            .services-item{
                text-align: center;
                .services-icon{
                    .image-part{
                        .hover-img{
                            left: 50%;
                            transform: scale(0) translateX(-50%);
                        }
                    }
                }
                &:hover{
                    &.pink-light-bg{
                        background: #f072d6;
                    }
                    &.blue2-bg{
                        background: #4790f2;
                    }
                    &.paste2-bg{
                        background: #67c565;
                    }
                    &.purple2-bg{
                        background:  #626ff3;
                    }
                    &.cyan2-bg{
                        background: #4ccbe6;
                    }
                    &.pink2-bg{
                        background: #e65599;
                    }
                    .services-icon{
                        .image-part{
                            .main-img{
                                transform: scale(0);
                            }
                            .hover-img{
                                visibility: visible;
                                opacity: 1;
                                transform: scale(1) translateX(-50%);
                            }
                        }
                    }
                    .services-content{
                        padding: 33px 0px 0px 15px;
                        position: relative;
                       .services-button{
                            a{
                                color: @white-color;
                                &:after{
                                    color: @white-color;
                                }
                            }
                        }
                    }
                }
                &.services-item{
                    padding: 50px 25px 50px 25px;
                }
            }
        }
        &.modify2{
            .services-item{
                display: flex;
                margin: 0px -13px 0px 0px;
                padding: 35px 37px 35px!important;
                background-color: #fff;
                box-shadow: 0 0 30px #eee;
                border-radius: 3px 3px 3px 3px;
                .services-icon{
                    .image-part{
                        .main-img{
                           max-width: unset;
                        }
                    }
                }
                .services-content{
                    padding: 0px 0px 0px 20px;
                }
                &:hover{
                    background-color: #FD660A;
                    &.pink-bg{
                        background: #F30876;
                    }
                    &.aqua-bg{
                        background: #05DBEE;
                    }
                    &.paste-bg{
                        background: #13E1AF;
                    }
                    &.purple-bg{
                        background:  #780FDA;
                    }
                    &.green-bg{
                        background: #0A99FD;
                    }
                    &.blue-bg{
                        background: #2c44e4;
                    }
                    &.gold-bg{
                        background: #f5be18;
                    }  
                    &.cyan-bg{
                        background: #14d2f5;
                    }
                    .services-content{
                        padding: 0px 0px 0px 20px;
                    }
                }
            }
        }
        &.modify3{
            .services-item{
                background-color: #131313;
                box-shadow: unset;
                .services-content{
                    .services-text{
                        .title{
                            a{
                                color: @white-color;
                            }
                        }
                    }
                    .services-desc{
                        p{
                            color: @white-color;
                        }
                    }
                    .serial-number{
                        color: #FFFFFF08;
                    }
                }
            }
        }
    }
    &.style4{
        .services-item{
            text-align: center;
            padding: 50px 40px 50px 40px;
            .services-icon{
                margin-bottom: 20px;
                img{
                    width: 50px;
                    height: 50px;
                }
            }
            .services-content{
                .title{
                    font-size: 22px;
                    line-height: 32px;
                    font-weight: 600;
                    margin-bottom: 10px;
                    a{
                        color: #102B3E;
                        &:hover{
                            color: @primary-color;
                        }
                    }
                }
                .desc{
                    margin-bottom: 15px;
                }
            }
        }
        .hover-effect{
            &:hover .services-item:hover,
            &:not(:hover) .active {
                background: @white-color;
                box-shadow: 3px 7px 25px 0px rgba(0, 0, 0, 0.05);
            }
        }
        &.modify1{
            .services-item{
                text-align: left;
                display: flex;
                padding: 40px 30px 35px 30px;
                .services-icon{
                   padding: 8px 0px 0px 0px;
                   font-size: 50px;
                   line-height: 50px;
                    img{
                       max-width: unset
                    }
                }
                .services-content{
                    padding: 0px 0px 0px 15px;
                    .title{
                        a{
                            color: #102B3E;
                            &:hover{
                                color:  #032390;
                            }
                        }
                    }
                }
            }
            &.services3{
                .services-item{
                    padding: 50px 25px 33px 25px;
                    background-color: #FFFFFF;
                    border-radius: 10px 10px 10px 10px;
                    margin: 0 -10px 0 0;
                }
            }
        }
    }
    &.style5{
        .services-item{
            padding: 25px 25px 25px 25px;
            background-color: #F1F6FC;
            border-radius: 4px 4px 4px 4px;
            margin: 0 -12px 0 0;
            display: flex;
            .services-icon{
                padding: 5px 5px 0px 0px;
                img{
                    height: 65px;
                    width: 65px;
                    max-width: unset;
                }
            }
            .services-content{
                padding: 0px 0px 0px 15px;
                .services-title{
                    font-size: 20px;
                    font-weight: 600;
                    line-height: 30px;
                    margin-bottom: 10px;
                    a{
                        color: @title-color;
                        &:hover{
                            color: @primary-color;
                        }
                    } 
                }
                .services-desc{
                    color: #444444;
                    margin-bottom: 0px; 
                }
            }
        }
    }
    &.style6{
        .services-item{
            padding: 0px 44px 0px;
            text-align: center;
            .services-icon{
                padding-bottom: 35px;
                img{
                    transition: all ease .3s;
                }
            }
            .services-content{
                .services-title{
                    .title{
                        font-size: 24px;
                        font-weight: 600;
                        line-height: 34px;
                        margin: 0px 20px 8px 20px;
                        a{
                            color: #102B3E;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                }
            }
            &:hover{
                .services-icon{
                    img{
                        transform: scale(1.1) rotate(4deg);
                    }
                }
            }
        }
    }
    &.style7{
        .services-item{
            .services-img{
                overflow: hidden;
                border-radius: 5px;
                a{
                    img{                    
                        transition: all .8s ease;
                        transform: scale(1);
                    }
                }
            }
            .services-content{
                padding-top: 25px;
                .services-title{
                    .title{
                        font-size: 22px;
                        font-weight: 600;
                        line-height: 32px;
                        margin: 0 0 10px 0;
                        a{
                            color: @title-color3;
                            &:hover{
                                color: @orange-color;
                            }
                        }
                    }
                }
                .services-txt{
                    margin-bottom: 20px;
                    padding-right: 34px;
                }
            }
            &:hover{
                .services-img{
                    a{
                        img{
                            transform: scale(1.1);
                        }
                    }
                }
            }
        }
        .animation-layer{
            position: relative;
            .shape-layer{
                position: absolute;
                right: -6%;
                bottom: -58px;
            }
        }
    }
    &.style8{
        .services-item{
            padding: 67px 35px 65px 35px;
            background-color: #E0F0FD;
            border-radius: 0px 0px 0px 0px;
            .services-img{
                margin-bottom: 25px;
                img{
                    height: 80px;
                    width: 80px;
                    max-width: unset;
                }
            }
            .services-content{
                .services-title{
                    .title{
                        font-size: 22px;
                        font-weight: 700;
                        line-height: 30px;
                        color: #0A0A0A;
                        margin-bottom: 15px;
                        &:hover{
                            color: #787CF2;
                        }
                    }
                }
                .services-txt{
                    color: #444444;
                    margin: 0;
                }
            }
            &.gray-light-bg{
                background-color: #D9F3F6;
            } 
            &.pink-bg{
                background-color: #F0E4FB;
            }
        }
    }
    &.style9{
        .services-top-section{
            margin-top: -525px;
            padding: 520px 0px 110px 0px;
            position: relative;
            .services-item{
                padding: 15px;
                .image-part{
                    img{
                        border-radius: 10px 10px 10px 10px;
                    }
                }
                .addon-services{
                    margin: -220px -20px 0px 20px;
                    padding: 265px 35px 20px 35px;
                    background-color: #6A40F9;
                    border-radius: 10px 10px 10px 10px;
                    .services-icon{
                        margin-bottom: 22px;
                        img{
                            max-width: unset;
                            width: 50px;
                            height: 50px;
                        }
                    }
                    .services-text{
                        .title{
                            font-size: 22px;
                            line-height: 32px;
                            font-weight: 700;
                            margin: 0 0 10px;
                            a{
                                color: @white-color;
                                &:hover{
                                    color: @orange-color2;
                                }
                            }
                        }
                    }
                    &:hover{
                        background-image: linear-gradient( 180deg, #343DFB 0%, #932FF5 100%);
                    }
                }
            }
        }
    }
    .shape-animation{
        position: relative;
       .shape-part{
            position: absolute;
            left: -50px;
            bottom: 150px;
        }
    }
}
.rs-services-single{
    .services-add{
        background: url(assets/images/services/single/contact-phone.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        text-align: center;
        border-radius: 5px;
        padding: 50px 35px 53px;
        .title{
            font-size: 24px;
            line-height: 42px;
            font-weight: 700;
            color: @white-color;
            margin-bottom: 30px;
        }
        .contact{
            a{
               font-size: 30px;
               line-height: 40px;
               font-weight: 700;
               color: @white-color; 
            }
        }
    }
    .brochures{
        background-color: #F0F5FF;
        padding: 35px 30px 45px 30px;
        border-radius: 5px 5px 5px 5px;
    }
}

.rs-case-studies-single{
    .services-add{
        background-image: linear-gradient(250deg, #0b70e1 19%, #03228f 100%);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        text-align: center;
        border-radius: 5px;
        padding: 50px 35px 53px;
        .title{
            font-size: 24px;
            line-height: 42px;
            font-weight: 700;
            color: @white-color;
            margin-bottom: 30px;
        }
        .contact{
            a{
               font-size: 30px;
               line-height: 40px;
               font-weight: 700;
               color: @white-color; 
            }
        }
    }
    .brochures{
        background-color: #F0F5FF;
        padding: 35px 30px 45px 30px;
        border-radius: 5px 5px 5px 5px;
    }
    .services-img{
        img{
            border-radius: 5px;
        }
    }
    .ps-informations {
        ul{
            margin: 0;
            list-style: none;
            text-align: left;        
            padding: 0;
        }
        ul {
            li {
                color: #fff;
                + li {
                    padding-top: 10px;
                    margin-top: 10px;
                    border-top: 1px solid rgba(54, 54, 54, 0.1);
                }
                span {
                    width: 150px;
                    display: inline-block;
                    font-weight: 600;
                }
            }
        }
    }
    .ps-informations{
        padding: 40px 30px 46px;
        border-radius: 5px;
        background-image: linear-gradient(250deg, #0b70e1 19%, #03228f 100%);
        .info-title{
            padding-bottom: 10px;
            color: #fff;
        }
    }
}

/* ------------------------------------
    18. Process Section CSS
---------------------------------------*/
.rs-process{
    .rs-addon-number{
        .number-text{
            .number-area{
                display: block;
                font-size: 50px;
                font-weight: 700;
                line-height: 1.4;
                color: @secondary-color;
            }
            .number-title{
                .title{
                    font-size: 24px;
                    line-height: 34px;
                    font-weight: 600;
                    color: @title-color;
                    margin-bottom: 10px;
                }
            }
            .number-txt{
                margin: 0;
                padding-right: 34px;
            }
        }
    }
    &.modify1{
        background-image: linear-gradient(140deg, #03228F 62%, #0E73E4 100%);
        border-radius: 270px 0px 0px 0px;
        .rs-addon-number{
            .number-text{
                margin: 0px 25px 0px 30px;
                padding: 0px 48px 11px 48px;
                background-color: #182AEE45;
                border-radius: 10px 10px 50px 10px;
                position: relative;
                .number-area{
                    font-size: 41px;
                    font-weight: 600;
                    line-height: 62px;
                    position: relative;
                    color: @white-color;
                    display: inline-block;
                    width: 70px;
                    height: 70px;
                    left: -70px;
                    top: -30px;
                    text-align: center;
                    background: #06D3E5;
                    transition: all 0.3s ease 0s;
                    border-radius: 50%;
                    &.green-bg{
                        background: #3BCD4C;
                    }
                    &.plum-bg{
                        background: #9439E9;
                    }
                    &.pink-bg{
                        background: #f30876;
                    }
                }
                .number-title{
                    .title{
                        color: @white-color;
                        margin-bottom: 15px;
                    }
                }
                .number-txt{
                    color: @white-color;
                    margin-bottom: 40px;
                    padding-right: 0;
                }
            }
        }
    }
    &.style2{
        .addon-process{
            .process-wrap{
                .process-img{
                    padding: 10px 10px 10px 10px;
                    img{
                        width: 100%;
                        height: auto;
                    }
                }
                .process-text{
                    text-align: center;
                    padding: 15px 0 0;
                    .title{
                        font-size: 24px;
                        line-height: 32px;
                        font-weight: 600;
                        color: @title-color2;
                        margin-bottom: 0;
                        &:hover{
                            color: #061340;
                        }
                    }
                }
            }
        }
    }
    &.style3{
        .rs-addon-number{
            margin: 0px -10px 0px 0px;
            padding: 37px 30px 37px 38px;
            background-color: #FFFFFF;
            border-bottom: 7px solid #095fd0;
        }
    } 
    &.style4{
        .rs-addon-number{
            margin: 0px -10px 0px 0px;
            padding: unset;
            background-color: unset;
            .number-text{
                .number-area{ 
                    display: inline-block;
                    width: 50px;
                    line-height: 50px;
                    z-index: 1;
                    position: relative;
                    transition: all 0.3s ease 0s;
                    text-align: center;
                    width: 64px;
                    height: 54px;
                    top: -20px;
                    &:after{
                        content: "";
                        width: 100%;
                        height: 100%;
                        position: absolute;
                        top: -15px;
                        left: 0;
                        z-index: -1;
                        transform: rotate(45deg);
                        transition: all 0.3s ease 0s;
                        border-radius: 50px 50px 50px 50px;
                        background: #A0B3F8;
                    }
                }
            }
        }
    }
    &.style5{
        .rs-addon-number{
            .number-text{
                .number-area{
                    color: @white-color;
                }
                .number-title{
                    .title{
                       color: @white-color;
                    }
                }
                .number-txt{
                   color: @white-color;
                }
            }
        }
    }
    &.style6{
        .tab-area{
            .nav{
                border-bottom: unset;
                li{
                    .tab-item{
                        padding: 20px 30px;
                        display: block;
                        position: relative;
                        transition: all ease .6s;
                        h3{
                            font-size: 22px;
                            line-height: 32px;
                            font-weight: 600;
                            color: @title-color3;
                            margin-bottom: 8px;
                            text-decoration: underline;
                        }
                        p {
                            font-size: 16px;
                            line-height: 26px;
                            font-weight: 400;
                            color: @title-color;
                            height: 0;
                            opacity: 0;
                            margin: 0;
                            transition: all ease .4s;
                        }
                        &.active {
                            background: #f8f6ff;
                            h3{
                                color: @orange-color;
                            }
                            p {
                                height: auto;
                                opacity: 1;
                                transition: all ease .8s;
                            }
                        }
                    }
                }
            }
           
        }
    }
    .shape-animation{
        position: relative;
        .shape-process{
            position: absolute;
            left: 180px;
            top: 50px
        }
    }
}

/*------------------------------------
    19. Pricing Section CSS
------------------------------------*/
.rs-pricing{
    margin-top: -150px;
    position: relative;
    .pricing-table{
        padding: 27px 40px 0px 40px;
        box-shadow: 0 0 30px #eee;
        background: @white-color;
        border-radius: 10px 10px 10px 10px;
        position: relative;
        text-align: center;
        margin: 0px 7px 0px 0px;
        .pricing-badge{
            top: 30px;
            left: 0px;
            padding: 10px 23px 11px 23px;
            background-color: #1273EB;
            border-radius: 0px 30px 30px 0px;
            font-size: 13px;
            font-weight: 500;
            text-transform: uppercase;
            position: absolute;
            color: #fff;
            line-height: 1;
            z-index: 1;
            &.white-color-bg{
                background: @white-color;
                color: @primary-color;
            }
            &.secondary-bg{
                background: @secondary-color;
            }
        }
        .pricing-icon{
            margin-bottom: 60px;
            img{
                width: 110px;
            }
        }
        .pricing-table-price{
            margin-bottom: 30px;
            .pricing-table-bags{
                .pricing-currency{
                    font-size: 25px;
                    font-weight: 600;
                    color: @title-color;
                }
                .table-price-text{
                    font-size: 52px;
                    font-weight: 600;
                    color: @title-color;
                }
                .table-period{
                    color: #435761;
                    font-size: 16px;
                    font-weight: 500;
                    display: block;
                }
            }
        }
        .pricing-table-body{
            margin-bottom: 10px;
            border-style: solid;
            border-width: 1px 0px 0px 0px;
            border-color: #EBEBEB;
            padding: 18px 15px 4px 15px;
            li{
                text-align: left;
                padding: 9px 0px 9px 0px;
                margin-bottom: 0px;
                font-size: 15px;
                font-weight: 400;
                i{
                    float: right;
                    margin-right: 0;
                    color: @primary-color;
                }
                span{

                }
            }
        }
        &.primary-bg{
            background-image: linear-gradient(70deg, #0B70E1 0%, #03228F 100%);
            .pricing-table-price{
                .pricing-table-bags{
                    .pricing-currency{
                        color: @white-color;
                    }
                    .table-price-text{
                        color: @white-color;
                    }
                    .table-period{
                       color: @white-color;
                    }
                }
            }
            .pricing-table-body{
                border-color: #1F71C1;
                li{
                    color: @white-color;
                    i{
                        color: @white-color;
                    }
                }
            }
        }
        &.light-gray-bg{
            background-color: #F3F7FF;
            border-style: solid;
            border-width: 1px 1px 1px 1px;
            border-color: #EBEBEB;
            border-radius: 5px 5px 5px 5px;
            box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0);
            .pricing-table-price{
                .pricing-table-bags{
                    .pricing-currency{
                        color: @secondary-color;
                    }
                    .table-price-text{
                        color: @secondary-color;
                    }
                }
            }
            .pricing-table-body{
                li{
                    
                    i{
                        color: @title-color;
                    }
                }
            }
        }
        &.new-style{
            box-shadow: unset;
            background: unset;
            border-style: solid;
            border-color: #EBEBEB;
            border-width: 1px 1px 1px 1px;
        } 
        &.new-style2{
            background: unset;
            border-style: solid;
            border-color: #EBEBEB;
            border-width: 1px 1px 1px 1px;
        }
    }
    &.style2{
        margin-top: unset;
        position: unset;
        &.modify1{
            .pricing-table{
                .pricing-icon{
                    img{
                        
                    }
                }
               .pricing-table-body{
                   li{
                   
                       i{
                           color: @secondary-color;
                        }
                    }
               }
            }
        }
        &.modify1{
            background-color: unset;
        }
    }
}

/*------------------------------------
    20. Technology Section CSS
------------------------------------*/
.rs-technology{
    .technology-item{
        text-align: center;
        padding: 20px 40px 20px 40px;
        a{
            overflow: hidden;
            .logo-img{
                img{
                   
                }
            }
        }
    }
    &.style2{
       .technology-wrap{
            .rs-grid-figure{
                position: relative;
                text-align: center;
                padding: 45px 30px 45px 30px;
                border-style: solid;
                border-width: 1px 1px 1px 1px;
                border-color: #a7acb4;
                border-radius: 4px 4px 4px 4px;
                transition: all ease .4s;
                .logo-img{
                    overflow: hidden;
                    a{
                        overflow: hidden;
                        display: inline-block;
                        position: relative;
                        .hover-img{
                            transition: all ease .4s;
                            filter: grayscale(100%);
                            display: block;
                            position: absolute;
                            z-index: 1;
                            top: 0;
                            left: 0;
                            visibility: hidden;
                        }
                        .main-img{
                            transition: all ease .4s;
                            filter: grayscale(100%);
                        }
                    }
                }
            }
            .logo-title{
                position: relative;
                text-align: center;
                padding: 30px 0px 0px 0px;
                .title{
                    font-size: 18px;
                    font-weight: 600;
                    text-transform: uppercase;
                    color: @white-color;
                    margin: 36px 0px 0px 0px;
                }
                &:before{
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 50%;
                    height: 40px;
                    width: 1px;
                    transform: translateX(-50%);
                    background-color: #a7acb4;
                    -webkit-transition: all 0.25s ease;
                    transition: all 0.25s ease;
                }
                &:after{
                    content: '';
                    position: absolute;
                    top: 40px;
                    left: 50.3%;
                    height: 12px;
                    border-radius: 50%;
                    width: 12px;
                    transform: translateX(-50%);
                    background-color: #a7acb4;
                    -webkit-transition: all 0.25s ease;
                    transition: all 0.25s ease;
                }
            }
            &:hover{
                .rs-grid-figure{
                    border-color: #fff;
                    background-color: #fff;
                    .logo-img{
                        a{
                            .hover-img{
                                display: block;
                                opacity: 3;
                                visibility: visible;
                                transform: translateY(0%);
                                filter: grayscale(0%);
                            }
                            .main-img{
                                display: block;
                                visibility: hidden;
                                transform: translateY(100%);
                            }
                        }
                    }
                }
                .logo-title{
                 
                    &:before{
                        background-color: #fff;
                    }
                    &:after{
                        background-color: #fff;
                    }
                }
            }
       }
    }
}

/*------------------------------------
    21. Industry Section CSS
------------------------------------*/
.rs-industry{
    .all-services{
        display: inline-block;
        .services-item{
            padding: 10px;
            width: 20%;
            float: left;
            .services-wrap{
                padding: 35px 27px 35px 27px;
                background: @white-color;
                box-shadow: 0px 0px 50px 2px rgba(0, 0, 0, 0.03);
                text-align: center;
                .services-icon{
                    margin-bottom: 15px;
                    img{
                        height: 65px;
                        width: 65px;
                    }
                }
                .services-text{
                    .title{
                        font-size: 20px;
                        line-height: 28px;
                        font-weight: 600;
                        color: @title-color2;
                        margin-bottom: 0;
                        &:hover{
                            color: #061340;
                        }
                    }
                }
            }
        }
    }
}

/*------------------------------------
    22. Project Section CSS
------------------------------------*/
.rs-project{
    &.style1{
        .owl-stage-outer{
            padding-bottom: 70px;
        }
        .project-item{
            position: relative;
            overflow: visible;
            .project-img{
                position: relative;
                z-index: 1;
                overflow: hidden;
                img{
                    width: 100%;
                    transition: 1.3s all ease;
                    border-radius: 5px;
                }
            }
            .project-content{
                background: #fff;
                box-shadow: 0 6px 25px rgba(0, 0, 0, 0.07);
                position: absolute;
                bottom: -60px;
                left: 35px;
                right: 35px;
                padding: 34px 0;
                border-radius: 5px;
                transition: all 0.5s ease-in-out;
                z-index: 10;
                text-align: center;
                .title{
                    font-size: 24px;
                    line-height: 30px;
                    font-weight: 600;
                    margin-bottom: 8px;
                    a{
                        color: @title-color;
                    }
                }
                .category{
                    font-size: 16px;
                    line-height: 26px;
                    font-weight: 500;
                    display: block;
                    a{
                        color: @primary-color;
                    }
                }
            }
            &:hover{
                .project-img{
                 
                    img{
                        transform: scale(1.3);
                    }
                }
                .project-content{
                    bottom: -50px;
                }
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                width: 42px;
                height: 42px;
                line-height: 42px;
                border-radius: 50%;
                background: @white-color;
                text-align: center;
                color: @title-color;
                transition: all 0.5s;
                transition-delay: 0.70s;
                opacity: 0;
                visibility: hidden;
                i {
                    &:before {
                        content: "\f111";
                        font-family: Flaticon;
                    }
                }
                &:hover {
                    color: @primary-color;
                }
            }
            .owl-next {
                right: -50px;
                left: unset;
                i {
                    &:before {
                        content: "\f110";
                    }
                }
            }
        }
        &:hover {
            .owl-nav {
                .owl-next,
                .owl-prev {
                    left: -50px;
                    transition-delay: 0s;
                    visibility: visible;
                    opacity: 1;                 
                }
                .owl-next {
                    right: -50px;
                    left: unset;
                }
            }
        }
    }
    &.style2{
        .project-item{
            position: relative;
            overflow: hidden;
            .project-img{
                img{
                    width: 100%;
                    border-radius: 5px;
                }
            }
            .project-content{
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 40%;
                text-align: center;
                z-index: 10;
                padding: 25px;
                opacity: 0;
                -webkit-transition: 0.3s all ease-out;
                transition: 0.3s all ease-out;
                border-radius: 5px;
                z-index: 1;
                .title{
                    font-size: 24px;
                    line-height: 30px;
                    font-weight: 600;
                    margin-bottom: 8px;
                    a{
                        color: @white-color;
                    }
                }
                .category{
                    font-size: 16px;
                    line-height: 26px;
                    font-weight: 500;
                    display: block;
                    a{
                        color: @white-color;
                    }
                }
                &:before{
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    background: rgba(0, 0, 0, 0.5);
                    transition: all 0.3s ease 0s;
                    border-radius: 5px;
                }
            }
            &:hover{
                .project-content{
                    top: 0;
                    opacity: 1;
                    z-index: 1;
                }
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                width: 42px;
                height: 42px;
                line-height: 42px;
                border-radius: 50%;
                background: @white-color;
                text-align: center;
                color: @title-color;
                transition: all 0.5s;
                transition-delay: 0.70s;
                opacity: 0;
                visibility: hidden;
                i {
                    &:before {
                        content: "\f111";
                        font-family: Flaticon;
                    }
                }
                &:hover {
                    color: @primary-color;
                }
            }
            .owl-next {
                right: -50px;
                left: unset;
                i {
                    &:before {
                        content: "\f110";
                    }
                }
            }
        }
        &:hover {
            .owl-nav {
                .owl-next,
                .owl-prev {
                    left: -50px;
                    transition-delay: 0s;
                    visibility: visible;
                    opacity: 1;                 
                }
                .owl-next {
                    right: -50px;
                    left: unset;
                }
            }
        }
    }
    &.style3{
        background-image: linear-gradient(150deg, #03228F 46%, #0E73E4 100%);
        border-radius: 0px 270px 0px 0px;
        padding: 110px 70px 120px 70px;
        .project-item{
            position: relative;
            overflow: hidden;
            z-index: 1;
            border-radius: 5px;
            .project-img{
                a{
                    img{
                        transition: 1.3s all ease;
                        border-radius: 5px;
                    }
                }
            }
            .project-content{
                position: absolute;
                padding: 24px 30px;
                opacity: 1;
                z-index: 10;
                top: 0;
                border: none;
                bottom: 0;
                left: 0;
                right: 0;
                text-align: left;
                width: 100%;
                .portfolio-inner{
                    position: absolute;
                    bottom: 30px;
                    right: 40px;
                    left: 40px;
                    display: flex;
                    flex-wrap: wrap;
                    transition: all .5s ease;
                    width: 100%;
                    .title{
                        margin-top: 8px;
                        font-size: 24px;
                        line-height: 30px;
                        font-weight: 600;
                        margin-bottom: 8px;
                        transform: translateY(0);
                        order: 2;
                        flex: 0 0 100%;
                        a{
                            color: @white-color;
                        }
                    }
                    .category{
                        font-size: 16px;
                        line-height: 26px;
                        font-weight: 500;
                        display: block;
                        flex: 0 0 100%;
                        transform: translateY(0px);
                        a{
                            color: @white-color;
                        }
                    }
                }
                &:before{
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    transition: all .3s ease 0s;
                    border-radius: 5px;
                    background: rgba(0, 0, 0, 0.4);
                    opacity: 1;
                }
            }
            &:hover{
                .project-img{
                    a{
                        img{
                           transform: scale(1.2);
                        }
                    }
                }
                .project-content{
                    opacity: 1;
                    .portfolio-inner{
                        bottom: 50px;
                    }
                }
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                width: 42px;
                height: 42px;
                line-height: 42px;
                border-radius: 50%;
                background: @white-color;
                text-align: center;
                color: @title-color;
                transition: all 0.5s;
                transition-delay: 0.70s;
                opacity: 0;
                visibility: hidden;
                i {
                    &:before {
                        content: "\f111";
                        font-family: Flaticon;
                    }
                }
                &:hover {
                    color: @primary-color;
                }
            }
            .owl-next {
                right: -50px;
                left: unset;
                i {
                    &:before {
                        content: "\f110";
                    }
                }
            }
        }
        &:hover {
            .owl-nav {
                .owl-next,
                .owl-prev {
                    left: -50px;
                    transition-delay: 0s;
                    visibility: visible;
                    opacity: 1;                 
                }
                .owl-next {
                    right: -50px;
                    left: unset;
                }
            }
        }
        &.modify1{
            background-image: unset;
            border-radius: unset;
            padding: 100px 0;
            margin-left: -80px;
            &.mod {
                padding: 120px 0;
                .project-item{
                    .project-img{
                        a{
                            img{
                                width: 380px;
                                max-width: 380px;
                            }
                        }
                    }
                }
            }
            .owl-nav {
                .owl-next,
                .owl-prev {
                    box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
                    width: 50px;
                    height: 50px;
                    line-height: 50px;
                    border-radius: 50%;
                    background: unset;
                    color:  #fff;
                    border: 1px solid #fff;
                    transform: translateY(-50%);
                    transition: 0.6s ease all;
                    z-index: 9;
                    text-align: center;
                    visibility: visible;
                    opacity: 1; 
                    i {
                        &:before {
                            content: "\f111";
                            font-family: Flaticon;
                            font-size: 18px;
                            font-weight: 400;
                        }
                    }
                    &:hover {
                        color: #ccc;
                    }
                }
                .owl-next {
                   top: 350px;
                    right: 1704px;
                    i {
                        &:before {
                            content: "\f110";
                        }
                    }
                }
                .owl-prev{
                    left: -470px;
                    top: 350px;
                }
            }
            &:hover {
                .owl-nav {
                    .owl-next,
                    .owl-prev {
                                        
                    }
                    .owl-next {
                                                
                    }
                }
            }
            &.case-style3{
                margin-left: unset;
                padding: 120px 0;
            }
        }
    }
    &.style4{
        .project-item{
            position: relative;
            overflow: hidden;
            .project-img{
                img{
                    border-radius: 5px;
                }
            }
            .project-content{
                position: absolute;
                padding: 30px 20px 30px;
                opacity: 0;
                z-index: 1;
                bottom: -150px;
                left: 50%;
                transform: translateX(-50%);
                width: 86%;
                z-index: 9;
                background: #ffffff;
                transition: 0.6s;
                .category{
                    margin: 0;
                    a{
                        font-size: 16px;
                        color: #0B70E1;
                    }
                }
                .title{
                    font-size: 20px;
                    font-weight: 700;
                    a{
                        color: #0F0F0F;
                    }
                }
            }
            &:hover{
                .project-content{
                    opacity: 1;
                    bottom: 30px;
                }
            }
        }
    }
    &.style5{
        .project-item{
            position: relative;
            overflow: hidden;
            z-index: 1;
            border-radius: 5px;
            transition: @transition;
            .project-img{
                img{
                    border-radius: 5px;
                }
            }
            .project-content{
                opacity: 0;
                visibility: hidden;
                .p-icon{
                    position: absolute;
                    top: 40px;
                    right: 0px;
                    bottom: 20px;
                    text-align: right;
                    width: 50px;
                    height: 50px;
                    line-height: 50px;
                    text-align: center;
                    background: #fff;
                    border-radius: 50%;
                    transition: @transition;
                    z-index: 11;
                    a{
                        display: block;
                        i{
                            &:before{
                                color: #1C1B1B;
                            }
                        }
                    }
                }
                .project-inner{
                    position: absolute;
                    bottom: 0px;
                    left: 25px;
                    transition: @transition;
                    .title{
                        font-size: 14px;
                        font-weight: 400;
                        text-transform: uppercase;
                        margin-bottom: 5px;
                        a{
                            color: @white-color;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                    .category{
                        font-size: 22px;
                        line-height: 37px;
                        font-weight: 600;
                        display: block;
                        a{
                            color: @white-color;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                }
            }
            &:before{
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: #1C232F;
                opacity: 0;
                visibility: hidden;
                transition: .3s all ease;
            }
            &:hover{
                .project-content{
                    opacity: 1;
                    visibility: visible;
                    .p-icon{
                        right: 25px;
                        a{
                            display: block;
                            i{
                                &:before{
                                    color: #1C1B1B;
                                }
                            }
                        }
                    }
                    .project-inner{
                        bottom: 20px;
                    }
                }
                &:before{
                  opacity: 0.5;
                  visibility: visible;
                }
            }
        }
    }
    &.style6{
        .project-item{
            position: relative;
            overflow: hidden;
            transition: @transition;
            .project-img{ 
                position: relative;
                img{
                    border-radius: 5px;
                }
                .plus-icon{
                    width: 50px;
                    height: 50px;
                    text-align: center;
                    line-height: 50px;
                    border-radius: 50px;
                    color: @title-color;
                    background: #fff;
                    position: absolute;
                    right: 30px;
                    top: 30px;
                    opacity: 0;
                    visibility: hidden;
                    transition: @transition;
                    i{
                        font-size: 14px;
                        color: @title-color;
                    }
                }
            }
            .project-content{
                margin-top: 25px;
                .title{
                    font-size: 22px;
                    font-weight: 600;
                    line-height: 1.1;
                    margin-bottom: 5px;
                    a{
                        color: @title-color;
                        &:hover{
                            color: @primary-color;
                        }
                    }
                }
                .category{
                    font-size: 16px;
                    line-height: 27px;
                    font-weight: 400;
                    display: block;
                    a{
                        color: @primary-color;
                    }
                } 
            }
            &:hover{
                .project-img{
                    .plus-icon{
                        opacity: 1;
                        visibility: visible;
                    }
                }
            }
        }
        &.modify1{
           .project-item{
               .project-img{ 
                   .plus-icon{
                       background: #F9780F;
                       i{
                           font-size: 16px;
                           font-weight: 300;
                           color: @white-color;
                       }
                   }
               }
               .project-content{
                   margin-top: 25px;
                   .title{
                       font-size: 23px;
                       font-weight: 700;
                       line-height: 46px;
                       margin-bottom: 5px;
                       text-decoration: underline;
                       a{
                           color: @title-color;
                           &:hover{
                               color: @primary-color;
                           }
                       }
                    }
                }
            }
        }
        &.modify2{
           .project-item{
               .project-img{ 
                   .plus-icon{
                       background: #1273eb;
                       i{
                           font-size: 24px;
                           line-height: 50px;
                           font-weight: 300;
                           color: @white-color;
                       }
                   }
               }
               .project-content{
                   margin-top: 25px;
                   .title{
                       font-size: 25px;
                       font-weight: 700;
                       line-height: 53px;
                       margin-bottom: 0;
                       a{
                           color: @title-color;
                           &:hover{
                               color: @primary-color;
                           }
                       }
                    }
                }
            }
        }
        &.modify3{
            .project-item{
                overflow: hidden;
                border-radius: 5px;
                .project-img{ 
                    position: relative;
                    overflow: hidden;
                    a{
                        img{
                            transition: all .8s ease;
                            transform: scale(1);
                        }
                    }
                }
                .project-content{
                    margin-top: 25px;
                    .title{
                        font-size: 20px;
                        font-weight: 700;
                        line-height: 1.1;
                        margin-bottom: 5px;
                        a{
                            color: #191821;
                            &:hover{
                                color: #787CF2;
                            }
                        }
                    }
                    .category{
                        font-size: 16px;
                        line-height: 27px;
                        font-weight: 400;
                        display: block;
                        a{
                            color: #454545;
                        }
                    } 
                }
                &:hover{
                    .project-img{
                        a{
                            img{
                                transform: scale(1.1);
                                border-radius: 5px;
                            }
                        }
                    }
                }
            }
        }
    }
    &.style7{
       .project-item{
           position: relative;
           overflow: hidden;
           border-radius: 5px;
           .project-img{
               img{
                    transform: scale(1.2);
                    transition: 0.6s;
                    border-radius: 5px;
               }
           }
           .project-content{
                position: absolute;
                padding: 24px 30px;
                opacity: 0;
                z-index: 10;
                top: 0;
                visibility: hidden;
                width: 100%;
                height: 100%;
                text-align: center;
                transform: scale(1.3);
                transition: 0.4s;
               .title{
                   font-size: 24px;
                   line-height: 30px;
                   font-weight: 600;
                   margin-bottom: 8px;
                   a{
                       color: @white-color;
                       &:hover{
                            color: @primary-color;
                       }
                   }
               }
               .category{
                   font-size: 16px;
                   line-height: 26px;
                   font-weight: 500;
                   display: block;
                   a{
                       color: @white-color;
                       &:hover{
                            color: @primary-color;
                       }
                   }
               }
               &:before{
                   content: '';
                   position: absolute;
                   top: 0;
                   left: 0;
                   opacity: 0;
                   visibility: hidden;
                   width: 100%;
                   height: 100%;
                   background: rgba(0, 0, 0, 0.7);
                   border-radius: 5px;
               }
           }
           &:hover{
               .project-img{
                   img{
                       transform: scale(1);
                   }
               }
               .project-content{
                    visibility: visible;
                    opacity: 1;
                    transform: scale(1);
                   &:before{
                        opacity: 1;
                        visibility: visible;
                   }
                }
            }
        }
    }
    &.style8{
        .project-item{
            position: relative;
            border-radius: 5px 5px 5px 5px;
            overflow: hidden;
            .project-img{
                position: relative;
                z-index: 1;
                overflow: hidden;
                img{
                    width: 100%;
                    transition: 1.3s all ease;
                }
            }
            .project-content{
                position: absolute;
                padding: 17px 25px 15px;
                opacity: 0;
                visibility: hidden;
                z-index: 1;
                left: 0;
                bottom: -100px;
                text-align: left;
                width: 100%;
                z-index: 11;
                transition: 0.6s;
                height: 100%;
                .project-inner{
                    position: absolute;
                    bottom: -100px;
                    transition: 0.5s;
                    left: 30px;
                    .title{
                        font-size: 14px;
                        font-weight: 400;
                        text-transform: uppercase;
                        margin-bottom: 5px;
                        a{
                            color: @white-color;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                    .category{
                        font-size: 22px;
                        line-height: 37px;
                        font-weight: 600;
                        display: block;
                        a{
                            color: @white-color;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                }
                &:before{
                    content: '';
                    position: absolute;
                    bottom: -150px;
                    left: 0;
                    opacity: 0;
                    visibility: hidden;
                    width: 100%;
                    height: 100%;
                    background: rgba(0, 0, 0, 0.5);
                    transition: all 0.4s;
                    border-radius: 5px;
                    transition: 0.6s
                }
            }
            &:hover{
                .project-img{
                    img{
                       transform: scale(1.2);
                    }
                }
                .project-content{
                    opacity: 1;
                    visibility: visible;
                    bottom: 0;
                    .project-inner{
                        bottom: 30px;
                        .title{
                            font-size: 14px;
                            font-weight: 400;
                            text-transform: uppercase;
                            margin-bottom: 5px;
                            a{
                                color: @white-color;
                                &:hover{
                                    color: @primary-color;
                                }
                            }
                        }
                        .category{
                            font-size: 22px;
                            line-height: 37px;
                            font-weight: 600;
                            display: block;
                            a{
                                color: @white-color;
                                &:hover{
                                    color: @primary-color;
                                }
                            }
                        }
                    }
                    &:before{
                        opacity: 1;
                        bottom: 0;
                        visibility: visible;
                    }
                }
            }
        }
        &.modify1{
            .project-item{
                .project-content{
                    z-index: 1;                
                    .project-inner{
                        .title{
                            a{
                                color: @white-color;
                                &:hover{
                                    color: @white-color;
                                }
                            }
                        }
                        .category{
                            a{
                                color: @white-color;
                                &:hover{
                                    color: @orange-color;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    &.style9{
        .project-item{
            position: relative;
            border-radius: 5px 5px 5px 5px;
            overflow: hidden;
            .project-content{
                position: absolute;
                width: 100%;
                bottom: -105%;
                left: 40px;
                transition: 0.4s;
                .project-inner{
                    .title{
                        font-size: 22px;
                        line-height: 28px;
                        font-weight: 600;
                        margin-bottom: 5px;
                        a{
                            color: @white-color;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                    .category{
                        font-size: 16px;
                        line-height: 27px;
                        font-weight: 400;
                        display: block;
                        margin-bottom: 25px;
                        a{
                            color: @white-color;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                }
                .p-icon{
                    width: 50px;
                    height: 50px;
                    text-align: center;
                    line-height: 50px;
                    border-radius: 50px;
                    background: #fff;
                    font-size: 24px;
                    a {
                        display: block;
                    }
                    i{
                        color: @title-color;
                    }
                }
            }
            &:before{
                background: @secondary-color;
                content: "";
                position: absolute;
                bottom: -105%;
                left: 0;
                width: 100%;
                height: 100%;
                opacity: 0;
                visibility: hidden;
                transition: 0.4s;
            }
            &:hover{
                .project-content{
                    bottom: 40px;
                }
                &:before{
                   bottom: 0;
                   opacity: .8;
                   visibility: visible;
                }
            }
        }
    }
    &.style10{
        .project-item{
            position: relative;
            overflow: hidden;
            .project-img{
                img{
                    border-radius: 5px;
                }
            }
            .project-content{
                position: absolute;
                width: 100%;
                height: 100%;
                top: 30%;
                left: 0;
                text-align: center;
                z-index: 10;
                padding: 25px;
                opacity: 0;
                -webkit-transition: .3s all ease-out;
                transition: .3s all ease-out;
                border-radius: 5px;
                .title{
                    font-size: 24px;
                    line-height: 34px;
                    font-weight: 600;
                    margin-bottom: 6px;
                    a{
                        color: @white-color;
                        &:hover{
                            color: rgba(255,255,255,.7);
                        } 
                    }
                }
                .category{
                    font-size: 16px;
                    line-height: 27px;
                    font-weight: 400;
                    a{
                        color: @white-color; 
                    }
                }
                &:before{
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    opacity: 0;
                    width: 100%;
                    height: 100%;
                    background: rgba(0,0,0,.5);
                    transition: all .3s ease 0s;
                    border-radius: 5px;
                }
            }
            &:hover{
                .project-content{
                    opacity: 1;
                    top: 0;                   
                    &:before{
                        opacity: 1;
                    }
                }
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                width: 60px;
                height: 60px;
                line-height: 60px;
                border-radius: 50%;
                background: @white-color;
                text-align: center;
                color: @title-color;
                transition: all 0.5s;
                transition-delay: 0.70s;
                opacity: 0;
                visibility: hidden;
                i {
                    &:before {
                        content: "\f111";
                        font-family: Flaticon;
                        font-size: 18px;
                    }
                }
                &:hover {
                    background: @primary-color;
                    color: @white-color;
                }
            }
            .owl-next {
                right: 30px;
                left: unset;
                i {
                    &:before {
                        content: "\f110";
                    }
                }
            }
        }
        &:hover {
            .owl-nav {
                .owl-next,
                .owl-prev {
                    left: -5%;
                    transition-delay: 0s;
                    visibility: visible;
                    opacity: 1;                 
                }
                .owl-next {
                    right: -5%;
                    left: unset;
                }
            }
        }   
    }
}

/*------------------------------------
    23. Progress Section CSS
------------------------------------*/
.progress-pie-part{
    .box{
        width: 100%;
        display: block;
        text-align: center;
        color: @title-color2;
        .chart {
            position: relative;
            span {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                font-size: 30px;
                font-weight: 600;
                color: #102b3e;
            }
        }
        .title{
            font-size: 22px;
            line-height: 37px;
            font-weight: 600;
            color: #102b3e;
            margin: 14px 0 0;
        }
    }
}

/*------------------------------------
    24. Case Study Section CSS
------------------------------------*/
.rs-case-study{
    &.primary-background{
        background: linear-gradient(90deg,#03228f 40%,#0e73e4 90%);
    }
}
   
/*------------------------------------
    25. Blog Section CSS
------------------------------------*/
.rs-blog{
   .blog-item{
        transition: all 500ms ease;
        border-radius: 5px;
        box-shadow: 0 6px 25px rgba(12, 89, 219, 0.09);
        margin-top: 15px;
        padding: 15px;
        background: #fff;
        .image-wrap{
            position: relative;
            .post-categories{
                position: absolute;
                z-index: 11;
                bottom: 20px;
                right: 20px;
                z-index: 10;
                li{
                    display: inline-block;
                    a{
                        border-radius: 30px;
                        color: #ffffff;
                        background: #03228f;
                        background: -moz-linear-gradient(left, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                        background: -webkit-linear-gradient(left, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                        background: linear-gradient(to right, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#03228f', endColorstr='#0b70e1', GradientType=1);
                        transition: 0.4s;
                        font-size: 14px;
                        font-weight: 500;
                        padding: 6px 20px;
                        display: block;
                        &:hover{
                            background: linear-gradient(to left, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                        }
                    }
                }
            }
        }
        .blog-content{
            padding: 30px 15px 18px 15px;
            background: #fff;
            .blog-meta{
                margin-bottom: 10px;
                display: flex;

                .date{
                    font-size: 14px;
                    color: @body-color;

                    i{
                        color: @primary-color;
                        padding-right: 5px;
                    }
                }
                .admin{
                    font-size: 15px;
                    font-weight: 500;
                    color: @body-color;
                    margin-left: 25px;
                    i{
                        color: @primary-color;
                        padding-right: 5px;
                    }
                }
            }
            .blog-title{
                font-weight: 600;
                font-size: 20px;
                margin-bottom: 12px;
                line-height: 1.4;
                a{
                    color: @title-color;
                    &:hover{
                        color: @primary-color;
                    }
                }
            }
            .desc{
                margin-bottom: 15px; 
            }
            
        }
    }
    .owl-stage-outer {
        padding-bottom: 10px;
        margin-top: -10px;
    }
   .blog-item{
        &:hover{
            transform: translateY(-10px);
        }
    }
    &.style2{
        .blog-item{
            transition: all 500ms ease;
            border-radius: 5px;
            box-shadow: 0 6px 25px rgba(12, 89, 219, 0.09);
            margin-top: 15px;
            padding: 15px;
            .image-wrap{
                .post-categories{
                    li{
                         a{
                            border-radius: 8px 8px 8px 8px;
                            background-image: linear-gradient( 150deg , #DA4511 0%, #E7B723 100%);
                        }
                    }
                }
            }
             .blog-content{
                padding: 30px 15px 18px 15px;
                background: #fff;
                 .blog-meta{
                     .date{
                        font-size: 14px;
                        color: @body-color;
                         i{
                             color: @primary-color;
                             padding-right: 5px;
                        }
                     }
                     .admin{
                        font-size: 15px;
                        font-weight: 500;
                        color: @body-color;
                        margin-left: 25px;
                         i{
                             color: @primary-color;
                             padding-right: 5px;
                         }
                    }
                 }
                 .blog-title{
                    a{
                        color: @title-color;
                        &:hover{
                            color: #FF5600;
                        }
                    }
                }
            }
        }
        .owl-stage-outer {
            padding: 20px;
            margin: -20px;
        }
    }
    &.style3{
        .blog-item{
            .image-wrap{
                .post-categories{
                    li{
                        a{
                            border-radius: 3px 3px 3px 3px;
                            background-image: linear-gradient( 120deg, #6E71DB 0%, #9C9FF9 100%);
                        }
                    }
                }
            }
             .blog-content{
                 .blog-meta{
                     .date{
                         i{
                             color: #787cf2;
                        }
                     }
                     .admin{
                         i{
                             color: #787cf2;
                             padding-right: 5px;
                         }
                    }
                 }
                 .blog-title{
                    a{
                        color: @title-color;
                        &:hover{
                            color: #787cf2;
                        }
                    }
                }
            }
        }
    }
}
.rs-inner-blog {
    .blog-item{
        background: #fff;
        box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
        border-radius: 15px;
        padding: 15px;
        transition: 0.3s;
        .blog-img{
            position: relative;
            a{
                img{
                    border-radius: 10px;
                }
            }
           .post-categories{
               position: absolute;
               z-index: 11;
               bottom: 20px;
               right: 20px;
               z-index: 10;
               li{
                   display: inline-block;
                   a{
                       border-radius: 30px;
                       color: #ffffff;
                       background: #03228f;
                       background: -moz-linear-gradient(left, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                       background: -webkit-linear-gradient(left, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                       background: linear-gradient(to right, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#03228f', endColorstr='#0b70e1', GradientType=1);
                       transition: 0.4s;
                       font-size: 14px;
                       font-weight: 500;
                       padding: 6px 20px;
                       display: block;
                       &:hover{
                           background: linear-gradient(to left, #03228f 0%, #03228f 0%, #03228f 26%, #4e95ed 100%, #2989d8 100%, #207cca 100%, #0b70e1 100%);
                        }
                    }
                }
            }
        }
        .blog-content{
            padding: 25px 15px 25px;
            overflow: hidden;
            .blog-title{
                margin: 4px 0 10px;
                font-size: 26px;
                line-height: 35px;
                font-weight: 700;
                a{
                    color: @title-color2;
                    &:hover{
                        color: @primary-color;
                    }
                }
            }
            .blog-meta{
                .btm-cate{
                    overflow: hidden;
                    margin: 0 0 5px;
                    padding: 0 0 12px;
                    font-size: 13px;
                    display: flex;
                    align-items: center;
                    li{
                        margin-right: 15px;
                        .blog-date{
                            display: inline-block;
                            font-weight: 400;
                            font-size: 13px;
                            color: #999;
                            i{
                                color: #0B70E1;
                                margin-right: 3px;
                                font-size: 14px;
                                font-weight: 600;
                            }
                        }
                        .author{
                            display: inline-block;
                            padding: 0;
                            margin-right: 0;
                            line-height: normal;
                            color: #999;
                            i{
                                color: #0B70E1;
                                margin-right: 3px;
                                font-size: 14px;
                                font-weight: 600;
                            }
                        }
                        &:last-child{
                            margin-right: 0;
                        }
                    }
                }
            }
            .blog-desc{
                font-size: 15px;
                line-height: 27px;
                font-weight: 400;
                color: @body-color;
                margin-bottom: 20px;
            }
        }
    }
    .widget-area{
        .widget-title{
            .title{
                color: @title-color;
                font-size: 20px;
                line-height: 26px;
                font-weight: 600;
                position: relative;
                z-index: 1;
                padding-bottom: 12px;
                margin: 0;
                &:before{
                    content: "";
                    position: absolute;
                    border: 0;
                    width: 50px;
                    height: 2px;
                    background: @primary-color;
                    z-index: 1;
                    margin-left: 0;
                    bottom: 0;
                    left: 0;
                }
            }
        }
        .search-widget{
            background: #fff;
            padding: 40px 30px 40px;
            box-shadow: 0 6px 25px rgba(0, 0, 0, 0.07);
            border-radius: 10px;
            .search-wrap{
                position: relative;
                [type=search] {
                    border: 1px solid #ddd;
                    color: #444444;
                    padding: 12px 17px;
                    width: 100%;
                    border-radius: 5px;
                    position: relative;
                }
                button{
                    background: transparent;
                    border: medium none;
                    color: @body-color;
                    padding: 11px 15px 12px;
                    position: absolute;
                    display: block;
                    right: 0px;
                    top: 0;
                    z-index: 10;
                    font-size: 20px;
                    border-radius: 0 5px 5px;
                    i{
                        &:before{
                            font-weight: 600;
                            font-size: 18px;
                        }
                    }
                    &:hover{
                        color: @primary-color;
                    }
                }
            }
        }
        .recent-posts{
            background: #fff;
            padding: 40px 30px;
            box-shadow: 0 6px 25px rgba(0,0,0,.07);
            border-radius: 10px;
            .recent-post-widget{
                margin-top: 15px;
                padding-top: 15px;
                border-top: 1px solid rgba(0,0,0,.06);
                .post-img{
                    width: 100px;
                    float: left;
                    padding-right: 15px;
                }
                .post-desc{
                    display: block;
                    font-size: 12px;
                    color: #888;
                    overflow: hidden;
                    a{
                        font-size: 15px;
                        line-height: 22px;
                        font-weight: 500;
                        color: @title-color2;
                        display: block;
                        &:hover{
                            color: @primary-color;
                        }
                    }
                    .date{
                        display: block;
                        i{
                            margin-right: 5px;
                            &:before{
                                font-size: 12px;
                            }
                        }
                    }
                }
            }
        }
        .categories{
            background: #fff;
            padding: 40px 30px 40px;
            box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
            border-radius: 10px;
            li{
                margin-top: 13px;
                padding-top: 13px;
                border-top: 1px solid rgba(0, 0, 0, 0.06);
                a{
                    font-size: 15px;
                    font-weight: 500;
                    color: @title-color;
                    &:hover{
                        color: @primary-color;
                    }
                }
            }
        }
    }
    .blog-details{
        .blog-full{
            .single-post-meta{
                display: flex;
                align-items: center;
                padding: 0 0 30px;
                li{
                    .p-date{
                        color: #555;
                        font-size: 14px;
                        margin-right: 8px;
                        i{
                            font-size: 13px;
                            margin-right: 3px;
                            color: #0B70E1;
                            &:before{
                                margin-right: 5px;
                            }
                        }
                    }
                   
                }
                .Post-cate{
                    list-style: none;
                    display: inline-block;
                    padding-right: 10px;
                    color: #555;
                    font-size: 14px;
                    .tag-line{
                        i{
                            color: #0B70E1;
                            margin-right: 3px;
                            &:before{
                                margin-right: 4px;
                            }
                        }
                        a{
                            font-weight: 400;
                            color: #555;
                            font-size: 14px;
                            &:hover{
                                color: @primary-color;
                            }
                        }
                    }
                }
                .post-comment{
                    color: #555;
                    font-size: 14px;
                    i{
                        &:before{
                            color: #0B70E1;
                        }
                    }
                }
            }
            .comment-title{
                font-size: 24px;
                margin-bottom: 40px;
                margin-top: 35px;
            }
            .comment-body{
                display: flex;
                border-bottom: 1px solid #ddd;
                padding-bottom: 30px;
                margin-bottom: 25px;
                .rstheme-logo{
                    margin-right: 28px;
                    img{
                        border-radius: 50%;
                        max-width: unset;
                    }
                }
                .comment-meta{
                    span{
                        display: block;
                        a{
                            color: #0a0a0a;
                            font-weight: 700;
                            line-height: 22px;
                        }
                    }
                    a{
                        font-size: 14px;
                        color: #909090;
                    }
                }
            }
            .comment-note{
                .from-control{
                    width: 100%;
                    padding: 15px 20px;
                    background-color: #F6F7F9;
                    border: none;
                    border-radius: 5px;
                }
                textarea {
                    height: 160px;
                }
                ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
                  color: #454545;
                  opacity: 1;
                }
                ::-moz-placeholder { /* Firefox 19+ */
                  color: #454545;
                  opacity: 1;
                }
                :-ms-input-placeholder { /* IE 10+ */
                  color: #454545;
                  opacity: 1;
                }
                :-moz-placeholder { /* Firefox 18- */
                  color: #454545;
                  opacity: 1;
                } 
            }
        }
    }
}


/*------------------------------------
    26. Features Section CSS
------------------------------------*/
.rs-feature{
    .icon-box-area{
        padding: 50px 40px 41px 40px;
        background-image: linear-gradient(
        90deg
        , #F69F6B 41%, #FBBB6A 100%);
        border-radius: 5px 5px 5px 5px;
        .box-inner{
            .icon-area{
                margin-bottom: 15px;
            }
            .content-part{
                .title{
                    font-size: 22px;
                    font-weight: 600;
                    line-height: 32px;
                    margin-bottom: 0;
                    a{
                        color: #fff;
                    }
                }
            }
        }
        &.blue-bg{
            background-image: linear-gradient(
            90deg
            , #559CEA 41%, #6BA3CB 100%);
        }
        &.purple-bg{
            background-image: linear-gradient(
            90deg
            , #A040F3 41%, #A86AE3 100%);
        }
        &.pink-bg{
            background-image: linear-gradient(
            90deg
            , #F954A1 41%, #F2A1C6 100%);
        }
    }
}

/*------------------------------------
    27. Call Action Section CSS
------------------------------------*/
.rs-call-action{
    .action-wrap{
        text-align: center;
        margin: 0 auto;
        max-width: 500px;
        .icon-img{
            margin-bottom: 20px;
            img{
                width: 120px;
            }
        }
        .title{
            font-size: 36px;
            line-height: 50px;
            font-weight: 700;
            color: @white-color;
            text-decoration: underline;
            margin-bottom: 15px;
            .watermark{
                color: #FBAB9A;
            }
        }
    }
    &.style2{
        .action-wrap{
            max-width: 520px;
            .title{
                font-size: 42px;
                color: @title-color3;
            }
        }
    }
}

/*------------------------------------
    28. Partner Section CSS
------------------------------------*/
.rs-partner{
    background-image: linear-gradient(330deg, #00005B 0%, #020275 90%);
    .partner-item{
        .logo-img{
            a{
                overflow: hidden;
                display: inline-block;
                position: relative;
                transition: all .3s ease-in-out;
                .hover-logo{
                    transition: all .3s ease-in-out;
                    display: block;
                    position: absolute;
                    z-index: 1;
                    top: 0;
                    left: 0;
                    visibility: hidden;
                    filter: grayscale(100%);
                }
                .main-logo{
                    filter: grayscale(100%);
                    transition: all .3s ease-in-out;
                    display: block;
                }
                &:hover{
                    .hover-logo{
                        position: absolute;
                        z-index: 1;
                        top: 0;
                        left: 0;
                        display: block;
                        opacity: 3;
                        visibility: visible;
                        -webkit-transform: translateY(0%);
                        -moz-transform: translateY(0%);
                        -ms-transform: translateY(0%);
                        -o-transform: translateY(0%);
                        transform: translateY(0%);
                        filter: grayscale(0%);
                    }
                    .main-logo{
                        display: block;
                        visibility: hidden;
                        -webkit-transform: translateY(100%);
                        -moz-transform: translateY(100%);
                        -ms-transform: translateY(100%);
                        -o-transform: translateY(100%);
                        transform: translateY(100%);
                        filter: grayscale(100%);
                    }
                }
            }
        }
    }
    &.style2{
       box-shadow: 0px 8px 50px 0px rgba(0, 0, 0, 0.05);
       background: @white-color;
       background-image: unset;
       &.modify1{
            .title{
                color: #717070;
                font-size: 18px;
                font-weight: 600;
            }
            box-shadow: unset;
            background: unset;
        }
    }
    &.style3{
        background-image: unset;
        background: url(assets/images/bg/partners-bg.jpg);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: cover;
        background-color: #00005B;
    }
    &.style4{
        box-shadow: unset;
        background-image: unset;
        &.modify1{
            .partner-item{
                padding: 0 10px;
            }
        }
    }
    &.style5{
        background-image: linear-gradient( 150deg, #03228F 46%, #0E73E4 100%);
    }
}

/* ------------------------------------
    29. Testimonial Section CSS
---------------------------------------*/
.rs-testimonial{
    &.main-home{
        .testi-item {
            .author-desc {
                background: @white-color;
                padding: 70px 40px 80px 40px;
                border-radius: 10px 10px 10px 10px;
                box-shadow: -2px 16px 44px -32px rgba(0, 0, 0, 0);
                .desc {
                    text-align: center;
                    position: relative;
                    color: #333333;
                    padding: 61px 0px 10px 0px;
                    font-size: 17px;
                    line-height: 33px;
                    font-weight: 400;
                    .quote {
                        width: 50px;
                        top: -13px;
                        position: absolute;
                        left: 50%;
                        transform: translateX(-50%);
                    }
                }
                .author-img {
                    position: absolute;
                    left: 50%;
                    transform: translateX(-50%);
                    bottom: 80px;
                    img {
                        width: 90px;
                        height: 90px;
                        border-radius: 50%;                        
                    }
                }
            }
            .author-part {
                text-align: center;
                padding-top: 70px;
                .name {
                    color: #0A0A0A;
                    font-size: 22px;
                    font-weight: 600;
                    display: block;
                    margin-bottom: 5px;
                }
                .designation {
                   
                }
            }
        }
        .owl-dots {
            text-align: center;
            margin-top: 47px;
            .owl-dot{
                width: 25px;
                height: 8px;
                display: inline-block;
                margin: 0 6px;
                padding: 3px 0;
                border-radius: 30px;
                border: none;
                transition: @transition;
                background: #0B70E1;
                box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
                &:hover,
                &.active {
                  width: 40px;
                  background: #0B70E1;
                  opacity: 1;
                }
            }
        }
        .owl-stage-outer {
            padding: 45px 0;
            margin: -45px 0;
        }
        &.style2{
            .testi-item{
                .author-desc{
                    background-image: linear-gradient(150deg, #000060 0%, #1E1EAA 98%);
                    box-shadow: unset;
                   .desc {
                        color: @white-color;
                        font-size: 20px;
                        padding: 70px 50px 35px 50px;
                    }
                }
                .author-part {
                    .name {
                        color: @white-color;
                    }
                    .designation {
                       color: @white-color;
                    }
                }
            }
            &.modify1{
                .overlayer{
                    position: relative;
                    .testi-item{
                        .author-desc{
                            background-color: #03228F75;
                            background-image: unset;
                            box-shadow: unset;
                            border-radius: unset;
                        }
                    }
                    &:after {
                        background-color: #020E38;
                        opacity: 0.64;
                        position: absolute;
                        content: '';
                        left: 0;
                        top: 0;
                        width: 100%;
                        height: 100%;
                    }
                }
            }
        }
        &.style4{
            padding: 120px 0px 120px 0px;
            border-radius: 270px 0px 0px 0px;
            .testi-item{
                padding: unset;
                position: relative;
                .author-desc{
                    background: @white-color;
                    padding: 40px 40px 80px 43px;
                    border-radius: 10px 10px 10px 10px;
                    box-shadow: -2px 16px 44px -32px rgba(0, 0, 0, 0);
                    .desc{
                        text-align: unset;
                        position: unset;
                        color: #333333;
                        padding: 73px 0px 10px 0px;
                        font-size: 17px;
                        line-height: 33px;
                        font-weight: 400;
                        .quote{
                            top: 44px;
                            position: absolute;
                            left: 7%;
                            transform: unset;
                        }
                    }
                }
                .testimonial-content{
                    position: absolute;
                    display: flex;
                    align-items: center;
                    bottom: -40px;
                    .author-img{
                        img{
                            width: 90px;
                            height: 90px;
                            border-radius: 50px 50px 50px 50px;
                        }
                    }
                    .author-part{
                        padding-left: 15px;
                        text-align: unset;
                        padding-top: unset;
                    }
                }
            }
            &.modify1{
               border-radius: unset;
               position: relative;
               .modify-gap {
                    padding-right: 220px;
                    padding-left: 50px;
               }
               .testi-img{
                    img{
                        max-width: 900px;
                    }
                }
            }
            &.modify2{
               .testi-item{
                   .author-desc{
                       padding: 40px 40px 160px 43px;
                   }
                   .testimonial-content{
                        bottom: 50px;
                        left: 34px;
                   }
               }
            }  
        }
    }
    &.style3{
        .testi-item{
            text-align: center;
            .author-desc{
                background-image: linear-gradient(310deg, #0024BA 19%, #000060 65%);
                padding: 100px 45px 40px 45px;
                border-radius: 15px 15px 15px 15px;
                box-shadow: -2px 16px 44px -32px rgba(0, 0, 0, 0);
                position: relative;
                .desc{
                    font-size: 18px;
                    line-height: 31px;
                    font-weight: 400;
                    color: @white-color;
                    margin-bottom: 0;
                    .quote {
                        width: 50px;
                        top: 36px;
                        position: absolute;
                        left: 44%;
                    }
                }
                &:before{
                  top: 100%;
                  left: 15%;
                  border: solid transparent;
                  content: " ";
                  height: 0;
                  width: 0;
                  position: absolute;
                  pointer-events: none;
                  border-color: rgba(136, 183, 213, 0);
                  border-top-color: #061340;
                  border-width: 12px;
                  margin-left: -30px;
                  left: 55%;
                  z-index: 1;
                }
            }
            .testi-content{
                .images-wrap{
                    img{
                        width: 90px;
                        height: 90px;
                        border-radius: 50%; 
                        margin: 25px auto 18px;
                    }
                }
                .name{
                    font-size: 22px;
                    line-height: 32px;
                    font-weight: 600;
                    color: @title-color;
                    display: block;
                    margin-bottom: 7px;
                    &:hover{
                        color: @primary-color;
                    }
                }
                .designation{
                   color:  #878787;
                   margin-bottom: 0px;
                }
            }
        }
        .owl-dots {
            text-align: center;
            margin-top: 47px;
            .owl-dot{
                width: 25px;
                height: 8px;
                display: inline-block;
                margin: 0 6px;
                padding: 3px 0;
                border-radius: 30px;
                border: none;
                transition: @transition;
                background: #0B70E1;
                box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
                &:hover,
                &.active {
                  width: 40px;
                  background: #0B70E1;
                  opacity: 1;
                }
            }
        }
        .owl-stage-outer {
            padding: 10px;
            margin: -10px;
        }
    }
    &.style4{
        .testi-item{
            background-color: #FDFDFD;
            border-radius: 5px 5px 5px 5px;
            padding: 60px 60px 60px 60px;
            .testi-content{
                display: flex;
                .images-wrap{
                    img{
                        width: 60px;
                        height: 60px;
                        border-radius: 4px 4px 4px 4px;
                    }
                }
                .testi-information{
                    padding-left: 15px;
                    position: relative;
                    .testi-name{
                        color: #000000;
                        font-size: 20px;
                        font-weight: 500;
                    }
                    .testi-title{
                        display: block;
                        color: #878787;
                    }
                }
            }
            .item-content-basic{
                .desc{
                   color: #555555;
                   padding: 30px 0px 0px 0px;
                   .quote {
                        width: 54px;
                        top: 55px;
                        position: absolute;
                        left: 71%;
                        z-index: 9;
                   } 
                }
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
                width: 50px;
                height: 50px;
                line-height: 50px;
                border-radius: 50%;
                color:  #FBFBFB;
                border: 1px solid #fff;
                transform: translateY(-50%);
                transition: 0.6s ease all;
                z-index: 9;
                text-align: center;
                i {
                    &:before {
                        content: "\f111";
                        font-family: Flaticon;
                        font-size: 18px;
                        font-weight: 400;
                    }
                }
                &:hover {
                    color: @white-color;
                }
            }
            .owl-next {
                top: 249px;
                left: -63%;
                i {
                    &:before {
                        content: "\f110";
                    }
                }
            }
            .owl-prev{
                left: -75%;
                top: 249px;
            }
        }
    }
    &.style5{
       .testi-item{
        background-image: linear-gradient(140deg, #03228F 0%, #4E95ED 100%);
        padding: 70px 60px 70px 60px;
        border-radius: 10px 10px 10px 10px;
        text-align: center;
            .testi-img{

            }
            p{
                color: #fff;
                font-size: 18px;
                line-height: 35px;
                margin-bottom: 0;
                padding: 30px 35px 20px 35px;
            }
            .testi-content{
                display: flex;
                align-items: center;
                justify-content: center;
                .testi-img{
                    padding-right: 15px;
                    img{
                        width: 80px;
                        height: 80px;
                        border-radius: 50%;
                    }
                }
                .author-part{
                    text-align: left;
                    .name{
                        font-size: 16px;
                        line-height: 35px;
                        color: #fff;
                        letter-spacing: 1px;
                        margin-bottom: 0;                        
                        display: block;
                    }
                    .designation{
                        font-size: 14px;
                        line-height: 24px;
                        color: #fff;
                        display: block;
                    }
                }
            }
        }
    }
    &.style6{
        .testi-item{
            background-color: #fff;
            border-radius: 10px 10px 10px 10px;
            box-shadow: 0px 0px 10px 0px rgba(231.74999999999997, 231.74999999999997, 231.74999999999997, 0.5);
            padding: 92px 0px 90px 0px;
            margin: 0 -15px 0 0;
            .testi-content{
                display: flex;
                justify-content: center;
                align-items: center;
                margin-bottom: 34px;
                .images-wrap{
                    width: 90px;
                    height: 90px;
                    img{
                        border-radius: 50px 50px 50px 50px;
                    }
                }
                .testi-information{
                    padding: 0 0 0 25px;
                    text-align: left;
                    .testi-name{
                        color: #102B3E;
                        font-size: 20px;
                        font-weight: 600;
                        line-height: 36px;
                    }
                    .testi-title{
                        color: #404A50;
                        padding-bottom: 10px;
                        display: block;
                    }
                    .rating{
                        img{
                            width: 100px;
                        }
                    }
                }
            }
            .item-content-basic{
                padding: 0px 40px 0px 40px;
                text-align: center;
                p{
                    color: #272525;
                    font-size: 18px;
                    font-weight: 500;
                    font-style: italic;
                    line-height: 35px;
                }
                span{
                    img{
                        width: 32px;
                        top: 82%;
                        position: absolute;
                        left: 47%;
                        z-index: 9;
                    }
                }
            }
        }
        .owl-dots {
            text-align: center;
            margin-top: 47px;
            .owl-dot{
                width: 25px;
                height: 8px;
                display: inline-block;
                margin: 0 6px;
                padding: 3px 0;
                border-radius: 30px;
                border: none;
                transition: @transition;
                background: #032390;
                box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
                &:hover,
                &.active {
                  width: 40px;
                  background: #032390;
                  opacity: 1;
                }
            }
        }
    }
    &.style7{
        background: url(assets/images/bg/testimonial-bg.png);
        background-position: bottom center;
        background-repeat: no-repeat;
        background-size: cover; 
        .testi-main{
            margin: 0px 0px 0px 0px;
            padding: 0px 100px 0px 150px;
            .testi-item{
                .testi-content{
                    display: flex;
                    align-items: center;
                    border-radius: 3px;
                    background: #ffffff;
                    box-shadow: 0 0 30px #eee;
                    margin: 40px 37px 30px 100px;
                    padding: 50px 30px 50px 50px;
                    .images-wrap{
                        img{
                            border-radius: 3px;
                            height: 263px;
                            max-width: 263px;
                            width: 263px;
                            margin-left: -150px;
                        }
                    }
                    .testi-information{
                        padding-left: 45px;
                        p{
                            color: #102B3E;
                            font-size: 22px;
                            font-weight: 500;
                            font-style: italic;
                            line-height: 35px;
                        }
                        .testi-name{
                            color: #102B3E;
                            font-size: 20px;
                            font-weight: 600;
                            line-height: 36px;
                        }
                        .testi-title{
                            color: #404A50;
                        }
                    }
                }
            }
        }
        .owl-nav {
            .owl-next,
            .owl-prev {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 30px;
                background: linear-gradient(
                90deg
                , #03228f 10%, #0e73e4 100%);
                width: 50px;
                height: 50px;
                line-height: 50px;
                border-radius: 50%;
                text-align: center;
                color: @white-color;
                i {
                    margin-top: 15px;
                    &:before {
                        content: "\f115";
                        font-family: Flaticon;
                        font-size: 18px;
                        font-weight: 400;
                    }
                }
                &:hover {
                    background: linear-gradient(
                    0deg
                    , #03228f 10%, #0e73e4 100%);
                    color: @white-color;
                }
            }
            .owl-next {
                right: -75px;
                left: unset;
                i {
                    &:before {
                        content: "\f114";
                        font-size: 18px;
                        font-weight: 400;
                    }
                }
            }
            .owl-prev {
                right: unset;
                left: -105px;
                i {
                    &:before {
                        content: "\f115";
                        font-size: 18px;
                        font-weight: 400;
                    }
                }
            }
        }
    }
    &.style8{
        .testi-item{
            background: #fff;
            padding: 50px 35px;
            border-radius: 4px;
                .item-content-basic{
                span{
                    img{
                        width: 100px;
                    }
                }
                p{
                    font-size: 20px;
                    line-height: 35px;
                    font-weight: 500;
                    color: @title-color;
                    margin-bottom: 32px;
                    padding-top: 20px;
                }
            }
            .testi-information{
                display: flex;
                align-items: center;
                .img-part{
                    img{
                        border-radius: 50%;
                    }
                }
                .testi-content{
                    padding-left: 25px;
                    .testi-name{
                        font-size: 20px;
                        line-height: 26px;
                        font-weight: 600;
                        color: @title-color;
                        margin-bottom: 2px;
                    }
                    .testi-title{
                        font-size: 16px;
                        line-height: 26px;
                        font-weight: 400;
                        color: @body-color;
                        margin-bottom: 0;
                    }
                }
            }
        }
       .owl-dots {
           text-align: center;
           margin-top: 47px;
           .owl-dot{
               width: 15px;
               height: 8px;
               display: inline-block;
               margin: 0 6px;
               padding: 3px 0;
               border-radius: 30px;
               background: darken(@primary-color, 10%);
               border: none;
               transition: @transition;
               &:hover,
               &.active {
                 width: 40px;
                 opacity: 1;
                 background: @orange-color;
               }
           }
       }
       .owl-stage-outer {
           padding: 10px;
           margin: -10px;
       }
    }
    &.style9{
        .testi-item{
            display: flex;
            background-color: #fff;
            border-radius: 5px 5px 5px 5px;
            box-shadow: 0px 0px 15px 0px #eee;
            padding: 40px 40px 15px 35px;
            .testi-content{
                display: block;
                margin-right: 30px;
                flex: 0 0 30%;
                padding-top: 12px;
                max-width: 30%;
                .images-wrap{
                    img{
                        width: 75px;
                        height: 75px;
                        border-radius: 50%;
                        margin-bottom: 12px;
                    }
                }
                .testi-information{
                    .testi-name{
                        font-size: 20px;
                        font-weight: 600;
                        line-height: 36px;
                        color: #191821;
                    }
                    .testi-title{
                        color: #404A50;
                    }
                    .ratings{
                        margin-top: 10px;
                        img{
                            width: 100px;
                        }
                    }
                }
            }
            .item-content{
                p{
                    font-size: 18px;
                    font-weight: 400;
                    line-height: 32px;
                    color: #454545;
                }
            }
        }
        .owl-dots {
            text-align: center;
            margin-top: 47px;
            .owl-dot{
                width: 25px;
                height: 8px;
                display: inline-block;
                margin: 0 6px;
                padding: 3px 0;
                border-radius: 30px;
                border: none;
                transition: @transition;
                background: #787cf2;
                box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.25);
                &:hover,
                &.active {
                  width: 40px;
                  background: #787cf2;
                  opacity: 1;
                }
            }
        }
        .owl-stage-outer {
            padding: 45px 0;
            margin: -45px 0;
        }
    }
    &.style10{
        padding-left: 15%;
        padding-top: 120px;
        padding-bottom: 80px;
        margin-top: -370px;
        position: relative;
        .slick-list {
            padding: 15px 300px 15px 15px !important;
        }
        .testi-top-section{
            .slick-part{
                .slider{
                    &.slider-for2{
                        .testi-item{
                            display: flex;
                            align-items: center;
                            vertical-align: middle;
                            border-radius: 3px;
                            background: #fff;
                            box-shadow: 0 0 25px #eee;  
                            padding: 30px 30px 30px 35px;
                            margin: 40px 45px 40px 100px;
                            .images-wrap{
                                position: relative;
                                img{
                                   max-width: 263px;
                                   width: 231px !important;
                                   height: 314px !important;
                                   margin-left: -150px;

                                }
                            }
                            .item-content{
                                padding: 0px 0px 0px 30px;
                                position: relative;
                                span{
                                    img{
                                        top: 74%;
                                        position: absolute;
                                        left: 73.5%;
                                        opacity: 0.5;
                                        width: 60px;
                                    }
                                }
                                p{
                                    font-size: 16px;
                                    font-style: italic;
                                    margin: 0 27px 15px 0;
                                }
                                .testi-informations{
                                    .testi-name{
                                        font-size: 18px;
                                        color: #0A0A0A;
                                        font-weight: 600;
                                    }
                                    .testi-title{
                                        font-size: 15px;
                                    }
                                }
                            }
                        }
                    }
                }
                .slick-arrow{
                    position: absolute;
                    font-size: 0;
                    background-image: linear-gradient( 90deg,#483afa 0%,#982ef5 100%);
                    border: none;
                    color: @white-color;
                    width: 50px;
                    height: 50px;
                    line-height: 50px;                    
                    border-radius: 50%;
                    z-index: 1;
                    top: -18%;
                    &:before {
                        content: "\f115";
                        font-family: Flaticon;
                        font-size: 18px;
                        font-weight: 400;
                    }
                    &.slick-prev{
                        right: 27%;
                    }
                    &.slick-next{
                        right: 22.5%;
                        &:before {
                            content: "\f114";
                        }
                    }
                }  
            }
        }
    }
}

/*----------------------------------------
    30. Shop Section CSS
----------------------------------------*/
.rs-shop-part{
    .woocommerce-result-count{
        font-size: 15px;
        line-height: 26px;
        color: @body-color;
        font-weight: 400;
        margin: 0;
    }
    .from-control{
        float: right;
        font-size: 15px;
        color: @body-color;
        font-weight: 400;
        vertical-align: top;
        padding: 10px;
        border: 1px solid #ced4da;
        border-radius: 5px;
    }
    .product-list{
        .image-product{
            position: relative;
            .overley{
                i{
                    position: absolute;
                    bottom: 150px;
                    right: 13px;
                    background: transparent;
                    opacity: 0;
                    visibility: hidden;
                    transition: 0.4s;
                    &:before{
                        font-size: 30px;
                        line-height: 45px;
                        color: @white-color;
                        font-weight: 400;
                        background: @primary-color;
                        border: none ;
                        padding: 8px 10px 8px;
                        height: 45px;
                        width: 45px;
                        line-height: 45px;
                        border-radius: 5px;
                    }
                }
            }
            .onsale{
                font-size: 13px;
                color: @white-color;
                font-weight: 700;
                line-height: 40px;
                background:@primary-color;
                width: 40px;
                height: 40px;
                text-align: center;
                border-radius: 50%;
                display: inline-block;
                position: absolute;
                top: 13px;
                right: 13px;
            }

        }
        .content-desc{
            .loop-product-title{
                margin: 0;
                font-size: 18px;
                line-height: 50px;
                color: @body-color;
                font-weight: 700;
               a{
                   color: @title-color;
                   font-size: 18px;
                   line-height: 52px;
                   font-weight: 600;
                    &:hover{
                        color: @primary-color;
                    }
               }
            }
            .price{
                font-size: 20px;
                line-height: 30px;
                color: @primary-color;
                font-weight: 700;
                margin: 0;
                del {
                    opacity: 0.6;
                    padding-right: 10px;
                }
            }
        }
        &:hover{
            .image-product{
                .overley i{
                    opacity: 1;
                    visibility: visible;
                    bottom: 13px;
                }
            }
        }
    }
}

/*----------------------------------------
    31. Single Shop Section CSS
----------------------------------------*/
.rs-single-shop {
    .single-product-image {
        .images-single{
            z-index: 1 !important;
          
        }
        img {
            width: 100%;
        }
    }
    .single-price-info {
        .product-title {
            font-size: 25px;
            font-weight: 700;
            margin-bottom: 12px;
        }
        .single-price {
            color: @primary-color;
            font-weight: 600;
        }
        .some-text {
            margin-top: 15px;
        }
        form {
            margin-bottom: 30px;
            input {
                height: 40px;
                width: 70px;
                line-height: 40px;
                text-align: center;
                padding-left: 10px;
                border: 1px solid rgba(54,54,54,.1);
                outline: none;
            }
        }
        p.category {
            margin: 0;
            padding-top: 25px;
            border-top: 1px solid #e6e6e6;
            font-size: 14px;
            span {
                font-weight: 700;
                padding-right: 10px;
            }
            a {
                color: @body-color;
                &:hover {
                    color: @primary-color;
                }
            }
        }
        .tag {
            margin: 0;
            span {
                font-weight: 700;
            }
        }
    }
    .tab-area {
        margin-top: 50px;
        ul.nav-tabs {
            border-bottom: 1px solid #f0f0f0;
            margin-bottom: 32px;
            li {
                margin-right: 3px;
                .nav-link {
                    padding: 10px 30px;
                    display: inline-block;
                    border-radius: 4px 4px 0 0;
                    font-size: 18px;
                    background: #f0f0f0;
                    color: @title-color;
                    font-weight: 600;
                    &:hover,
                    &.active {
                        background: @primary-color;
                        color: @white-color;
                    }
                }
                &:last-child {
                    margin-right: 0;
                }
            }
        }
        .tab-content {
            .tab-pane {
                .tab-title {
                    font-weight: 700;
                    margin-bottom: 34px;
                }
                .dsc-p {
                    margin: 0;
                }
                .reviews-grid {
                    .top-area {
                        margin-bottom: 5px;
                        p {
                            margin-bottom: 23px;
                        }
                        h6 {
                            font-size: 15px;
                            font-weight: 600;
                            color: @body-color;
                        }
                    }
                    .comment-form {
                        max-width: 600px;
                        p.comment-notes {
                            margin-bottom: 15px;
                        }
                        .placeholder-cntrl {
                            label {
                                font-weight: 600;
                                display: block;
                            }
                            input {
                                border: 1px solid rgba(54,54,54,.1);
                                padding: 10px 15px;
                                margin-bottom: 10px;
                                width: 100%;
                            }
                            textarea {
                                width: 100%;
                                padding: 10px 15px;
                                height: 75px;
                                border: 1px solid rgba(54,54,54,.1);
                                margin-bottom: 20px;
                            }
                        }
                        .ratings {
                            font-weight: 600;
                            margin-bottom: 18px;
                            display: block;
                            ul {
                                li {
                                    display: inline;
                                    i {
                                        color: @primary-color;
                                        font-weight: normal;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

/*----------------------------------------
    32. Cart Section CSS
----------------------------------------*/
.rs-cart {
    .cart-wrap {
        table.cart-table {
            border: 1px solid rgba(0,0,0,.1);
            width: 100%;
            border-collapse: collapse;
            td, th {
                padding: 25px;
                text-align: center;
                border: 1px solid #ccc;
            }
            th {
                border: none;
                font-size: 18px;
                padding: 25px;
                text-align: center;
                vertical-align: middle;
                font-weight: 700;
            }
            td {
                border-bottom: none;
                border-left: none;
                border-right: none;
                border-top: 1px solid #e6e6e6;
            }
            .product-remove {
                a {
                    margin: 0 auto;
                    color: @title-color;
                    display: block;
                    border-radius: 100%;
                    border: 1px solid #ddd;
                    font-size: 16px;
                    font-weight: 400;
                    height: 20px;
                    width: 20px;
                    line-height: 17px;
                    text-align: center;
                    &:hover {
                        background: #ff0000;
                        color: @white-color;
                    }
                }
            }
            .product-thumbnail {
                min-width: 32px;
                a {
                    img {
                        width: 80px;
                        height: auto;
                    }
                }
            }
            .product-name {
                a {
                    color: @body-color;
                    font-weight: 700;
                    &:hover {
                        color: @primary-color;
                    }
                }
            }
            .product-price {
                font-weight: 700;
            }
            .product-quantity {
                input {
                    border: 1px solid #e6e6e6;
                    border-radius: 4px;
                    padding: 0 0 0 10px;
                    max-width: 65px;
                    margin: 0 auto;
                    outline: none;
                }
            }
            .action {
                .coupon {
                    float: left;
                    input {
                        box-sizing: border-box;
                        border: 1px solid #d3ced2;
                        padding: 6px 6px 5px;
                        margin: 0 4px 0 0;
                        outline: none;
                        width: 320px;
                        border-radius: 4px;
                        height: 45px;
                        margin-right: 20px;
                        text-align: left;
                        padding-left: 22px;
                    }
                }
            }
        }
    }
    .cart-collaterals {
        width: 100%;
        overflow: hidden;
        .cart-totals {
            float: right;
            width: 48%;
            .title {
                font-weight: 700;
                color: @body-color;
                text-transform: capitalize;
            }
            table.cart-total-table {
                text-align: left;
                width: 100%;
                border-collapse: collapse;
                border-radius: 5px;
                tr {
                    border-top: 1px solid rgba(0,0,0,.1);
                    th {
                        font-size: 18px;
                        font-weight: 700;
                    }
                    td,th {
                        padding: 30px 10px;
                    }
                }
            }
        }
    }
}

/*----------------------------------------
    33. Checkout Section CSS
----------------------------------------*/
.rs-checkout {
    .checkout-title {
        margin-bottom: 30px;
        h3 {
            font-size: 26px;
            margin: 0;
        }
    }
    .coupon-toggle {
        .accordion {
            .card {
                border: unset;
                border-top: 3px solid @primary-color;
                border-radius: 0;
                .card-header {
                    border: none;
                    margin: 0;
                    border-radius: unset;
                    .card-title {
                        margin: 0;
                        span {
                            i {
                                margin-right: 10px;
                            }
                        }
                        button {
                            background: unset;
                            border: none;
                            color: @primary-color;
                            transition: @transition;
                            outline: none;
                            cursor: pointer;
                            &:hover {
                                color: @primary-color;
                            }
                        }
                    }
                }
                .card-body {
                    border: 1px solid #d3ced2;
                    padding: 20px 20px 50px 20px;
                    margin-top: 2em;
                    text-align: left;
                    .coupon-code-input {
                        width: 47%;
                        float: left;
                        margin-right: 50px;
                        input {
                            width: 100%;
                            height: 45px;
                            outline: none;
                            padding: 10px 18px;
                            color: @body-color;
                            border: 1px solid rgba(54, 54, 54, 0.1);
                        }
                    }
                }
            }
        }
    }
    
    .full-grid { 
        margin-top: 25px;   
        .form-content-box {
            margin-bottom: 50px;
            .form-group {
                label {
                    line-height: 2;
                    display: block;
                    margin-bottom: 5px;
                    font-weight: 600;
                }
                select {
                    color: #666666;
                    opacity: .5;
                    padding-left: 8px;
                    padding-right: 20px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    border: 1px solid #ccc;
                    border-radius: 0;
                    height: 45px;
                    line-height: 45px;
                    cursor: pointer;
                    width: 100%;
                    outline: none;
                }
                textarea {
                    height: 4em;
                    line-height: 1.5;
                    display: block;
                    box-shadow: none;
                    width: 100%;
                    border: 1px solid rgba(54, 54, 54, 0.1);
                    padding: 10px 18px;
                    margin: 0;
                    outline: none;
                }
                .form-control-mod {
                    border: 1px solid rgba(54, 54, 54, 0.1);
                    height: 45px;
                    padding: 10px 18px;
                    width: 100%;
                    margin: 0;
                    outline: none;
                    line-height: normal;
                    border-radius: unset;
                    &.margin-bottom {
                        margin-bottom: 10px !important;
                    }
                }
            }
        }
        .ordered-product {
            table {
                width: 100%;
                tr {
                    th {
                        border: 1px solid #ccc;
                        padding: 9px 12px;
                    }
                    td {
                        border: 1px solid #ccc;
                        padding: 6px 12px;
                    }
                }
            }
        }

        .payment-method {
            .top-area {
                border-bottom: 1px solid #d3ced2;
                .payment-co {
                    margin-bottom: 20px;
                    span {
                        font-weight: 600;
                        margin-right: 10px;
                    }
                }
                .p-msg {
                    position: relative;
                    box-sizing: border-box;
                    width: 100%;
                    padding: 1em;
                    margin: 1em 0 2em;
                    font-size: .92em;
                    border-radius: 2px;
                    line-height: 1.5;
                    background-color: #f9f9f9;
                    &:before {
                        content: '';
                        display: block;
                        border: 1em solid #f9f9f9;
                        border-right-color: transparent;
                        border-left-color: transparent;
                        border-top-color: transparent;
                        position: absolute;
                        top: -.75em;
                        left: 0;
                        margin: -1em 0 0 2em;
                    }
                }
            }
        }
    }
}

/*----------------------------------------
    34. Account Section CSS
----------------------------------------*/
.rs-my-account{
    .title{
        font-size: 42px;
        line-height: 52px;
        font-weight: 600;
        color: @title-color;
        margin: 0;
    }
    .rs-login{
        border: 1px solid rgba(54,54,54,.1);
        padding: 20px;
        text-align: left;
        border-radius: 5px;
        .form-group{
            label{
                display: block;
                font-size: 15px;
                line-height: 30px;
                font-weight: 600;
                color: @body-color;
                span{
                    color: @primary-color;
                }
            }
            input{
                width: 100%;
                margin: 0;
                outline: 0;
                line-height: normal;
                border: 1px solid rgba(54,54,54,.1);
                height: 45px;
            }
        }
        .last-password{
            a{
                font-size: 15px;
                line-height: 26px;
                font-weight: 400;
                color: @primary-color;
            }
        }
        p{
            font-size: 15px;
            line-height: 26px;
            font-weight: 400;
            color: @body-color;
            margin-bottom: 14px;
            a{  
                font-size: 15px;
                line-height: 26px;
                font-weight: 400;
                color: @primary-color;
            }
        }
    }
}

/*------------------------------------
    35. Footer Section CSS
------------------------------------*/
.rs-footer{
    background: url(assets/images/bg/footer-bg.png);
    background-color: #F5F6F9;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    .footer-top{
        padding: 92px 0 65px;
        .footer-logo{
            img{
                height: 40px;
            }
        }
        .widget-title{
            font-size: 22px;
            line-height: 40px;
            font-weight: 600;
            color: @title-color;
            margin-bottom: 25px;
        }
        .site-map{
            li{

                margin-bottom: 12px;
                a{
                    font-size: 16px;
                    color: @body-color;
                    &:hover{
                        color: @primary-color;
                    }
                }
            }
        }
        .footer-social {
            li {
                display: inline;
                margin-right: 5px;
                a {
                    display: inline-block;
                    width: 35px;
                    height: 35px;
                    line-height: 35px;
                    border-radius: 50%;
                    color: #555;
                    text-align: center;
                    font-size: 15px;
                    transition: all .8s ease;
                    background: rgba(255, 255, 255, 0.9);
                    i {
                        line-height: 35px;
                    }
                    &:hover {
                        color: @white-color;
                        background: @primary-color;
                    }
                }
                &:last-child {
                    margin: 0;
                }
            }
        }
        .address-widget{
            li{
                padding: 0px 0px 16px 40px;
                position: relative;
                .desc{
                    a{
                        color: @body-color;
                        &:hover {
                            color: @primary-color;
                        }

                    }
                }
                i{
                    color: @primary-color;
                    position: absolute;
                    left: 0px;
                    &:before{
                        font-size: 20px;
                    }
                }
            }
        }
        .widget-desc{
            margin: 0;
        }
        p{
           margin: 30px 0 0;
                position: relative;
                input[type=email]{
                    border: none;
                    width: 91%;
                    font-size: 13px;
                    padding: 16px 60px 16px 20px;
                    margin: 0;
                    color: #0a0a0a;
                    overflow: hidden;
                    border-radius: 30px 0 0 30px;
                    background: #fff;
                    box-shadow: 0 0 25px #eee
                }
                input[type="submit"]{
                   position: absolute;
                   top: 1px;
                   right: 1px;
                   bottom: 1px;
                   background-image: linear-gradient(90deg, #03228f 0%, #0e73e4 100%);
                   border-radius: 50%;
                   padding: 15px 28px 15px;
                   font-family: "Flaticon";
                   font-size: 0;
                   border: none;
                }
                    i{
                        position: absolute;
                        right: 0;
                        top: 0;
                        bottom: 0;
                        padding: 12px 20px;
                        pointer-events: none;
                        color: @white-color;
                    }
               
            ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
              color: @body-color;
              opacity: 1;
            }
            ::-moz-placeholder { /* Firefox 19+ */
              color: @body-color;
              opacity: 1;
            }
            :-ms-input-placeholder { /* IE 10+ */
              color: @body-color;
              opacity: 1;
            }
            :-moz-placeholder { /* Firefox 18- */
              color: @body-color;
              opacity: 1;
            } 
        }
    }
    .footer-bottom{
        padding: 20px 0;
        background: rgba(255,255,255,0.4);
        .copyright{
            p{
              
                margin: 0;
                a {
                    color: @body-color;
                    &:hover {
                        color: @primary-color;
                    }
                }

            }
        }
        .copy-right-menu {
            li {
             position: relative;
             display: inline-block;
             position: relative;
             padding: 0px 19px 0 25px; 
                a {
                    color: @body-color;
                    &:hover {
                        color: @primary-color;
                    }
                }
                &:before {
                    display: block;
                    content: "";
                    position: absolute;
                    font-size: 18px;
                    background: @primary-color;
                    left: 0;
                    top: 50%;
                    width: 6px;
                    height: 6px;
                    transform: translateY(-50%);
                    border-radius: 50%;
                }
                &:first-child {
                    &:before {
                        display: none;
                    }
                }
            }
        }
                      
    }
    &.style1{
        .footer-top{
            .widget-title{
                color: @title-color3;
            }
            .site-map{
                li{
                    a{
                        &:hover{
                            color: @orange-color;
                        }
                    }
                }
            }
            .footer-social {
                li {
                    a {
                        &:hover {
                            background: @orange-color;
                        }
                    }
                }
            }
            .address-widget{
                li{
                    .desc{
                        a{
                            &:hover {
                                color: @orange-color;
                            }

                        }
                    }
                    i{
                        color: @orange-color;
                    }
                }
            }
            p{
                input[type="submit"]{
                   background-image: linear-gradient(180deg , #dd4c23 19%, #f27c1e 100%);
                }
            }

        }
        .footer-bottom{
            .copyright{
                p{
                    a {
                        &:hover {
                            color: @orange-color;
                        }
                    }

                }
            }
            .copy-right-menu {
                li {
                    a {
                        &:hover {
                            color: @orange-color;
                        }
                    }
                    &:before {
                        background: @orange-color;
                    }
                }
            }
                          
        }
        &.home14-footer-style{
            .footer-bottom .copyright p a:hover,
            .footer-top .address-widget li .desc a:hover,
            .footer-top .address-widget li i,
            .footer-top .site-map li a:hover {
               color: @orange-color2;
            }
            .footer-top p input[type="submit"],
            .footer-bottom .copy-right-menu li:before,
            .footer-top .footer-social li a:hover {
               background: @orange-color2;
            }
        }
    }
    &.style2{
        background: url(assets/images/bg/footer-bg2.jpg);
        background-color: #F5F6F9;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        .footer-top{
            padding: 92px 0 65px;
            .footer-logo{
                img{
                    height: 40px;
                }
            }
            .widget-title{
                color: @white-color;
            }
            .site-map{
                li{

                    a{
                        color: @white-color;
                        &:hover{
                            color: #03228f;
                        }
                    }
                }
            }
            .footer-social {
                li {
                    display: inline;
                    margin-right: 5px;
                    a {
                        display: inline-block;
                        width: 35px;
                        height: 35px;
                        line-height: 35px;
                        border-radius: 50%;
                        color: #555;
                        text-align: center;
                        font-size: 15px;
                        transition: all .8s ease;
                        background: rgba(255, 255, 255, 0.9);
                        &:hover {
                            color: @white-color;
                            background: @primary-color;
                        }
                    }
                    &:last-child {
                        margin: 0;
                    }
                }
            }
            .address-widget{
                li{
                    padding: 0px 0px 16px 40px;
                    position: relative;
                    .desc{
                        color: @white-color;
                        a{
                            color: @white-color;
                            &:hover{
                                color: #03228f;
                            }
                        }
                    }
                }
            }
            .widget-desc{
                margin: 0;
            }
            p{
             
                input[type=email]{
                    box-shadow: unset;
                }
            }
        }
        .footer-bottom{
            background: transparent;
            border-color: rgba(80,90,100,0.56) !important;
            border-top: 1px solid;
            .copyright{
                p{
                    color: @white-color;
                    a {
                        color: @white-color;
                        &:hover {
                            color: @secondary-color;
                        }
                    }

                }
            }
            .copy-right-menu {
                li {
                    a {
                        color: @white-color;
                    }
                }
            }
        }
        &.modify1{
            background: unset;
            background-color: unset;
            .footer-top{
                .site-map{
                    li{
                        a{
                            &:hover{
                                color: #1273EB;
                            }
                        }
                    }
                }
                .address-widget{
                    li{
                        i{
                            &:before{
                                color: #fd6509;
                            }
                        }
                        .desc{
                            a{
                                &:hover{
                                    color: #1273EB;
                                }
                            }
                        }
                    }
                }
               
            }
            .footer-bottom{
                background: #000000;
                border-color: unset;
                border-top: unset;
                .copyright{
                    p{
                        color: @white-color;
                        a {
                            color: @white-color;
                            &:hover {
                                color: #1273EB;
                            }
                        }

                    }
                }
                .copy-right-menu {
                    li {
                        a {
                            color: @white-color;
                            &:hover {
                                color: #1273EB;
                            }
                        }
                    }
                }
            }
        }
    }
    &.style3{
       background: #F5F6F9;
       background-size: cover;
       .footer-top{
           .widget-title{
               color: @title-color3;
           }
           .site-map{
               li{
                   a{
                       &:hover{
                           color: #1273EB;
                       }
                   }
               }
           }
           .footer-social {
               li {
                   a {
                       &:hover {
                           background: #787cf2;
                       }
                   }
               }
           }
           .address-widget{
               li{
                   .desc{
                       a{
                           &:hover {
                               color: #1273EB;
                           }

                       }
                   }
                   i{
                       color: #1273EB;
                   }
               }
           }
           p{
               input[type="submit"]{
                  background: #787cf2;
               }
               input[type="submit"]:hover {
                   opacity: .9;
               }
           }

       }
       .footer-bottom{
           .copyright{
               p{
                   a {
                       &:hover {
                           color: #1273EB;
                       }
                   }

               }
           }
           .copy-right-menu {
               li {
                   a {
                       &:hover {
                           color: #1273EB;
                       }
                   }
                   &:before {
                       background: #787cf2;
                   }
               }
           }             
       }
       &.onepage-style4{
            background: url(assets/images/bg/footer-bg.png);
            background-color: #F5F6F9;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
       }
    }
}

/* -----------------------
    36. Error Page CSS
--------------------------*/
.page-error {
    background: url(assets/images/bg/error.jpg);
    background-repeat: no-repeat !important;
    background-size: cover !important;
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100vh;
    .error-not-found {
        position: relative;
        background: #cfd0ef;
        width: 650px;
        padding: 50px;
        height: 650px;
        border-radius: 50%;
        margin: 0 auto;
        text-align: center;
        .error-content {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
        }
        .title {
            font-size: 35px;
            line-height: 52px;
            font-weight: 700;
            color: #101010;
            margin-bottom: 30px;
            span {
                font-size: 251px;
                line-height: 171px;
                font-weight: 700;
                color: #101010;
                display: block;
                padding-bottom: 70px;
            }
        }
    }
}

/* -----------------------
    37. Scroll Up CSS
--------------------------*/
#scrollUp {
    text-align: center;
    bottom: 40px;
    cursor: pointer;
    display: none;
    position: fixed;
    right: 20px;
    z-index: 999;
    border-radius: 50px 50px 4px 4px;
    i {
        background-image: linear-gradient(90deg, #03228f 0%, #0e73e4 100%);
        border-radius: 50%;
        height: 40px;
        font-size: 24px;
        font-weight: 600;
        width: 42px;
        color: #fff;
        line-height: 36px;
        transition: @transition;
        margin-left: 2px;
        box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
        &:hover {
            opacity: 0.8;            
        }
    }
    &.oranage{
        i{
            background-image: linear-gradient(
            180deg
            , #dd4c23 19%, #f27c1e 100%);
        }
    } 
    &.oranage2{
        i{
           background: @orange-color2;
        }
    }
    &.purple-color{
        i{
           background: #787cf2; 
        }
    }
}

/* ------------------------------------
    38. Preloader CSS
---------------------------------------*/
.loader {
    background-color: @white-color;
    height: 100%;
    width: 100%;
    position: fixed;
    margin-top: 0;
    top: 0;
    z-index: 999999;
    .loader-container {
        width: 50px;
        height: 50px;
        background-color: @primary-color;
        border-radius: 100%;
        -webkit-animation: sk-scaleout 1s infinite ease-in-out;
        animation: sk-scaleout 1s infinite ease-in-out;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    &.orange-loader{
        .loader-container{
            background: @orange-color2;
        }
    }
}

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

/* ------------------------------------
    39. Animation Part
---------------------------------------*/

/*Pulse Border Animation*/
@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}
@-webkit-keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

.move-y{
    animation: move-y 2s alternate infinite;
    -webkit-animation: move-y 2s alternate infinite;
}

@keyframes move-y{
    0% {
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(0, 10px, 0);
        -webkit-transform: translate3d(0, 10px, 0);
    }
}



.dance3{
   -webkit-animation: dance3 8s alternate infinite; 
}
@keyframes dance3{
  0% 
    {  
        -webkit-transform: scale(0.8);
    }
    100% {
        -webkit-transform: scale(1);
    }
}

.dance{
   -webkit-animation: dance 2s alternate infinite; 
}
@keyframes dance{
  0% 
    {  
        -webkit-transform: scale(0.8);
    }
    100% {
        -webkit-transform: scale(1);
    }
}

.dance2{
  -webkit-animation: dance2 4s alternate infinite; 
}

@keyframes dance2{
    0% {
      
        -webkit-transform: translate3d(0, 0, 0);
    }
    50% {
      
        -webkit-transform: translate3d(15px, -15px, 0);
    }
    100% {
        
        -webkit-transform: translate3d(0, -15px, 15px);
    }
}
.watermark-animate {
  -webkit-animation: watermark-animate 8s infinite;
   animation: watermark-animate 8s infinite;
   animation-direction: alternate-reverse;
   -webkit-animation-timing-function: linear;
   animation-timing-function: linear;
}
@keyframes watermark-animate{
    0% {
       left: 0;
    }
    100% {
       left: 100%;
    }
}

.rs-rain-animate {
    position: relative;
    .container {
        position: relative;
        z-index: 1;
    }
    .line-inner {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 100%;
        margin: auto;
        width: calc(100%);
        pointer-events: none;
        overflow: hidden;
        z-index: 0;
        max-width: 1240px;
        .line {
            position: absolute;
            width: 1px;
            height: 100%;
            top: 0;
            left: calc(50%);
            background: #fff;
            z-index: 1;
            &:after {
                content: "";
                display: block;
                position: absolute;
                height: 80px;
                width: 3px;
                top: -20%;
                left: -1px;
                background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 39%, #1273eb 130%, #1273eb 59%);
                    background-color: rgba(0, 0, 0, 0);
                -webkit-animation: rain-line 13s 0s linear infinite;
                animation: rain-line 13s 0s linear infinite;
                animation-delay: 0s;
            }
            &:nth-child(1) {
                left: 2px !important;
                &:after {
                    -webkit-animation-delay: 2s;
                    animation-delay: 2s;
                }
            }
            &:nth-child(3) {
                left: unset !important;
                right: 2px;
                &:after {
                    -webkit-animation-delay: 2.5s;
                    animation-delay: 2.5s;
                }
            }
        }
        &.style2 {
            .line {
                background: rgba(255, 255, 255, 0.10);
                &:after {
                    background-color: #fff;
                }
            }
        }
        &.orange-dark {
            .line {
                background: rgba(255, 255, 255, 0.10);
                &:after {
                        background-image: linear-gradient(
                    220deg
                    , #F27C1E 0%, #DD4C23 79%);
                }
            }
        }
    }
}
@keyframes rain-line {
    0% {
        top: -20%;
    }
    100% {
        top: 100%;
    }
}
@-webkit-keyframes rain-line {
    0% {
        top: -20%;
    }
    100% {
        top: 100%;
    }
}
.up-down {
   animation: up-down 3s alternate infinite;
   -webkit-animation: up-down 3s alternate infinite;
}
@keyframes up-down {
   0% {
       transform: translateY(10px);
       -webkit-transform: translateY(0);
   }
   50% {
       transform: translateY(-10px);
       -webkit-transform: translateY(-10px);
   }
   100% {
       transform: translateY(0);
       -webkit-transform: translateY(0);
   }
}
@-webkit-keyframes up-down {
   0% {
       transform: translateY(30px);
       -webkit-transform: translateY(0);
   }
   50% {
       transform: translateY(-50px);
       -webkit-transform: translateY(-50px);
   }
   100% {
       transform: translateY(0);
       -webkit-transform: translateY(0);
   }
}
.horizontal{
    animation-name: horizontal;
    animation-duration: 12s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    &.new-style{
        animation-duration: 15s;
    }
}
@keyframes horizontal{
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(100px);
    }
    100% {
        transform: translateX(0);
    }
}
.vertical{
    animation-name: vertical;
    animation-duration: 12s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    &.new-style{
        animation-duration: 15s;
    }
}
@keyframes vertical{
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(100px);
    }
    100% {
        transform: translateY(0);
    }
}

.rotated-style{
    animation: rotated-style 5s linear infinite;
}
@keyframes rotated-style{
    0% {
        -webkit-transform: translate(0)rotate(0);
        transform: translate(0)rotate(0);
    }
    25% {
     
        transform: translate(-10px,10px)rotate( 10deg );
    }
    50% {
  
        transform: translate(5px,-5px)rotate( 25deg );
    }
    75% {
        transform: translate(15px,-5px)rotate( 15deg );
    }
    100% {
        transform: translate(0)rotate(0);
    }
}

.fadeinup{
    animation-duration: 2s;
    animation-name: fadeInUp;
}
@keyframes fadeinup{
    0% {
        opacity: 0;
        transform: translate3d(0,100%,0);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

.fadeinup2{
    animation-duration: 3s;
    animation-name: fadeInUp;
}
@keyframes fadeinup2{
    0% {
        opacity: 0;
        transform: translate3d(0,100%,0);
    }
    00% {
        opacity: 1;
        transform: none;
    }
}

.fadeInRight{
    animation-duration: 2s;
    animation-name: fadeInRight;
}
@keyframes {
    0% {
        opacity: 0;
        transform: translate3d(100%,0,0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}