/*.modal {
    display: none;
    position: fixed;
    padding-top: 140px;
    margin: auto;
    width: 52%;
    height: 65% !important;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: #9BA1AD;
    overflow-y: auto !important;
    border-radius: 5%;
}*/
.header-menu .toggle-item .image {
  
    background-color: white;
    -webkit-mask: url('../image/double.svg') no-repeat center;
    mask: url('../image/double.svg') no-repeat center;
}

.header-menu .toggle-item.checked .image {
    background-color: white;
    -webkit-mask: url('../image/double-close.svg') no-repeat center;
    mask: url('../image/double-close.svg') no-repeat center;
}

.talk {
    text-align: left;
    margin: -7% auto;
}
.dxtvControl_Moderno .dxtv-subnd {
    margin-left: 3px !important;
}
.close {
    position: absolute;
    top: 10%;
    right: 6%;
    color: #F5F5F5 !important;
    font-size: 40px !important;
    font-weight: bold;
    transition: 0.3s;
    text-shadow: unset !important;
    filter: unset !important;
    opacity: unset !important;
}

.usabilla_live_button_container {
    z-index: 999;
    right: 0;
    top: 60%;
    margin-top: -45px;
    width: 30px;
    height: 90px;
    position: fixed;
}
a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
}


.logo {
    width: 120px;
    margin: 0px 0 0 -79px;
}
.center {
    text-align: center;
}

/*.fixed-top {
    position: fixed;
}*/
.content-wrapper {
        position: relative;
        margin-right: auto;
    }

   /* .container-fluid {
       margin:auto;
    }*/


img.small, img.small:visited {
    display: block;
    width: 50px;
    height: 40px;
    text-decoration: none;
}
.footer {
    position: fixed;
    left: 0;
    bottom: -11px;
    width: 100%;
    background-color: white !important;
    color: #979797;
    text-align: right;
    font-size: 11px;
}
    .footer ul {
        display: inline-block;
        font-size: 20px ;
        background-color: white !important;
    }




#img.small:hover {
    text-decoration: none;
}

#img .large {
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border: 0;
    top: 0;
    left: 0;
    -webkit-border-radius: 90px;
    -moz-border-radius: 90px;
    border-radius: 90px;
}
.UploadControl {
    width: 150px !important;
    height: 150px !important;
    -webkit-border-radius: 75px !important;
    -moz-border-radius: 75px !important;
    border-radius: 75px !important;
}
.edit {
    /* image */
    list-style: url('../image/edit_icon_k6A_icon.ico') inside !important ;
    /* position */
    list-style: inside;
}
#img.small:hover .large {
    display: block;
    position: absolute;
    top: 90px;
    left: 1150px;
    width: 200px;
    height: 200px;
}
    @media (max-width:820px) {
       

        .logo {
            width: 120px;
            margin: auto;
        }

       
    }

    
.small-img {
    -webkit-border-radius: 90px;
    -moz-border-radius: 90px;
    border-radius: 90px;
    width:40px;
    height:40px;
}
    @media (min-width: 995px) {
        .top-menu {
            display: none;
        }

        .top-auth-menu {
            display: none;
        }

        .navbar-light .navbar-toggler {
            display: none;
        }

        .navbar-toggler-icon {
            display: none;
        }

        .LoginView2_LoggedInMenu1 {
            display: none;
        }
        .LoginView_LoggedInMenu {
            font-size:12px;
            padding-right: 10px;
        }
        .fa-2x {
            font-size: 1.7em;
            padding-top: 10px;
        }
        #scrollNavSidebar {
            display: none;
        }

        #lin {
            display: none;
        }
        #lin1 {
            display: none;
        }
    }

    .nav-justified .nav-item {
        flex-basis: 0;
        text-align: center;
        flex-grow: inherit !important;
    }

    @media (max-width:1300px) {
        .logo {
            width: 120px;
            margin: auto;
        }
    }

    .navbar-expand-lg .navbar-nav {
        flex-direction: row-reverse !important;
        float: right !important;
        margin-right: auto !important;
    }
 .navbar-nav ul li .active {
   color:red;
}
    @media (max-width:995px) {
        .small-img-sidbar {
            -webkit-border-radius: 90px;
            -moz-border-radius: 90px;
            border-radius: 90px;
            width: 30%;
            margin-right: auto;
            margin-left: auto;
            min-height: 67px;
        }

        .navbar-nav {
            display: inline-flex;
            margin-top: -74px;
            right: 0px;
        }

        .small {
            text-align: center;
        }

      

        #scrollNav {
            display: none;
        }

        #sidebar li a, #sidebar li a.collapsed.active {
            font-size:12px;
            padding: 5px 30px !important;
        }
    }

    .nav-pills .nav-link.active {
        color: #8c8c8c !important;
        background: transparent !important;
        border-bottom: 6px solid #4d0000 !important;
    }

    .nav-pills .nav-link:not(:first-child) {
        margin-left: 50px !important;
    }

    .header-nav__social {
        list-style: none;
        display: inline-block;
        font-size: 1.2rem;
    }

        .header-nav__social li {
            padding-left: 0;
            display: inline-block;
        }

            .header-nav__social li a {
                color: rgba(255, 255, 255, 0.15);
            }

                .header-nav__social li a:hover,
                .header-nav__social li a:focus {
                    color: white;
                }

            .header-nav__social li:last-child {
                margin: 0;
            }

