/*============================================
	Project Name : BizLine
	Company Name : G-Projects
	Company URL: https://themeforest.net/user/g-projects
    Project Description: BizLine is a Modern HTML template
============================================*/


/*============================================
    START TABLE OF CONTENT.section-title
==============================================
    1.  Standard Styles
    2.  Buttons Styles
    3.  Breadcrumb & Page Title Styles
    4.  Custom Margins & Paddings Styles
    5.  Theme Titles Styles
    6.  Flaticons & Hovers Styles
    7.  TopBar & NavBar Styles
    8.  Home Slider Styles
    9.  Animation & Features Styles
    10. Text Section Styles
    11. Filters & Portfolio Styles
    12. Team Details Styles
    13. Skills Section Styles
    14. Progress Bar Styles
    15. News Section Styles
    16. Testimonials Styles
    17. Pricing Boxes Styles
    18. Accordion Styles
    19. Subscription Form Styles
    20. Blog & Single Post Styles
    21. Sidebar Elements Styles
    22. Contact Form Styles
    23. Footer Styles
    24. 404 Page Styles
    25. Other Styles
==============================================
    END TABLE OF CONTENT
============================================*/


/*--------------------------------------------
1. Standard Styles

--------------------------------------------*/

@font-face {
    font-family: "Circe Rounded";
    src: url("../../fonts/CirceRounded-Regular.otf");
    src: url("../../fonts/Circe Rounded.woff") format("woff"), url("../../fonts/CirceRounded-Regular.otf") format("opentype");
}

body {
    font-family: "Circe Rounded", sans-serif;
    color: #333;
    font-size: 17px;
    line-height: 26px;
    letter-spacing: .5px;
    overflow-x: hidden;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
}

#container {
    background: #fff;
    position: relative;
    overflow-x: hidden;
    margin: 0 auto;
}

.boxed-page {
    position: relative;
    overflow-x: hidden;
    width: 1220px;
    margin: 0 auto;
    background-color: #fff;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.boxed-page .tp-leftarrow {
    left: 70px !important;
}

.boxed-page .tp-rightarrow {
    left: 95% !important;
}

.boxed-page .navbar-fixed-top {
    max-width: 1220px;
    margin: 0 auto;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    color: #333;
    font-family: "Circe Rounded", sans-serif !important;
}

img {
    max-width: 100%;
    height: auto;
}

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

.text-right {
    text-align: right;
}

.text-brand-color {
    color: #FF0000;
}

/* 26/7/2022 stat*/
#myModal .modal-body img {
    width: 80px !important;

}

.full_blog_single .page-title h1 {
    margin: 26px 0px;
}

.post_texts a {
    color: #000;
    font-size: 14px;
}

.page-title_blogs .page-title {
    padding: 0px;
}

.frter {
    margin-bottom: 8px !important;
}

.frter img {
    margin-right: 8.5px !important;
    margin-top: -4px !important;
    width: 17px;
}




.light-bg img {
    width: 20px;
    margin-top: -1px;
}

.colof .fa-phone::before {
    font-size: 25px;
}

.bgfe {
    width: 100%;
    float: left;
    margin-top: 34px;
}

.light-bg {
    text-align: center;
    margin-bottom: 30px;
    padding: 27px 15px 35px;
    border-radius: 7px;
    background: #eff6f9;
    box-shadow: 0px 4px 5px 2px #dbdbdb;
}

.contact-form .light-bg {
    margin-top: 28px;
}

.light-bg .btn-style-one {
    font-size: 17px;
}

.colof .fa-phone {
    width: auto !important;
    height: auto !important;
    padding: 7px !important;
    border: none !important;
}

.talk-in-person-cta {
    font-size: 20px;
}

.colof img {
    width: 27px;
    margin-top: -6px;
    margin-right: 5px;
    margin-left: 5px;
}

/* .zoom-in-zoom-out img { */
/* width: 40px; */
/* } */




.zoom-in-zoom-out img {
    display: block;
    width: 35px;
    -webkit-animation: ring 7s .7s ease-in-out infinite;
    -webkit-transform-origin: 50% 4px;
    -moz-animation: ring 7s .7s ease-in-out infinite;
    -moz-transform-origin: 50% 4px;
    animation: ring 7s .7s ease-in-out infinite;
    transform-origin: 50% 4px;
}

@-webkit-keyframes ring {
    0% {
        -webkit-transform: rotateZ(0);
    }

    1% {
        -webkit-transform: rotateZ(30deg);
    }

    3% {
        -webkit-transform: rotateZ(-28deg);
    }

    5% {
        -webkit-transform: rotateZ(34deg);
    }

    7% {
        -webkit-transform: rotateZ(-32deg);
    }

    9% {
        -webkit-transform: rotateZ(30deg);
    }

    11% {
        -webkit-transform: rotateZ(-28deg);
    }

    13% {
        -webkit-transform: rotateZ(26deg);
    }

    15% {
        -webkit-transform: rotateZ(-24deg);
    }

    17% {
        -webkit-transform: rotateZ(22deg);
    }

    19% {
        -webkit-transform: rotateZ(-20deg);
    }

    21% {
        -webkit-transform: rotateZ(18deg);
    }

    23% {
        -webkit-transform: rotateZ(-16deg);
    }

    25% {
        -webkit-transform: rotateZ(14deg);
    }

    27% {
        -webkit-transform: rotateZ(-12deg);
    }

    29% {
        -webkit-transform: rotateZ(10deg);
    }

    31% {
        -webkit-transform: rotateZ(-8deg);
    }

    33% {
        -webkit-transform: rotateZ(6deg);
    }

    35% {
        -webkit-transform: rotateZ(-4deg);
    }

    37% {
        -webkit-transform: rotateZ(2deg);
    }

    39% {
        -webkit-transform: rotateZ(-1deg);
    }

    41% {
        -webkit-transform: rotateZ(1deg);
    }

    43% {
        -webkit-transform: rotateZ(0);
    }

    100% {
        -webkit-transform: rotateZ(0);
    }
}

@-moz-keyframes ring {
    0% {
        -moz-transform: rotate(0);
    }

    1% {
        -moz-transform: rotate(30deg);
    }

    3% {
        -moz-transform: rotate(-28deg);
    }

    5% {
        -moz-transform: rotate(34deg);
    }

    7% {
        -moz-transform: rotate(-32deg);
    }

    9% {
        -moz-transform: rotate(30deg);
    }

    11% {
        -moz-transform: rotate(-28deg);
    }

    13% {
        -moz-transform: rotate(26deg);
    }

    15% {
        -moz-transform: rotate(-24deg);
    }

    17% {
        -moz-transform: rotate(22deg);
    }

    19% {
        -moz-transform: rotate(-20deg);
    }

    21% {
        -moz-transform: rotate(18deg);
    }

    23% {
        -moz-transform: rotate(-16deg);
    }

    25% {
        -moz-transform: rotate(14deg);
    }

    27% {
        -moz-transform: rotate(-12deg);
    }

    29% {
        -moz-transform: rotate(10deg);
    }

    31% {
        -moz-transform: rotate(-8deg);
    }

    33% {
        -moz-transform: rotate(6deg);
    }

    35% {
        -moz-transform: rotate(-4deg);
    }

    37% {
        -moz-transform: rotate(2deg);
    }

    39% {
        -moz-transform: rotate(-1deg);
    }

    41% {
        -moz-transform: rotate(1deg);
    }

    43% {
        -moz-transform: rotate(0);
    }

    100% {
        -moz-transform: rotate(0);
    }
}

@keyframes ring {
    0% {
        transform: rotate(0);
    }

    1% {
        transform: rotate(30deg);
    }

    3% {
        transform: rotate(-28deg);
    }

    5% {
        transform: rotate(34deg);
    }

    7% {
        transform: rotate(-32deg);
    }

    9% {
        transform: rotate(30deg);
    }

    11% {
        transform: rotate(-28deg);
    }

    13% {
        transform: rotate(26deg);
    }

    15% {
        transform: rotate(-24deg);
    }

    17% {
        transform: rotate(22deg);
    }

    19% {
        transform: rotate(-20deg);
    }

    21% {
        transform: rotate(18deg);
    }

    23% {
        transform: rotate(-16deg);
    }

    25% {
        transform: rotate(14deg);
    }

    27% {
        transform: rotate(-12deg);
    }

    29% {
        transform: rotate(10deg);
    }

    31% {
        transform: rotate(-8deg);
    }

    33% {
        transform: rotate(6deg);
    }

    35% {
        transform: rotate(-4deg);
    }

    37% {
        transform: rotate(2deg);
    }

    39% {
        transform: rotate(-1deg);
    }

    41% {
        transform: rotate(1deg);
    }

    43% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(0);
    }
}


.zoom-in-zoom-out {
    right: 0;
    position: fixed;
    float: right;
    bottom: 0;
    margin: 0 19px 19px 0;
    z-index: 8;
    background: #00ca4f;
    padding: 10px;
    border-radius: 50%;
}



/* .zoom-in-zoom-out { */
/* animation: zoom-in-zoom-out 2s ease-out infinite; */
/* }*/

@keyframes zoom-in-zoom-out {
    0% {
        transform: scale(1, 1);
    }

    50% {
        transform: scale(1.5, 1.5);
    }

    100% {
        transform: scale(1, 1);
    }
}



.post_imgs,
.post_texts {
    margin-bottom: 20px;
    height: 70px;
}

.post_imgs img {
    border-radius: 4px;
}

.fsre img {
    margin-right: 2px !important;
    margin-top: -3px !important;
    width: 23px;
}


#myModal .modal-body .quote-f-txt {
    text-transform: capitalize !important;
}

#myModal .modal-title {
    text-transform: capitalize !important;
}

/* 26/7/2022 end*/
.img-center {
    margin-left: auto;
    margin-right: auto;
}



.circle {
    -webkit-border-radius: 100%;
    border-radius: 100%;
}

.white {
    color: #fff !important;
}

a {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:focus {
    text-decoration: none;
    color: #333;
    outline: 0;
}

::-moz-selection {
    background: #FF0000;
    color: #fff;
    text-shadow: none;
    outline: none;
}

/* css landing page */

.claa {
    width: 100%;
    float:
        left;
    padding: 30px 0px;
}

/* Slides */
.mySlides {
    display: none;
    padding: 80px;
    text-align: center;
}

/* Next & previous buttons */
.prev,
.next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -30px;
    padding: 16px;
    color: #888;
    font-weight: bold;
    font-size: 20px;
    border-radius: 0 3px 3px 0;
    user-select: none;
}

/* Position the "next button" to the right */
.next {
    position: absolute;
    right: 0;
    border-radius: 3px 0 0 3px;
}

.form_filis label {
    color: #fff;
}

.form_filis .btn-style-one {
    background-color: #fff !important;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
}

/* The dot/bullet/indicator container */
.dot-container {
    text-align: center;
    padding: 20px;
    background: #ddd;
}

/* The dots/bullets/indicators */
.dot {
    cursor: pointer;
    height: 7px;
    width: 7px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}


/* Add an italic font style to all quotes */
q {
    font-style: italic;
}

/* Add a blue color to the author */
.author {
    color: cornflowerblue;
}

.dot-container {
    background: none;
}

.testimonial {
    position: relative;
}

/* 10/6/2022 */
.blod_gse h1 {
    height: 60px;
}

/* 10/6/2022*/


.gallery-item {
    padding: 15px 0px;
}

.fr {
    margin-top: 27px;
}

.full_img {
    max-width: 136px;
    margin: 21px 0px;
}

.slideshow-container {
    position: relative;
}

/* landing page*/

::selection {
    background: #FF0000;
    color: #fff;
    text-shadow: none;
    outline: none;
}

.main-container {
    overflow: hidden;
}

.dropcap {
    font-size: 38px;
    font-weight: 400;
    line-height: 58px;
    float: left;
    width: 60px;
    height: 60px;
    padding: 0 10px 0 14px;
}

.dropcap.bg {
    margin-right: 22px;
    margin-bottom: 0;
    color: #ffffff;
    background: #FF0000;
    text-align: center;
}

.dropcap.yellow-bg {
    background: #f6d014;
    margin-right: 10px;
}

.dropcap.circle {
    border-radius: 50%;
}

.dropcap.rounded {
    border-radius: 5px;
}

hr {
    margin-top: 0;
    margin-bottom: 0;
}

.right-half,
.left-half {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    background-position: center center;
    background-size: cover;
}

.right-half.width33,
.left-half.width33 {
    width: 33%;
}

.right-half.width50,
.left-half.width50 {
    width: 50%;
}

.left-half {
    left: 0;
}


/*--------------------------------------------
2. Buttons Styles
--------------------------------------------*/

.btn {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.btn-primary {
    font-size: 14px;
    font-style: normal !important;
    line-height: 17px;
    margin: 0;
    padding: 12px 25px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #ffffff !important;
    border: 0;
    background: #24252a;
    text-shadow: none;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    border-radius: 2rem;
}

.btn-primary:hover {
    background: #ffffff;
    color: #FF0000 !important;
}

.btn-primary.call-to-action-dark:hover {
    background: #f3f3f3;
    color: #24252a !important;
}

.btn-primary.white {
    background: #fff;
    color: #FF0000 !important;
    border-radius: 2rem;
}

.btn-primary.white:hover {
    background: #24252a;
    color: #ffffff !important;
}

.btn-primary.black {
    background: #24252a;
    color: #FF0000 !important;
}

.btn-primary.black:hover {
    background: #FF0000;
    color: #fff !important;
}

.btn-primary.yellow {
    background: #f6d014;
    color: #ffffff !important;
}

.btn-primary.yellow:hover {
    background: #24252a;
}

.btn-primary.blue {
    background: #00bcd4;
    color: #ffffff !important;
}

.btn-primary.blue:hover {
    background: #24252a;
}

.btn-white-bordered {
    border: 2px solid #fff;
    padding: 12px 25px;
    text-transform: uppercase;
    color: #fff;
}

/* blog stats css*/
.page-title {}

.blogs .page-title_blogs{
	height: 460px ;
}

.page-title_blogs p:nth-child(3) {
    height: 117px;
}

.page-title_blogs {
    border: 2px solid #ff1b1b;
    box-shadow: 0px 0px 10px 0px #ff1b1b;
    margin: 11px 0px;
}

.blogs_title {
    text-align: center;
    margin: 55px 0px;
}

.page-view {
    padding: 12px 23px 17px;
}

.page-view h4 {
    margin: 18px 0px;
}

.page-view .texts {
    margin: 10px 0px;
}

.page-view a {
    color: red;
    font-size: 14px;
    padding: 9px 0px;
    line-height: 23px;
}

.page-view h4 {
    margin: 18px 0px 0px;
    font-weight: 700;
}

.right_blog {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0px 4px 5px 2px #dbdbdb;
}

.single_blog {
    margin: 58px 0px 21px;
}

.Popular_Posts h3,
.Recent_Posts h3 {
    padding: 17px 15px;
}

/* blog stats css*/

.btn-white-bordered:hover {
    background: #FF0000 !important;
}

a.btn.btn-info {
    border-radius: 2rem;
    padding: 5px 15px 5px !important;

}

/*--------------------------------------------
3. Breadcrumb & Page Title Styles
--------------------------------------------*/

.breadcrumb-section {
    padding: 150px 0;
}

#overlay .modal-content {
    background: #ffffff;
    padding: 19px;
    text-align: center;
}

#overlay .form_coll {
    width: 100%;
    margin: 9px 0px;
    border: 1px solid #ced4da !important;
    border-radius: 1rem !important;
    background: no-repeat;
    padding: 6px 14px;
}

#overlay .sumbmit_bar {
    margin: 9px 0px;
    border: 1px solid #ff0000 !important;
    border-radius: 24px;
    padding: 9px 32px;
    background-color: #ff0000 !important;
    color: #fff;
}

#form_coll_sev {
    padding: 8px 14px !important;
}

#overlay .form_coll:focus-visible {
    border: 1px solid #ced4da !important;
    box-shadow: 0px 0px 3px 0px #ced4da !important;
    outline: -webkit-focus-ring-color auto 0px !important;
}

h4.login_frw {
    margin-bottom: 14px;
}

#overlay .close {
    font-size: 29px !important;
    font-weight: 500 !important;
    line-height: 0.4 !important;
}


#overlay .sumbmit_bar:hover {
    background: none !important;
    color: #000;
}

#overlay .modal-dialog {
    margin: 96px auto !important;
}


.breadcrumb {
    background: transparent;
    border-radius: 0;
    color: #fff;
    float: right;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0;
    background: rgba(0, 0, 0, 0.4);
}

.breadcrumb li {
    display: inline-block;
    padding: 0 5px 0 0;
}

.breadcrumb li a {
    color: #fff;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.breadcrumb li a:hover {
    color: #FF0000;
}

.breadcrumb li:after {
    content: "\f101";
    padding-left: 10px;
    font-family: 'FontAwesome';
    font-size: 15px;
}

.breadcrumb li:first-child:after,
.breadcrumb li:last-child:after {
    content: "";
}

.page-title {
    padding: 4px 0 0 0;
}

.page-title h1 {
    font-size: 35px;
    letter-spacing: 1.5px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
    color: #fff;
}


/*--------------------------------------------
4. Custom Margins & Paddings Styles
--------------------------------------------*/

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

.mt60 {
    margin-top: 60px;
}

.mt65 {
    margin-top: 65px;
}

.mt30 {
    margin-top: 30px;
}

.mt25 {
    margin-top: 25px;
}

.mb15 {
    margin-bottom: 15px;
}

.mb30 {
    margin-bottom: 30px;
}

.mb60 {
    margin-bottom: 60px;
}

.mr10 {
    margin-right: 10px;
}

.pad15 {
    padding: 15px 0;
}

.pad30 {
    padding: 30px 0;
}

.pad50 {
    padding: 50px 0;
}

.pad60 {
    padding: 60px 0;
}

.pad80 {
    padding: 20px 0;
}

.pad100 {
    padding: 100px 0;
}

.pad120 {
    padding: 120px 0;
}

.pad-t100 {
    padding-top: 100px;
}

.pad-t80 {
    padding-top: 50px;
}

.pad-t30 {
    padding: 30px 0 30px;
    background-size: cover;
}

.pad-t60 {
    padding-top: 60px;
}

.pad-t90 {
    padding-top: 90px;
}

.pad-t120 {
    padding-top: 120px;
}

