/**
* Template Name: Scaffold - v2.0.0
* Template URL: https://bootstrapmade.com/scaffold-bootstrap-metro-style-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {
    --register-black: #000;
    --blue-dreveal: #2184be;
    --green-dreveal: #00a15d;
    /*--shadow-box-blue: 0 0px 40px 4px rgba(55 143 216 / 92%);*/
    --shadow-box-blue: 0px 0px 15px rgb(55 143 216 / 60%);
    --shadow-box-black: 0px 0px 15px rgb(113 113 113 / 30%);
    --shadow-focus-blue-dreveal: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

body {
    font-family: "Raleway", sans-serif;
    color: #444444;
}

a {
    color: #2184be;
}

    a:hover {
        color: #1eb4ff;
        text-decoration: none;
    }

.btn.btn-outline-success a {
    color: var(--green-dreveal);
}

    .btn.btn-outline-success a:hover {
        color: #fff;
    }

.wizard > .steps .done a,
.wizard > .steps .disabled a,
.wizard > .steps .disabled a:hover {
    background: transparent;
    color: #2184be;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Raleway", sans-serif;
}

b {
    color: #576971;
}

@media (max-width: 1100px) {
    .mainBody .container-expand {
        max-width: 95%;
    }
}

@media (min-width: 1101px) {
    .mainBody .container-expand {
        max-width: 85%;
    }
}
/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
    position: fixed;
    display: none;
    right: 15px;
    bottom: 15px;
    z-index: 99999;
}

    .back-to-top i {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        width: 40px;
        height: 40px;
        border-radius: 4px;
        background: #6e6f6f;
        color: #fff;
        transition: all 0.4s;
    }

        .back-to-top i:hover {
            background: #14b1ff;
            color: #fff;
        }

/*--------------------------------------------------------------
# Disable AOS delay on mobile
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    [data-aos-delay] {
        transition-delay: 0 !important;
    }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
    height: 85px;
    transition: all 0.5s;
    z-index: 997;
    transition: all 0.5s;
    padding: 18px 0;
    background: #fff;
    box-shadow: var(--shadow-box-black);
}

    #header .logo h1 {
        font-size: 28px;
        margin: 0;
        padding: 6px 0;
        line-height: 1;
        font-weight: 600;
        letter-spacing: 1px;
        font-family: "Raleway", sans-serif;
    }

        #header .logo h1 a, #header .logo h1 a:hover {
            color: #576971;
            text-decoration: none;
        }

.logo {
    max-width: 7.5em;
    max-height: 6em;
}

#header .logo img {
    padding: 0;
    margin: 0;
    margin-top: -9px;
    max-width: 7.5em;
    max-height: 6em;
}

@media (max-width: 768px) {
    #header .logo h1 {
        font-size: 28px;
        padding: 8px 0;
    }
}

/*--------------------------------------------------------------
# Header Social Links
--------------------------------------------------------------*/
.header-social-links a {
    color: #7b909a;
    padding: 12px 0 12px 6px;
    display: inline-block;
    line-height: 1px;
    transition: 0.3s;
}

    .header-social-links a:hover {
        color: #2184be;
    }

@media (max-width: 768px) {
    .header-social-links {
        padding-right: 48px;
    }
}

/*--------------------------------------------------------------
# RRSS Button Menu
--------------------------------------------------------------*/
.btn-google {
    color: #fff;
    background-color: #ea4335;
    font-weight: 400;
    font-size: 1.2rem;
}

    .btn-google:hover {
        color: #fff;
        background-color: #e12717;
    }

.btn-facebook {
    color: #fff;
    background-color: #3b5998;
    font-weight: 400;
    font-size: 1.2rem;
}

    .btn-facebook:hover {
        color: #fff;
        background-color: #30497c;
    }

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
.nav-menu .drop-down ul a.current-menu,
.nav-menu ul a.current-menu {
    color: #2184be;
    /*border: 1px dotted #7b909a;*/
    font-weight: 700;
}

/* Desktop Navigation */
.nav-menu, .nav-menu * {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .nav-menu > ul > li {
        position: relative;
        white-space: nowrap;
        float: left;
    }

    .nav-menu a,
    .custom-control.custom-switch.language-switch {
        display: block;
        position: relative;
        color: #7b909a;
        padding: 10px 0px 10px 15px;
        transition: 0.3s;
        font-size: 18px;
        font-weight: 600;
        font-family: "Raleway", sans-serif;
    }

        .nav-menu a:hover, .nav-menu .active > a, .nav-menu li:hover > a {
            color: #2184be;
            text-decoration: none;
        }

        .custom-control.custom-switch.language-switch {
            padding-left: 50px;
        }
            .custom-control.custom-switch.language-switch a{
                padding:0;
                margin:0;
                display: inline;
                opacity: 0.4;
            }

                .custom-control.custom-switch.language-switch a.selected {
                    opacity: 1;
                }

            .custom-control.custom-switch.language-switch .custom-control-label {
                margin-left: 38px;
            }

                .custom-control.custom-switch.language-switch .custom-control-label:before,
                .custom-control.custom-switch.language-switch .custom-control-label:after {
                    cursor: pointer;
                }

            .custom-control.custom-switch.language-switch .custom-control-input ~ .custom-control-label::before {
                top: .41rem;
            }

            .custom-control.custom-switch.language-switch .custom-control-input ~ .custom-control-label::after {
                top: calc(.41rem + 2px);
            }

            .custom-control.custom-switch.language-switch .custom-control-input:checked ~ .custom-control-label::before {
                border-color: var(--blue-dreveal);
                background-color: var(--blue-dreveal);
            }

    .nav-menu .drop-down ul {
        display: none;
        position: absolute;
        left: 0;
        top: calc(100% + 30px);
        z-index: 99;
        opacity: 0;
        visibility: hidden;
        padding: 10px 0;
        background: #fff;
        box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
        transition: ease all 0.3s;
    }

    .nav-menu .drop-down:hover > ul {
        opacity: 1;
        top: 100%;
        visibility: visible;
        display: block;
    }

    .nav-menu .drop-down li {
        min-width: 180px;
        position: relative;
    }

    .nav-menu .drop-down ul a {
        padding: 10px 20px;
        font-size: 14px;
        text-transform: none;
        color: #003651;
        font-weight: normal;
    }

        .nav-menu .drop-down ul a:hover, .nav-menu .drop-down ul .active > a, .nav-menu .drop-down ul li:hover > a {
            color: #2184be;
        }

    .nav-menu .drop-down > a:after {
        content: "\ea99";
        font-family: IcoFont;
        padding-left: 5px;
    }

    .nav-menu .drop-down .drop-down ul {
        top: 0;
        left: calc(100% - 30px);
    }

    .nav-menu .drop-down .drop-down:hover > ul {
        opacity: 1;
        top: 0;
        left: 100%;
    }

    .nav-menu .drop-down .drop-down > a {
        padding-right: 35px;
    }

        .nav-menu .drop-down .drop-down > a:after {
            content: "\eaa0";
            font-family: IcoFont;
            position: absolute;
            right: 15px;
        }

.nav-menu .drop-down ul li.TMmenu a {
    font-size: 0.75em;
    font-weight: 500;
}

@media (min-width: 992px) and (max-width: 1100px) {
    #header .container-expand {
        max-width: 89%
    }
}

@media (max-width: 1366px) {
    .nav-menu .drop-down .drop-down ul {
        left: -90%;
    }

    .nav-menu .drop-down .drop-down:hover > ul {
        left: -100%;
    }

    .nav-menu .drop-down .drop-down > a:after {
        content: "\ea9d";
    }
}

.nav-pills .nav-link.active {
    background-color: #2184be;
}