.header-s {
    font-size: 8px;
    margin-top: 51px;
    margin-left: -163px;
}

    .border-r {
        border-right: 1px dotted;
        padding-left: 10px;
    }

    .linkk {
        display: block;
        padding-top: 16px;
        border-top: 1px solid #E8E8E8;
        background-color: white;
        text-align: center;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }

    #scrollNavSidebar .active {
        color: #8c8c8c !important;
        background: transparent !important;
        border-bottom: 6px solid #4d0000 !important;
    }

    .screen {
        transition: margin-left 500ms, margin-right 500ms;
    }

    /*#sidebar {
        width: 0;
    }*/

        #sidebar #searchResults ul > li > a {
            color: #444444;
            font-weight: 500;
        }

            #sidebar #searchResults ul > li > a:not(:first-child) {
                font-size: 14px;
            }

/*.show-nav #sidebar {
    width: min-content;
}*/

    .screen {
        width: 100%;
        min-height: 100%;
        display: table;
    }

        .screen > a {
            min-width: 1px;
            min-height: 1px;
            display: block;
        }

    .screen-1 {
        background: linear-gradient(to bottom, #267de5, #364abe);
        overflow: hidden;
        position: relative;
    }


        .screen-1 .letter-b {
            background: url(../Content/landing-b.png) no-repeat top;
            background-size: 100%;
            opacity: .15;
            position: absolute;
            z-index: 10;
        }

        .screen-1 .text-block {
            color: #fff;
            font-weight: 400;
            position: absolute;
            width: 760px;
            font-size: 1.25em;
            z-index: 15;
        }

        .screen-1 #scene .layer.tablet {
            background: url(../Content/landing-tablet.png) no-repeat center;
            background-size: 100% 100%;
            float: right;
            margin-top: 90px;
            margin-right: -50px;
            margin-bottom: 30px;
            width: 800px;
            height: 695px;
        }

    @media (min-width: 1681px) {
        .screen-1 .letter-b {
            width: 511px;
            height: 700px;
            left: 233px;
            top: 168px;
        }

        .screen-1 .text-block {
            top: 290px;
            left: 175px;
            width: 740px;
        }

        .screen-1 #scene .layer.tablet {
            width: 1000px;
            height: 869px;
        }

        .screen-1 .text-block h1 {
            margin-bottom: 45px;
        }

        .screen-1 .text-block .btn {
            margin-top: 68px;
        }
    }

    @media (min-width: 1281px) and (max-width: 1680px) {
        .screen-1 .letter-b {
            width: 461px;
            height: 632px;
            left: 209px;
            top: 213px;
        }

        .screen-1 .text-block {
            top: 328px;
            left: 157px;
            width: 640px;
        }

        .screen-1 #scene .layer.tablet {
            margin-right: -125px;
            margin-bottom: 35px;
            margin-top: 120px;
        }

        .screen-1 .text-block h1 {
            margin-bottom: 39px;
        }

        .screen-1 .text-block .btn {
            margin-top: 60px;
        }
    }

    @media (min-width: 1281px) and (max-width: 1480px) {
        .screen-1 #scene .layer.tablet {
            margin-right: -255px;
            margin-bottom: 85px;
        }
    }

    @media (min-width: 1025px) and (max-width: 1280px) {
        .screen-1 .letter-b {
            width: 368px;
            height: 504px;
            left: 125px;
            top: 163px;
        }

        .screen-1 .text-block {
            top: 250px;
            left: 85px;
            width: 530px;
        }

        .screen-1 #scene .layer.tablet {
            margin-right: -285px;
            margin-bottom: 35px;
        }

        .screen-1 .text-block h1 {
            margin-bottom: 26px;
        }

        .screen-1 .text-block .btn {
            margin-top: 47px;
        }
    }

    @media (max-width: 1024px) {
        .screen-1 .letter-b {
            width: 331px;
            height: 454px;
            left: 120px;
            top: 155px;
        }

        .screen-1 .text-block {
            top: 180px;
            left: 80px;
            width: 480px;
        }

        .screen-1 #scene .layer.tablet {
            margin-right: -285px;
            margin-bottom: 35px;
        }

        .screen-1 .text-block h1 {
            margin-bottom: 22px;
        }

        .screen-1 .text-block .btn {
            margin-top: 41px;
        }
    }

    @media (min-width: 850px ) {
        #navbar #scrollNav a {
            font-size: 14px;
        }

        #navbar #scrollNav .nav-item:not(:first-child) {
            margin-left: 28px;
        }

        #navbar .nav-header li > a {
            font-size: 16px;
            padding: 34px 50px 24px 50px;
        }
    }

    #navbar #scrollNav .active {
        color: #8c8c8c;
        background: transparent;
        border-bottom: 6px solid #4d0000;
    }