.pad-b30 {
    /* padding-bottom: 30px; */
}

.pad-b40 {
    padding-bottom: 40px;
}

.pad-b50 {
    padding-bottom: 50px;
}

.pad-b60 {
    padding-bottom: 60px;
}

.pad-b70 {
    padding-bottom: 70px;
}

.pad-b80 {
    padding-bottom: 80px;
}

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


/*--------------------------------------------
5. Theme Titles Styles
--------------------------------------------*/

.section-title {
    position: relative;
    margin: 30px 0 30px;
}

.section-title h3 {
    position: relative;
    font-size: 30px;
    line-height: 42px;
    color: #333;
}

.section-title h3 span {
    color: #FF0000 !important;
}

.section-title h3:after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    width: 200px;
    height: 2px;
    margin: 0 auto;
    content: '';
    opacity: 1;
    background: #FF0000;
}

.section-title.white h3 {
    color: #ffffff;
}

.section-title.white h3:after {
    background: #fff !important;
}

.section-title.left h3:after {
    left: 0;
    right: 100%;
}

.section-title span i:before {
    font-size: 40px;
    color: #FF0000;
}

.footer-title h3 {
    font-size: 17px;
    text-transform: uppercase;
    color: #ffffff;
    position: relative;
    margin-bottom: 20px;
}

.section-title-sm h3 {
    font-size: 30px;
    line-height: 30px;
    text-transform: uppercase;
}

.section-title-sm h3 span {
    color: #FF0000;
}

.section-title-2 {
    font-size: 16px;
    line-height: 22px;
    position: relative;
    margin: 0 0 50px;
    color: #24252a;
}

.section-title-2 h3 {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 50px;
}

.section-title-2 h3 span {
    color: #FF0000 !important;
}

.section-title-2:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 25px;
    height: 2px;
    margin: -27px auto;
    content: '';
    opacity: 1;
    background: #FF0000;
}

.section-title-2.white h3 {
    color: #ffffff;
}

.section-title-2 span i:before {
    font-size: 40px;
    color: #FF0000;
}

.section-title-2.center {
    text-align: center;
}

.section-title-2.center:after {
    left: 0;
    right: 0;
    width: 40px;
    height: 3px;
    margin: -28px auto;
}

blockquote {
    padding: 12.5px 25px;
    margin: 0 0 12.5px;
    font-style: italic;
    border-left: 3px solid #24252a;
}

blockquote.primary {
    border-left-color: #FF0000;
}

blockquote.ash-bg {
    background-color: #f7f7f7;
}

.divider {
    margin-top: 20px;
    margin-bottom: 20px;
    border-top: 1px solid #999;
}

.divider.dotted {
    border-top: 1px dotted #999;
}

.divider.dashed {
    border-top: 1px dashed #999;
}

.bg-color-1 {
    background: #1f2125;
}

.bg-color-2 {
    background: #111010;
}

.parallax {
    background-repeat: no-repeat;
    /* background-attachment: fixed; */
    background-position: 50% 0;
    background-size: cover;
}


/*--------------------------------------------
6. Flaticons & Hovers Styles
--------------------------------------------*/

[class^="flaticon-"]:before,
[class*=" flaticon-"]:before,
[class^="flaticon-"]:after,
[class*=" flaticon-"]:after {
    margin-left: 0;
}

.fa-ul li {
    padding: 5px 0;
}

.fa-ul li .fa-li {
    margin-top: 8px;
    color: #FF0000;
}

.flex-control-thumbs {
    margin: 20px 0 0;
    position: static;
    overflow: visible;
}

.flex-control-thumbs li {
    float: none;
    width: 60px;
    height: 60px;
    overflow: hidden;
    transform: rotate(-45deg);
    margin: 0 8px;
}

.flex-control-thumbs img {
    border: 2px solid #545454;
    opacity: 0.4;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    position: relative;
    z-index: 0;
}

.flex-control-thumbs img.flex-active {
    border: 2px solid #FF0000;
    z-index: 1;
}

.flex-control-thumbs img:hover {
    border: 2px solid #FF0000;
    z-index: 1;
}

.hvr-in {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    background: #FF0000;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.hvr-in:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #1f2125;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-in:hover,
.hvr-in:focus,
.hvr-in:active {
    color: white;
}

.hvr-in:hover:before,
.hvr-in:hover:before,
.hvr-in:hover:before,
.hvr-in:focus:before,
.hvr-in:focus:before,
.hvr-in:focus:before,
.hvr-in:active:before,
.hvr-in:active:before,
.hvr-in:active:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
}

.hvr-out {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    background: #FF0000;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.hvr-out:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #000;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-out:hover,
.hvr-out:focus,
.hvr-out:active {
    color: white;
}

.hvr-out:hover:before,
.hvr-out:hover:before,
.hvr-out:hover:before,
.hvr-out:focus:before,
.hvr-out:focus:before,
.hvr-out:focus:before,
.hvr-out:active:before,
.hvr-out:active:before,
.hvr-out:active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.shadow {
    box-shadow: -25px 0 30px -15px rgba(0, 0, 0, 0.15), 25px 0 30px -15px rgba(0, 0, 0, 0.15);
}

.back-to-top.reveal {
    cursor: pointer;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    opacity: 30;
    filter: alpha(opacity=3000);
}

.back-to-top.reveal:focus,
.back-to-top.reveal:active,
.back-to-top.reveal:hover {
    background-color: #24252a;
    opacity: 100;
    filter: alpha(opacity=10000);
}

.back-to-top {
    border-radius: 2rem;
    position: fixed;
    z-index: 1000;
    right: 25px;
    bottom: 15px;
    width: 40px;
    height: 40px;
    margin: 0;
    background-color: #FF0000;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: opacity 350ms;
    -o-transition: opacity 350ms;
    transition: opacity 350ms;
}

.back-to-top i {
    position: absolute;
    top: 40%;
    left: 35%;
    margin-top: -15px;
    margin-left: -5px;
    color: #ffffff;
}


/*--------------------------------------------
7. TopBar & NavBar Styles
--------------------------------------------*/

.navbar-fixed-top {
    position: fixed !important;
    right: 0;
    left: 0;
    z-index: 1100;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    animation-duration: .8s;
    -webkit-animation-duration: .8s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
}

.navbar-brand.separate {
    padding-left: 0;
}

.top-header {
    padding: 0px 0;
    /* border-bottom: 1px solid #dddcdc; */
}

/* } */

.top-header .top-phone,
.top-header .top-address {
    padding: 5px 0;
    font-size: 14px;
    color: #fff;
    display: inline-block;
}

.top-header .top-address {
    margin-right: 15px;
}

.top-header.primary-bg {
    background: #FF0000;
}

.social-top ul.top-social li {
    font-size: 16px;
    line-height: 16px;
    display: inline-block;
    margin: 0 1px 0 0;
    padding: 5px 10px;
    list-style: none;
    text-align: center;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.social-top ul.top-social .fa-facebook {
    color: #1b6bd7;
}

.social-top ul.top-social .fa-twitter {
    color: #1DA1F2;
}

.social-top ul.top-social .fa-linkedin {
    color: #0077b5;
}

.social-top ul.top-social .fa-pinterest {
    color: #0A66C2;
}

.social-top ul.top-social .fa-instagram {
    color: #e95950;
}

.social-top ul.top-social .fa-pinterest {
    color: #E60023;
}

.social-top ul.top-social li:first-child {
    margin-left: 0;
}

.social-top ul.top-social li a {
    text-decoration: none;
    color: #fff;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.social-top ul.top-social li a i {
    text-align: center;
    padding-top: 6px;
}

.social-top ul.top-social li:first-child:hover {
    background-image: radial-gradient(circle farthest-corner at 10% 20%, rgba(37, 145, 251, 0.98) 0.1%, rgba(0, 7, 128, 1) 99.8%);
}

.social-top ul.top-social li:nth-child(2):hover {
    background-image: radial-gradient(circle farthest-corner at 10% 20%, rgba(0, 221, 214, 1) 0%, rgba(51, 102, 255, 1) 90%);
}

.social-top ul.top-social li:nth-child(3):hover {
    background-image: linear-gradient(109.5deg, rgba(76, 221, 242, 1) 11.2%, rgba(92, 121, 255, 1) 91.1%);
}

.social-top ul.top-social li:nth-child(4):hover {
    background-image: radial-gradient(circle farthest-corner at 10% 20%, rgba(247, 87, 0, 1) 0%, rgba(249, 0, 0, 1) 90.1%);
}

.social-top ul.top-social li:last-child:hover {
    background-image: linear-gradient(68.2deg, rgba(255, 202, 88, 1) 0%, rgba(139, 73, 255, 1) 100.2%);
}

.social-top ul.top-social li:hover i {
    color: #fff;
}

.header-address {
    margin-top: 5px;
}

.header-address a {
    display: inline-block;
    text-align: center;
    font-size: 34px;
    width: 50px;
    height: 50px;
    color: #FF0000;
}

.header-address i {
    margin-top: 12px;
    margin-left: 2px;
}

.header-address .header-content {
    display: inline-block;
}

.header-address .header-content h5 {
    font-size: 13px;
    text-transform: uppercase;
}

.header-address .header-content p {
    font-size: 13px;
}

.banner {
    padding: 200px 0;
}

.banner h1 {
    font-size: 70px;
    line-height: 70px;
    font-weight: 700;
    margin-bottom: 40px;
}

.banner h1 span {
    color: #FF0000 !important;
}

.banner p {
    margin-bottom: 50px;
}

.banner.white h1,
.banner.white p {
    color: #fff;
}

.banner.primary h1,
.banner.primary p {
    color: #FF0000;
}


/*--------------------------------------------
8. Home Slider Styles
--------------------------------------------*/

#main-slide .item img {
    width: 100%;
}

#main-slide .item .slider-content {
    z-index: 0;
    opacity: 0;
    -webkit-transition: opacity 500ms;
    -moz-transition: opacity 500ms;
    -o-transition: opacity 500ms;
    transition: opacity 500ms;
}

#main-slide .item.active .slider-content {
    z-index: 0;
    opacity: 1;
    -webkit-transition: opacity 100ms;
    -moz-transition: opacity 100ms;
    -o-transition: opacity 100ms;
    transition: opacity 100ms;
}

#main-slide .carousel-indicators {
    bottom: 30px;
}

#main-slide .carousel-indicators li {
    width: 14px !important;
    height: 14px !important;
    border: 2px solid #fff !important;
    margin: 1px !important;
}

#main-slide .carousel-control.left,
#main-slide .carousel-control.right {
    opacity: 1;
    filter: alpha(opacity=100);
    background-image: none;
    background-repeat: no-repeat;
    text-shadow: none;
}

#main-slide .carousel-control.left span {
    padding: 15px;
}

#main-slide .carousel-control.right span {
    padding: 15px;
}

#main-slide .carousel-control .fa-angle-left,
#main-slide .carousel-control .fa-angle-right {
    position: absolute;
    top: 40%;
    z-index: 5;
    display: inline-block;
}

#main-slide .carousel-control .fa-angle-left {
    left: 0;
}

#main-slide .carousel-control .fa-angle-right {
    right: 0;
}

#main-slide .carousel-control i {
    background: rgba(0, 0, 0, 0.7);
    color: #fff;
    line-height: 36px;
    font-size: 32px;
    padding: 15px 20px;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

#main-slide .slider-content {
    top: 45%;
    margin-top: -70px;
    left: 0;
    padding: 0;
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    color: #fff;
}

#main-slide .slider-content h1 {
    font-size: 50px;
    line-height: 50px;
    letter-spacing: 5px;
    margin-bottom: 55px;
    color: #fff;
    text-transform: uppercase;
}

#main-slide .slider-content h1 strong {
    color: #FF0000;
}

#main-slide .slider-content p {
    font-size: 25px;
    line-height: 35px;
    letter-spacing: 1px;
    margin-bottom: 55px;
    color: #fff;
}

#main-slide .slider-content h2.white,
#main-slide .slider-content h3.white {
    color: #fff;
}