.nav-menu .wkMenu {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

    .nav-menu .wkMenu .wkImg {
        width: 32px;
        height: 32px;
        display: inline;
    }

/* Mobile Navigation */
.mobile-nav-toggle {
    position: fixed;
    right: 15px;
    top: 21px;
    z-index: 9998;
    border: 0;
    background: none;
    font-size: 40px;
    transition: all 0.4s;
    outline: none !important;
    line-height: 1;
    cursor: pointer;
    text-align: right;
}

    .mobile-nav-toggle i {
        color: #2184be;
    }

.mobile-nav {
    position: fixed;
    top: 55px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    z-index: 9999;
    overflow-y: auto;
    background: #fff;
    transition: ease-in-out 0.2s;
    opacity: 0;
    visibility: hidden;
    border-radius: 10px;
    padding: 10px 0;
}

    .mobile-nav * {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .mobile-nav a {
        display: block;
        position: relative;
        color: #364146;
        padding: 10px 20px;
        font-weight: 500;
        outline: none;
    }

        .mobile-nav a:hover, .mobile-nav .active > a, .mobile-nav li:hover > a {
            color: #2184be;
            text-decoration: none;
        }

    .mobile-nav .drop-down > a:after {
        content: "\ea99";
        font-family: IcoFont;
        padding-left: 10px;
        position: absolute;
        right: 15px;
    }

    .mobile-nav .active.drop-down > a:after {
        content: "\eaa1";
    }

    .mobile-nav .drop-down > a {
        padding-right: 35px;
    }

    .mobile-nav .drop-down ul {
        display: none;
        overflow: hidden;
    }

    .mobile-nav .drop-down li {
        padding-left: 20px;
    }

.mobile-nav-overly {
    width: 100%;
    height: 100%;
    z-index: 9997;
    top: 0;
    left: 0;
    position: fixed;
    background: rgba(32, 38, 41, 0.6);
    overflow: hidden;
    display: none;
    transition: ease-in-out 0.2s;
}

.mobile-nav-active {
    overflow: hidden;
}

    .mobile-nav-active .mobile-nav {
        opacity: 1;
        visibility: visible;
    }

    .mobile-nav-active .mobile-nav-toggle i {
        color: #fff;
    }

/*--------------------------------------------------------------
# Sidebar Menu
--------------------------------------------------------------*/

#wrapper {
    padding-top: 85px;
    padding-left: 45px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

@media (min-width: 992px) {
    #wrapper {
        padding-left: 225px;
    }

    #wrapper #sidebar-wrapper {
        width: 225px;
    }
}

#sidebar-wrapper {
    border-right: 1px solid #e7e7e7;
}

#sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    left: 225px;
    width: 0;
    height: 100%;
    margin-left: -225px;
    overflow-y: auto;
    background: var(--blue-dreveal);
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

    #sidebar-wrapper .sidebar-nav {
        position: absolute;
        top: 0;
        width: 225px;
        font-size: 14px;
        margin: 0;
        padding: 10px;
        list-style: none;
    }

        #sidebar-wrapper .sidebar-nav li {
            text-indent: 0;
            line-height: 45px;
            margin: 5px 0px;
        }

            #sidebar-wrapper .sidebar-nav li a {
                display: block;
                text-decoration: none;
                color: #fff;
                background-color: #4799c9;
                font-weight: 500;
            }

.sidebar-nav li:first-child a {
/*    background: #92bce0 !important;
    color: #fff !important;*/
}

#sidebar-wrapper .sidebar-nav li a .sidebar-icon {
    width: 45px;
    height: 45px;
    font-size: 14px;
    padding: 0 2px;
    display: inline-block;
    text-indent: 7px;
    margin-right: 10px;
    color: #fff;
    float: left;
}

#sidebar-wrapper .sidebar-nav li a .sidebar-icon img{
    width: 90%;
}
    #sidebar-wrapper .sidebar-nav li a .caret {
    position: absolute;
    right: 23px;
    top: auto;
    margin-top: 20px;
}

#sidebar-wrapper .sidebar-nav li ul.panel-collapse {
    list-style: none;
    -moz-padding-start: 0;
    -webkit-padding-start: 0;
    -khtml-padding-start: 0;
    -o-padding-start: 0;
    padding-start: 0;
    /*padding: 0;*/
    padding: 1px 4px;
    background-color: #71b3c8;
}

    #sidebar-wrapper .sidebar-nav li ul.panel-collapse li i {
        margin-right: 10px;
    }

    #sidebar-wrapper .sidebar-nav li ul.panel-collapse li {
        text-indent: 15px;
    }

@media (max-width: 992px) {
    #wrapper #sidebar-wrapper {
        width: 45px;
    }

    #wrapper #sidebar-wrapper .sidebar-nav {
        padding: 0px;
    }

    #wrapper #sidebar-wrapper .sidebar-nav li a .sidebar-icon {
        padding:0px;
    }

    #sidebar-wrapper .sidebar-nav li a .sidebar-icon img {
        width: 70%;
    }
    
    #wrapper #sidebar-wrapper #sidebar #sidemenu li ul {
        position: fixed;
        left: 45px;
        margin-top: -45px;
        z-index: 1000;
        width: 200px;
        /*height: 0;*/
    }
}

#sidebar-wrapper .sidebar-nav li a.current-menu {
    /*background-color: #fff;*/
    /*color: var(--blue-dreveal);*/
    background-color: #77b4d7;
    font-weight: 600;
    border: 1px solid #fff;
}

/*--------------------------------------------------------------
# Home Section
--------------------------------------------------------------*/
.homeIndex img {
    width: 100%;
}
@media (max-width: 767px) {
    
}
@media (min-width: 768px) and (max-width: 1023px) {
    
}
@media (min-width: 1024px) {
    
}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.homeIndex .col-lg-6 {
    padding:0;
}

.homeIndex .justify-content-center div {
    padding: 0 50px;
}

.homeIndex h1 {
    font-size: 30px;
    font-weight: bold;
}

.homeIndex h2 {
    font-size: 20px;
    line-height: 35px;
    margin-left: 15px;
    font-weight: bold;
}

.homeIndex h3 {
    font-size: 17px;
    line-height: 1.7;
    margin-bottom: 18px;
}

.homeIndex .imageContent {
    background-color: #eef4fe;
    justify-content: center;
}

.homeIndex .ContactUs h3 {
    font-size: 20px;
}

.homeIndex .infoWhyUs ul,
.homeIndex .infoWhyUs h3 {
    margin: 0;
}

.homeIndex .infoWhyUs div.text-justify {
    padding: 15px 50px;
}

#hero {
    width: 100%;
    background-image: url("../img/hero-bg.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right top;
    margin-top: 85px;
    font-style: normal;
}

    #hero .btn-get-started {
        font-family: "Raleway", sans-serif;
        font-weight: 600;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 1px;
        display: inline-block;
        padding: 12px 28px;
        border-radius: 3px;
        transition: 0.5s;
        color: #fff;
        background: #2184be;
    }

        #hero .btn-get-started:hover {
            background: #008bd1;
        }

    #hero .hero-img {
        text-align: center;
    }

        #hero .hero-img img {            
            /*margin-top: 70px;*/
        }

@media (min-width: 1024px) {
    #hero {
        background-attachment: fixed;
    }
}

@media (max-width: 992px) {
    #hero h1 {
        font-size: 32px;
        line-height: 40px;
    }

    #hero h2 {
        font-size: 20px;
    }
}

/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
}

.section-bg {
    background-color: #fff;
}

.section-title {
    text-align: center;
    padding-bottom: 30px;
}

    .section-title h2 {
        font-size: 32px;
        font-weight: 400;
        margin-bottom: 20px;
        padding-bottom: 0;
        font-family: "Raleway", sans-serif;
        color: #627680;
    }

    .section-title p {
        margin-bottom: 0;
    }

/*--------------------------------------------------------------
# Info T-Mi
--------------------------------------------------------------*/
/*#infoTMi {
    font-style: normal;
}

    #infoTMi h3 {
        font-size: 32px;
        font-weight: 500;
    }

    #infoTMi h4 {
        font-size: 20px;
        font-weight: normal;
    }*/

/*--------------------------------------------------------------
# Ticket Management
--------------------------------------------------------------*/
/*#ticketManagement {
    background-color: #f7f8f9;
    font-style: normal;
}

    #ticketManagement h3 {
        font-size: 32px;
        font-weight: 500;
    }

    #ticketManagement h4 {
        font-size: 20px;
        font-weight: normal;
    }*/

/*--------------------------------------------------------------
# Infor Custom Reporting
--------------------------------------------------------------*/
#infoCustomReporting {
    font-style: normal;
}

    #infoCustomReporting h1 {
    }

    #infoCustomReporting h2 {
        margin-top: 15px;
    }

    #infoCustomReporting h3 {
        margin-top: 15px;
    }

.infoCustomDashboard h3 {
}
/*--------------------------------------------------------------
# Features
--------------------------------------------------------------*/
.features {
    padding-bottom: 40px;
}

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

    .features .nav-link {
        border: 0;
        padding: 20px;
        transition: 0.3s;
        color: #364146;
        transition: 0.3s ease-in-out;
        border-radius: 0;
        border-left: 4px solid #fafbfb;
    }

        .features .nav-link h4 {
            font-size: 18px;
            font-weight: 600;
            transition: 0.3s ease-in-out;
            color: #576971;
        }

        .features .nav-link p {
            font-size: 14px;
            margin-bottom: 0;
        }

        .features .nav-link:hover {
            background: #fafbfb;
        }

            .features .nav-link:hover h4 {
                color: #364146;
            }

        .features .nav-link.active {
            border-radius: 0;
            border: 0;
            border-left: 4px solid #2184be;
            background: #fafbfb;
        }

            .features .nav-link.active h4 {
                color: #2184be;
            }

    .features .tab-pane.active {
        -webkit-animation: slide-down 0.5s ease-out;
        animation: slide-down 0.5s ease-out;
    }

    .features .tab-content {
        text-align: right;
    }