@media (max-width: 999px) {


    .screen-1 {
        height: 700px;
    }

        .screen-1 .letter-b {
            width: 461px;
            height: 632px;
            left: 0px;
            top: 90px;
        }

        .screen-1 #scene {
            display: none !important;
        }

        .screen-1 .text-block {
            left: 0;
            right: 0;
            margin-left: auto;
            margin-right: auto;
            width: 500px;
            text-align: center;
        }

            .screen-1 .text-block h1 {
                margin-bottom: 51px;
            }

            .screen-1 .text-block .btn {
                margin-top: 76px;
            }

        .screen-1 .arrow-container {
            display: none;
        }

    #navbar #scrollNav {
        display: none;
    }
}

@media (max-width: 885px) {
    .screen-1 .text-block {
        width: auto;
        margin-left: 15px;
        margin-right: 15px;
    }
}

@media (max-width: 885px) {
    #navbar .nav-header {
        display: none;
    }

    #sidebar .sidebar-body {
        bottom: 114px;
    }

    #sidebar .sidebar-footer {
        display: block;
    }
}

.screen-1 .text-block h1 {
    margin-top: 0;
    font-size: 2.25em;
    font-weight: 600;
    font-style: normal;
    text-transform: uppercase;
}

.screen-1 .text-block span {
    opacity: .6;
}

.screen-1 #scene {
    z-index: 5;
}

    .screen-1 #scene .layer.shapes {
        width: 100%;
        height: 100%;
        background: url(../Content/landing-shapes.png) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        z-index: 10;
    }

.screen-1 .arrow-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    clip: rect(0, auto, auto, 0);
}

    .screen-1 .arrow-container .scroll-arrow {
        bottom: 50px;
        position: fixed;
        left: 50%;
        color: #fff;
        z-index: 10;
        font-weight: 400;
        font-size: 0.8em;
        -ms-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: .8;
    }

.screen-1 .scroll-arrow .line {
    width: 40px;
    height: 2px;
    background: #fff;
    display: inline-block;
    margin-bottom: 4px;
    margin-left: 8px;
}

.screen > h2 {
    font-size: 1.5em;
    font-weight: 400;
    color: #666666;
    text-align: center;
    margin-bottom: 30px;
    margin-top: 50px;
}

.screen > h3 {
    font-size: 1em;
    font-weight: 500;
    color: #999999;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 40px;
    width: 50%;
    text-align: center;
}

@media (max-width: 1199px) {
    .screen > h3 {
        width: 900px;
    }
}

@media (max-width: 999px) {
    .screen > h3 {
        width: 700px;
    }
}

@media (max-width: 885px) {
    .screen > h3 {
        width: 100%;
        padding-left: 40px;
        padding-right: 40px;
    }
}




.screen-2 {
    padding-bottom: 40px;
    overflow: hidden;
}

    .screen-2 .features > .row > div:not(.clearfix) {
        padding: 10px;
    }

    .screen-2 .feature {
        text-align: center;
        box-shadow: 0px 3px 18px 0px rgba(0, 0, 0, 0.16);
        position: relative;
        padding: 7px 25px 7px;
        height: 250px;
    }