.slider.btn {
    padding: 10px 40px;
    font-size: 20px;
    border-radius: 2px;
    text-transform: uppercase;
    line-height: 28px;
    font-weight: 300;
    border: 0;
    -moz-transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.slider.btn.btn-default {
    margin-left: 4px;
    background: #ECECEC;
}

.slider.btn.btn-default:hover {
    background: #000;
    color: #fff;
}

.slider-content-left {
    position: relative;
    margin: 0 0 0 40px;
}

.slider-content-right {
    position: relative;
}


/*--------------------------------------------
9. Animation & Features Styles
--------------------------------------------*/

.carousel .item.active .animated1 {
    -webkit-animation: lightSpeedIn 1s ease-in 800ms both;
    animation: lightSpeedIn 1s ease-in 800ms both;
}

.carousel .item.active .animated2 {
    -webkit-animation: bounceIn 1s ease-in 800ms both;
    animation: bounceIn 1s ease-in 800ms both;
}

.carousel .item.active .animated3 {
    -webkit-animation: flipInX 2s ease-in-out 800ms both;
    animation: flipInX 2s ease-in-out 800ms both;
}

.feature-1 {
    /* margin-right: 15px; */
    margin-bottom: 30px;
    -webkit-transition: all 0.3s;
    transition: all 0.8s;
    z-index: 1;
    position: relative;
}

.feature-1 h4 {
    font-size: 18px;
    letter-spacing: 1px;
    color: #000;
    margin-top: 0;
    line-height: 24px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

/* 
.feature-1:hover {
    transform: scale(1.08);
    overflow: hidden;
} */

.right-content {
    display: table-cell;
    padding-left: 25px;
}

.feature-1 .aio-icon-read {
    opacity: 0;
    float: right;
}

.feature-1:hover .aio-icon-read {
    opacity: 1;
    -webkit-transition: all 0.3s;
    transition: all 0.8s;
}

.feature-1:hover span {
    opacity: 0.5;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.feature-1 span {
    float: left;
    font-size: 44px;
    color: #FF0000;
    display: inline-block;
}

.feature-2 {
    margin-bottom: 30px;
}

.feature-2 .feature-icon i {
    font-size: 45px;
    width: 45px;
    height: 45px;
    line-height: 45px;
    color: #FF0000;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    font-weight: bold;
    margin-top: -12px;
}

.feature-2 .feature-icon i:before {
    font-size: 20px;
}

.media .media-left {
    padding-right: 0 !important;
}

.media-body p {
    font-size: 16px;
}

.feature-2 .media-body {
    padding-left: 10px;
}

.feature-2 .media-body h3 {
    font-size: 17px;
    line-height: 24px;
    margin-bottom: 10px;
    text-transform: uppercase;
    color: #000;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.feature-2.white .media-body {
    color: #fff;
}

.feature-2.white .media-body h3 {
    color: #fff;
}

.feature-2.yellow-icon .feature-icon i {
    color: #f6d014;
}

.feature-2.blue-icon .feature-icon i {
    color: #00bcd4;
}

.feature-3 {
    height: 420px;
    padding: 50px;
    margin-bottom: 30px;
    overflow: hidden;
    border-radius: 2rem;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
}

.feature-3 i {
    font-size: 60px;
    color: #FF0000;
}

.feature-3 i:before {
    font-size: 60px;
}

.feature-3 h4 {
    font-size: 21px;
    margin-bottom: 20px;
    margin-top: 30px;
}

.feature-3:hover i {
    -webkit-animation: moveFromTop 600ms ease;
    animation: moveFromTop 600ms ease;
}

.feature-3:hover h4 {
    -webkit-animation: moveFromRight 600ms ease;
    animation: moveFromRight 600ms ease;
}

.feature-3:hover p {
    -webkit-animation: moveFromLeft 600ms ease;
    animation: moveFromLeft 600ms ease;
}

.feature-3:hover a {
    -webkit-animation: moveFromBottom 600ms ease;
    animation: moveFromBottom 600ms ease;
}

@-webkit-keyframes moveFromTop {
    from {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }

    to {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@-webkit-keyframes moveFromRight {
    from {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }

    to {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
}

@-webkit-keyframes moveFromBottom {
    from {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }

    to {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@-webkit-keyframes moveFromLeft {
    from {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }

    to {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
}

.feature-4 {
    position: relative;
    margin-bottom: 30px;
    margin-top: 30px;
}

.feature-4:before {
    content: '';
    position: absolute;
    width: 1px;
    border-left: 1px dashed #cecece;
    top: 50%;
    bottom: 0;
    left: 38px;
    margin-bottom: -72px;
}

.feature-4 .feature-icon {
    position: relative;
}

.feature-4 .feature-icon i {
    border: 1px solid #333;
    border-radius: 50%;
    padding: 15px;
    display: inline-table;
    font-size: 36px;
    width: 78px;
    background: #fff;
    line-height: 45px;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.feature-4 .media-body {
    padding-left: 10px;
}

.feature-4 .media-body h3 {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 15px;
    text-transform: uppercase;
    color: #000;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.feature-4:hover .feature-icon i {
    background: #FF0000;
    color: #fff;
}

.feature-4:last-child {
    margin-bottom: 0;
}

.feature-4:last-child:before {
    display: none;
}

.feature-5 {
    padding: 80px 35px;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 300ms linear;
    transition: all 300ms linear;
}

.feature-5 i {
    position: relative;
    font-size: 42px;
    margin-bottom: 25px;
    z-index: 2;
}

.feature-5 h4 {
    position: relative;
    z-index: 2;
    margin-bottom: 20px;
    transition: all .3s;
    -webkit-transition: all .3s;
}

.feature-5 p {
    position: relative;
    z-index: 2;
    transition: all .3s;
    -webkit-transition: all .3s;
}

.feature-5 img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: all .3s;
    -webkit-transition: all .3s;
    background: #000;
}

.feature-5:hover img {
    opacity: 1;
}

.feature-5:hover i,
.feature-5:hover h4,
.feature-5:hover p {
    color: #fff;
}

.feature-5:hover i {
    -webkit-animation: moveFromRightRotate 300ms ease;
    animation: moveFromRightRotate 300ms ease;
}

.feature-5:hover h4 {
    -webkit-animation: moveFromLeftRotate 300ms ease;
    animation: moveFromLeftRotate 300ms ease;
}

.feature-5:hover p {
    -webkit-animation: moveFromBottom 300ms ease;
    animation: moveFromBottom 300ms ease;
}

@-webkit-keyframes moveFromLeftRotate {
    from {
        -webkit-transform: translateX(-100%) rotate(-90deg);
    }

    to {
        -webkit-transform: translateX(0%) rotate(0deg);
    }
}

@-webkit-keyframes moveFromRightRotate {
    from {
        -webkit-transform: translateX(100%) rotate(90deg);
    }

    to {
        -webkit-transform: translateX(0%) rotate(0deg);
    }
}

@-webkit-keyframes moveFromBottom {
    from {
        -webkit-transform: translateY(100%);
    }

    to {
        -webkit-transform: translateY(0%);
    }
}

.feature-6 {
    margin-bottom: 30px;
}

.feature-6 img {
    margin-bottom: 20px;
}

.feature-6 h4 {
    margin-bottom: 15px;
}

.feature-6 a {
    color: #333;
}

.feature-6 a i {
    -webkit-transition: margin-left 0.3s ease-in;
    transition: margin-left 0.3s ease-in;
}

.feature-6 a:hover {
    color: #FF0000;
    -webkit-transition: color 0.3s ease-in;
    transition: color 0.3s ease-in;
}

.feature-6 a:hover i {
    margin-left: 5px;
}

.feature-7 {
    margin-top: 35px;
    display: inline-block;
}

.feature-7 a {
    display: inline-block;
    text-decoration: none;
    float: left;
    width: 60px;
    height: 60px;
    background: #FF0000;
    text-align: center;
    line-height: 60px;
    font-size: 22px;
    color: #ffffff;
}

.feature-7 h4 {
    font-size: 17px;
    margin: 0 0 15px;
    margin-left: 80px;
    margin-bottom: 0;
    padding-top: 10px;
}

.feature-7 span {
    display: block;
    margin: 0;
    font-size: 11px;
    font-family: georgia;
    margin-left: 80px;
    color: #666;
    font-style: italic;
}

.feature-8 {
    border: 1px solid #efefef;
    background-color: #fafafa;
    padding: 50px 30px 15px;
    margin-bottom: 30px;
    -webkit-transition: all .5s;
    transition: all .5s;
}

.feature-8 i {
    font-size: 35px;
    background: #FF0000;
    width: 60px;
    height: 60px;
    color: #fff;
    padding-top: 14px;
    margin-bottom: 20px;
    text-align: center;
}

.feature-8 h4 {
    font-size: 16px;
    margin-top: 10px;
    margin-bottom: 15px;
}

.feature-8:hover,
.feature-8.active {
    background: #282828;
}

.feature-8:hover h4,
.feature-8.active h4 {
    color: #fff;
}

.feature-8:hover p,
.feature-8.active p {
    color: #999;
}

.feature-9 {
    margin-bottom: 40px;
}

.feature-9 {
    box-shadow: 0px 0px 20px rgb(0 0 0 / 10%);
    padding: 25px;
    border-radius: 2rem;
    height: 300px;
}

/*}*/

.feature-9 i {
    font-size: 60px;
    color: #FF0000;
}

.feature-9 i:before {
    font-size: 50px;
}

.feature-9 h4 {
    font-size: 17px;
    margin-bottom: 20px;
    margin-top: 30px;
}

.feature-9.yellow i {
    color: #f6d014;
}


/*--------------------------------------------
10. Text Section Styles
--------------------------------------------*/

.text-section h4 {
    font-size: 26px;
    line-height: 36px;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.text-section ul {
    margin-bottom: 20px;
}

.text-section .btn {
    margin-top: 20px;
}

.text-section.white {
    color: #fff;
}

.text-section.white h4,
.text-section.white h5,
.text-section.white h6 {
    color: #fff;
}

.text-section.white .fa-li {
    color: #fff;
}

.call-to-action h3 {
    font-size: 52px;
    text-transform: uppercase;
    margin-bottom: 36px;
}

.call-to-action p {
    padding: 0 10%;
    margin-bottom: 40px;
    font-size: 16px;
}

.call-to-action.white h3,
.call-to-action.white p {
    color: #fff;
}


/*--------------------------------------------
11. Filters & Portfolio Styles
--------------------------------------------*/

ul.filter {
    margin: 0;
    padding: 0;
    text-align: center;
    margin-bottom: 60px;
}

ul.filter li {
    display: inline-block;
    margin: 0 5px;
}

ul.filter li a {
    display: inline-block;
    text-decoration: none;
    font-size: 13px;
    border: 1px solid #151515;
    padding: 5px 20px;
    background: #24252a;
    color: #fff;
    text-transform: uppercase;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
}

ul.filter li a:hover,
ul.filter li a.active {
    background: #FF0000;
    color: #ffffff;
}

.isotope-item {
    z-index: 2;
}

.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}

.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    transition-property: height, width;
}

.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    transition-property: transform, opacity;
}

.portfolio-post {
    position: relative;
}

.portfolio-post img {
    width: 100%;
}

.portfolio-post .hover-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 0, 0, 0.7);
    text-align: center;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    opacity: 0;
    overflow: hidden;
}

.portfolio-post .hover-box .inner-hover {
    position: absolute;
    width: 100%;
}

.portfolio-post .hover-box .inner-hover h4 {
    font-size: 18px;
    color: #ffffff;
    text-transform: uppercase;
    transition: all 0.6s ease-in-out;
    -webkit-transition: all 0.6s ease-in-out;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.portfolio-post .hover-box .inner-hover p {
    font-size: 14px;
    color: #ffffff;
    margin-bottom: 20px;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.portfolio-post .hover-box .inner-hover a {
    display: inline-block;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    width: 40px;
    height: 40px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    border: 1px solid #ffffff;
    text-align: center;
    margin: 0 5px;
    -webkit-transform: translate3d(0, 500%, 0);
    transform: translate3d(0, 500%, 0);
}

.portfolio-post .hover-box .inner-hover a i {
    font-size: 14px;
    color: #ffffff;
    line-height: 40px;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
}

.portfolio-post .hover-box .inner-hover a.link {
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
}

.portfolio-post .hover-box .inner-hover a a.zoom {
    transition: all 0.6s ease-in-out;
    -webkit-transition: all 0.6s ease-in-out;
}

.portfolio-post .hover-box .inner-hover a:hover {
    background: #ffffff;
}

.portfolio-post .hover-box .inner-hover a:hover i {
    color: #5AC8FB;
}

.portfolio-post:hover .hover-box {
    opacity: 1;
}

.portfolio-post:hover .hover-box .inner-hover h4 {
    -webkit-transform: translate3d(0, 400%, 0);
    transform: translate3d(0, 400%, 0);
}

.portfolio-post:hover .hover-box .inner-hover p {
    -webkit-transform: translate3d(0, 350%, 0);
    transform: translate3d(0, 350%, 0);
}

.portfolio-post:hover .hover-box .inner-hover a {
    -webkit-transform: translate3d(0, 300%, 0);
    transform: translate3d(0, 300%, 0);
}

.portfolio-post.yellow .hover-box {
    background: #f6d014;
}

.portfolio-post.blue .hover-box {
    background: #00bcd4;
}

.portfolio-post-2 {
    overflow: hidden;
    position: relative;
    display: block;
}

.portfolio-post-2 img {
    -webkit-transition: -webkit-transform 0.4s;
    -moz-transition: -moz-transform 0.4s;
    transition: transform 0.4s;
}

.portfolio-post-2 .portfolio-details {
    position: absolute;
    top: 0;
    left: 0;
    padding: 20px;
    background: #222;
    color: #FF0000;
    height: 100px;
    width: 100%;
    bottom: 0;
    opacity: 0;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
    -moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
    transition: transform 0.4s, opacity 0.1s 0.3s;
}

.portfolio-post-2 .portfolio-details h4 {
    color: #fff;
    margin-bottom: 5px;
}

.portfolio-post-2 a {
    position: absolute;
    right: 20px;
    top: 30%;
    font-size: 20px;
    color: #fff;
}

.portfolio-post-2:hover img {
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px);
}

.portfolio-post-2:hover .portfolio-details {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
    -moz-transition: -moz-transform 0.4s, opacity 0.1s;
    transition: transform 0.4s, opacity 0.1s;
}

.project-info li {
    line-height: 40px;
    vertical-align: middle;
    margin: 0;
    padding: 0px;
    background: #f5f6f8;
    margin-top: 3px;
}

.project-info li i {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    text-align: center;
    background: #FF0000;
    font-size: 22px;
    line-height: 40px;
    margin-right: 20px;
    color: #fff;
}

.project-hr {
    margin-top: 10px;
    margin-bottom: 18px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, .1);
}

.btn-default {
    background-color: #eee;
    color: #333;
}

.btn-default:hover {
    background-color: #FF0000;
    color: #fff;
}

.btn-lg {
    padding: 12px 25px;
}


/*--------------------------------------------
12. Team & Skills Styles
--------------------------------------------*/

.animated-counter {
    padding-bottom: 30px;
}

.animated-counter .animated-icon span {
    font-size: 40px;
    padding-bottom: 28px;
}

.animated-counter .animated-number {
    font-size: 60px;
    line-height: 60px;
    position: relative;
    margin: 0;
    padding: 0;
}

.animated-counter .animated-number:after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    width: 37px;
    height: 2px;
    margin: -30px auto;
    content: '';
    background: #333;
}

.animated-counter h4 {
    font-size: 16px;
    line-height: 22px;
    margin: 70px 0 0;
    padding: 0;
}

.animated-counter.white .animated-icon,
.animated-counter.white .animated-number,
.animated-counter.white h4 {
    color: #fff !important;
}

.animated-counter.white .animated-number:after {
    background: #fff;
}

.team .nav-tabs img {
    max-width: 100%;
    height: auto;
}

.team .nav-tabs {
    border: 0;
}

.team .nav-tabs.nav-justified>li>a {
    border: 0;
}

.team .nav-tabs.nav-justified>.active>a,
.team .nav-tabs.nav-justified>.active>a:hover,
.team .nav-tabs.nav-justified>.active>a:focus {
    border: 0;
}

.team .nav>li>a:first-child {
    padding-left: 0;
}

.team .nav>li>a:hover,
.team .nav>li>a:focus {
    background: none;
}

.team .tab-content {
    margin-top: 30px;
}

.panel.panel-default.main-content {
    background-color: #ffffff70;
    border-radius: 2rem;
}

.panel.panel-profile {
    border: 1px solid #ebebeb;
}

.panel-profile>.panel-heading {
    padding: 0;
    border-bottom: 1px solid #ebebeb;
}

.panel-profile>.panel-heading>.panel-title {
    margin-top: 20px;
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: bold;
}

.panel-profile>.panel-heading>.caption {
    margin-bottom: 20px;
}

.panel-profile>.panel-heading>.panel-title,
.panel-profile>.panel-heading>.caption {
    margin-left: 35px;
    margin-right: 35px;
}

.panel-profile>.panel-body {
    padding: 15px 30px;
}

.panel-profile>.panel-body ul {
    margin-bottom: 0;
}

.panel-profile>.panel-body ul>li {
    padding: 5px;
}

.panel-profile>.panel-body ul>li:first-of-type {
    padding-top: 0;
}

.panel-profile>.panel-body ul>li:last-of-type {
    padding-bottom: 0;
}

.panel-profile>.panel-heading>.panel-title,
.panel-profile>.panel-heading>.caption,
.panel-profile>.panel-body {
    color: #323232;
}

.panel-profile>.panel-footer {
    padding: 15px 30px;
    background-color: #f6f6f6;
    border-top: 1px solid #ebebeb;
}

.panel-profile>.panel-footer ul.sm-links {
    margin-bottom: 0;
}

.panel-profile>.panel-footer ul.sm-links li {
    margin-left: 14px;
    padding: 0;
    width: 38px;
    height: 38px;
    line-height: 42px;
    text-align: center;
    background-color: #FF0000;
    border-radius: 50%;
}

.panel-profile>.panel-footer ul.sm-links li:hover {
    background-color: #313131;
}

.panel-profile>.panel-footer ul.sm-links li a .fa {
    font-size: 16px;
    color: #fff;
}

.panel-profile>.panel-footer .btn {
    padding: 10px 14px;
}

.profile-details {}

.profile-details h3 {
    margin-top: 0;
    margin-bottom: 40px;
}

.profile-details h4 {
    margin-bottom: 10px;
}

.profile-details h5 {
    margin-top: 30px;
}

.team-details {
    margin-bottom: 30px;
}

.team-details .section-title {
    margin: 0 0 40px 0;
}

.team-details h4 {
    font-size: 20px;
    text-transform: uppercase;
}

.team-details span {
    font-size: 13px;
}

.team-details p {
    padding: 20px 0 0 0;
}

.team-details .fa-ul {
    margin-bottom: 30px;
}

.team-details ul.social {
    margin: 0;
    padding: 0;
}

.team-details ul.social li {
    display: inline;
    list-style: none;
    padding-right: 10px;
}

.team-details ul.social li a {
    padding: 5px 8px;
    background: #151515;
    color: #fff;
    border-radius: 2px;
    -webkit-transition: all 0.35s;
    transition: all 0.35s;
}

.team-details a:hover {
    text-decoration: none;
    background: transparent;
    color: #151515;
}

.team-details .panel-title {
    margin-top: 20px;
    margin-left: 20px;
    margin-bottom: 5px;
}

.team-details .caption {
    margin-left: 20px;
    margin-bottom: 5px;
}

.team-member-2 {
    position: relative;
    margin-bottom: 30px;
}

.team-member-2 .team-member-details {
    text-align: center;
    position: absolute;
    top: 0;
    bottom: 100%;
    left: 0;
    width: 100%;
    background: rgba(237, 28, 36, 0.85);
    opacity: 0;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.team-member-2 .team-member-details h4 {
    margin-top: 20%;
    color: #fff;
    margin-bottom: 20px;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.team-member-2 .team-member-details h5 {
    color: #fff;
    margin-bottom: 40px;
    text-transform: lowercase;
}

.team-member-2 .team-member-details .team-social {
    padding-top: 10px;
}

.team-member-2 .team-member-details .team-social li {
    display: inline-block;
    margin-right: 10px;
}

.team-member-2 .team-member-details .team-social li a {
    color: #fff;
    font-size: 28px;
}

.team-member-2:hover {
    cursor: pointer;
}

.team-member-2:hover .team-member-details {
    opacity: 1;
    bottom: 0;
}

.team-member-2:hover .team-member-details h4 {
    margin-top: 30%;
}

.team-member-2.yellow .team-member-details {
    background: rgba(246, 208, 20, 0.85);
}

.team-member-2.blue .team-member-details {
    background: rgba(0, 188, 212, 0.85);
}

.team-member-3 {
    position: relative;
    padding-bottom: 30px;
}

.team-member-3 .team-member-img {
    position: relative;
    overflow: hidden;
}

.team-member-3 .team-member-img:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0 20px;
    content: '';
    text-align: center;
    opacity: 0;
    background-color: rgba(33, 40, 45, 0.66);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.team-member-3 .team-info {
    position: absolute;
    right: auto;
    bottom: 30px;
    left: auto;
    width: 100%;
    padding: 20px;
    opacity: 0;
    -webkit-transition: all .3s;
    transition: all .3s;
    text-align: center;
}

.team-member-3 .team-info .team-name {
    font-size: 16px;
    display: block;
    margin: 5px auto;
    text-align: center;
    text-transform: uppercase;
}

.team-member-3 .team-info .team-designation {
    font-size: 15px;
    margin: auto;
    padding: 10px 0 0;
    text-align: center;
    text-transform: uppercase;
}

.team-member-3 .icon {
    position: absolute;
    bottom: 10%;
    left: 0;
    width: 100%;
    padding: 10px 20px;
    -webkit-transition: transform .3s ease 0s;
    transition: transform .3s ease 0s;
    transform: scale(0);
    text-align: center;
    opacity: 0;
}

.team-member-3 .icon>li {
    display: inline-block;
}

.team-member-3 .icon>li:hover {
    color: #FF0000;
}

.team-member-3 .icon a {
    font-size: 16px;
    line-height: 35px;
    display: block;
    width: 35px;
    height: 35px;
    margin: 0 5px;
    -webkit-transition: all .3s;
    transition: all .3s;
    color: #ffffff;
}

.team-member-3:hover .team-member-img:after {
    opacity: 1;
}

.team-member-3:hover .team-info {
    bottom: 50%;
    color: #ffffff;
    opacity: 1;
}

.team-member-3:hover .icon {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.team-4 {
    margin-bottom: 30px;
}

.team-4 img {
    margin-bottom: 20px;
    width: 100%;
}

.team-4 span {
    margin-bottom: 15px;
    color: #FF0000;
}


/*--------------------------------------------
13. Team Skills Styles
--------------------------------------------*/

.skill-section_ {
    margin: 55px 0 40px;
}

.skill-section_ h4 {
    margin-bottom: 40px;
    text-align: center;
    font-size: 22px;
}

.skill-section {
    margin: 0 0 10px;
}

.skill-section h4 {
    margin-bottom: 30px;
    text-align: center;
    font-size: 22px;
}

.skill-section .skill {
    padding-bottom: 10px;
}

.skill-section .skill-name {
    font-size: 14px;
    color: #333;
    text-transform: uppercase;
}

.skill-section .progress-bar-percentage {
    font-size: 13px;
    background: #ff0000;
    color: #ffffff;
    padding: 3px 8px;
    margin-top: -26px;
    border-radius: 20px;
}

.skill-section .progress {
    overflow: visible;
    height: 5px;
    margin-bottom: 10px;
    margin-top: 5px;
    background: #f9f9f9;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.skill-section .progress-bar {
    /*background: #FF0000;*/
    float: left;
    height: 100%;
    font-size: 12px;
    color: #ffffff;
    text-align: center;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: width 0.6s ease;
    transition: width 0.6s ease;
    position: relative;
}

.skill-section .progress-bar.yellow {
    background: #f6d014;
}

.skill-section .progress-bar.blue {
    background: #00bcd4;
}

.skill-section .skill-style-2 {
    padding-bottom: 30px;
}

.skill-section .skill-style-2 .progress {
    height: 20px;
}

.skill-section.white .skill-name {
    color: #fff;
}


/*--------------------------------------------
14. Team Skills Styles
--------------------------------------------*/

.progress-chart-feature {
    text-align: center;
}

.progress-chart-feature .chart {
    position: relative;
    display: inline-block;
    width: 130px;
    height: 130px;
    text-align: center;
}

.progress-chart-feature .chart-icon {
    display: inline-block;
    line-height: 140px;
    z-index: 2;
}

.progress-chart-feature .chart-icon span {
    font-size: 26px;
    line-height: 50px;
    width: 50px;
    height: 50px;
}

.progress-chart-feature .chart canvas {
    position: absolute;
    top: 0;
    left: 0;
}

.progress-chart-feature h4 {
    font-size: 18px;
    letter-spacing: 1px;
    position: relative;
    margin-top: 20px;
    margin-bottom: 25px;
    text-transform: uppercase;
    color: #24252a;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.progress-chart-feature.white {
    color: #ffffff;
}

.progress-chart-feature.white h4,
.progress-chart-feature.white p {
    color: #ffffff;
}

.progress-chart-feature.white .chart-icon span {
    color: #fff;
}


/*--------------------------------------------
15. News Section Styles
--------------------------------------------*/

.latest-news {
    margin-bottom: 30px;
}

.latest-news h4 {
    font-size: 15px;
    position: relative;
    line-height: 22px;
    margin-top: 10px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.latest-news h4 a {
    color: #282828;
    text-decoration: none;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.latest-news h4 a:hover {
    color: #ec4933;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.latest-news .latest-news-img {
    position: relative;
    overflow: hidden;
}

.latest-news .latest-news-img img {
    width: 100%;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    -webkit-transition: all 400ms;
    transition: all 400ms;
}

.latest-news .latest-news-img div {
    position: absolute;
    background: #ec4933;
    text-align: center;
    left: 0;
    bottom: 0;
    display: inline-block;
    text-decoration: none;
    padding: 7px 10px;
}

.latest-news .latest-news-img span:first-child {
    font-size: 12px;
    color: #fdfdfd;
    display: block;
}

.latest-news .latest-news-img span:last-child {
    font-size: 26px;
    color: #fdfdfd;
    font-weight: bold;
    margin-top: 0;
    display: block;
    position: relative;
}

.latest-news:hover img {
    -webkit-transform: scale3d(1.15, 1.15, 1);
    transform: scale3d(1.15, 1.15, 1);
}


/*--------------------------------------------
16. Testimonials Styles
--------------------------------------------*/

section.parallax .testimonial-carousel .testimonial-item ul.logo-group {
    border: none;
}

section.parallax .testimonial-carousel .testimonial-item ul.logo-group li {
    border-right: none;
    border-bottom: none;
}

.testimonial-item {
    width: 90%;
    margin: 0 auto;
}

.testimonial-item img {
    width: 100px;
}

.testimonial-item p {
    font-size: 15px;
    margin-bottom: 20px;
}

.testimonial-item .name {
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: 20px;
    color: #FF0000;
}

.testimonial-item.white {
    color: #fff;
}

.testimonial-item .logo-group .client-logo a img {
    min-width: 132px;
}

ul.logo-group {
    /* overflow: hidden; */
    padding: 0;
    /*border: 1px solid #ddd;*/
    border: none;
    border-right: none;
    border-bottom: none;
    position: relative;
}

ul.logo-group li {
    /* width: 20%;
    float: left;*/
    height: 150px;
    list-style: none;
    /* border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;*/
    border: none;
}

ul.logo-group li img {
    display: block;
    margin: 5px auto 0 5px;
}

ul.logo-group.width33 li {
    width: 33.33%;
}


/*--------------------------------------------
17. Pricing Boxes Styles
--------------------------------------------*/

.pricing-box {
    overflow: hidden;
    margin-bottom: 30px;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
}

.pricing-box .pricing-head {
    text-align: center;
    padding: 50px 0;
}

.pricing-box .pricing-head .previous-price {
    text-decoration: line-through;
}

.pricing-box .pricing-head h4 {
    padding: 10px 0;
    font-size: 26px;
}

.pricing-box .pricing-head h5 {
    font-size: 16px;
}

.pricing-box .pricing-head.white span,
.pricing-box .pricing-head.white h4,
.pricing-box .pricing-head.white h5 {
    color: #fff;
}

.pricing-box .pricing-body {
    padding: 10px 30px;
}

.pricing-box .pricing-body li {
    padding: 10px 0;
}

.pricing-box .pricing-body li i {
    float: right;
}

.pricing-box .pricing-footer a {
    display: block;
    padding: 1em;
    background: #f2f2f2;
    color: #2b2c2d;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all .4s ease-in-out;
}

.pricing-box .pricing-footer a:hover {
    background: #FF0000;
    color: #fff;
}


/*--------------------------------------------
18. Accordion Styles
--------------------------------------------*/

.bizline-accordion .panel {
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-radius: 0;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

.bizline-accordion .panel-heading {
    background: #f9f9f9;
    border: 0;
    border-radius: 0;
    padding-left: 20px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.bizline-accordion .panel-heading .panel-title a {
    display: block;
    font-size: 16px;
    color: #FF0000;
    text-transform: uppercase;
    padding: 3px 0;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
}

.bizline-accordion .panel-heading .panel-title a:before {
    font-family: 'FontAwesome';
    content: '\f103';
    font-size: 20px;
    line-height: 36px;
    padding-right: 10px;
    color: #FF0000;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.bizline-accordion .panel-heading .panel-title a.collapsed {
    color: #444;
}

.bizline-accordion .panel-heading .panel-title a.collapsed:hover {
    color: #FF0000;
}

.bizline-accordion .panel-heading .panel-title a.collapsed:before {
    font-family: 'FontAwesome';
    content: '\f101';
}

.bizline-accordion .panel-body {
    padding: 15px;
    border-top: 1px solid #ddd;
    font-size: 15px;
    line-height: 24px;
    background-color: transparent !important;
}

.panel-title a .control-icon {
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -11px;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    display: none;
}

.panel-title a.collapsed .control-icon {
    display: block;
}

.panel-title a i {
    font-size: 22px;
    padding-right: 5px;
    color: #FF0000;
}


/*--------------------------------------------
19. Subscription Form Styles
--------------------------------------------*/

.subscription-section {
    color: #fff;
}

.subscription-section h3 {
    font-size: 42px;
    margin-bottom: 40px;
    color: #fff;
}

.subscription-section p {
    width: 90%;
    margin: 0 auto;
    margin-bottom: 40px;
}

.subscribe-form {
    margin-top: 20px;
    margin-bottom: 30px;
    position: relative;
    width: 70%;
    margin: 0 auto;
}

.subscribe-form input,
.subscribe-form input:focus {
    background: transparent;
    border-radius: 0px;
    border: 1px solid #333;
    height: 60px;
    outline: none;
    box-shadow: none;
}

.subscribe-form button,
.subscribe-form button:focus {
    position: absolute;
    right: 0;
    top: 0;
    background: #FF0000;
    padding: 0 30px;
    height: 100%;
    text-transform: uppercase;
    color: #fff;
    border: 0 solid;
    border-radius: 0;
    outline: none;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.subscribe-form button:hover,
.subscribe-form button:focus:hover {
    background: #24252a;
    color: #FF0000;
}


/*--------------------------------------------
20. Blog & Single Post Styles
--------------------------------------------*/

.blog-post,
.single-blog-post {
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #ddd;
}

.blog-post .blog-img,
.single-blog-post .blog-img {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    margin: 0 0 8px;
    text-align: center;
}

.blog-post .blog-img img,
.single-blog-post .blog-img img {
    width: 100%;
}

.blog-post .blog-img .img-overlay,
.single-blog-post .blog-img .img-overlay {
    position: absolute;
    z-index: 100;
    right: 0;
    bottom: 0;
    display: block;
    width: 0;
    height: 0;
    background: rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.blog-post .blog-img .img-overlay i,
.single-blog-post .blog-img .img-overlay i {
    font-size: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80px;
    height: 80px;
    margin-top: -50px;
    margin-left: -50px;
    padding: 26px 0;
    opacity: 0;
    color: #ffffff;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.blog-post .blog-img:hover .img-overlay,
.single-blog-post .blog-img:hover .img-overlay {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.blog-post .blog-img:hover .img-overlay i,
.single-blog-post .blog-img:hover .img-overlay i {
    opacity: 1;
}

.blog-post .post-content,
.single-blog-post .post-content {
    margin-top: 50px;
}

.blog-post .post-content .left-part,
.single-blog-post .post-content .left-part {
    float: left;
    margin-right: 20px;
}

.blog-post .post-content .right-part,
.single-blog-post .post-content .right-part {
    display: table-cell;
}

.blog-post .post-content .blog-date .blog_date,
.single-blog-post .post-content .blog-date .blog_date {
    display: block;
    width: 35px;
    padding: 13px 0 7px 0;
    text-align: center;
    color: #ffffff;
    background-color: #FF0000;
}

.blog-post .post-content .blog-date .blog_date .date,
.single-blog-post .post-content .blog-date .blog_date .date {
    font-size: 24px;
}

.blog-post .post-content .blog-date .blog_icon,
.single-blog-post .post-content .blog-date .blog_icon {
    display: block;
    padding: 20px 10px;
    text-align: center;
    background: #f6f6f6;
}

.blog-post .post-content .blog-date .blog_icon i,
.single-blog-post .post-content .blog-date .blog_icon i {
    font-size: 24px;
    color: #FF0000;
}

.blog-post .post-content .post-title h3,
.single-blog-post .post-content .post-title h3 {
    text-transform: uppercase;
    font-size: 20px;
    margin-bottom: 15px;
}

.blog-post .post-content .post-title h3 a,
.single-blog-post .post-content .post-title h3 a {
    color: #333;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.blog-post .post-content .post-title h3 a:hover,
.single-blog-post .post-content .post-title h3 a:hover {
    color: #FF0000;
}

.blog-post .post-content .post-text p,
.single-blog-post .post-content .post-text p {
    line-height: 24px;
}

.blog-post .post-content .post-footer .post-meta,
.single-blog-post .post-content .post-footer .post-meta {
    float: left;
}

.blog-post .post-content .post-footer .post-meta li,
.single-blog-post .post-content .post-footer .post-meta li {
    display: inline-block;
    margin-right: 20px;
}

.blog-post .post-content .post-footer .post-meta li a,
.single-blog-post .post-content .post-footer .post-meta li a {
    font-size: 13px;
    color: #333;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.blog-post .post-content .post-footer .post-meta li a i,
.single-blog-post .post-content .post-footer .post-meta li a i {
    color: #FF0000;
    margin-right: 6px;
    font-size: 15px;
}

.blog-post .post-content .post-footer .post-meta li a:hover,
.single-blog-post .post-content .post-footer .post-meta li a:hover {
    color: #FF0000;
}

.blog-post .post-content .post-footer .read-more,
.single-blog-post .post-content .post-footer .read-more {
    float: right;
}

.blog-post .post-content .post-footer .read-more a,
.single-blog-post .post-content .post-footer .read-more a {
    color: #333;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.blog-post .post-content .post-footer .read-more a:hover,
.single-blog-post .post-content .post-footer .read-more a:hover {
    color: #FF0000;
}

.blog-post .blog-author,
.single-blog-post .blog-author {
    margin: 40px 0;
    padding: 30px;
    border-radius: 2px;
    border: 1px solid #ddd;
}

.blog-post .blog-author img,
.single-blog-post .blog-author img {
    width: 80px;
    display: block;
    background: #fff;
    border: 1px solid #ddd;
    margin: 0 20px 0 0;
    border-radius: 50%;
}

.blog-post .blog-author .author-name,
.single-blog-post .blog-author .author-name {
    margin-top: 20px;
}

.blog-post .blog-author .author-name a,
.single-blog-post .blog-author .author-name a {
    color: #24252a;
    font-size: 16px;
}

.blog-post .comment-section,
.single-blog-post .comment-section {
    margin-top: 80px;
}

.blog-post .comment-section h2,
.single-blog-post .comment-section h2 {
    color: #222222;
    font-size: 15px;
    margin: 0 0 15px;
    text-transform: uppercase;
    padding-bottom: 35px;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 40px;
}

.blog-post .comment-section .comment-box,
.single-blog-post .comment-section .comment-box {
    overflow: hidden;
    padding-bottom: 35px;
    border-bottom: 1px solid #f3f3f3;
    margin-bottom: 40px;
}

.blog-post .comment-section .comment-box img,
.single-blog-post .comment-section .comment-box img {
    width: 70px;
    float: left;
    border-radius: 50%;
}

.blog-post .comment-section .comment-box .comment-content,
.single-blog-post .comment-section .comment-box .comment-content {
    margin-left: 100px;
}

.blog-post .comment-section .comment-box .comment-content h4,
.single-blog-post .comment-section .comment-box .comment-content h4 {
    color: #222222;
    font-size: 13px;
    text-transform: uppercase;
    margin: 0;
}

.blog-post .comment-section .comment-box .comment-content h4 a,
.single-blog-post .comment-section .comment-box .comment-content h4 a {
    color: #222222;
    display: inline-block;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    float: right;
    font-size: 11px;
}

.blog-post .comment-section .comment-box .comment-content span,
.single-blog-post .comment-section .comment-box .comment-content span {
    color: #999999;
    line-height: 20px;
    margin: 0 0 10px;
    font-size: 11px;
    display: inline-block;
    margin-bottom: 16px;
    text-transform: uppercase;
}

.blog-post .comment-section ul.depth .comment-box,
.single-blog-post .comment-section ul.depth .comment-box {
    padding-left: 100px;
}

.blog-post .comment-section .comment-form .form-group h2,
.single-blog-post .comment-section .comment-form .form-group h2 {
    padding-bottom: 0;
    border-bottom: none;
    margin-bottom: 30px;
}

.blog-post .comment-section .comment-form .form-group input[type="text"],
.blog-post .comment-section .comment-form .form-group input[type="email"],
.blog-post .comment-section .comment-form .form-group textarea,
.single-blog-post .comment-section .comment-form .form-group input[type="text"],
.single-blog-post .comment-section .comment-form .form-group input[type="email"],
.single-blog-post .comment-section .comment-form .form-group textarea {
    width: 100%;
    display: block;
    padding: 22px;
    background: #fff;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    color: #999999;
    font-size: 13px;
    border: 1px solid #ccc;
    outline: none;
    margin: 0 0 20px;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}

.blog-post .comment-section .comment-form .form-group input[type="text"]:focus,
.blog-post .comment-section .comment-form .form-group input[type="email"]:focus,
.blog-post .comment-section .comment-form .form-group textarea:focus,
.single-blog-post .comment-section .comment-form .form-group input[type="text"]:focus,
.single-blog-post .comment-section .comment-form .form-group input[type="email"]:focus,
.single-blog-post .comment-section .comment-form .form-group textarea:focus {
    border: 1px solid #FF0000;
}

.blog-post .comment-section .comment-form .form-group textarea,
.single-blog-post .comment-section .comment-form .form-group textarea {
    min-height: 193px;
    margin-bottom: 30px;
}

.single-blog-post {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.pagination li a,
.pagination li a:hover,
.pagination li a:focus {
    color: #adadad;
    padding: 6px 12px;
    border-radius: 0;
    border: solid 1px #e1e1e1;
    background: transparent;
    -webkit-transition: 400ms;
    -o-transition: 400ms;
    transition: 400ms;
}

.pagination li.active a,
.pagination li a:hover {
    color: #fff;
    background-color: #FF0000;
}

.pagination li:first-child a {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.pagination li:last-child a {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}


/*--------------------------------------------
21. Sidebar Elements Styles
--------------------------------------------*/

.widget {
    margin-bottom: 40px;
}

.widget-title {
    margin: 0 0 20px 0;
}

dget-title h3 {
    font-size: 16px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    letter-spacing: normal;
    text-transform: uppercase;
    color: #333333;
    border-bottom: 2px solid #ddd;
}

.widget-archive li a,
.widget-category li a {
    color: #333;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.widget-archive li a:hover,
.widget-category li a:hover {
    color: #FF0000;
}

.widget-tag li {
    display: inline-block;
    margin-bottom: 15px;
    margin-right: 2px;
}

.widget-tag a {
    font-size: 14px;
    font-style: normal !important;
    line-height: 17px;
    margin: 0;
    padding: 8px 15px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #ffffff !important;
    border: 0;
    background: #FF0000;
    text-shadow: none;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.widget-tag a:hover {
    background: #24252a;
}

.widget-social li {
    font-size: 16px;
    line-height: 16px;
    float: left;
    margin: 0 1px 0 0;
    padding: 5px 15px 5px 13px;
    list-style: none;
    text-align: center;
    background: #1a1a1a;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.widget-social li a {
    color: #fff;
}

.widget-social li:hover {
    background: #FF0000;
}

.tags-list li a:before {
    content: "\f02c";
    padding-right: 8px;
    font-size: 13px;
    font-family: 'FontAwesome';
}


/*--------------------------------------------
22. Contact Form Styles
--------------------------------------------*/

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form select,
.quotation-form input[type="text"],
.quotation-form input[type="email"],
.quotation-form input[type="tel"],
.quotation-form select {
    width: 100%;
    display: block;
    height: 45px;
    background: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    color: #999999;
    font-size: 13px;
    border: 1px solid #ccc;
    outline: none;
    margin: 0 0 20px;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}

.contact-form input[type="text"]:focus,
.contact-form input[type="email"]:focus,
.contact-form input[type="tel"]:focus,
.contact-form select:focus,
.quotation-form input[type="text"]:focus,
.quotation-form input[type="email"]:focus,
.quotation-form input[type="tel"]:focus,
.quotation-form select:focus {
    border: 1px solid #FF0000;
}

.contact-form textarea,
.quotation-form textarea {
    margin-bottom: 20px;
    background: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    color: #999999;
    font-size: 13px;
    border: 1px solid #ccc;
    outline: none;
}

.contact-form .help-block,
.quotation-form .help-block {
    color: #f00;
}


/*--------------------------------------------
23. Footer Styles
--------------------------------------------*/

.footer-section p {
    color: #bfbfbf;
}

.footer-text {
    margin-bottom: 30px;
}

.footer-text p,
.footer-list li {
    color: #efefef !important;
}

p.footer-info {
    margin-bottom: 5px;
}

p.footer-info i {
    color: #fff;
    font-size: 18px;
    min-width: 25px;
}

.footer-minimal h3 {
    font-size: 30px;
    margin-bottom: 30px;
}

.footer-minimal ul.social {
    margin: 0;
    padding: 0;
}

.footer-minimal ul.social li {
    display: inline;
    list-style: none;
    padding-right: 10px;
}

.footer-minimal ul.social li a {
    padding: 5px 8px;
    background: #151515;
    color: #fff;
    border-radius: 2px;
    -webkit-transition: all 0.35s;
    transition: all 0.35s;
}

.footer-minimal ul.social li a:hover {
    text-decoration: none;
    background: #FF0000;
    color: #fff;
}

.footer-minimal .copyright-text {
    margin-top: 30px;
}

.footer-minimal .copyright-text a {
    color: #FF0000;
}

.footer-minimal .copyright-text a:hover {
    color: #333;
}

.footer-minimal .copyright-text p {
    margin-bottom: 0;
}

.gallery {
    margin-bottom: 20px;
    display: inline-block;
}

.gallery li {
    float: left;
    width: 31%;
    margin-right: 5px;
    margin-bottom: 5px;
}

.footer-list {
    margin-bottom: 30px;
}

.footer-list ul li a {
    color: #bfbfbf;
    font-size: 13px;
    display: block;
    padding: 5px 0px;
    text-decoration: none;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.footer-list ul li a i {
    padding-right: 8px;
}

.footer-list ul li a:hover {
    color: #FF0000;
}

.footer-subscribe {
    margin-top: 20px;
    margin-bottom: 30px;
    position: relative;
}

.footer-subscribe input,
.footer-subscribe input:focus {
    background: #fff;
    border-radius: 0px;
    border: 0px solid;
    height: 40px;
    outline: none;
    box-shadow: none;
}

.footer-subscribe button,
.footer-subscribe button:focus,
.footer-subscribe button:hover {
    position: absolute;
    right: 0;
    top: 0;
    background: #FF0000;
    width: 60px;
    height: 100%;
    font-size: 13px;
    color: #fff;
    font-weight: 600;
    border: 0px solid;
    border-radius: 0px;
    outline: none;
}

.copyright {
    border-top: 1px solid #ccc;
    padding: 30px 0px;
    margin-top: 50px;
}

.copyright .copyright-text p {
    color: #efefef;
}

.copyright .copyright-text a {
    color: #fff;
    font-weight: 700;
}

.footer-menu ul {
    text-align: right;
}

.footer-menu ul li {
    display: inline-block;
}

.footer-menu ul li a {
    color: #efefef;
    font-size: 13px;
    display: inline-block;
    /* padding-left: 25px; */
    text-decoration: none;
    border-right: 2px solid #efefef;
    line-height: 1em;
    margin-right: 1rem;
    padding-right: 1rem;
}

.footer-menu ul li:last-child a {
    border: none;
}


/*--------------------------------------------
24. 404 Page Styles
--------------------------------------------*/

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

.error-page h1 {
    font-size: 120px;
    margin-bottom: 10px;
    color: #333;
}

.error-page h3 {
    font-size: 60px;
    color: #333;
}

.error-page p {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 30px;
    margin-top: 30px;
    color: #333;
}


/*--------------------------------------------
25. Other Styles
--------------------------------------------*/

.blog_date .fa {
    font-size: 25px;
}

.recent-comments-list {
    margin-bottom: 10px;
}

.recent-comments-list li {
    margin-bottom: 20px;
    padding-left: 18px;
    position: relative;
    padding-top: 3px;
}

.recent-comments-list li:last-of-type {
    margin-bottom: 0;
}

.recent-comments-list li:before {
    content: "\f054";
    position: absolute;
    top: 3px;
    left: 0;
    font-size: 13px;
    font-family: 'FontAwesome';
}

.recent-comments-list li,
.recent-comments-list li a {
    color: #333;
}

.recent-comments-list li:before,
.recent-comments-list li a:hover,
.recent-comments-list li a:focus {
    color: #FF0000;
    text-decoration: none;
}

.recent-comments-list li .date-stamp {
    color: #333;
    font-weight: 300;
}

.recent-comments-list li .date-stamp .fa {
    color: #FF0000;
}

.recent-comments-list li .date-stamp .fa:last-child {
    padding-left: 10px;
}

.recent-comments-list li p {
    margin-bottom: 0px;
}

.recent-comments-list li .date-stamp {
    color: #373636;
    font-weight: 300;
}

.list-style-2 {
    margin-top: 5px;
    margin-bottom: 15px;
}

.list-style-2 li {
    position: relative;
    padding-top: 3px;
    padding-bottom: 3px;
}

.list-style-2 li:before {
    content: "\f017";
    margin-right: 10px;
    font-family: 'FontAwesome';
    font-size: 16px;
}

.list-style-2 li,
.list-style-2 li a {
    font-size: 15px;
}

.list-style-2 li:before,
.list-style-2 li a:hover,
.list-style-2 li a:focus {
    color: #FF0000;
}

.list-style-4 {
    margin-top: 5px;
}

.list-unstyled.list-style-4.style_- ul li:nth-child(3n) {
    margin-right: 0;
}

.list-unstyled.list-style-4.style_- ul li {
    width: 32%;
    margin-right: 2%;
}

.list-unstyled.list-style-4.style_- ul {
    display: flex;
    flex-wrap: wrap;
}

.list-style-4 li {
    position: relative;
    padding-top: 3px;
    padding-bottom: 3px;
}

.list-style-4 li:before {
    content: "\f219";
    margin-right: 10px;
    font-family: 'FontAwesome';
    font-size: 16px;
}

.list-style-4 li,
.list-style-4 li a {
    font-size: 15px;
}

.list-style-4 li:before,
.list-style-4 li a:hover,
.list-style-4 li a:focus {
    color: #FF0000;
}

.widget-text p i {
    color: #FF0000;
    font-size: 15px;
    width: 20px;
}


/* get-quote */

.get-quote label {
    font-weight: 400;
    color: #444444;
}

.navbar.navbar-default .navbar-nav li.drop ul.drop-down li a i {
    padding-right: 5px;
    font-size: 17px;
}

.get-quote h3 {
    color: #ff0000;
    margin-bottom: 20px;
}

.get-quote .label-right label {
    margin-bottom: 10px;
    font-size: 19px
}

.common-cls {
    display: inline-block;
}

.common-cls input {
    margin-left: 10px;
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
    cursor: pointer;
    opacity: 1;
}

.footer-text a {
    color: #efefef;
}

.footer-text a:hover {
    color: #000;
}

.form-right-content h3 {
    margin-bottom: 15px;
}

.form-right-content p {
    color: #444444;
    font-size: 16px;
}


/* join-us */

.main-content {
    width: 100%;
    float: left;
    border: 1px solid #ccc;
    margin-bottom: 15px;
}

.join-heading {
    background-color: #ff0000;
    padding: 15px;
}

.join-heading h4 {
    color: #fff;
}

.join-main-content {
    padding: 15px 0;
}

.join-main-content h5 {
    text-transform: capitalize;
}

.join-main-content h5,
.join-main-content p {
    margin: 0 0 10px;
    font-size: 17px;
}

.join-head {
    color: #ff0000;
    margin-bottom: 20px;
    margin-top: 22px;
}

.join-footer {
    width: 100%;
    float: left;
    padding: 15px;
    background: #f7f7f7;
    text-align: right;
    color: #333;
}

.join-footer ul li a {
    color: #FF0000;
}

.join-footer ul li span {
    margin-right: 10px;
}

.join-footer ul li i {
    margin-right: 3px;
}

.right-blog-joinus {
    height: 910px;
    overflow-y: scroll;
}

.form-control {
    height: 45px;
    border-radius: 0;
}

.common-btn-gs {
    background: #FF0000;
    color: #fff;
    border: 1px solid transparent;
}

.common-btn-gs:hover,
.common-btn-gs:focus {
    background: #fff !important;
    color: #ff0000 !important;
    transition: ease .4s;
    border-color: #ff0000 !important;
    border: 1px solid transparent;
}

.owl-theme .owl-controls .owl-buttons div {
    /* border: 1px solid #ff0000;
    border-radius: 50%;
    height: 40px;
    width: 40px;
    background: none;
    opacity: 1; */
    left: 0px;
    width: 30px;
    height: 100px;
    color: #555555;
    font-size: 20px;
    text-align: center;
    line-height: 98px;
    margin-left: 10px;
    border-radius: 50px;
    display: inline-block;
    border: 1px solid #ff0000;
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    background-color: #ffffff;
}

.br-rd {
    border-radius: 3rem;
}

.owl-buttons {
    position: absolute;
    left: -40px;
    top: 25px;
    right: -34px;
}

.owl-prev {
    position: absolute;
    left: 0px;
    width: 30px;
    height: 100px;
    color: #555555;
    font-size: 20px;
    text-align: center;
    line-height: 98px;
    margin-left: 10px;
    border-radius: 50px;
    display: inline-block;
    border: 1px solid #555555;
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    background-color: #ffffff;
}

.clients-carousel .owl-controls .owl-buttons .owl-prev {
    padding-top: 7px;
    padding-left: -34px;
}

.clients-carousel .owl-controls .owl-buttons .owl-prev:before {
    content: "\f053";
    color: #ff0000;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 18px;
    text-rendering: auto;
    margin-left: -3px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.clients-carousel .owl-controls .owl-buttons .owl-next {
    padding-top: 7px;
    padding-left: 10px;
    float: right;
}

.clients-carousel .owl-controls .owl-buttons .owl-next:before {
    content: "\f054";
    color: #ff0000;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 18px;
    text-rendering: auto;
    margin-left: -2px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/*.bb {
  overflow: hidden;
  position: relative;
}
.bb::before, .bb::after {
  content: '';
  box-sizing: border-box;
  position: absolute;
  border: 2px solid transparent;
  width: 0;
  height: 0;
}
.bb::before {
  top: 0;
  left: 0;
  border-top-color: #ff0000;
  border-right-color: #ff0000;
  animation: border 2s infinite;
}
.bb::after {
  bottom: 0;
  right: 0;
  animation: border 2s 1s infinite, borderColor 2s 1s infinite;
}

@keyframes border {
  0% {
    width: 0;
    height: 0;
  }
  25% {
    width: 100%;
    height: 0;
  }
  50% {
    width: 100%;
    height: 100%;
  }
  100% {
    width: 100%;
    height: 100%;
  }
}
@keyframes borderColor {
  0% {
    border-bottom-color: #ff0000;
    border-left-color: #ff0000;
  }
  50% {
    border-bottom-color: #ff0000;
    border-left-color: #ff0000;
  }
  51% {
    border-bottom-color: transparent;
    border-left-color: transparent;
  }
  100% {
    border-bottom-color: transparent;
    border-left-color: transparent;
  }
}*/

.bb {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.bb::before {
    content: '';
    z-index: 999;
    margin: -5%;
    box-shadow: inset #ff0000 0 0 0 2px;
    animation: clipMe 8s linear infinite;
}

.bb::after {
    content: '';
    z-index: 999;
    margin: -5%;
    box-shadow: inset #ff0000 0 0 0 2px;
    animation: clipMe 8s linear infinite;
}

.bb::before {
    animation-delay: -4s;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.bb::after {
    animation-delay: -4s;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@keyframes clipMe {

    0%,
    100% {
        clip: rect(0px, 220px, 2px, 0px);
    }

    25% {
        clip: rect(0px, 2px, 220px, 0px);
    }

    50% {
        clip: rect(218px, 220px, 220px, 0px);
    }

    75% {
        clip: rect(0px, 220px, 220px, 218px);
    }
}


/* join Us page 15-01-2020   */

.joinus .panel-default>.panel-heading {
    background-color: #ffffff2e;
    border: none;
    padding: 25px 30px;
    border-radius: 2rem;

}

.joinus .panel-default {
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none;
    /* border-bottom: 1px solid #e9e9e9; */
    /* border-radius: 0; */
    /* box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; */
    box-shadow: rgb(50 50 93 / 20%) 0px 50px 100px -20px, rgb(0 0 0 / 20%) 0px 30px 60px -30px, rgb(10 37 64 / 25%) 0px -2px 6px 0px inset;
}

.joinus .panel-default .panel-body {
    border-top: none !important;
}

.joinus .panel-default>.panel-heading h4 {
    margin-bottom: 20px;
}

.joinus .panel-default>.panel-heading h4 a {
    font-size: 17px;
    font-weight: bold;
    position: relative;
}

.joinus .panel-default>.panel-heading h4 a:before {
    content: '\f178';
    position: absolute;
    width: auto;
    height: 17px;
    color: #ff0000;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 24px;
    display: inline-block;
    left: 7px;
    top: -1px;
    -webkit-transform: scale(1.2, 0.9);
    -moz-transform: scale(1.2, 0.9);
    -ms-transform: scale(1.2, 0.9);
    -o-transform: scale(1.2, 0.9);
    transform: scale(1.2, 0.9);
}

.joinus .panel-default>.panel-heading+.panel-collapse>.panel-body,
.joinus .panel-default>.panel-heading h4 a {
    padding-left: 45px;
}

.joinus .panel-default>.panel-heading .job-otherDetails {
    padding-left: 17px;
    font-size: 15px;
    line-height: 1;
}

.joinus .panel-default>.panel-heading .job-otherDetails a {
    color: #333333;
}

.joinus .panel-default h5 b {
    color: #ff0000;
}

.joinus .join_description {
    margin-bottom: 19px;
}

.pl-0 {
    padding-left: 0px;
}

.get-quote .form-control {
    background-color: #f1efef !important;
    background: #f1efef;
    border: none;
    border-radius: 0;
    font-size: 14px;
}

.get-quote .form-control:focus {
    border: 1px solid #FF0000 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6)c !important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6) !important;
}


/*  Get a Quote  */

.getQuote-section {
    display: flex;
    flex-direction: row;
}

.getQuote-section.sh {
    background-color: #ffffff38;
    border-radius: 3rem;
    box-shadow: rgb(50 50 93 / 20%) 0px 50px 100px -20px, rgb(0 0 0 / 20%) 0px 30px 60px -30px, rgb(10 37 64 / 25%) 0px -2px 6px 0px inset;
}

.getQuote-section .gImage {
    padding: 10px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    /* margin-bottom: 24px; */
    position: relative;
    background: url(https://gswebtech.com/assets/images/bg/work-with-us.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    border-radius: 0 3rem 3rem 0;
}

.getQuote-section .gImage:before {
    content: '';
    background: #00000040;
    bottom: 0;
    text-align: center;
    opacity: 0.7;
    position: absolute;
    width: 100%;
    height: 100%;
    color: #ff0000;
    font: normal normal normal 14px/1 FontAwesome;
    top: 0;
    right: 0;
    z-index: 1;
    border-radius: 0 3rem 3rem 0;
    box-shadow: rgb(50 50 93 / 20%) 0px 50px 100px -20px, rgb(0 0 0 / 20%) 0px 30px 60px -30px, rgb(10 37 64 / 25%) 0px -2px 6px 0px inset;
}



.getQuote-section .gImage h2 {
    color: #fff;
    font-weight: bold;
    font-size: 40px;
    margin-bottom: 50px;
    z-index: 1;
}

.getQuote-section .gImage p {
    color: #fff;
    z-index: 1;
}

.join-bgc .get-quote {
    padding: 45px 30px;
    margin: 0 auto;
    /* box-shadow: -1px 8px 25px 10px #f2efef; */
    /* background: #ffffff61; */
    border-radius: 3rem 0 0 3rem;
}

.join-bgc .get-quote .formInner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 10px;
}

.join-bgc .get-quote .project-width {
    margin-bottom: 10px;
}

.join-bgc .get-quote .formInner .form-group {
    flex: 0 32%;
}

.join-bgc .get-quote .formInner .form-group:nth-child(4),
.join-bgc .get-quote .formInner .form-group:nth-child(5) {
    flex: 0 49%;
}

.join-bgc .get-quote h3 {
    margin-bottom: 15px;
}

.join-bgc .get-quote .project-width .form-group:nth-child(4),
.join-bgc .get-quote .project-width .form-group:nth-child(5) {
    display: inline-block;
    width: 49%;
}

.join-bgc .get-quote .project-width .form-group:nth-child(4) {
    margin-right: 1%;
}

.get-quote input.form-control,
.get-quote select.form-control,
.contact-form input.form-control,
.contact-form select.form-control {
    /* height: 35px; */
}




.get-quote .form-control,
.contact-form .form-control {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 4px !important;
    background: transparent !important;
    border: 1px solid #ced4da !important;
    border-radius: 1rem !important;
}

.getQuotePage {
    padding-bottom: 9rem;
    background: url("https://gswebtech.com/assets/images/bg/texture.jpg");
}

.dasw {
    display: none;
}

.dasw_2 {
    display: block;
}

@media only screen and (min-width: 768px) and (max-width:1199px) {
    .join-bgc .get-quote .project-width .form-group:nth-child(3) .label-left .common-cls {
        width: 49%;
    }

    .template-image.text-center.wow {
        margin-top: inherit;
    }

    .blod_gse p {
        font-size: 16px;
    }
}

@media only screen and (min-width: 768px) {
    .align-items_ {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .join-bgc .get-quote .project-width .form-group:nth-child(3) .label-left .common-cls {
        width: 30%;
    }

    .join-bgc {
        padding-right: 0px;
    }
}

@media only screen and (max-width: 767px) {
    .join-bgc .get-quote .project-width .form-group:nth-child(3) .label-left .common-cls {
        width: 100%;
    }

    .dasw {
        width: auto !important;
        float: none !important;
        display: block;
    }


    .dasw_2 {
        display: none;
    }
}

@media only screen and (max-width: 520px) {

    .join-bgc .get-quote .formInner .form-group,
    .join-bgc .get-quote .formInner .form-group:nth-child(4),
    .join-bgc .get-quote .formInner .form-group:nth-child(5) {
        flex: 0 100%;
    }

    .join-bgc .get-quote .project-width .form-group:nth-child(4),
    .join-bgc .get-quote .project-width .form-group:nth-child(5) {
        display: block;
        width: 100%;
    }
}

@media only screen and (max-width: 400px) {
    .joinus .panel-default>.panel-heading h4 a {
        font-size: 14px;
    }

    .joinus .panel-default>.panel-heading h4 a:before {
        font-size: 22px;
        left: 5px;
        top: -1px;
        -webkit-transform: scale(1, 0.7);
        -moz-transform: scale(1, 0.7);
        -ms-transform: scale(1, 0.7);
        -o-transform: scale(1, 0.7);
        transform: scale(1, 0.7);
    }

    .joinus .panel-default>.panel-heading+.panel-collapse>.panel-body,
    .joinus .panel-default>.panel-heading h4 a {
        padding-left: 30px;
    }

    .joinus .panel-default>.panel-heading .job-otherDetails {
        padding-left: 0px;
    }
}


.pull-right {
    color: #fff;
}

header#header {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 999;
    /* background-color: rgba(36, 38, 41, 0.102); */
    /* box-shadow: 0px 1px 0px 0px rgb(255 255 255 / 10%); */
}

.pull-right .top-phone.mr10 {
    display: inline-block;
}

/* social media */

.fb-bg:hover {
    background-image: linear-gradient(135deg, #97ABFF 10%, #123597 100%);
}

a.gb-bg-h {
    color: #fff !important;
}

.tw-bg:hover {
    background-image: linear-gradient(135deg, #72EDF2 10%, #5151E5 100%);
    color: #fff;
}

.gplus-bg:hover {
    background-image: linear-gradient(135deg, #FF9D6C 10%, #BB4E75 100%);
}

.lk-bg:hover {
    background-image: linear-gradient(135deg, #52E5E7 10%, #130CB7 100%);
    color: #fff;
}

.ins-bg:hover {
    background-image: linear-gradient(135deg, #FD6585 10%, #0D25B9 100%);
    color: #fff;
}

.sticky_-container {
    padding: 0px;
    margin: 0px;
    position: fixed;
    right: -146px;
    top: 230px;
    width: 180px;
    z-index: 1100;
}

.sticky_ li {
    list-style-type: none;
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    color: #efefef;
    height: 43px;
    padding: 0px;
    margin: 0px 0px 1px 0px;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    cursor: pointer;
    border-radius: 30px;
}

.sticky_ li:hover {
    margin-left: -115px;
}

.sticky_ li img {
    float: left;
    margin: 5px 4px;
    margin-right: 5px;
}

.sticky_ li p {
    padding-top: 5px;
    margin: 0px;
    line-height: 16px;
    font-size: 11px;
}

.sticky_ li p a {
    text-decoration: none;
    color: #2C3539;
}

.sticky_ li p a:hover {
    text-decoration: underline;
}

ul.sticky_ li {
    display: flex;
    align-items: center;
}

ul.sticky_ li p {
    margin-left: 4rem;
}

.sticky_ .icon-mr {
    margin-left: 11px;
    color: #4267B2;
}

.navbar-fixed-top {
    background-color: #fff !important;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.section-bg {
    background-color: #d1d1d121;
}

section.section-bg {
    background-repeat: no-repeat;
    background-position: center;
    padding: 3rem 0 3rem;
}

.navbar-fixed-top .navbar.navbar-default .navbar-nav>li>a {
    color: inherit;
}


.template-image.text-center.wow {
    margin-top: 15rem;
}

footer.footer-section {
    background: radial-gradient(circle farthest-corner at center center, #ff0000 0%, #920000 100%);
}

.footer-section {
    position: relative;
}

.footer-section .pattern-layer-one {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 50%;
    height: 100%;
    background-position: left top;
    background-repeat: no-repeat;
}

.footer-section .pattern-layer-two {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 50%;
    height: 100%;
    background-position: right top;
    background-repeat: no-repeat;
}

.footer-title h3 {
    color: #fff !important;
}

.footer-section .footer-title h3:before {
    position: absolute;
    content: '';
    left: 0px;
    bottom: 0px;
    height: 1px;
    width: 30px;
    background-color: #ffffff;
}

.footer-section .footer-title h3 {
    padding-bottom: 20px;
}



.social-top ul.top-social li {
    font-size: 17px;
    background-color: #fff;
    width: 40px;
    height: 40px;
    text-align: center;
    border-radius: 2rem;
}

.call-to-action-2 {
    position: relative;
    background: radial-gradient(circle farthest-corner at center center, #ff0000 0%, #920000 100%);
    padding: 50px;
    /* border-radius:11rem;  */
    /* box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset; */
}

.contact-us-pop {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    /* background-position: right center;
    background-repeat: no-repeat; */
}

/*Btn Style One*/

.theme-btn {
    cursor: pointer;
    display: inline-block;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.btn-style-one {
    position: relative;
    display: inline-block;
    font-size: 14px;
    line-height: 30px;
    color: #ff0000;
    padding: 10px 15px;
    font-weight: 500;
    overflow: hidden;
    border-radius: 30px;
    overflow: hidden;
    text-transform: capitalize;
    background-color: #fff;
    font-family: 'Montserrat', sans-serif;
    box-shadow: rgb(0 0 0 / 25%) 0px 0.0625em 0.0625em, rgb(0 0 0 / 25%) 0px 0.125em 0.5em, rgb(255 255 255 / 10%) 0px 0px 0px 1px
}

.btn-style-one:before {
    position: absolute;
    content: '';
    left: 92%;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 1;
    background-color: #ff0000;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    transform: skewX(-25deg);
}

.btn-style-one .txt {
    position: relative;
    z-index: 1;
}

.btn-style-one:hover::before {
    left: 0%;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
}

.btn-style-one:hover {
    color: #ffffff;
    border-color: #00e49a;
    transform: translateY(-3px) !important;
}

/*  */
input#scroll-up {
    background-color: transparent;
    border: none;
    display: inline-block;
    width: 100%;
    position: relative;
    z-index: 1;
}

span.theme-btn.btn-style-one {
    text-align: center;
    padding: 5px 35px;
    margin-top: 8px;
    margin-bottom: -8px;
}

span.theme-btn.btn-style-one.min {
    margin-bottom: inherit;
    margin-left: 1rem;
    padding: 5px 25px;
}

.span.theme-btn.btn-style-one.min:hover {
    color: #fff;
}


form#apply_form {
    background-color: #ffffff70;
    padding: 2rem;
    border-radius: 2rem;
    box-shadow: rgb(50 50 93 / 20%) 0px 50px 100px -20px, rgb(0 0 0 / 20%) 0px 30px 60px -30px, rgb(10 37 64 / 25%) 0px -2px 6px 0px inset;
}

/* Btn Style Two */

.btn-style-two.min {
    padding: 7px 35px;
}

.btn-style-two {
    position: relative;
    display: inline-block;
    font-size: 14px;
    line-height: 30px;
    color: #ffffff;
    padding: 10px 19px;
    font-weight: 500;
    overflow: hidden;
    border-radius: 30px;
    overflow: hidden;
    text-transform: capitalize;
    background-color: #171717;
    font-family: 'Montserrat', sans-serif;
    box-shadow: rgb(0 0 0 / 25%) 0px 0.0625em 0.0625em, rgb(0 0 0 / 25%) 0px 0.125em 0.5em, rgb(255 255 255 / 10%) 0px 0px 0px 1px
}

.btn-style-two:before {
    position: absolute;
    content: '';
    left: 92%;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 1;
    background-color: #ffffff;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    transform: skewX(-25deg);
}

.btn-style-two .txt {
    position: relative;
    z-index: 1;
}

.btn-style-two:hover::before {
    left: 0%;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
}

.btn-style-two:hover {
    color: #171717;
    transform: translateY(-3px) !important;
}

/* Btn Style Three */

.btn-style-three {
    position: relative;
    display: inline-block;
    font-size: 16px;
    line-height: 30px;
    color: #ffffff;
    padding: 10px 15px !important;
    font-weight: 600;
    overflow: hidden;
    border-radius: 30px;
    overflow: hidden;
    text-transform: capitalize;
    background-color: #ff0000;
    font-family: 'Montserrat', sans-serif;
}

.btn-style-three:before {
    position: absolute;
    content: '';
    left: 92%;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 1;
    background-color: #fff;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    transform: skewX(-25deg);
}

.btn-style-three .txt {
    position: relative;
    z-index: 1;
}

.btn-style-three:hover::before {
    left: 0%;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
}

.btn-style-three:hover {
    color: #ffffff;
    transform: translateY(-3px) !important;
}

ul.nav.navbar-nav.navbar-right {
    align-items: center;
    display: flex;
}

.clearfix.navbar-fixed-top a.theme-btn.btn-style-three {
    color: #fff !important;
    border: 1px solid #ff0000;
}

/*  */

/* Loader */

/* .overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 9999;
  }
  
  .part1 {
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    content: "";
    z-index: 99999;
    position: absolute;
    background: #ff0000;
  }
  
  .part2 {
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
    content: "";
    z-index: 99999;
    position: absolute;
    background: #ff0000;
  }
  
  .loader {
    left: 0;
    width: 0%;
    z-index: 50;
    height: 10px;
    position: absolute;
    background: #fff;
    top: calc(50% - 5px);
    z-index: 99999;
    animation: load 2s ease-in forwards;
  }
  
  .loaderfont h1 {
    top: 50rem;
    color: white;
    font-size: 5rem;
    position: absolute;
    left: calc(50% - 11rem);
    z-index: 999999;
    animation: size 2s ease-in-out infinite;
  }
  
  @keyframes size {
    0% {
      transform: scale(1.1);
    }
    50% {
      transform: scale(1);
    }
    100% {
      transform: scale(1.1);
    }
  }
  @keyframes load {
    from {
      width: 0%;
    }
    to {
      width: 100%;
    }
  } */

.gradi:after {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    content: " ";
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6));
}

.gradi {
    position: relative;
}

.box {
    padding: 35px 25px 0px;
    height: 260px;
    margin-bottom: 2rem;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border-radius: 3rem;
}

/* Service Block Two */

.service-block-two {
    position: relative;
    z-index: 1;
    margin-bottom: 30px;
}

.service-block-two .inner-box {
    position: relative;
    overflow: hidden;
    /* padding:45px 45px; */
    background-color: #fff;
}

.service-block-two .inner-box .shape-one {
    content: '';
    width: 250px;
    height: 250px;
    background: #ff0000;
    border-radius: 50%;
    position: absolute;
    top: -120px;
    opacity: 0.4;
    right: -120px;
    transform: scale(0);
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.service-block-two .inner-box:hover .shape-one {
    transform: scale(1);
    webkit-transition-delay: 300ms;
    -ms-transition-delay: 300ms;
    transition-delay: 300ms;
}

.service-block-two .inner-box .shape-two {
    content: '';
    width: 373px;
    height: 373px;
    background: #ff0000;
    border-radius: 50%;
    position: absolute;
    top: -180px;
    right: -180px;
    z-index: 1;
    opacity: 0;
    transform: scale(0);
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.service-block-two .inner-box:hover .shape-two {
    opacity: 0.4;
    transform: scale(1);
    webkit-transition-delay: 600ms;
    -ms-transition-delay: 600ms;
    transition-delay: 600ms;
}

.service-block-two .inner-box:before {
    position: absolute;
    content: '';
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 50%;
    opacity: 0;
    background-color: #222;
    -webkit-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    transition: all 600ms ease;
}

.service-block-two .inner-box:hover::before {
    height: 100%;
    opacity: 1;
}

.service-block-two .inner-box .icon-box {
    position: relative;
    z-index: 2;
}

.service-block-two .inner-box .icon-box {
    position: relative;
    font-size: 65px;
    line-height: 1em;
    color: #8b99af;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.service-block-two .inner-box .icon-box .icon {
    position: relative;
}

.service-block-two .inner-box h5 {
    position: relative;
    z-index: 2;
    color: #222222;
    font-weight: 600;
    line-height: 1.3em;
    margin: 20px 0px 15px;
}

.service-block-two .inner-box h5 a {
    position: relative;
    color: #222222;
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
}

.service-block-two .inner-box h5 a:hover,
.service-block-two .inner-box .read-more:hover {
    color: #ff0303;
}

.service-block-two .inner-box .text {
    position: relative;
    color: #222222;
    z-index: 2;
    font-size: 16px;
    line-height: 1.8em;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.service-block-two .inner-box:hover .icon-box,
.service-block-two .inner-box:hover h4 a,
.service-block-two .inner-box:hover .text {
    color: #ffffff;
}

.inner-box.box:hover .feature-1.wow.fadeInLeft,
.inner-box.box:hover .feature-1.wow.fadeInLeft h4,
.inner-box.box:hover .feature-1.wow.fadeInLeft span,
.inner-box.box:hover .feature-1.wow.fadeInLeft a {
    color: #fff;
}

.main-menu .navigation>li:hover::before,
.main-menu .navigation>li.current::before {
    opacity: 1;
    width: 100%;
    z-index: 1;
}

img.img-responsive {
    /* margin-top: -11rem; */

}

.pad80.bg {
    /* background-color: #fafafa; */
    /* box-shadow: rgb(0 0 0 / 40%) 0px 2px 4px, rgb(0 0 0 / 30%) 0px 7px 13px -3px, rgb(0 0 0 / 20%) 0px -3px 0px inset; */
}

/*** 

====================================================================
	Featured Section
====================================================================

***/

.featured-section {
    position: relative;
    z-index: 1;
    background-color: #d1d1d121 !important;
    background-position: center !important;
    background-size: cover !important;
}

.feature-block-two {
    position: relative;
    margin-bottom: 30px;
}

.feature-block-two .inner-box {
    position: relative;
    padding: 50px 50px;
    background-size: cover;
}

.feature-block-two .inner-box:before {
    position: absolute;
    content: '';
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(20, 29, 59, 0.70);
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.feature-block-two .inner-box:hover::before {
    background-color: rgba(255, 0, 0, 0.70);
}

.feature-block-two .inner-box .number {
    position: relative;
    color: #ffffff;
    font-size: 60px;
    font-weight: 800;
    line-height: 1em;
    margin-bottom: 2rem;
}

.feature-block-two .inner-box h4 {
    position: relative;
    color: #ffffff;
    font-weight: 600;
    line-height: 1.3em;
    margin-top: 12px;
    margin-bottom: 15px;
}

.feature-block-two .inner-box .text {
    position: relative;
    color: #ffffff;
    font-size: 16px;
    line-height: 1.8em;
}

.theme-btn i.fa.fa-phone {
    margin-right: 1rem;
}

.btn-style-two:hover i.fa.fa-phone {
    color: #000;
    z-index: 1;
    position: relative;
}

.call-to-action-2 .mr-rt {
    margin-right: 10rem;
}

.pad-t50 a.theme-btn.btn-style-one {
    margin-left: -3rem;
}

.pad-t50 a.theme-btn.btn-style-two {
    margin-left: 1rem;
}

====================================================================Technology Section====================================================================***/ .technology-section_ {
    position: relative;
    padding: 110px 0px 70px;
}

.technology-section_ .title-column {
    position: relative;
}

.technology-section_ .title-column .inner-column {
    position: relative;
    padding-top: 30px;
}

.technology-section_:before {
    position: absolute;
    content: '';
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    /* background-color:rgba(20,29,56,0.95); */
}

.technology-section_ .pattern-layer-one {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 50%;
    height: 100%;
    background-position: left top;
    background-repeat: no-repeat;
}

.technology-section_ .pattern-layer-two {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 50%;
    height: 100%;
    background-position: right top;
    background-repeat: no-repeat;
}

.technology-section_ .blocks-column {
    position: relative;
}

.technology-section_ .blocks-column .inner-column {
    position: relative;
}

.technology-section_ .blocks-column .inner-column .technology-block:nth-child(4) {
    margin-left: -100px;
}

.technology-block {
    position: relative;
    margin-bottom: 30px;
}

.technology-block .inner-box li {
    position: relative;
    padding: 45px 15px;
    text-align: center;
    border-radius: 10px;
    border: 1px dashed rgba(255, 255, 255, 0.60);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.technology-block .inner-box .overlay-link {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    display: block;
    z-index: 1;
}

.technology-block .inner-box .icon-box {
    position: relative;
    color: #0060ff;
    font-size: 64px;
    line-height: 1em;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.technology-block .inner-box:hover .icon-box {
    transform: rotateY(180deg);
}

.technology-block .inner-box h6 {
    position: relative;
    color: #ffffff;
    font-weight: 600;
    margin-top: 18px;
    text-transform: uppercase;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.technology-block .inner-box:hover {
    border-color: #ffffff;
    background-color: #ffffff;
}

.technology-block .inner-box:hover .icon-box {
    color: #0060ff;
}

.technology-block .inner-box:hover h6 {
    color: #000055;
}

.technology-section_.style-two .technology-block {
    width: 20%;
    padding: 0px 15px;
}

.technology-section_.style-two .technology-block h6 {
    text-transform: capitalize;
}

section.technology-section_ {
    background-color: #222;
}

.ul-li-bg {
    background-color: #d1d1d121;
}

.inner-box_ li {
    box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    padding: 20px 20px;
    margin-bottom: 25px;
    border-radius: 2rem;
}

.inner-box_ li:hover {
    border-color: #ffffff;
    background-color: #00000012;
    color: #000;
}


.btn-grad {
    background-image: linear-gradient(to right, #b31217 0%, #e52d27 51%, #b31217 100%)
}

.btn-grad {
    margin: 0 46px 0;
    padding: 10px 45px;
    text-align: center;
    text-transform: uppercase;
    transition: 0.5s;
    background-size: 200% auto;
    color: white;
    box-shadow: 0 0 20px #eee;
    border-radius: 30px;
    display: block;
}

.btn-grad:hover {
    background-position: right center;
    /* change the direction of the change here */
    color: #fff;
    text-decoration: none;
    transform: translateY(-3px);
}


.clinet-sh {
    box-shadow: 0px 0px 15px rgb(0 0 0 / 10%);
}

.owl-controls.clickable {
    top: 0;
}

.mr-bt {
    margin-bottom: 2rem;
}

/*  */
.floating {
    animation: floating 3s ease infinite;
    will-change: transform;
}

.floating:hover {
    animation-play-state: paused;
}

.floating-lg {
    animation: floating-lg 3s ease infinite;
}

.floating-sm {
    animation: floating-sm 3s ease infinite;
}


.icon-floating2 {
    animation-delay: .5s;
}

.icon-floating3 {
    animation-delay: 1s;
}

.icon-floating4 {
    animation-delay: 1.5s;
}

@keyframes floating-lg {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(15px);
    }

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

@keyframes floating {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(10px);
    }

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

@keyframes floating-sm {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(5px);
    }

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

/*  */

@media (min-width: 1200px) {
    .col-lg-offset {
        /* margin-left: 4%; */
    }
}


.quote-pd {
    padding-bottom: 112px;
}


button,
html input[type=button],
input[type=reset],
input[type=submit] {
    background: transparent !important;
    border: none !important;

}

.contact-bg-img {
    background-size: contain;
    background-image: url(https://gswebtech.com//assets/images/bg/contact-us-bg.jpg);
}

.well {
    background-color: transparent !important;
}

.wow.fadeInLeft-service {
    margin: 0 14px;
}

.our-clients-carousel-service .owl-buttons {
    display: none;
}

/* Hardeep */

.hero-slider {
    position: relative;
    margin: 0 auto;
    top: 0px;
    left: 0px;
    width: 980px;
    height: 480px;
    overflow: hidden;
    visibility: hidden;
}

.jssorl-009-spin {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.7);
}

.jssorl-009-spin-stlye {
    margin-top: -19px;
    position: relative;
    top: 50%;
    width: 38px;
    height: 38px;
}

.slides-style {
    cursor: default;
    position: relative;
    top: 0px;
    left: 0px;
    width: 980px;
    height: 480px;
    overflow: hidden;
}

.p-style {
    color: #fff;
    margin-top: 9rem;
    text-align: right;
}

.slider-1 {
    position: absolute;
    top: 150px;
    left: -36px;
    width: 1053px;
    height: 150px;
    z-index: 0;
}

.slider-1-p1 {
    position: absolute;
    top: 0px;
    left: 360px;
    width: 140px;
    height: 72px;
    z-index: 0;
    font-size: 46px;
    color: #ffffff;
    line-height: 72px;
    text-align: center;
    background-color: #FF0000;
}

.slider-1-p2 {
    position: absolute;
    top: 0px;
    left: 495px;
    width: 75px;
    height: 72px;
    z-index: 0;
    background-color: #FF0000;
    font-size: 45px;
    color: #ffffff;
    line-height: 72px;
    text-align: center;
}

.slider-1-p3 {
    position: absolute;
    top: 0px;
    left: 560px;
    width: 170px;
    height: 72px;
    z-index: 0;
    background-color: #FF0000;
    font-size: 45px;
    color: #ffffff;
    line-height: 72px;
    text-align: center;
}

.slider-1-p4 {
    position: absolute;
    top: 360px;
    left: 238px;
    width: 577px;
    height: 30px;
    z-index: 0;
    font-size: 28px;
    color: #ffffff;
    line-height: 30px;
    text-align: center;
}

.slider-1-p5 {
    position: absolute;
    top: 80px;
    left: 182px;
    width: 616px;
    height: 150px;
    z-index: 0;
}

.slider-1-p6 {
    position: absolute;
    top: 195px;
    left: 260px;
    width: 96px;
    height: 30px;
    z-index: 0;
    font-size: 18px;
    color: #ffffff;
    line-height: 30px;
    text-align: center;
}

.slider-1-p7 {
    position: absolute;
    top: 22px;
    left: 22px;
    width: 84px;
    height: 84px;
    z-index: 0;
}

.slider-1-p8 {
    position: absolute;
    top: 125px;
    left: 166px;
    width: 96px;
    height: 30px;
    z-index: 0;
    font-size: 18px;
    color: #ffffff;
    line-height: 30px;
    text-align: center;
}

.slider-1-p9 {
    position: absolute;
    top: 22px;
    left: 510px;
    width: 84px;
    height: 84px;
    z-index: 0;
}

.slider-1-p10 {
    position: absolute;
    top: 125px;
    left: 354px;
    width: 96px;
    height: 30px;
    z-index: 0;
    font-size: 18px;
    color: #ffffff;
    line-height: 30px;
    text-align: center;
}

.slider-1-p5a {
    position: absolute;
    top: 22px;
    left: 266px;
    width: 84px;
    height: 84px;
    z-index: 0;
}

.slider-1-p5b {
    position: absolute;
    top: 16px;
    left: 260px;
    width: 96px;
    height: 96px;
    z-index: 0;
}

.slider-1-p7a {
    position: absolute;
    top: 16px;
    left: 16px;
    width: 96px;
    height: 96px;
    z-index: 0;
}

.slider-1-p9a {
    position: absolute;
    top: 16px;
    left: 504px;
    width: 96px;
    height: 96px;
    z-index: 0;
}

.slider-1-p11 {
    position: absolute;
    top: 90px;
    left: 327px;
    width: 336px;
    height: 312px;
    z-index: 0;
}

.slider-1-p12 {
    position: absolute;
    top: 82px;
    left: 104px;
    width: 128px;
    height: 147px;
    z-index: 0;
}

.slider-1-p13 {
    position: absolute;
    top: 40px;
    left: 0px;
    width: 128px;
    height: 90px;
    z-index: 0;
    font-size: 15px;
    line-height: 30px;
    text-align: center;
    color: #fff;
}

.slider-1-p12a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 128px;
    height: 147px;
    z-index: 0;
}

.slider-1-p12b {
    position: absolute;
    top: 9px;
    left: 8px;
    width: 112px;
    height: 129px;
    z-index: 0;
}

.slider-1-p14 {
    position: absolute;
    top: 0px;
    left: 187px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p15 {
    position: absolute;
    top: 104px;
    left: 246px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p16 {
    position: absolute;
    top: 208px;
    left: 187px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p17 {
    position: absolute;
    top: 208px;
    left: 59px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p18 {
    position: absolute;
    top: 104px;
    left: 0px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p19 {
    position: absolute;
    top: 0px;
    left: 59px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p14a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p14b {
    position: absolute;
    top: 8px;
    left: 7px;
    width: 76px;
    height: 88px;
    z-index: 0;
}

.slider-1-p14c {
    position: absolute;
    top: 33px;
    left: 26px;
    width: 38px;
    height: 38px;
    z-index: 0;
}

.slider-1-p15a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p15b {
    position: absolute;
    top: 8px;
    left: 7px;
    width: 76px;
    height: 88px;
    z-index: 0;
}

.slider-1-p15c {
    position: absolute;
    top: 33px;
    left: 26px;
    width: 38px;
    height: 38px;
    z-index: 0;
}

.slider-1-p16a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p16b {
    position: absolute;
    top: 8px;
    left: 7px;
    width: 76px;
    height: 88px;
    z-index: 0;
}

.slider-1-p16c {
    position: absolute;
    top: 33px;
    left: 26px;
    width: 38px;
    height: 38px;
    z-index: 0;
}

.slider-1-p17a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p17b {
    position: absolute;
    top: 8px;
    left: 7px;
    width: 76px;
    height: 88px;
    z-index: 0;
}

.slider-1-p17c {
    position: absolute;
    top: 33px;
    left: 26px;
    width: 38px;
    height: 38px;
    z-index: 0;
}

.slider-1-p18a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p18b {
    position: absolute;
    top: 8px;
    left: 7px;
    width: 76px;
    height: 88px;
    z-index: 0;
}

.slider-1-p18c {
    position: absolute;
    top: 33px;
    left: 26px;
    width: 38px;
    height: 38px;
    z-index: 0;
}

.slider-1-p19a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 90px;
    height: 104px;
    z-index: 0;
}

.slider-1-p19b {
    position: absolute;
    top: 8px;
    left: 7px;
    width: 76px;
    height: 88px;
    z-index: 0;
}

.slider-1-p19c {
    position: absolute;
    top: 33px;
    left: 28px;
    width: 38px;
    height: 38px;
    z-index: 0;
}

.slider-2-p1 {
    position: absolute;
    top: 100px;
    left: 100px;
    width: 500px;
    height: 40px;
    color: #FF0000;
}

.slider-2-p2 {
    position: absolute;
    top: 150px;
    left: 100px;
    width: 500px;
    height: 40px;
    font-size: 32px;
    font-weight: 200;
    line-height: 1.2;
    text-align: left;
    color: #fff;
}

.slider-2-p3 {
    color: #fff;
    word-spacing: -9px;
}

.slider-2-p4 {
    position: absolute;
    top: 220px;
    left: 100px;
    width: 500px;
    height: 40px;
    line-height: 1.2;
    text-align: left;
    color: #fff;
}

.slider-2-p5 {
    position: absolute;
    top: 290px;
    left: 100px;
    width: 500px;
    height: 40px;
    line-height: 1.2;
    text-align: left;
}

.slider-2-p6 {
    background: #ff0000 !important;
    border-color: #ff0000;
}

.slider-2-p7 {
    position: absolute;
    top: 100px;
    left: 550px;
    width: 500px;
    height: 40px;
}

.slider-2-p8 {
    position: absolute;
    top: 150px;
    left: 550px;
    width: 500px;
    height: 40px;
    font-size: 32px;
    font-weight: 200;
    line-height: 1.2;
    text-align: left;
}

.slider-2-p9 {
    position: absolute;
    top: 220px;
    left: 550px;
    width: 500px;
    height: 40px;
    line-height: 1.2;
    text-align: left;
}

.slider-2-p10 {
    position: absolute;
    top: 290px;
    left: 550px;
    width: 500px;
    height: 40px;
    line-height: 1.2;
    text-align: left;
}

.slider-2-p10a {
    background: #ff0000 !important;
    border-color: #ff0000;
}

.Navigator1 {
    position: absolute;
    bottom: 12px;
    right: 12px;
}

.Navigator1a {
    width: 16px;
    height: 16px;
}

.Navigator1b {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.Arrow-Navigator1 {
    width: 55px;
    height: 55px;
    top: 0px;
    left: 25px;
}

.Arrow-Navigator1a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.Arrow-Navigator2 {
    width: 55px;
    height: 55px;
    top: 0px;
    right: 25px;
}

/*  */

.index-service {
    font-size: 30px;
    line-height: 40px;
    margin: 0 0 10px;
    text-transform: uppercase;
    color: #fff;
}

/*  */

/*  */

.index-contact {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.index-contact-h {
    color: #fff;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 30px;
    font-weight: 600
}

.index-contact-p {
    color: #000;
}

.index-contact-pdp {
    color: #ffffff;
    font-size: 17px;
}

@font-face {
    font-family: 'bgricon';
    src: url('<?php echo base_url();?>assets/fonts/bgricon.eot');
    src: url('<?php echo base_url();?>assets/fonts/bgricon.eot#iefix') format('embedded-opentype'),
        url('<?php echo base_url();?>assets/fonts/bgricon.ttf') format('truetype'),
        url('<?php echo base_url();?>assets/fonts/bgricon.woff') format('woff'),
        url('<?php echo base_url();?>assets/fonts/bgricon.svg#bgricon') format('svg');
    font-weight: normal;
    font-style: normal;
}

.whatwedo:after {
    /*background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;*/
    bottom: 0;
    content: " ";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 0;
}

.icons_block .mi_icon {
    display: inline-block;
}

[class*="mi_box"] {
    position: relative;
}

/*.whatwedo {
        background-image: url("<?php echo base_url();?>/assets/images/others/whatwedo.jpg");
        padding: 30px 0;
       
        background-position: center !important;background-repeat: no-repeat !important;
background-size: cover !important;
    }*/
.animation_background_rotate .mi_icon.box:before {
    transition: transform 500ms ease 0s;
}

.mi_icon:before {
    color: #FF0000;
    font-size: 140px;
}

.mi_icon.box .mi_icon i {
    color: #fff;
    font-size: 40px;
    line-height: 120px;
}

.sl_mega_icon .mi_icon.box {
    height: calc(120px + 2px);
    width: calc(120px + 2px);
}

.mi_icon.box {
    display: inline-block;
    position: relative;
    text-align: center;
    transition: all 300ms ease 0s;
    z-index: 2;
}

.mi_icon.box:before {
    left: 0;
    position: absolute;
    top: 0;
    transition: all 300ms ease 0s;
    z-index: 3;
}

.mi_icon.box:before {
    color: #FF0000;
    font-size: 120px;
}

[class^="ibgr-"]:before,
[class*=" ibgr-"]:before {
    font-family: "bgricon";
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    text-transform: none;
}

.ibgr-sd2:before {
    content: "\e90d";
}

.mi_icon.box .mi_icon i,
.mi_icon.box .mi_icon span {
    display: block;
    font-style: normal;
    position: relative;
    transition: all 300ms ease 0s;
    z-index: 15;
}

.mi_icon.box .mi_icon i,
.mi_icon.box .mi_icon span {
    display: block;
    font-style: normal;
    position: relative;
    transition: all 300ms ease 0s;
    z-index: 15;
}

.mi_general {
    margin-bottom: 10px;
}

.upb_row_bg {
    background-position: center center;
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 0;
}

.mi_content_box_top>div,
.mi_content_box_top .mi_title_box_title_inside {
    display: block;
    width: 100%;
}

.mi_title_box_top {
    padding: 20px 0 5px;
    padding-left: 34px;
}

.mi_title {
    display: block;
    font-size: 18px;
    line-height: 1.5em;
    margin: 0 0 5px;
}

.mi_content_box_top {
    display: block;
    width: 100%;
}

.vc_row-flex {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
}

.wpb_row {
    position: relative;
    z-index: 20;
}

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

.sl_mega_icon:hover .mi_icon.box:before {
    color: #000;
}

.animation_background_rotate:hover .mi_icon.box:before {
    transform: rotate(45deg);
}

/*  */

/*  */

.index-skills {
    padding-top: 0;
    text-align: justify;
}

/*  */

/*  */

< !-------------------Slide animate text---------------->.title {
    display: inline;
    position: relative;
}

.title1 {
    display: inline;
    position: relative;
    animation-name: intro;
    animation-duration: 2.3s;
    animation-iteration-count: 1;
    animation-timing-function: ease;
    animation-delay: 1s;
    animation-fill-mode: backwards;
}

@keyframes intro {
    0% {
        top: 290px;
    }

    90% {
        top: 0px;
    }

    100% {
        top: 0%;
    }
}

h1 {

    text-transform: uppercase;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 17px;
    letter-spacing: 1px;

}

/* 29/7/2022 */

h1 span {
    display: inline-block;
    animation: slideLeft 3.5s forwards;
    opacity: 0;
    transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
    animation-duration: 2.3s;
    animation-iteration-count: 1;
}

/* 29/7/2022 */
@keyframes slideLeft {
    from {
        opacity: 0;
        transform: translateX(1000px);
    }

    to {
        opacity: 1;
        transform: translateX(0%);
    }
}

ul.logo-group li img {
    height: 140px;
}

/* 4/11/2022 gourav */
.testimonial-item img {
    width: 50px !important;
    height: 50px !important;
    object-fit: cover !important;
}

/* 4/11/2022 */

#container .portfolio-bg {
    background-color: #19272F;
}

/* jssor slider loading skin spin css */

.jssorl-009-spin img {
    animation-name: jssorl-009-spin;
    animation-duration: 1.6s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes jssorl-009-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


.jssorb101 .i {
    position: absolute;
    cursor: pointer;
}

.jssorb101 .i .ci {
    fill: #000;
}

.jssorb101 .i .co {
    fill: #fff;
    opacity: .3;
}

.jssorb101 .i:hover .co {
    fill: #ff9933;
    opacity: 1;
}

.jssorb101 .i:hover .ci {
    fill: #fff;
}

.jssorb101 .iav .ci {
    fill: #fff;
    stroke-width: 0;
}

.jssorb101 .iav .co {
    fill: #46d1d3;
    opacity: 1;
}

.jssorb101 .i.idn {
    opacity: .3;
}

.jssora051 {
    display: block;
    position: absolute;
    cursor: pointer;
}

.jssora051 .a {
    fill: none;
    stroke: #ff0000;
    stroke-width: 360;
    stroke-miterlimit: 10;
}

.jssora051:hover {
    opacity: .8;
}

.jssora051.jssora051dn {
    opacity: .5;
}

.jssora051.jssora051ds {
    opacity: .3;
    pointer-events: none;
}

/**/
.shead {
    color: #fff;
    font-size: 33px;
    font-weight: 700;
    line-height: 55px;
}

/*end*/
.clientlogos2 {
    padding: 5px 0 40px !important;
}

.whychoose {
    background-image: url("https://gswebtech.com//assets/img/bg-work.jpg");
    background-position: center top;
    background-repeat: no-repeat;
    padding: 30px 0 30px;
    position: relative !important;
}

.whychoose::after {
    background: rgba(254, 220, 30, 0.7) none repeat scroll 0 0;
    bottom: 0;
    content: " ";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 0;
}

.whatwedo {
    /*background-image: url("<?php echo base_url();?>assets/img/whatwedo.jpg");*/
    background: url('<?php echo base_url();?>/assets/images/others/whatwedo.jpg') no-repeat fixed center center;
    padding: 30px 0 30px;
    position: relative !important;
}

.whatsay {
    /*background-image: url("<?php echo base_url();?>assets/img/whatwedo.jpg");*/
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("https://gswebtech.com//assets/images/bg/bg2.jpg") no-repeat fixed center center;
    position: relative !important;
}

.wealways {
    background: url("https://gswebtech.com//assets/images/bg/bg10.jpg") no-repeat fixed center center;
    position: relative !important;
    -webkit-background-size: cover;
    background-size: cover;
    -ms-background-size: cover;
}

.wealways:before {
    content: '';
    background-image: linear-gradient(to right, transparent, rgba(0, 0, 0));
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.whatwedo::after {
    /*background: rgba(62, 195, 213, 0.7) none repeat scroll 0 0;*/
    background: rgba(0, 0, 0, 0.7);
    bottom: 0;
    content: " ";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 0;
}

.bg-fixed>* {
    position: relative !important;
    z-index: 1 !important;
}

.bg-fixed {
    width: 100%;
    float: left;
    background-attachment: fixed;
    background-origin: initial;
    background-clip: initial;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 100% 0;
}

@media only screen and (max-device-width: 600px) {
    .whatwedo {
        display: none !important;
    }
}


.sl_mega_icon .mi_icon.box {
    width: calc(180px + 2px);
    height: calc(180px + 2px);
}

.sl_mega_icon [class*="mi_box_"] {
    text-align: center;
}

.sl_mega_icon .mi_icon.box:before {
    font-size: 180px;
    color: #26b7e7;
}

.sl_mega_icon:hover .mi_icon.box:before {
    color: #FF0000;
}

.sl_mega_icon .mi_icon.box .mi_icon i {
    font-size: 60px;
    color: #ffffff;
    line-height: 180px;
}

.sl_mega_icon:hover .mi_icon.box .mi_icon i {
    color: #ffffff;
}

.sl_mega_icon .mi_title {}

.sl_mega_icon .mi_description,
.sl_mega_icon .mi_box a {}

.sl_mega_icon.animation_border_parts [class*="mi_box_"]:before,
.sl_mega_icon.animation_border_parts [class*="mi_box_"]:after {
    background-color: #fdee00
}

.sl_mega_icon1 .mi_icon.box {
    width: calc(180px + 2px);
    height: calc(180px + 2px);
}

.sl_mega_icon1 [class*="mi_box_"] {
    text-align: center;
}

.sl_mega_icon1 .mi_icon.box:before {
    font-size: 180px;
    color: #26b7e7;
}

.sl_mega_icon1:hover .mi_icon.box:before {
    color: #FF0000;
}

.sl_mega_icon1 .mi_icon.box .mi_icon i {
    font-size: 60px;
    color: #ffffff;
    line-height: 180px;
}

.sl_mega_icon1:hover .mi_icon.box .mi_icon i {
    color: #ffffff;
}

.sl_mega_icon1 .mi_title {}

.sl_mega_icon1 .mi_description,
.sl_mega_icon1 .mi_box a {}

.sl_mega_icon1.animation_border_parts [class*="mi_box_"]:before,
.sl_mega_icon1.animation_border_parts [class*="mi_box_"]:after {
    background-color: #fdee00
}

.sl_mega_icon .mi_icon.box {
    width: calc(120px + 2px);
    height: calc(120px + 2px);
}

.sl_mega_icon [class*="mi_box_"] {
    text-align: center;
}

.sl_mega_icon .mi_icon.box:before {
    font-size: 120px;
    color: #ff0000;
}

.sl_mega_icon:hover .mi_icon.box:before {
    color: #F0A517;
}

.sl_mega_icon .mi_icon.box .mi_icon i {
    font-size: 40px;
    color: #FFF;
    line-height: 120px;
}

.sl_mega_icon:hover .mi_icon.box .mi_icon i {
    color: #ff0000;
}

.sl_mega_icon .mi_title {}

.sl_mega_icon .mi_description,
.sl_mega_icon .mi_box a {}

.sl_mega_icon.animation_border_parts [class*="mi_box_"]:before,
.sl_mega_icon.animation_border_parts [class*="mi_box_"]:after {
    background-color: #fdee00
}

.skill-section .skill-name {
    color: #fff;
}

.goal .content {
    display: table-cell;
    padding-left: 20px;
    padding-right: 20px;
    vertical-align: middle;
}

.goal .content h3 {
    margin: 0;
    padding-top: 15px;
    padding-bottom: 15px;
}

.goal .vision {
    background-color: #ffe323;

    float: left;
}

.goal .teamwork {

    float: left;
    background-color: #53c6fc;
}

.goal .mission {

    float: left;
    background-color: #51fcce;
}

.thumb img {
    max-width: 100%;
    height: auto;
}

.content p {
    font-size: 17px;
}

p.text-center.txt_p {
    margin-top: 70px;
    margin-bottom: 70px;
}

.about-contact {
    background-image: url("https://gswebtech.com/assets/images/pattern-7.png")
}

.about-contact-a {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.about-contact-b {
    color: #fff;
    font-size: 22px;
    line-height: 28px;
}

.about-contact-c {
    color: #fff;
    font-size: 14px;
    margin-bottom: 0;
}

.about-contact-c {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.about-contact-d {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.about-skill {
    margin-top: 30px;
    margin-bottom: 15px;
}

.about-skill-img {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("https://gswebtech.com/assets/images/bg/bg5.jpg") no-repeat fixed center center;
    position: relative;
    background-size: 100%;
}

.featured-section-img {
    background-image: url("https://gswebtech.com/assets/images/1096-[Converted].png")
}

.featured-section-img1 {
    background-image: url("https://gswebtech.com/assets/images/feature-1.jpg");
    visibility: visible;
    animation-duration: 1500ms;
    animation-delay: 0ms;
    animation-name: fadeInLeft;
}

.featured-section-img2 {
    background-image: url("https://gswebtech.com/assets/images/feature-2.jpg");
    visibility: visible;
    animation-duration: 1500ms;
    animation-delay: 0ms;
    animation-name: fadeInRight;
}

.featured-section-img3 {
    background-image: url("https://gswebtech.com/assets/images/feature-3.jpg");
    visibility: visible;
    animation-duration: 1500ms;
    animation-delay: 0ms;
    animation-name: fadeInRight;
}


.services_ {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("https://gswebtech.com/assets/images/bg/services-banner.jpg");
    background-size: cover;
}

.services-contact {
    padding: 30px 40px;
    float: left;
    width: 100%;
    text-align: center;
    position: relative;
    background: radial-gradient(circle farthest-corner at center center, #ff0000 0%, #920000 100%);
}

.services-contact-img {
    background-image: url("https://gswebtech.com/assets/images/pattern-7.png")
}

.services-contact-a {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.services-contact-b {
    color: #fff;
    font-size: 22px;
    line-height: 28px;
}

.services-contact-c {
    color: #fff;
    font-size: 14px;
    margin-bottom: 0;
}

.services-contact-btn {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.services-contact-service {
    background-image: url("https://gswebtech.com//assets/banner/services-pattern.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #d1d1d121;
}

/*  */

/*  */

.career-bgc {
    /* padding-top:20px !important; */
}

.form-control {
    background-color: #f1efef !important;
}

.skill_set ul li {

    list-style: disc;
}




@media only screen and (max-device-width: 768px) {

    .join_description {
        margin-right: 20px;
        margin-left: 10px;

    }

}

.join-us {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("https://gswebtech.com//assets/images/bg/joinus-banner0.jpg") no-repeat fixed center;
}

.joinus-img {
    background-image: url("https://gswebtech.com//assets/images/bg/form-bg.jpg")
}

/*  */

/* Contact start*/

form label {
    font-size: 17px;
    font-weight: 400;
}

.contact_map input[type="text"],
.contact_map input[type="email"],
.contact_map input[type="tel"],
.contact_map input[type="number"],
.contact_map select,
.contact_map textarea {
    background: #f1efef;
    border: none;
    border-radius: 0;

    font-size: 14px;
}

.feature-9 i {
    font-size: 60px;
    color: #FF0000;
    border-radius: 50%;
    border: 1px dashed #ff0000;
    width: 110px;
    height: 110px;
    padding: 28px;
}
}

.modal-content {
    background: #fff !important;
}

.modal-content.rd {
    border-radius: 3rem !important;
}

.modal-body {
    padding: 30px !important;
}

.msg-error {
    color: #c65848;
}

.g-recaptcha.error {
    border: solid 1px #c64848;
    width: 304px;
    border-radius: 5px;
    height: 78px;
}

.contact-page {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("https://gswebtech.com//assets/images/bg/gs-bcontact.jpg");
    background-size: cover;
    width: 100%;
    height: auto;
    background-position: center;
    float: left;
}

.contact-us-section {
    float: left;
    width: 100%;
}

.contact-us-section-2 {
    padding: 0 0 50px;
    margin-bottom: 0px;
    border-color: #fff;
    box-shadow: none;
}

.contact-us-msg {
    font-family: serif !important;
    margin-top: 15px;
    margin-bottom: 20px;
    color: #FF0000;
}

/* contact end */

/* Get a quote start*/

.asterrisk {
    color: #ff0000;
}

.g-image {
    position: relative;
}

.g-image img {
    position: absolute;
    top: 34px;
}

.career-bgc {
    /* background-color:#eaeaea !important; */
    padding-top: 20px !important;
}

.form-control {
    background-color: #f1efef !important;
}

.skill_set ul li {
    list-style: disc;
}


@media only screen and (max-device-width: 768px) {
    .join_detail {
        margin-right: 20px;
    }

    .join_description {
        margin-right: 20px;
        margin-left: 10px;
    }
}

@media only screen and (max-device-width: 1024px) {
    .form-group {
        margin-bottom: 5px;
    }
}

.form-group {
    margin-bottom: 2px;
}

/* Get a quote end */

/* Quote */

.Quote-banner {}

.ld.ld-ring.ld-spin {
    margin-right: 2px;
}

.quotebtn {
    vertical-align: middle;
}

.quotebtn1 {
    padding: 6px 35px 6px;
    margin-left: 1rem;
    background-color: #fff !important;
}

a.btn.btn-style-two {
    z-index: 1;
}

.service-img_ {
    /* box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset; */
    border-radius: 3rem;
    margin-top: 0;
}

.ct-btn {
    margin-left: 0 !important;
    margin-top: 1.5rem;
}

.err {

    margin: 0 0 10px;

    color: #a94442;

    margin-top: 4px;

    font-size: 18px;

    border-color: #a94442;

}

.err {
    margin: 0 0 10px;
    color: #a94442;
    margin-top: 4px;
    font-size: 18px;
    border-color: #a94442;
}

.skypewhats {
    padding: 3px 0px;
}

.skypewhats li {
    display: inline-block;
    color: #333;
}

.skypewhats li a {
    color: #fff;
    font-size: 14px;
}

.owl-theme .owl-controls .owl-buttons div {
    font-size: 0px;
}

.netwbgr {
    background-image: url('<?php echo base_url();?>assets/bgrni.jpg') !important;
    background-repeat: no-repeat !important;
    background-position: right bottom !important;
}

ul.nav.navbar-nav.navbar-right li a.btn.btn-info {
    margin-top: 20px;
}


#preloader {

    position: fixed;

    left: 0;

    top: 0;

    z-index: 999;

    width: 100%;

    height: 100%;

    overflow: visible;

    background: #141A26 url('https://www.styloworld.in/frontend/loader.gif') no-repeat center center;

    background-size: 60px;

    opacity: 0.7;
}

.footer-list li {


    color: #bfbfbf;


    font-size: 14px;


}


.footer-title h3 {


    font-size: 14px;


    color: #FF0000;


}


.footer-text p {


    font-size: 14px;


}


.copyright .copyright-text p {


    font-size: 13px;


}


.copyright {


    margin-top: 0px;


    padding: 10px 0;


}

.modal-content {
    border-radius: 3rem;
}

.quote-breadcrumb {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("https://gswebtech.com/assets/images/bg/aqq.jpg");
    background-size: cover;
    width: 100%;
    height: auto;
    float: left;
}

.quote-f-txt {
    font-family: serif !important;
    margin-top: 15px;
    color: #FF0000;
}

.quote-contact-p {
    padding: 30px 40px;
    float: left;
    width: 100%;
    text-align: center;
    position: relative;
    background: radial-gradient(circle farthest-corner at center center, #ff0000 0%, #920000 100%);
}

.quote-contact-p-1 {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("https://gswebtech.com/assets/images/bg/footer-top.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center bottom;
}

.Contact-red1-style {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.primary-style {
    color: #fff;
    font-size: 22px;
    line-height: 28px;
}

.primary-style-2 {
    color: #fff;
    font-size: 14px;
    margin-bottom: 0;
}

.style-3 {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.contact-content,
.contact-content p a,
.contact-content a {
    color: #FF0000;
}

.join-us-bg {
    background-image: url("https://gswebtech.com//assets/images/bg/form-bg.jpg");
    background-size: cover;
}

.form-control .txt {
    min-height: 175px;
}

.hr1-mg {
    margin-bottom: 50px;
}

.feature-3-txt {
    background-color: #fff;
}

.btn-grad-mt {
    margin-top: 20px;
}

.about-bg {
    background-image: url("https://gswebtech.com//assets/images/bg/Untitled-1.jpg");
    background-size: no-repeat fixed center;
}

.txt-btm-p {
    margin-bottom: 0px;
}

.txt-btm-p1 {
    margin-top: 20px;
}

.about-section-bg_ {
    background-image: url("https://gswebtech.com/images/feature-1.jpg");

}

.about-section-bg_1 {
    background-image: url("https://gswebtech.com/images/feature-2.jpg");
}

.about-section-bg_2 {
    background-image: url("https://gswebtech.com/images/feature-3.jpg");
}

.progress-bar-clr {
    background-color: rgb(54, 149, 217);
}

.progress-bar-clr-a {
    background-color: rgb(248, 185, 71);
}

.progress-bar-clr-b {
    background-color: rgb(248, 125, 192);
}

.progress-bar-clr-c {
    background-color: rgb(54, 149, 217);
}

.progress-bar-clr-d {
    background-color: rgb(255, 23, 23);
}

.progress-bar-clr-e {
    background-color: rgb(248, 125, 192);
}

.progress-bar-clr-f {
    background-color: rgb(146, 199, 18);
}


i.fa.fa-twitter.icon-mr.icon-clr-a {
    color: #1DA1F2;
}

i.fa.fa-google-plus.icon-mr.icon-clr-b {
    color: #db4a39;
}

i.fa.fa-linkedin.icon-mr.icon-clr-c {
    color: #0077b5;
}

i.fa.fa-instagram.icon-mr.icon-clr-d {
    color: #405DE6;
}

.icon-clr-icon-bg {
    color: #4267B2;
}

.icon-clr-icon-bg-a {
    color: #1DA1F2;
}

.icon-clr-icon-bg-b {
    color: #db4a39;
}

.icon-clr-icon-bg-c {
    color: #0077b5;
}

.icon-clr-icon-bg-d {
    color: #8a3ab9;
}

.heading-a {
    color: #ff0000;
}

.heading-aa {
    color: #ff0000;
}

.heading-h1 {
    color: #fff;
}

.index-info {
    margin-bottom: 30px;
}

.expertise-bg {
    background-image: url("https://gswebtech.com//assets/banner/pattern-9.png");
}

.wealways-position {
    position: relative;
}

.color-white {
    color: #fff;
}

.fl-mr {
    margin-top: 40px;
}

.texture-img {
    background-image: url("https://gswebtech.com//assets/banner/texture.jpg");
}

.contact-us-pop-bg-index {
    background-image: url("https://gswebtech.com/assets/images/pattern-7.png");
}

.index-ctbtn {
    display: inline-block;
    float: none;
    vertical-align: middle;
}

.pb-clr-a {
    background-color: rgb(54, 149, 217);
}

.pb-clr-b {
    background-color: rgb(248, 185, 71);
}

.pb-clr-c {
    background-color: rgb(54, 149, 217);
}

.pb-clr-d {
    background-color: rgb(255, 23, 23);
}

.pb-clr-e {
    background-color: rgb(146, 199, 18);
}

.anm-1 {
    visibility: visible;
    animation-duration: 2s;
    animation-delay: 3s;
    animation-name: fadeInRight;
}

.anm-2 {
    visibility: visible;
    animation-duration: 1s;
    animation-delay: 0.5s;
    animation-name: fadeInDown;
}

.anm-2 {
    visibility: visible;
    animation-duration: 1s;
    animation-delay: 0.5s;
    animation-name: zoomIn;
}

.anm-3 {
    visibility: visible;
    animation-duration: 1500ms;
    animation-delay: 0ms;
    animation-name: fadeInLeft;
}

.anm-4 {
    visibility: visible;
    animation-duration: 1500ms;
    animation-delay: 0ms;
    animation-name: fadeInRight;
}

.anm-5 {
    visibility: visible;
    animation-duration: 1500ms;
    animation-delay: 0ms;
    animation-name: fadeInRight;
}

.map-height {
    height: 300px;
}

.modal-mr-tp {
    margin-top: 253px;
}

.form-control-ht {
    min-height: 60px;
}

.quote-msg-pop {
    margin-bottom: 40px;
    visibility: hidden;
}

.modal-dg-ht {
    margin-top: 253px;
}

.anm-6 {
    visibility: visible;
    animation-duration: 1s;
    animation-delay: 1s;
    animation-name: fadeInUp;
}

.pr-none {
    display: none;
}

.anm {
    visibility: visible;
    animation-duration: 1s;
    animation-delay: .5s;
    animation-name: fadeInUpBig;
}

.anm-7 {
    visibility: visible;
    animation-duration: 1s;
    animation-delay: 0.5s;
    animation-name: fadeInRight;
}

.header-contact {
    margin-bottom: 0;
}

.ft-ft-rt {
    float: right;
}

.ft-bg-img-2 {
    background-image: url(https://gswebtech.com//assets/images/pattern-8.png);
}

.ft-bg-img-1 {
    background-image: url(https://gswebtech.com//assets/images/pattern-7.png);
}

#container .portfolio-bg {
    background-color: #19272F;
}

.portfolio-breadcrumb {
    background-image: url(https://gswebtech.com//assets/images/bg/portfolio_gswebtech.jpg);
    background-size: cover;
}

.pf-heading {
    color: white;
    font-size: 19px;
}

.pf-heading-a {
    color: white;
    font-size: 20px;
}

.color-red {
    color: #FF0000;
}

/*  */


/*=== 11-11-2022 ===*/
.preloader {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    background: #ffffffd9;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* 
.pl {
    display: block;
    width: 8em;
    height: 8em;
}

.pl__ring,
.pl__ball1,
.pl__ball2 {
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    transform-origin: 32px 32px;
}

.pl__ring {
    animation-name: ring;
    stroke: #fff;
}

.pl__ball1 {
    animation-name: ball1;
    fill: #fff;
}

.pl__ball2 {
    animation-name: ball2;
    fill: #fff;
}

/* Animation */
/* @keyframes ring {
    from {
        animation-timing-function: ease-in-out;
        stroke-dashoffset: -122.52;
        transform: rotate(135deg);
    }

    15% {
        animation-timing-function: ease-in;
        stroke-dashoffset: -122.52;
        transform: rotate(90deg);
    }

    35% {
        animation-timing-function: ease-out;
        stroke-dashoffset: -65.34;
        transform: rotate(297.5deg);
    }

    55% {
        animation-timing-function: ease-in-out;
        stroke-dashoffset: -122.52;
        transform: rotate(505deg);
    }

    70% {
        animation-timing-function: ease-in-out;
        stroke-dashoffset: -122.52;
        transform: rotate(490deg);
    }

    85%,
    to {
        stroke-dashoffset: -122.52;
        transform: rotate(497.5deg);
    }
}

@keyframes ball1 {
    from {
        transform: rotate(14deg);
    }

    20% {
        transform: rotate(-7deg);
    }

    60% {
        transform: rotate(399deg);
    }

    75% {
        transform: rotate(361deg);
    }

    90%,
    to {
        transform: rotate(374deg);
    }
}

@keyframes ball2 {
    from {
        transform: rotate(-21deg);
    }

    25% {
        transform: rotate(-47deg);
    }

    60% {
        transform: rotate(364deg);
    }

    75% {
        transform: rotate(326deg);
    }

    90%,
    to {
        transform: rotate(339deg);
    }
} */