@-webkit-keyframes slide-down {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes slide-down {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/
.services .icon-box {
    padding: 30px;
    position: relative;
    overflow: hidden;
    margin: 0;
    background: #fff;
    box-shadow: 0 10px 29px 0 rgba(68, 88, 144, 0.1);
    transition: all 0.3s ease-in-out;
    border-radius: 4px;
    text-align: center;
    border-bottom: 3px solid #fff;
}

    .services .icon-box:hover {
        transform: translateY(-5px);
    }

.services .icon i {
    font-size: 48px;
    line-height: 1;
    margin-bottom: 15px;
}

.services .title {
    font-weight: 700;
    margin-bottom: 15px;
    font-size: 18px;
}

    .services .title a {
        color: #111;
    }

.services .description {
    font-size: 15px;
    line-height: 28px;
    margin-bottom: 0;
}

.services .icon-box-pink .icon i {
    color: #ff689b;
}

.services .icon-box-pink:hover {
    border-color: #ff689b;
}

.services .icon-box-cyan .icon i {
    color: #3fcdc7;
}

.services .icon-box-cyan:hover {
    border-color: #3fcdc7;
}

.services .icon-box-green .icon i {
    color: #41cf2e;
}

.services .icon-box-green:hover {
    border-color: #41cf2e;
}

.services .icon-box-blue .icon i {
    color: #2282ff;
}

.services .icon-box-blue:hover {
    border-color: #2282ff;
}

/*--------------------------------------------------------------
# Cta
--------------------------------------------------------------*/
.cta {
    background: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), url("../img/cta-bg.jpg") center center;
    background-size: cover;
    padding: 80px 0;
}

    .cta h3 {
        color: #364146;
        font-size: 28px;
        font-weight: 700;
    }

    .cta p {
        color: #576971;
    }

    .cta .cta-btn {
        font-family: "Raleway", sans-serif;
        font-weight: 500;
        font-size: 15px;
        letter-spacing: 1px;
        display: inline-block;
        padding: 10px 30px;
        border-radius: 4px;
        transition: 0.5s;
        margin: 10px;
        color: #fff;
        background: #2184be;
    }

        .cta .cta-btn:hover {
            background: #008bd1;
        }

@media (min-width: 1024px) {
    .cta {
        background-attachment: fixed;
    }
}

@media (min-width: 769px) {
    .cta .cta-btn-container {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
}

/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
.testimonials .testimonial-item {
    box-sizing: content-box;
    min-height: 320px;
}

    .testimonials .testimonial-item .testimonial-img {
        width: 90px;
        border-radius: 50%;
        margin: -40px 0 0 40px;
        position: relative;
        z-index: 2;
        border: 6px solid #fff;
    }

    .testimonials .testimonial-item h3 {
        font-size: 18px;
        font-weight: bold;
        margin: 10px 0 5px 45px;
        color: #111;
    }

    .testimonials .testimonial-item h4 {
        font-size: 14px;
        color: #999;
        margin: 0 0 0 45px;
    }

    .testimonials .testimonial-item .quote-icon-left, .testimonials .testimonial-item .quote-icon-right {
        color: #d8dee1;
        font-size: 26px;
    }

    .testimonials .testimonial-item .quote-icon-left {
        display: inline-block;
        left: -5px;
        position: relative;
    }

    .testimonials .testimonial-item .quote-icon-right {
        display: inline-block;
        right: -5px;
        position: relative;
        top: 10px;
    }

    .testimonials .testimonial-item p {
        font-style: italic;
        margin: 0 15px 0 15px;
        padding: 20px 20px 60px 20px;
        background: #f4f6f7;
        position: relative;
        border-radius: 6px;
        position: relative;
        z-index: 1;
    }

.testimonials .owl-nav, .testimonials .owl-dots {
    margin-top: 5px;
    text-align: center;
}

.testimonials .owl-dot {
    display: inline-block;
    margin: 0 5px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #ddd !important;
}

    .testimonials .owl-dot.active {
        background-color: #2184be !important;
    }

@media (max-width: 767px) {
    .testimonials {
        margin: 30px 10px;
    }
}

/*--------------------------------------------------------------
# Team
--------------------------------------------------------------*/
.team {
    background: url("../img/team-bg.jpg") center center no-repeat;
    background-size: cover;
    padding: 60px 0;
    position: relative;
}

    .team::before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.75);
        z-index: 9;
    }

    .team .container {
        position: relative;
        z-index: 10;
    }

    .team .member {
        text-align: center;
        margin-bottom: 80px;
        position: relative;
    }

        .team .member .pic {
            overflow: hidden;
        }

        .team .member .member-info {
            position: absolute;
            top: 85%;
            left: 20px;
            right: 20px;
            background: #fff;
            padding: 20px 0;
            color: #364146;
            box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
            max-height: 95px;
            overflow: hidden;
            transition: max-height 0.5s ease-in-out;
        }

        .team .member:hover .member-info {
            max-height: 300px;
        }

        .team .member h4 {
            font-weight: 700;
            margin-bottom: 10px;
            font-size: 16px;
            color: #364146;
            position: relative;
            padding-bottom: 10px;
        }

            .team .member h4::after {
                content: '';
                position: absolute;
                display: block;
                width: 50px;
                height: 1px;
                background: #b5c1c6;
                bottom: 0;
                left: calc(50% - 25px);
            }

        .team .member span {
            font-style: italic;
            display: block;
            font-size: 13px;
        }

        .team .member .social {
            margin-top: 15px;
        }

            .team .member .social a {
                transition: color 0.3s;
                color: #627680;
            }

                .team .member .social a:hover {
                    color: #2184be;
                }

            .team .member .social i {
                font-size: 16px;
                margin: 0 2px;
            }

@media (max-width: 992px) {
    .team .member {
        margin-bottom: 110px;
    }
}

/*--------------------------------------------------------------
# Clients
--------------------------------------------------------------*/
.clients .clients-wrap {
    border-top: 1px solid #eceff0;
    border-left: 1px solid #eceff0;
}

.clients .client-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 1px solid #eceff0;
    border-bottom: 1px solid #eceff0;
    overflow: hidden;
    background: #fff;
    height: 120px;
    padding: 40px;
}

    .clients .client-logo img {
        max-width: 50%;
        -webkit-filter: grayscale(100);
        filter: grayscale(100);
    }

    .clients .client-logo:hover img {
        -webkit-filter: none;
        filter: none;
        transform: scale(1.1);
    }

.clients img {
    transition: all 0.4s ease-in-out;
}

/*--------------------------------------------------------------
# Pricing
--------------------------------------------------------------*/
#pricing h2 {
    font-size: 32px;
    font-weight: 500;
    font-style: italic;
}

#pricing .container {
    background-color: #fff;
}

.pricing .box {
    padding: 20px;
    background: #fff;
    text-align: center;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
    border: 2px solid #e9ecee;
    font-family: "Raleway", sans-serif;
}

.pricing h3 {
    font-weight: 400;
    padding: 20px 15px;
    font-size: 18px;
    font-weight: 400;
    color: #777777;
}

.pricing h4 {
    font-size: 36px;
    color: #2184be;
    font-weight: 600;
    margin-bottom: 20px;
}

    .pricing h4 sup {
        font-size: 20px;
        top: -15px;
        left: -3px;
    }

    .pricing h4 span {
        color: #bababa;
        font-size: 16px;
        font-weight: 300;
    }

.pricing h5 {
    padding: 16px 12px;
    text-align: left;
    line-height: 20px;
    font-size: 14px;
    margin-bottom: 0;
}

.pricing ul {
    padding: 0;
    list-style: none;
    color: #444444;
    text-align: left;
    line-height: 20px;
    font-size: 14px;
    margin-bottom: 0;
}

    .pricing ul li {
        padding-bottom: 16px;
    }

    .pricing ul i {
        color: #2184be;
        font-size: 18px;
        padding-right: 4px;
    }

    .pricing ul .na {
        color: #ccc;
        text-decoration: line-through;
    }


.pricing a img {
    padding: 20px;
    max-width: 100%;
    max-height: 100%;
}

.pricing .btn-wrap {
    padding: 20px 15px;
    text-align: center;
}

.pricing .btn2-wrap {
    padding: 9px 15px;
    text-align: center;
}

.pricing .btn-buy {
    background: #2184be;
    display: inline-block;
    padding: 8px 30px;
    border-radius: 4px;
    color: #fff;
    font-size: 13px;
    font-family: "Raleway", sans-serif;
    font-weight: 600;
    text-transform: uppercase;
}

.pricing .featured {
    background: #2184be;
    border-color: #2184be;
}

    .pricing .featured h3, .pricing .featured h4, .pricing .featured h4 span, .pricing .featured ul, .pricing .featured ul .na {
        color: #fff;
    }

    .pricing .featured .btn-buy {
        background: #fff;
        color: #2184be;
    }