@media (max-width: 1199px) {
    .screen-2 .feature {
        height: 300px;
    }
}

.screen-2 .feature .icon {
    color: #2a71dc;
    font-size: 4em;
}

.screen-2 .feature h4 {
    color: #666;
    font-weight: 700;
    margin-top: 30px;
    margin-bottom: 20px;
    font-size: 1.2em;
}

.screen-2 .feature .desc {
    color: #999;
    font-weight: 500;
    font-size: .7em;
}

@media (max-width: 991px) {
    .screen-2 .features .feature {
        height: auto;
    }

    .screen-2 .features .feature {
        padding-top: 55px;
    }

        .screen-2 .features .feature h4 {
            margin-top: 46px;
            margin-bottom: 25px;
        }
}

.screen-3 {
    background: #f5f5f5;
    overflow: hidden;
    padding-bottom: 80px;
}

    /* Screen Products */
    .screen-3 .products > .row > div:not(.col-reg),
    .screen-3 .products > .row > .col-reg > .row > div {
        padding: 10px;
    }

    .screen-3 .products > .row > .col-reg > .row {
        margin-left: 0;
        margin-right: 0;
    }

    .screen-3 .products > .row > div.col-reg {
        padding: 0;
    }

    .screen-3 .product {
        display: block;
        text-decoration: none;
        background: #fff;
        padding: 30px 25px;
        box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.12);
        overflow: hidden;
        color: #666666;
        position: relative;
    }

        .screen-3 .product,
        .screen-3 .product h4,
        .screen-3 .product .pic {
            -webkit-transition-property: background, color;
            -moz-transition-property: background, color;
            -o-transition-property: background, color;
            transition-property: background, color;
            -webkit-transition-duration: .2s;
            -moz-transition-duration: .2s;
            -o-transition-duration: .2s;
            transition-duration: .2s;
            -webkit-transition-timing-function: linear;
            -moz-transition-timing-function: linear;
            -o-transition-timing-function: linear;
            transition-timing-function: linear;
        }

           

                .screen-3 .product.regular:hover .pic,
                .screen-3 .product.horizontal:hover .pic {
                    opacity: .25;
                }

            .screen-3 .product.large {
                background-color: #F5F5F5;
                background-image: -webkit-linear-gradient(top, #F5F5F5, #F5F5F5);
                background-image: linear-gradient(to bottom, #F5F5F5, #F5F5F5);
                box-shadow: 0px 3px 18px 0px rgba(0, 0, 0, 0.16);
                color: black;
                height: 500px;
            }

            .screen-3 .product.regular,
            .screen-3 .product.horizontal {
                height: auto;
            }

            .screen-3 .product h4 {
                margin-top: -12px;
                z-index: 10;
            }

            .screen-3 .product.large h4 {
                font-size: 3em;
            }

            .screen-3 .product.regular h4 {
                font-size: 1.2em;
                color: #990000;
            }

            .screen-3 .product.horizontal h4 {
                color: #990000;
                font-family: Aldhabi
            }
.black {
    color: black;
}
            .screen-3 .product .text {
                z-index: 10;
                position: relative;
            }

            .screen-3 .product.large .text > span:first-child {
                opacity: .8;
                font-size: 1.2em;
                font-weight: 400;
                width: 70%;
                display: block;
            }

            .screen-3 .product.regular .text {
                width: 95%;
            }

            .screen-3 .product.horizontal .text {
                width: 100%;
                font-size:14px;
            }

@media (max-width: 1199px) {
    .screen-3 .product.horizontal .text {
        width: 75%;
    }
}

@media (max-width: 885px) {
    .screen-3 .product.regular .text,
    .screen-3 .product.horizontal .text {
        width: 90%;
    }
}

.screen-3 .product .btn {
    display: inline-block;
}

.screen-3 .product .pic {
    background-size: 100% 100%;
    position: absolute;
    z-index: 5;
}

.screen-3 .product .pic {
    width: 270px;
    height: 106px;
}


.screen-3 .product.large .pic {
    width: 568px;
    height: 340px;
}

@media (min-width: 1200px) {
    .screen-3 .product.horizontal .pic {
        width: 568px;
        height: 340px;
        right: -120px;
        top: -50px;
    }
}

.screen-3 .product .pic {
    right: 0;
    bottom: 0;
}

@media (max-width: 1199px) {
    .screen-3 .product.large {
        height: 400px;
    }
}

@media (max-width: 999px) and (min-width: 885px) {
    .screen-3 .product.large .pic {
        bottom: -70px;
    }

    .screen-3 .product.regular,
    .screen-3 .product.horizontal {
        height: 200px;
    }
}

@media (max-width: 885px) {
    .screen-3 .product.large {
        height: 240px;
        background: #fff;
        color: #666;
    }

        .screen-3 .product.large .pic {
            width: 270px;
            height: 150px;
        }

        .screen-3 .product.large h4 {
            font-size: 1.8em;
        }

        .screen-3 .product.large .text > span:first-child {
            font-size: 1.0em;
            width: 90%;
        }

    .screen-3 .product .btn {
        display: none;
    }

    .screen-3 .product.large:hover,
    .screen-3 .product.large:hover {
        background-color: #990000;
        background-image: -webkit-linear-gradient(top, #990000, #364abe);
        background-image: linear-gradient(to bottom, #990000, #364abe);
        color: #fff;
    }

        .screen-3 .product.large:hover .pic {
            opacity: .25;
        }

    .screen-3 .product.large,
    .screen-3 .product.regular,
    .screen-3 .product.horizontal {
        height: 442px;
        margin-top: 24px;
        font-size:10px;
    }
}



.blockquote {
    margin-bottom: 1rem;
    font-size: 1rem;
}
blockquote {
    font-family: Georgia, serif;
    position: relative;
    margin: 0.5em;
    padding: 0.5em 2em 0.5em 3em;
}
    blockquote:before {
        font-family: Georgia, serif;
        position: absolute;
        font-size: 4em;
        line-height: 1;
        top: 0;
        left: 0;
        content: "\201C";
    }

    blockquote:after {
        font-family: Georgia, serif;
        position: absolute;
        /* display: block; don't use this, it raised the quote too high from the bottom - defeated line-height? */
        float: right;
        font-size: 4em;
        line-height: 1;
        right: 0;
        bottom: -0.5em;
        content: "\201D";
    }

    blockquote footer {
        padding: 0 2em 0 0;
        text-align: right;
    }

    blockquote cite:before {
        content: "\2013";
    }
.img-ts {
    width: 20%;
    border-radius: 80%;
    max-height: 68px;
}
.font14 {
    font-size: 14px;
}
.margintop {
    margin-top: 29px;
}
.font18 {
    font-size: 18px;
}
.font17 {
    font-size: 17px;
}
.color {
    color: #990000;
}
.contact {
    margin: 27px;
    color: #990000;
}
.fa-3x {
    color: #E0E0E0
}
    .fa-3x:hover {
        color: #990000;
    }
.marginbottom15{
    margin-bottom:15px;
}
.news {
    font-size: 1.5em;
    font-weight: 400;
    color: #666666;
    text-align: center;
}
.dxtlNode_PlasticBlue td.dxtl, .dxtlAltNode_PlasticBlue td.dxtl, .dxtlSelectedNode_PlasticBlue td.dxtl, .dxtlFocusedNode_PlasticBlue td.dxtl, .dxtlEditFormDisplayNode_PlasticBlue td.dxtl, .dxtlCommandCell_PlasticBlue  {
    white-space: normal;
}
.dxtlNode_Office2010Black td.dxtl, .dxtlAltNode_Office2010Black td.dxtl, .dxtlSelectedNode_Office2010Black td.dxtl, .dxtlFocusedNode_Office2010Black td.dxtl, .dxtlEditFormDisplayNode_Office2010Black td.dxtl, .dxtlCommandCell_Office2010Black {
    white-space: normal;
}

.card {
    margin: 0 auto; /* Added */
    float: none; /* Added */
    margin-bottom: 10px; /* Added */
}
.card-body {
    font-size: 15px;
    text-align:left;
}
.margin{
   margin-bottom:20px;
}
.dxmLite .dxm-main {
    border: none !important;
    background-color: transparent !important;
    padding:0px !important;
}
.dropbtn {
    color: white;
    padding: 16px;
    font-size: 11px;
    border: none;
    background-color: transparent;
}
@media (max-width: 885px) {
  /*  .modal {
        width: 97%;
        height:87%;
    }*/
    .dropbtn {
        font-size: 14px;
        margin-right: 12px !important;
        padding: 7px !important;
    }
}
    .dropdown {
        position: relative;
        display: inline-block;
    }

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 230px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    border-top: 3px solid Brown !important;
    z-index: 5;
    padding-top: 5px;
    padding-bottom: 15px;
}
    .dropdown-content:before {
        -moz-border-color: none;
        border-color: transparent transparent Brown;
        border-image: none;
        border-style: solid;
        border-width: 5px;
        content: "";
        display: block;
        height: 0;
        opacity: 1;
        width: 2px;
        position: absolute;
        top: -12px;
        left: auto;
        right: 20px;
    }
    .dropdown-content a {
        color: black;
        text-decoration: none;
        display: block;
        text-align: left;
        font-size: 14px;
        text-transform: none;
    }

            .dropdown-content a:hover {
                background-color: #ddd;
            }

    .dropdown:hover .dropdown-content {
        display: block;
    }

    .dropdown:hover .dropbtn {
        background-color: #ddd;
    }
.form-group {
    font-size: 13px;
/*    text-align: right;
    direction: rtl;*/
    margin-bottom: 0.6rem;
}
.dxeListBoxItemSelected {
    text-align: right;
}
.dxeListBoxItem {
    text-align: right;
    font-size: 11px;
}
.input[type="text"].dxeEditAreaSys {
    font-size: 11px;
}


.board {
    width: 75%;
    margin: 60px auto;
    height: 500px;
    background: #fff;
    /*box-shadow: 10px 10px #ccc,-10px 20px #ddd;*/
}

    .board .nav-tabs {
        position: relative;
        /* border-bottom: 0; */
        /* width: 80%; */
        margin: 40px auto;
        margin-bottom: 0;
        box-sizing: border-box;
    }

    .board > div.board-inner {
        background: #fafafa url(http://subtlepatterns.com/patterns/geometry2.png);
        background-size: 30%;
    }

p.narrow {
    width: 60%;
    margin: 10px auto;
}

.liner {
    height: 2px;
    background: #ddd;
    position: absolute;
    width: 80%;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 50%;
    z-index: 1;
}

/*.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #555555;
    cursor: default;
    /* background-color: #ffffff; */
    border: 0;
    border-bottom-color: transparent;
}*/

span.round-tabs {
    width: 70px;
    height: 70px;
    line-height: 70px;
    display: inline-block;
    border-radius: 100px;
    background: white;
    z-index: 2;
    position: absolute;
    left: 0;
    text-align: center;
    font-size: 25px;
}

    span.round-tabs.one {
        color: rgb(34, 194, 34);
        border: 2px solid rgb(34, 194, 34);
    }

li.active span.round-tabs.one {
    background: #fff !important;
    border: 2px solid #ddd;
    color: rgb(34, 194, 34);
}

span.round-tabs.two {
    color: #febe29;
    border: 2px solid #febe29;
}

li.active span.round-tabs.two {
    background: #fff !important;
    border: 2px solid #ddd;
    color: #febe29;
}

span.round-tabs.three {
    color: #3e5e9a;
    border: 2px solid #3e5e9a;
}

li.active span.round-tabs.three {
    background: #fff !important;
    border: 2px solid #ddd;
    color: #3e5e9a;
}

span.round-tabs.four {
    color: #f1685e;
    border: 2px solid #f1685e;
}

li.active span.round-tabs.four {
    background: #fff !important;
    border: 2px solid #ddd;
    color: #f1685e;
}

span.round-tabs.five {
    color: #999;
    border: 2px solid #999;
}

li.active span.round-tabs.five {
    background: #fff !important;
    border: 2px solid #ddd;
    color: #999;
}

/*.nav-tabs > li.active > a span.round-tabs {
    background: #fafafa;
}

.nav-tabs > li {
    width: 20%;
}*/
    /*li.active:before {
    content: " ";
    position: absolute;
    left: 45%;
    opacity:0;
    margin: 0 auto;
    bottom: -2px;
    border: 10px solid transparent;
    border-bottom-color: #fff;
    z-index: 1;
    transition:0.2s ease-in-out;
}*/
    /*.nav-tabs > li:after {
        content: " ";
        position: absolute;
        left: 45%;
        opacity: 0;
        margin: 0 auto;
        bottom: 0px;
        border: 5px solid transparent;
        border-bottom-color: #ddd;
        transition: 0.1s ease-in-out;
    }

    .nav-tabs > li.active:after {
        content: " ";
        position: absolute;
        left: 45%;
        opacity: 1;
        margin: 0 auto;
        bottom: 0px;
        border: 10px solid transparent;
        border-bottom-color: #ddd;
    }

    .nav-tabs > li a {
        width: 70px;
        height: 70px;
        margin: 20px auto;
        border-radius: 100%;
        padding: 0;
    }

        .nav-tabs > li a:hover {
            background: transparent;
        }*/



.tab-pane {
    position: relative;
    padding-top: 50px;
}

.tab-content .head {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 25px;
    text-transform: uppercase;
    padding-bottom: 10px;
}

.btn-outline-rounded {
    padding: 10px 40px;
    margin: 20px 0;
    border: 2px solid transparent;
    border-radius: 25px;
}

.btn.green {
    background-color: #5cb85c;
    /*border: 2px solid #5cb85c;*/
    color: #ffffff;
}



@media ( max-width : 885px ) {

    .board {
        width: 90%;
        height: auto !important;
    }

    span.round-tabs {
        font-size: 16px;
        width: 50px;
        height: 50px;
        line-height: 50px;
    }

    .tab-content .head {
        font-size: 20px;
    }

    /*.nav-tabs > li a {
        width: 50px;
        height: 50px;
        line-height: 50px;
    }

    .nav-tabs > li.active:after {
        content: " ";
        position: absolute;
        left: 35%;
    }*/

    .btn-outline-rounded {
        padding: 12px 20px;
    }
    .image_contact {
        margin-top: 10px;
        margin-left: 36px;
        cursor: pointer;
    }
}
.dxeMemoEditAreaSys, input[type="text"].dxeEditAreaSys, input[type="password"].dxeEditAreaSys{
    font-size:14px
}
button, input, optgroup, select, textarea{
    font-size:12px;
}
/*legend{
    text-align:center;
}*/
.padding-0 {
    padding-right: 0;
    padding-left: 0;
}

.image_contact {
    margin-top: 15px;
    cursor: pointer;
}
.banner-box-outer {
    background-image: url(../image/Banner.jpg);
    background-position: center;
    background-repeat: no-repeat;
    height: 400px;
    width: 100%;
}

    .banner-box-outer .text {
        text-align: center;
        line-height: 23px;
    }

.PanelContainer {
    width: 90%;
    height: 400px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 5px;
}

.banner-box-outer .text h2 {
    font-size: 24px;
    color: #777b7a;
    font-weight: 300;
}

.banner-box-outer .text h1 {
    font-size: 48px;
    color: cadetblue;
    font-weight: 300;
}
.settings-content {
    padding: 0px 20px;
    margin-top: 83px;
}

    .settings-content h2 {
        color: #494949;
        font-size: 1.3em;
        font-weight: 600;
    }

    .settings-content p {
        color: #999999;
    }

.rightToggel {
    width: fit-content !important;
    float: right !important;
}
.rightDiv {
    float: right;
    width: auto;
    margin-right: -31px;
    margin-top: 15px;
}

@media ( max-width : 985px ) {
    .rightDiv {
        margin-top: -66px !important;
        margin-right: -16px !important;
    }
    }
/* Account */
.header-menu .account-background {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.1);
}

    .header-menu .account-background div {
        border-radius: 50%;
    }

    .header-menu .account-background .empty-image {
        width: 32px;
        height: 32px;
        display: inline-block;
        background: url(../image/user.svg);
        background-size: cover;
        background-position: center;
        max-width: 100%;
        max-height: 100%;
        background-repeat: no-repeat;
    }

    .header-menu .account-background .account-image {
        width: 32px;
        height: 32px;
        font-size: 0.8em;
        font-weight: 600;
        line-height: 32px;
        text-align: center;
        margin: 0 auto;
        display: table;
        background-size: 100%;
    }

.user-info .avatar img {
    float: left;
    height: 43px;
    border-radius: 50%;
}

.user-info .text-container {
    margin: 0px auto;
    text-align: center;
}

    .user-info .text-container .user-name {
        color: #444444;
        font-size: 1.14em;
    }

    .user-info .text-container .email {
        display: block;
        color: #666666;
        font-size: 0.86em;
    }

.myaccount-item {
    background-color: #e4e4e4;
}
.fullscreen-button {
    font-size: 12px;
    color: #ccc;
    background: #666;
    text-shadow: -1px -1px #333;
}
.ONAir {
    width: 38px;
    height: 62px;
    margin-top: 10px;
    float: right;
}
@media ( max-width : 985px ) {

    .ONAir {
        width: 26px !important;
        height: 46px !important;
        margin-top: -70px !important;
    }
}
.title {
    width: 100%;
    text-align: left;
    font-size: 1.2em;
    margin-right: 100px;
}



/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/


.hero h1 {
    margin: 0 0 10px 0;
    font-size: 48px;
    font-weight: 700;
    line-height: 56px;
}

.hero h2 {
    margin-bottom: 50px;
    font-size: 24px;
}

.btn-get-started {
    font-family: "Jost", sans-serif;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 10px 28px 11px 28px;
    border-radius: 50px;
    transition: 0.5s;
    margin: 10px 0 0 0;
    color: #fff;
    background: #0d6efd;
}

    .btn-get-started:hover {
        background: #6ea8fe;
    }

.hero .btn-watch-video {
    font-size: 16px;
    display: flex;
    align-items: center;
    transition: 0.5s;
    margin: 10px 0 0 25px;
    line-height: 1;
}

    .hero .btn-watch-video i {
        line-height: 0;
        font-size: 32px;
        transition: 0.3s;
        margin-right: 8px;
    }

    .hero .btn-watch-video:hover i {
        color: #47b2e4;
    }

.hero .animated {
    animation: up-down 2s ease-in-out infinite alternate-reverse both;
}

@media (max-width: 991px) {
    .hero {
        /*   height: 75vh;*/
        text-align: center;
    }

        /*  .hero .animated {
            -webkit-animation: none;
            animation: none;
        }
*/
        .hero .hero-img {
            text-align: center;
        }

            .hero .hero-img img {
                width: 50%;
            }
}

@media (max-width: 768px) {
    .hero h1 {
        font-size: 28px;
        line-height: 36px;
    }

    .hero h2 {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 30px;
    }

    .hero .hero-img img {
        width: 70%;
    }
}

@media (max-width: 575px) {
    .hero .hero-img img {
        width: 80%;
    }

    .hero .btn-get-started {
        font-size: 16px;
        padding: 10px 24px 11px 24px;
    }
}

@-webkit-keyframes up-down {
    0% {
        transform: translateY(10px);
    }

    100% {
        transform: translateY(-10px);
    }
}

@keyframes up-down {
    0% {
        transform: translateY(10px);
    }

    100% {
        transform: translateY(-10px);
    }
}



#loadd {
    display: flex;
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100vh;
    z-index: 99999;
}
    /*loader in all pages*/

    #loadd:before,
    #loadd:after {
        content: "";
        background-color: #f6f9ff;
        position: absolute;
        inset: 0;
        width: 50%;
        height: 100%;
        transition: all 0.3s ease 0s;
        z-index: -1;
    }

    #loadd:after {
        left: auto;
        right: 0;
    }