.pricing .advanced {
    width: 200px;
    position: absolute;
    top: 18px;
    right: -68px;
    transform: rotate(45deg);
    z-index: 1;
    font-size: 14px;
    padding: 1px 0 3px 0;
    background: #2184be;
    color: #fff;
}

/*--------------------------------------------------------------
# Frequently Asked Questions
--------------------------------------------------------------*/
.faq {
    padding: 60px 0;
}

    .faq .faq-list {
        padding: 0;
        list-style: none;
    }

        .faq .faq-list li {
            padding: 0 0 20px 25px;
        }

        .faq .faq-list a {
            display: block;
            position: relative;
            font-family: #2184be;
            font-size: 18px;
            font-weight: 500;
        }

        .faq .faq-list i {
            font-size: 18px;
            position: absolute;
            left: -25px;
            top: 6px;
        }

        .faq .faq-list p {
            margin-bottom: 20px;
            font-size: 15px;
        }

        .faq .faq-list a.collapse {
            color: #2184be;
        }

        .faq .faq-list a.collapsed {
            color: #343a40;
        }

            .faq .faq-list a.collapsed:hover {
                color: #2184be;
            }

            .faq .faq-list a.collapsed i::before {
                content: "\eab2" !important;
            }

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
.contact {    
      position:relative;
}

    .contact .background {
        background-size: cover;
        background-repeat: no-repeat;
        background-color: rgba(0, 0, 0, 0);
        background-image: url('../img/home/contact-background.jpg');
        background-attachment: fixed;
        background-position: center center;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        width: 150%;
        height: 100%;
        left: -25%;
    }
        .contact .background .opacity-2 {
            background-color: rgba(255,255,255,0.4);
            width: 100%;
            height: 100%;
        }

    .contact .header {
        font-weight: bold;
        font-size: 28px;
        line-height: 40px;
    }

    .contact .frm {
        background: #fff;
        border-radius: 15px;
        padding: 25px;
        padding-top: 25px;
        text-align: left;
        -webkit-box-shadow: var(--shadow-box-blue);
        box-shadow: var(--shadow-box-blue);
    }

        .contact .frm .title {
            font-size: 22px;
            font-weight: 600;
        }

@media (min-width: 1200px) {
    .contact .frm {
        margin: 7%;
    }
}

/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
    padding: 15px 0;
    background: #f4f6f7;
    min-height: 40px;
    margin-top: 70px;
}

    .breadcrumbs h2 {
        font-size: 24px;
        font-weight: 600;
    }

    .breadcrumbs ol {
        display: flex;
        flex-wrap: wrap;
        list-style: none;
        padding: 0 0 10px 0;
        margin: 0;
        font-size: 14px;
    }

        .breadcrumbs ol li + li {
            padding-left: 10px;
        }

            .breadcrumbs ol li + li::before {
                display: inline-block;
                padding-right: 10px;
                color: #4c5c63;
                content: "/";
            }

/*--------------------------------------------------------------
# Portfolio Details
--------------------------------------------------------------*/
.portfolio-details .portfolio-details-container {
    position: relative;
}

.portfolio-details .portfolio-details-carousel {
    position: relative;
    z-index: 1;
}

    .portfolio-details .portfolio-details-carousel .owl-nav, .portfolio-details .portfolio-details-carousel .owl-dots {
        margin-top: 5px;
        text-align: left;
    }

    .portfolio-details .portfolio-details-carousel .owl-dot {
        display: inline-block;
        margin: 0 10px 0 0;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background-color: #ddd !important;
    }

        .portfolio-details .portfolio-details-carousel .owl-dot.active {
            background-color: #2184be !important;
        }

.portfolio-details .portfolio-info {
    padding: 30px;
    position: absolute;
    right: 0;
    bottom: -70px;
    background: #fff;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
    z-index: 2;
}

    .portfolio-details .portfolio-info h3 {
        font-size: 22px;
        font-weight: 700;
        margin-bottom: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid #eee;
    }

    .portfolio-details .portfolio-info ul {
        list-style: none;
        padding: 0;
        font-size: 15px;
    }

        .portfolio-details .portfolio-info ul li + li {
            margin-top: 10px;
        }

.portfolio-details .portfolio-description {
    padding-top: 50px;
}

    .portfolio-details .portfolio-description h2 {
        width: 50%;
        font-size: 26px;
        font-weight: 700;
        margin-bottom: 20px;
    }

    .portfolio-details .portfolio-description p {
        padding: 0 0 0 0;
    }

@media (max-width: 768px) {
    .portfolio-details .portfolio-info {
        position: static;
        margin-top: 30px;
    }
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
    background: #191919;
    padding: 0 0 0 0;
    color: #ffffff;
    font-size: 14px;
}

    #footer .footer-top {
        padding: 60px 0 30px 0;
        border-top: 2px solid #e9ecee;
    }

        #footer .footer-top .footer-info {
            margin-bottom: 30px;
        }

            #footer .footer-top .footer-info h3 {
                font-size: 24px;
                margin: 0 0 20px 0;
                padding: 2px 0 2px 0;
                line-height: 1;
                font-weight: 700;
            }

        #footer .footer-top ul {
            list-style: none;
            padding: 0;
            margin: 0;
            color: gray;
        }

            #footer .footer-top ul li {
                line-height: 30px;
            }

            #footer .footer-top ul, #footer .footer-top ul a {
                color: #aaaaaa;
            }

                #footer .footer-top ul svg {
                    margin-right: 8px;
                    height: 14px;
                    color: #b3b3b3;
                    font-size: 14px;
                }

                #footer .footer-top ul.doBg svg {
                    width: 6px;
                    background-color: rgba(170,170,170,0.15);
                }

                #footer .footer-top ul.doNotBg svg {
                    width: 14px;
                }

    #footer .footer-bottom {
        background: #252525;
    }

        #footer .footer-bottom .copyright {
            text-align: right;
            padding: 15px 0px 10px 0px;
            font-size: 12px;
            color: #aaaaaa;
        }

/*--------------------------------------------------------------
# Login Section
--------------------------------------------------------------*/
#login {
    width: 100%;
    background-image: url("../img/hero-bg.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right top;
    margin-top: 70px;
    padding: 60px 0;
    font-family: "Raleway", sans-serif;
}

    #login .img-login {
        background-image: url("../img/login2.jpg");
        background-position: center;
        background-size: cover;
    }

    #login .input-data {
        font-size: 1.2rem;
    }

    #login .check-remember {
        font-weight: 600;
        font-size: 1.2rem;
    }

        #login .check-remember:hover {
            cursor: pointer;
        }

    #login .btn-login {
        font-weight: 400;
        font-size: 1.2rem;
    }

    #login .a-label {
        font-size: 1.2rem;
    }

/*--------------------------------------------------------------
# Sign Up Section
--------------------------------------------------------------*/
#signUp {
    width: 100%;
    background-image: url("../img/hero-bg.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right top;
    margin-top: 70px;
    padding: 60px 0;
    font-family: "Raleway", sans-serif;
    font-style: italic;
}

    #signUp h3 {
        font-size: 32px;
        font-weight: 500;
    }

    #signUp h4 {
        font-size: 20px;
        font-weight: normal;
    }

    #signUp h5 {
        font-size: 16px;
        font-weight: normal;
    }

    #signUp a, #signUp p {
        font-size: 18px;
    }

    #signUp .textSignUp {
        margin-left: 10%;
        margin-right: 20%;
        text-align: center;
    }

    #signUp .img-login {
        background-image: url("../img/signup.jpg");
        background-position: center;
        background-size: cover;
        height: 70%;
        margin-top: 10%;
        margin-right: 10%;
    }

    #signUp .account {
        border-top: 1px solid gray;
        margin-top: 10px;
        text-align: right;
    }

/*--------------------------------------------------------------
# Notification for Request Section
--------------------------------------------------------------*/
#resume-notification {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

#notification-alert, cite {
    color: red;
}

#resume-notification > i {
    margin-top: 12px;
}

#resume-notification .tooltiptext {
    visibility: hidden;
    position: absolute;
    width: 295px;
    color: #555;
    text-align: left;
    padding: 5px 10px;
    font-size: 13px;
    text-size-adjust: auto;
    border-radius: 6px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s;
}

#resume-notification:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.tooltip-bottom {
    top: 135%;
    left: 80%;
    margin-left: -150px;
}

    .tooltip-bottom::after {
        content: "";
        position: absolute;
        bottom: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: transparent transparent #555 transparent;
    }


/*--------------------------------------------------------------
# Custom Reporting Section
--------------------------------------------------------------*/
#customReporting {
    width: 100%;
    margin-top: 85px;
    padding: 20px 0;
    font-family: "Raleway", sans-serif;
}

.container-expand {
    max-width: 80%;
    margin-right: auto;
    margin-left: auto;
}

#customReporting .steps > ul > li {
    width: 276px;
}

#customReporting .steps > ul {
    margin-top: 17px;
}

@media (max-width: 1700px) {
    #customReporting .container-expand {
        max-width: 80%;
    }
}

@media (max-width: 1450px) {
    #customReporting .container-expand {
        max-width: 85%;
    }
}

@media (max-width: 1230px) {
    #customReporting .container-expand {
        max-width: 90%;
    }

    #customReporting .steps > ul > li {
        width: 233px;
    }
}

@media (max-width: 992px) {
    #customReporting .container-expand {
        max-width: 93%;
    }

    #customReporting .steps > ul > li {
        width: 173px;
    }
}

@media (max-width: 768px) {
    #customReporting .steps > ul > li {
        width: 128px;
    }
}

#customReporting div.content.clearfix > section {
    padding-top: 0;
}

#customReporting h1 {
    margin: 0 0 20px 0;
    font-size: 36px;
    font-weight: 600;
    line-height: 56px;
    color: #576971;
}

#customReporting h2 {
    font-size: 24px;
    font-weight: 600;
    line-height: 56px;
    color: #576971;
}

#customReporting h3 {
    font-size: 18px;
    font-weight: 600;
    color: #576971;    
}

#customReporting .portfolio-item h3 {
    z-index: 5;
    position: relative;
    margin: 15px 0px -50px 0px;
}

@media (min-width: 768px) and (max-width: 991px) {
    #customReporting .portfolio-item h3 {
        margin: 15px 0px -60px 0px;
    }
}

#customReporting h4 {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 600;
    color: #576971;
}

#customReporting .h2-5 {
    font-size: 20px;
    font-weight: 900;
}

#customReporting .modal-title {
    margin-bottom: 0 !important;
}

#customReporting .checkSelectedReport {
    color: #2184BE;
    font-size: 30px;
    text-shadow: 0 0 #7185bb, 0 0 #7185bb, 3px 0 #7185bb, 0 0 #7185bb;
    transform: scale(1,1.3);
    display: none;
    position: absolute;
    top: -2px;
    right: 10px;
}

#customReporting .checkSelectedOptionReport {
    color: #2184BE;
    font-size: 30px;
    text-shadow: 0 0 #7185bb, 0 0 #7185bb, 3px 0 #7185bb, 0 0 #7185bb;
    transform: scale(1,1.3);
    display: none;
    position: absolute;
    top: -2px;
    right: 10px;
}
#customReporting .textArea {
    height: 500px;
}

#customReporting .searchButton {
    background-color: #2184be;
}

#customReporting .reportsFlex {
    display: flex;
    justify-content: space-between;
}

#customReporting .close:hover {
    cursor: pointer;
}

#clear-report-content, #clear-report-content-Model, #clear-report-content-OData {
    visibility: hidden;
    color: white;
}

#button-clear-report:hover, #button-clear-report-Model:hover, #button-clear-report-OData:hover {
    background-color: #bd2130;
}

/* Custom Reporting */
#customReporting .portfolio-item {
    margin-bottom: 50px;
}

    #customReporting .portfolio-item .text-justify {
        margin-top: -50px;
        position: relative;
        z-index: 4;
    }

    @media (min-width: 768px) and (max-width: 991px) {
        #customReporting .portfolio-item .text-justify {
            margin-top: -70px;
        }
    }

    #customReporting .portfolio-wrap {
        transition: 0.3s;
        position: relative;
        overflow: hidden;
        z-index: 1;
    }

    #customReporting .portfolio-wrap .img-fluid {
        max-width: 95%;
    }

    #customReporting .portfolio-wrap::before {
        content: "";
        background: rgba(255, 255, 255, 0.7);
        position: absolute;
        left: 30px;
        right: 30px;
        top: 30px;
        bottom: 30px;
        transition: all ease-in-out 0.3s;
        z-index: 2;
        opacity: 0;
    }

    #customReporting .portfolio-wrap .portfolio-info {
        opacity: 0;
        position: absolute;
        top: 10%;
        left: 0;
        right: 0;
        text-align: center;
        z-index: 3;
        transition: all ease-in-out 0.3s;
    }

        #customReporting .portfolio-wrap .portfolio-info h4 {
            font-size: 20px;
            color: #364146;
            font-weight: 600;
        }

        #customReporting .portfolio-wrap .portfolio-info p {
            color: #364146;
            font-size: 14px;
        }

    #customReporting .portfolio-wrap .portfolio-links {
        opacity: 0;
        left: 0;
        right: 0;
        bottom: 10%;
        text-align: center;
        z-index: 3;
        position: absolute;
        transition: all ease-in-out 0.3s;
    }

    #customReporting .portfolio-wrap .portfolio-message {
        opacity: 0;
        left: 0;
        right: 0;
        bottom: 30%;
        text-align: center;
        z-index: 3;
        position: absolute;
        transition: all ease-in-out 0.3s;
    }

    #customReporting .portfolio-wrap:hover::before {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 1;
    }

    #customReporting .portfolio-wrap:hover .portfolio-info {
        opacity: 1;
        top: calc(50% - 48px);
    }

    #customReporting .portfolio-wrap:hover .portfolio-links {
        opacity: 1;
        bottom: calc(40%);
    }

    #customReporting .portfolio-wrap:hover .portfolio-message {
        opacity: 1;
    }

#customReporting .tab-content,
#customReporting .summaryList-content,
#customReporting #stepChartType,
#customReporting .selectedChartCustomizationContainer {
    padding-bottom: 85px;
    margin-top: 3px;
}

#customReporting .accessTypeContent .reportCard {
    padding: 30px;
    background: #fff;
    border: 1px solid #eee;
    border-top: 2px solid #2168d1;
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
    position: relative;
    top: 0;
}

    #customReporting .accessTypeContent .reportCard.selected {
        background-color: #dce9fc;
        -webkit-box-shadow: 0px 0px 16px 1px hsl(212deg 100% 73.78%);
        box-shadow: 0px 0px 16px 1px hsl(212deg 100% 73.78%);
    }

    #customReporting .accessTypeContent .reportCard:hover {
        background-color: #dce9fc;
        cursor: pointer;
        -webkit-box-shadow: 0px 0px 10px 2px hsl(212deg 100% 50%);
        box-shadow: 0px 0px 12px 2px hsl(212deg 100% 50%);
    }

#customReporting .accessTypeContent .checkSelectedOptionReport {
    color: #2184BE;
    display: inline;
}

#customReporting .v-stepper .v-stepper-header button.v-stepper-item:focus {
    outline:none;
}

#customReporting .v-stepper .v-stepper-header hr {
    border-color: inherit;
}

#customReporting .v-stepper input{
    border: none;
}

#customReporting .v-stepper input:focus {
    border: none;
}

#customReporting .wizard > .content > .body label {
    margin: 0;
    display: inherit;
}

a.customRequest {
    border-radius: 50px;
    background: #2184be;
    display: inline-block;
    line-height: 0;
    padding: 20px;
    color: #fff;
    font-size: .75rem;
    letter-spacing: .1rem;
    font-weight: 900;
    position: relative;
    text-transform: uppercase;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}

    a.customRequest:after {
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease;
        position: absolute;
        content: "\F061";
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        font-family: "Font Awesome 5 Free";
        right: 0;
        opacity: 0;
        visibility: hidden;
        padding-right: 15px;
    }

    a.customRequest:hover {
        padding-right: 50px;
        cursor: pointer;
        color: #fff;
    }

        a.customRequest:hover:after {
            opacity: 1;
            visibility: visible;
        }
/*
    Source Step - Excel
*/
@media (min-width: 576px) {
    .modal-dialog {
        max-width: fit-content;
    }
}

/* Custom Report Dashboard Steps Section */
#customReporting .imgColoring {
    width: 40px;
    margin-bottom: 0.5rem;
    margin-left: 1rem;
}

#customReporting .textRadio {
    font-size: 14px;
    font-weight: 600;
    margin-left: 1rem;
}

#stepChartType .chartTypeList a {
    border-radius: 50px;
    background: #2184be;
    display: inline-block;
    line-height: 0;
    padding: 18px;
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    position: relative;
    text-transform: uppercase;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}

    #stepChartType .chartTypeList a:after {
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease;
        position: absolute;
        content: "\F067";
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        font-family: "Font Awesome 5 Free";
        right: 0;
        opacity: 0;
        visibility: hidden;
        padding-right: 20px;
    }

    #stepChartType .chartTypeList a:hover {
        padding-right: 40px;
        cursor: pointer;
    }

        #stepChartType .chartTypeList a:hover:after {
            opacity: 1;
            visibility: visible;
        }

/*--------------------------------------------------------------
# Report Library Section
--------------------------------------------------------------*/
#reportLibrary {
    width: 100%;
    margin-top: 85px;
    padding: 20px 0;
    font-family: "Raleway", sans-serif;
}

    #reportLibrary h1 {
        margin: 0 0 20px 0;
        font-size: 36px;
        font-weight: 600;
        line-height: 56px;
        color: #576971;
    }

    #reportLibrary .searchButton {
        background-color: #2184be;
    }