.spinner {
    width: 44.8px;
    height: 44.8px;
    animation: spinner-y0fdc1 2s infinite ease;
    transform-style: preserve-3d;
}

    .spinner > div {
        background-color: rgba(13,110,253,0.2);
        height: 100%;
        position: absolute;
        width: 100%;
        border: 2.2px solid #0d6efd;
    }

    .spinner div:nth-of-type(1) {
        transform: translateZ(-22.4px) rotateY(180deg);
    }

    .spinner div:nth-of-type(2) {
        transform: rotateY(-270deg) translateX(50%);
        transform-origin: top right;
    }

    .spinner div:nth-of-type(3) {
        transform: rotateY(270deg) translateX(-50%);
        transform-origin: center left;
    }

    .spinner div:nth-of-type(4) {
        transform: rotateX(90deg) translateY(-50%);
        transform-origin: top center;
    }

    .spinner div:nth-of-type(5) {
        transform: rotateX(-90deg) translateY(50%);
        transform-origin: bottom center;
    }

    .spinner div:nth-of-type(6) {
        transform: translateZ(22.4px);
    }

@keyframes spinner-y0fdc1 {
    0% {
        transform: rotate(45deg) rotateX(-25deg) rotateY(25deg);
    }

    50% {
        transform: rotate(45deg) rotateX(-385deg) rotateY(25deg);
    }

    100% {
        transform: rotate(45deg) rotateX(-385deg) rotateY(385deg);
    }
}