.myReports {
    padding: 1.5em 0;
}

@media (min-width: 768px) {
    .myReports {
        padding: 2.5em 0;
    }
}

.myReportOptions .reportCard {
    padding: 30px;
    background: #fff;
    border: 1px solid #eee;
    border-top: 2px solid #0d741c;
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
    position: relative;
    top: 0;
}

    .myReportOptions .reportCard:hover, .reportCard:focus {
        -webkit-box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.4);
        box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.4);
        border: 1px solid transparent;
        border-top: 2px solid #0d741c;
        cursor: pointer;
        top: -2px;
    }
.myReports .reportCard {
    padding: 30px;
    background: #fff;
    border: 1px solid #eee;
    border-top: 2px solid #bd1220;
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
    position: relative;
    top: 0;
}

    .myReports .reportCard:hover, .reportCard:focus {
        -webkit-box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.4);
        box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.4);
        border: 1px solid transparent;
        border-top: 2px solid #bd1220;
        cursor: pointer;
        top: -2px;
    }

    .myReports .reportCard *:last-child {
        margin-bottom: 0;
    }

    #customReporting .myReports .reportCard h3, .myReports .reportCard h3 {
        font-size: 1rem;
        color: #000;
    }

    .myReports .reportCard p {
        color: #999999;
        font-size: .85rem;
    }

.myReports .openReport {
    position: relative;
    padding-right: 20px;
    text-transform: uppercase;
    font-size: .75rem;
    letter-spacing: .1rem;
    font-weight: 900;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}

    .myReports .openReport:after {
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease;
        position: absolute;
        content: "\F061";
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        font-family: "Font Awesome 5 Free";
        right: 0;
        opacity: 0;
        visibility: hidden;
    }

    .myReports .openReport:hover {
        padding-right: 30px;
    }

        .myReports .openReport:hover:after {
            opacity: 1;
            visibility: visible;
        }

/*--------------------------------------------------------------
# Columns Section
--------------------------------------------------------------*/
.columnsAndFiltersContainer {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: visible;
}

    .columnsAndFiltersContainer i.fas {
        font-size: 30px;
        position: absolute;
        right: 10px;
        top: 10px;
        cursor: pointer;
    }

.columnsAndFiltersTabContent .form-group, .columnsSelectedTabContent .form-group, .chart-properties .form-check {
    border: 1px solid #c5c5c5;
    background: #f6f6f6;
    margin: 0;
}

    .columnsAndFiltersTabContent .form-group .indexColumn, .columnsSelectedTabContent .form-group .indexColumn {
        display: inline-block;
        min-width: 30px;
        text-align: center;
    }

    .columnsSelectedTabContent .form-group .indexColumn {
        color: #6c757d;
    }

.columnsAndFiltersTabContent .form-check, .columnsSelectedTabContent .form-check, .chart-properties .form-check {
    padding-left: 0.75rem;
    padding-top: 0.25rem;
}

    .columnsAndFiltersTabContent .form-check:hover, .columnsSelectedTabContent .form-check:hover, .chart-properties .form-check:hover {
        border: 1px solid #cccccc;
        background: #ededed;
        font-weight: normal;
        color: #2b2b2b;
    }

.columnsAndFiltersTabContent .form-check-input,
.columnsSelectedTabContent .form-check-input,
.axisPanels .form-check-input{
    position: relative;
    width: 15px;
    height: 15px;
    margin: 0px 8px 0px 8px;
    top: 2px;
}

.columnsAndFiltersTabContent .report-name {
    background-color: #b1b1b1;
}

    .columnsAndFiltersTabContent .report-name:hover {
        background-color: #b1b1b1;
        cursor: none;
    }

.columnsGroupByContainer {
}
    .columnsGroupByContainer .columnsGroupByTabContent {
        position: relative;
    }

    .columnsGroupByContainer .groupBy,
    .columnsGroupByContainer .groupByChecks .totalFunctionItem,
    .columnsGroupByContainer .groupFunction,
    .columnsGroupByContainer .totalFunction,
    .columnsGroupByContainer .totalFunctionChecks .totalFunctionItem,
    .columnsGroupByContainer .orderByFunction,
    .columnsGroupByContainer .orderByFunctionChecks .orderByFunctionItem,
    .ColsGroupBySummaryContainer .groupBy,
    .ColsGroupBySummaryContainer .groupFunction,
    .ColsGroupBySummaryContainer .totalFunction,
    .ColsGroupBySummaryContainer .totalFunctionChecks .totalFunctionItem,
    .ColsGroupBySummaryContainer .orderByFunction,
    .ColsGroupBySummaryContainer .orderByFunctionChecks .orderByFunctionItem {
        position: relative;
        text-align: center;
    }

        .columnsGroupByContainer .groupBy span,
        .columnsGroupByContainer .orderByFunction span,
        .ColsGroupBySummaryContainer .groupBy span,
        .ColsGroupBySummaryContainer .orderByFunction span {
            padding-right: 10px;
        }

        .columnsGroupByContainer .groupBy .form-check,
        .columnsGroupByContainer .orderByFunction .form-check,
        .ColsGroupBySummaryContainer .groupBy .form-check,
        .ColsGroupBySummaryContainer .orderByFunction .form-check {
            display: inline-grid;
        }

    .columnsGroupByContainer .groupByChecks .totalFunctionItemLabel,
    .columnsGroupByContainer .totalFunctionChecks .totalFunctionItemLabel,
    .ColsGroupBySummaryContainer .totalFunctionChecks .totalFunctionItemLabel {
        margin-left: 5px;
    }

    .columnsGroupByContainer .group-by-columns,
    .groupBySummaryContainer .group-by-columns {
        /*width:50%*/
    }
    .columnsGroupByContainer .group-by-gb,
    .groupBySummaryContainer .group-by-gb {
        width: 15%
    }
    .columnsGroupByContainer .group-by-gf,
    .groupBySummaryContainer .group-by-gf {
        width: 17%
    }
    .columnsGroupByContainer .group-by-tf,
    .groupBySummaryContainer .group-by-tf {
        width: 17%
    }
    .columnsGroupByContainer .group-by-ob,
    .groupBySummaryContainer .group-by-ob {
        width: 17%
    }

    .columnsGroupByContainer .table td,
    .groupBySummaryContainer .table td{
        border: 0;
    }

    .columnsGroupByContainer .table tr,
    .groupBySummaryContainer .table tr{
        border-bottom: 1px solid #dee2e6;
    }

    .columnsGroupByContainer .spinnerContent {
        border: 1px solid red;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #d7d7d7;
        opacity: 0.1;
        z-index: 5;
        cursor: not-allowed;
        border-radius: 10px;
    }

    .columnsGroupByContainer thead.flotante {
        position: sticky;
        top: 85px;
        background-color: #f4f4f4ff;
        z-index: 1;
    }

.groupBySummaryContainer .table {
}

.wizard > .content > .body .columnsAndFiltersTabContent label, .wizard > .content > .body .chart-properties label {
    margin-bottom: 0.2em;
}

.wizard > .content > .body .columnsAndFiltersContainer ul {
    list-style: none !important;
}

.unorder-list > li {
    list-style-type: disc;
}

.tab-space {
    margin-top: 1.25em;
}

html .modal{
    background-color: #8f8f8f17;
    opacity: 0.94;
}

    html .modal .modal-content {
        background-color: #ffffff;
    }

#myModalCancel #myModalCancelError {
    width: 100%;
}

/*--------------------------------------------------------------
# Filter Section
--------------------------------------------------------------*/
.filterContainer {
    /*position: absolute;
    width: 100%;
    height: 100%;
    overflow: auto;*/
}

    .filterContainer i.fas {
        cursor: pointer;
    }

.filterTabContent .form-group {
    border: 1px solid #c5c5c5;
    background: #f6f6f6;
    margin: 0;
}

.filterTabContent .form-check {
    padding-left: 1.95rem;
    padding-top: 0.25rem;
}

    .filterTabContent .form-check:hover {
        border: 1px solid #cccccc;
        background: #ededed;
        font-weight: normal;
        color: #2b2b2b;
    }

.filterTabContent .form-check-input {
    width: 15px;
    height: 15px;
}

.filterTabContent .report-name {
    background-color: #b1b1b1;
}

    .filterTabContent .report-name:hover {
        background-color: #b1b1b1;
        cursor: none;
    }

.wizard > .content > .body .filterTabContent label {
    margin-bottom: 0.2em;
}

.wizard > .content > .body .filterContainer ul {
    list-style: none !important;
}

/*Chart Type Carousel*/
.chartTypeList {
    padding: 1rem 0;
}

.chartTypeList .owl-dots {
    margin-top: 5px;
    text-align: center;
}

.chartTypeList .owl-dot {
    display: inline-block;
    margin: 0 5px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #ddd !important;
}

    .chartTypeList .owl-dot.active {
        background-color: #2184be !important;
    }

@media (max-width: 767px) {
    .chartTypeList {
        margin: 30px 10px;
    }
}

.selectedChartTypeContainer a {
    cursor: pointer;
}

/*Chart customization*/
.selectedChartCustomizationContainer .SelectedChartRow .row {
    cursor: pointer;
}

    .SelectedChartRow .row:hover {
        background-color: #d3d3d3;
    }

    .SelectedChartRow .custom-file-label {
        padding-right: 3.85rem;
    }

    .SelectedChartRow .custom-file-label, .SelectedChartRow .custom-file-label::after {
        height: auto;
    }

        .SelectedChartRow .custom-file-label::after {
            display: flex;
            align-items: center;
            padding: .375rem 0.35rem;
        }

.selectedChartCustomizationContainer .nav-pills {
    border-bottom: 1px solid var(--blue-dreveal);
    background-color: #fff;
}

    .selectedChartCustomizationContainer .nav-pills .nav-link.active {
        background-color: initial;
        color: var(--blue-dreveal);
        font-weight: 500;
        border-bottom: 3px solid var(--blue-dreveal);
        border-radius: unset;
    }

.colorsButton {
    width: 80px;
    height: 30px;
    border: 1px solid gray;
    border-radius: 5px;
    margin-bottom: 5px;
    cursor: pointer;
}

.displayNone {
    display: none;
}

.showMoreContainer {
    text-align: right;
    font-weight: bold;
    font-size: 0.75rem;
}

.showMoreContainer2 {
    text-align: right;
    font-weight: bold;
    font-size: 0.75rem;
}

.btnDeleteFile {
    display: none;
    position: absolute;
    font-size: 25px;
    top: 7px;
    right: -29px;
    cursor: pointer;
}

.custom-reporting .SelectedChartRow ul.nav-tabs {
    list-style: none !important;
}

.chartCustomizationSpinner {
    text-align: center;
}

.allowedFiles {
    font-size: 0.9rem;
}

.axisPanels .form-check-input,
.axisPanels .form-check-label {
    cursor: pointer;
}

.axisPanels .SelectAllAxis,
.axisPanels .SelectAllAxis:hover{
    display: inline-block;
    padding-right: 5px;
    background: transparent;
    border: none;
}

/*--------------------------------------------------------------
# My Request Section
--------------------------------------------------------------*/
#myRequest {
    width: 100%;
    margin-top: 85px;
    padding: 20px 0;
    font-family: "Raleway", sans-serif;
}

    #myRequest h1 {
        margin: 0 0 20px 0;
        font-size: 36px;
        font-weight: 600;
        line-height: 56px;
        color: #576971;
    }

.mainBody .disabledDownload {
    color: #8b8989;
    border-color: #8b8989;
    cursor: not-allowed;
}

#customReporting .dx-row {
    font-family: "Raleway", sans-serif !important;
}

#customReporting .dx-texteditor-input {
    font-family: "Raleway", sans-serif !important;
}

#customReporting .dx-item-content {
    font-family: "Raleway", sans-serif !important;
}

/*--------------------------------------------------------------
# Request detail
--------------------------------------------------------------*/
#requestDetail {
    margin-top: 85px;
    padding: 20px 0;
    font-family: "Raleway", sans-serif;
}

    #requestDetail h1 {
        margin: 0 0 20px 0;
        font-size: 36px;
        font-weight: 600;
        line-height: 56px;
        color: #576971;
    }

    #requestDetail .header {
        padding: 15px;
    }

    #requestDetail .img-card {
        float: left;
        width: 120px;
    }

    #requestDetail hr {
        clear:both;
    }

/*--------------------------------------------------------------
# Subscription
--------------------------------------------------------------*/
#subscription {
    margin-top: 70px;
    padding: 60px 0;
    font-family: "Raleway", sans-serif;
}

    #subscription .container {
        background-color: #fff;
    }

.subscription .box {
    padding: 20px;
    background: #fff;
    text-align: center;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
    border: 2px solid #e9ecee;
    font-family: "Raleway", sans-serif;
}

.subscription h3 {
    font-weight: 400;
    padding: 20px 15px;
    font-size: 18px;
    font-weight: 400;
    color: #777777;
}

.subscription h4 {
    font-size: 36px;
    color: #2184be;
    font-weight: 600;
    margin-bottom: 20px;
}

    .subscription h4 sup {
        font-size: 20px;
        top: -15px;
        left: -3px;
    }

    .subscription h4 span {
        color: #bababa;
        font-size: 16px;
        font-weight: 300;
    }

.subscription h5 {
    padding: 16px 12px;
    text-align: left;
    line-height: 20px;
    font-size: 14px;
    margin-bottom: 0;
}

.subscription ul {
    padding: 0;
    list-style: none;
    color: #444444;
    text-align: left;
    line-height: 20px;
    font-size: 14px;
    margin-bottom: 0;
}

    .subscription ul li {
        padding-bottom: 16px;
    }

    .subscription ul i {
        color: #2184be;
        font-size: 18px;
        padding-right: 4px;
    }

    .subscription ul .na {
        color: #ccc;
        text-decoration: line-through;
    }


.subscription a img {
    padding: 20px;
    max-width: 100%;
    max-height: 100%;
}

.subscription .btn-wrap {
    padding: 20px 15px;
    text-align: center;
}

.subscription .btn2-wrap {
    padding: 9px 15px;
    text-align: center;
}

.subscription .btn-buy {
    background: #2184be;
    display: inline-block;
    padding: 8px 30px;
    border-radius: 4px;
    color: #fff;
    font-size: 13px;
    font-family: "Raleway", sans-serif;
    font-weight: 600;
    text-transform: uppercase;
}

.subscription .featured {
    background: #2184be;
    border-color: #2184be;
}

    .subscription .featured h3, .subscription .featured h4, .subscription .featured h4 span, .subscription .featured ul, .subscription .featured ul .na {
        color: #fff;
    }

    .subscription .featured .btn-buy {
        background: #fff;
        color: #2184be;
    }

.subscription .advanced {
    width: 200px;
    position: absolute;
    top: 18px;
    right: -68px;
    transform: rotate(45deg);
    z-index: 1;
    font-size: 14px;
    padding: 1px 0 3px 0;
    background: #2184be;
    color: #fff;
}

/*--------------------------------------------------------------
# Class
--------------------------------------------------------------*/
.search-content {
    width: 300px;
    display: flex;
    white-space: nowrap;
    margin-bottom: 0;
}

    .search-content > i {
        font-size: 20px;
    }

.input-text {
    background-color: #ffffff !important;
    font-size: 13pt;
    width: 90%;
}

.search-button {
    font-size: 16px;
    text-align: left;
    background-color: #ffffff;
}

.enter-section {
    margin-left: 1%;
    margin-bottom: 10px;
    width: 80% !important;
    padding: 8px !important;
}

.content-base-model, .content-base-oData {
    display: none;
}

.content-version {
    display: none;
    padding-bottom: 9%;
}

.word-counter {
    font-size: 15px;
    text-align: right;
}

.word-counter-modal {
    font-size: 15px;
    text-align: right;
}

.link {
    font-weight: bold;
}

.pointerEventsNone {
    pointer-events: none;
    opacity: 0.65;
}

.pointerEventsAll {
    pointer-events: all;
    opacity: 1;
}

.box-color {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    width: 20px;
    height: 20px
}

.type-tag {
    background: #e4f2fa;
    padding: 0.25rem 0.5rem 0.25rem 0.5rem;
}

/*Documentation*/
.files-inline {
    display: inline-grid;
}

.clear-document-inline {
    float: right;
    margin-top: -0.5em;
}

.documentationImage {
    text-decoration: underline;
}

.documentationImage:hover {
    text-decoration: none;
}

.documentationSpan {
    color: #f00;
}

/*Summary*/
.summaryList-content > li {
    list-style: none;
}

    .summaryList-content > li > label {
        font-weight: normal;
        font-size: 20px;
    }

        .summaryList-content > li > label > i {
            margin: 5px;
            /*color: #28a745;*/
            color: #585858;
            padding-left: 0px;
        }

.paragraphSummary-section, .paragraphSummary-section > li {
    font-size: 17px;
    margin-bottom: 12px;
    margin-left: 40px;
}

.card-summary {
    min-width: 94%;
    padding: 30px;
    margin-left: 50px;
    margin-top: 20px;
    border: 1px solid #d7d7d7;
    border-top: 2px solid #bd1220;
    position: relative;
}

.img-card-summary {
    float: left;
    margin-right: 30px;
}

    .img-card-summary img {
        height: 120px;
        width: 120px;
    }

.text-card-summary {
    overflow: hidden;
}

    .text-card-summary .row {
        margin-right: 0;
        margin-left: 0;
    }

#chartTypeName {
    text-align: center;
    font-weight: bolder;
    border-bottom: 2px solid #bd1220;
}

/*Summary Tooltip*/
.resume-tooltip {
    border-bottom: 1px dotted black;
    cursor: pointer;
    position: relative;
}

.tooltip-summary .tooltiptext-summary {
    visibility: hidden;
    background-color: #19692c;
    color: #fff;
    border-radius: 6px;
    padding: 5px 10px;
    margin-left: 10px;
    font-size: 12px;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    min-width: 380px;
}

.tooltip-summary:hover .tooltiptext-summary {
    visibility: visible;
}

/*Finish*/
.classification > span > img {
    display: block;
    margin: auto
}

.classification > p {
    font-weight: bold;
    font-size: 20px;
    text-align: center;
}

.classification-content {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
}

.dReveal-img {
    display: block;
    margin: auto
}

.inlineElements {
    display: flex;
    justify-content: flex-start;
}

.uploadFile {
    cursor: pointer;
    font-weight: 600;
}

.btn-primary {
    background: #2184be;
}

    .btn-primary:hover {
        background-color: #196693;
    }
/*--------------------------------------------------------------
# Agent
--------------------------------------------------------------*/
.Agent {
    margin-top: 75px;
}

.status-icon img {
    width: 15px;
    margin-right: 3px;
    margin-top: -3px;
}

/*Custom Request dataExchange*/
#customReporting-wizard > div.content.clearfix {
    min-height: 38em !important;
}

.wizard {
    overflow: initial;
}

.wizard > .steps a {
    position:relative;
}

.wizard > .steps a:hover, 
.wizard > .steps .done a:hover, 
.wizard > .steps .current a:hover {
    background: transparent;
    color: #2184be;
    font-weight: 600;
}

.wizard > .steps a.fullData:hover, .wizard > 
.steps .done a.fullData:hover, 
.wizard > .steps .current a.fullData:hover {
    background: #28a745;
    color: #ffffff;
    font-weight: 600;
}

    .wizard > .steps .current a,
    .wizard > .steps .current a:active {
        font-weight: 500;
        background: transparent;
        color: #2184be;
        -webkit-box-shadow: 0px 0px 10px 2px hsl(212deg 100% 50%);
        box-shadow: 0px 0px 12px 2px hsl(212deg 100% 50%);
    }

    .wizard > .steps .current a:hover {
        font-weight: 500;
    }

.wizard .steps a.fullData {
    background-color: #28a745;
    color: #ffffff;
}

.wizard > .content > .body ul {
list-style: none !important;
}

    .wizard .actions {
        z-index:1045;
    }

.requiredFieldSpan {
    color: #f00;
    font-weight: bolder;
    position: absolute;
    width: 20px;
    height: 20px;
    /* background-color: blue; */
    top: 0px;
    right: 0px;
    font-size: 45px;
    font-weight: bold;
    padding: 17px 0 0 2px;
    margin: 0;
    line-height: 10px;
    border-radius: 10px;
}

    .requiredFieldSpan:hover {
        background-color: #ffdada;
    }

/*----------------------------------------------
#Form register
----------------------------------------------*/

.mainIdentity {
    display: flex;
    align-items: center;
    /*height: 100vh;*/
    margin: 55px auto;
}

.mainIdentity.confirmation {
    display: flex;
    align-items: center;
    height: 100vh;
    margin: 0 auto;
}
    .mainIdentity.confirmation .container {
        /*margin-top: 85px;*/
    }

    .mainIdentity .row {
        background-color: #fff;
        border-radius: 10px;
        align-items: center;
        padding: 70px 50px;        
    }

    .mainIdentity .image img {
        width: 150px;
    }

    .mainIdentity .title {
        font-size: 61px;
        font-weight: 600;
        margin: 35px 0;
        line-height: initial;
        color: var(--register-black);
    }

    .mainIdentity .detail {
        font-size: 24px;
        font-weight: 500;
    }

    .mainIdentity .header {
        font-size: 2rem;
        font-weight: 700;
        margin-bottom: 2rem;
        color: var(--register-black);
    }

    .mainIdentity .message {

    }

    .mainIdentity .right {
        padding: 25px 15px;
    }

.form-group-identity label {
    color: #333;
}

.form-control-identity {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    border: 2px solid #777;
    border-radius: 5px;
}

.divider-regiter {
    border-top: 2px solid #767676;
    margin: 20px 50px;
}

.form-label-identity {
    /*color: #ff0000 !important;*/
}

.form-label-identity::after {
    content: " *";
    font-size: 26px;
    /*color: #ff0000;*/ 
}

.password-container {
    position: relative;
}

.password-input {
    padding-right: 30px; /* Ajusta el espacio para el icono */
}

.toggle-password {
    position: absolute;
    top: 43%;
    right: 3px;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 1;
    background: white;
    border: none;
}

@media (max-width: 991px) {
    .mainIdentity {
        max-width:inherit;
    }

    .mainIdentity .row {
        padding: 40px;
    }

    .mainIdentity .title {
        font-size: 45px;
        margin: 35px 0;
    }

    .mainIdentity .detail {
        font-size: 22px;
    }
}

@media (max-width: 765px) {

    .mainIdentity .row {
        padding: 30px;
    }
}

@media (min-width: 992px) {

    .mainIdentity.confirmation .title {
        font-size: 52px;
        margin: 32px 0;
    }

    .mainIdentity.confirmation .detail {
        font-size: 25px;
    }
}

@media (min-width: 1200px) {
    .mainIdentity .container {
        max-width: 1050px;
    }
}

.tooltip-inner {
    background-color: #2184be;
}

.bs-tooltip-bottom .arrow::before {
    border-bottom-color: #2184be;
}

.bs-tooltip-top .arrow::before {
    border-top-color: #2184be;
}



/*----------------------------------------------
#Form register
----------------------------------------------*/
.mainMyAccount{
    margin: 0;
}

    .mainMyAccount .row{
        background-color: initial;
        justify-content: center;
    }

        .mainMyAccount .row .center {
            background-color: #fff;
            padding: 20px 40px;
            border-radius: 10px;
            -webkit-box-shadow: var(--shadow-box-blue);
            box-shadow: var(--shadow-box-blue);
        }

    .mainMyAccount input[readonly="readonly"] {
        background-color: #e5e5e5;
        border: 1px solid #777;
        cursor: no-drop;
    }

    .mainMyAccount .text-danger {
        font-weight: 600;
    }

    .mainMyAccount .positive {
        color: var(--green-dreveal);
    }

/*----------------------------------------------
#Form FileUpload
----------------------------------------------*/
.mainFileUpload {
    /*margin: 0;*/
}

    .mainFileUpload .row {
        background-color: initial;
        justify-content: center;
    }

        .mainFileUpload .row .center {
            background-color: #fff;
            padding: 20px 40px;
            border-radius: 10px;
            -webkit-box-shadow: var(--shadow-box-blue);
            box-shadow: var(--shadow-box-blue);
        }

    .mainFileUpload input[readonly="readonly"] {
        background-color: #e5e5e5;
        border: 1px solid #777;
        cursor: no-drop;
    }

    .mainFileUpload .text-danger {
        font-weight: 600;
    }

    .mainFileUpload .positive {
        color: var(--green-dreveal);
    }

/*----------------------------------------------
#ThankYou page
----------------------------------------------*/
.thankYouContainer{
    margin-top: 23%
}

    .thankYouContainer .row {
        border-radius: 10px;
        box-shadow: var(--shadow-box-blue);
        align-items: center;
        padding: 35px;
    }

    .thankYouContainer .title {
        font-size: 2rem;
        font-weight: 700;
    }

    .thankYouContainer .body {
        font-size: 1.3rem;
        text-align: justify;
    }

    .thankYouContainer a {
        color:#fff;
    }

        .thankYouContainer a:hover {
            text-decoration: underline;
        }

    .thankYouContainer img {
        width: 100%;
    }

@media (min-width: 576px) {
    .thankYouContainer {
        margin-top: 19%
    }
}

@media (min-width: 768px) {
    .thankYouContainer {
        margin-top: 17%
    }
}

@media (min-width: 992px) {
    .thankYouContainer {
        margin-top: 15%
    }
}

@media (min-width: 1200px) {
    .thankYouContainer {
        margin-top: 13%
    }
}

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

a:focus {
    color: var(--blue-dreveal);
    text-decoration:underline;
}

    a:focus > img {
        box-shadow: var(--shadow-focus-blue-dreveal);
        border-radius: 5px;
    }

    a:focus .sidebar-title,
    #sidebar-wrapper .sidebar-nav li a:focus {
        color: var(--blue-dreveal);
    }

.form-check input[type="radio"]:focus {
    box-shadow: 1px 1px 3px #2e74b5, -1px -1px 3px #2e74b5;
    outline: 0px solid #2e74b5;
}

.nav-pills .nav-link:focus {
    box-shadow: var(--shadow-focus-blue-dreveal);
}