/* Default tab style */



.tabsA {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    width: 100%;
    font-weight: 300;
    font-size: 1.25em;
}
    /* Nav */
    .tabsA nav {
        text-align: center;
    }

        .tabsA nav ul {
            position: relative;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: -moz-flex;
            display: -ms-flex;
            display: flex;
            margin: 0 auto;
            padding: 0;
            max-width: 1200px;
            list-style: none;
            -ms-box-orient: horizontal;
            -ms-box-pack: center;
            -webkit-flex-flow: row wrap;
            -moz-flex-flow: row wrap;
            -ms-flex-flow: row wrap;
            flex-flow: row wrap;
            -webkit-justify-content: center;
            -moz-justify-content: center;
            -ms-justify-content: center;
            justify-content: center;
        }

            .tabsA nav ul li {
                position: relative;
                z-index: 1;
                display: inline-block;
                margin: 0;
                text-align: center;
                margin-bottom: 5px;
            }









        .tabsA nav a {
            position: relative;
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            line-height: 2.5;
        }

            .tabsA nav a span {
                vertical-align: middle;
                font-size: 0.75em;
            }

        .tabsA nav li.tab-current a {
            color: #74777b;
        }

        .tabsA nav a:focus {
            outline: none;
        }
/* Content */
.content-wrap {
    position: relative;
}

    .content-wrap section {
        display: none;
        margin: 0 auto;
        padding: 1em;
        max-width: 1200px;
        text-align: center;
    }

        .content-wrap section.content-current {
            display: block;
        }

        .content-wrap section p {
            margin: 0;
            padding: 0.75em 0;
            color: rgba(40,44,42,0.05);
            font-weight: 900;
            font-size: 4em;
            line-height: 1;
        }
/* Fallback */
.no-js .content-wrap section {
    display: block;
    padding-bottom: 2em;
    border-bottom: 1px solid rgba(255,255,255,0.6);
}

.no-flexbox nav ul {
    display: block;
}

    .no-flexbox nav ul li {
        min-width: 15%;
        display: inline-block;
    }
/*****************************/
/* Triangle and line */
/*****************************/

.tabs-style-linetriangle nav a {
    overflow: visible;
    border-bottom: 1px solid #ccc;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

    .tabs-style-linetriangle nav a span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 1em;
        margin-right: 5px;
        margin-left: 5px;
    }

.tabs-style-linetriangle nav li.tab-current a:after, .tabs-style-linetriangle nav li.tab-current a:before {
    position: absolute;
    bottom: -25px;
    left: 50%;
    width: 0;
    height: 0;
    border: solid transparent;
    content: '';
    pointer-events: none;
}

.tabs-style-linetriangle nav li.tab-current a:after {
    margin-left: -12px;
    border-width: 12px;
    border-top-color: #c8122e;
}
/*.tabs-style-linetriangle nav li.tab-current a:before {
	margin-left: -21px;
	border-width: 21px;
	border-top-color: rgba(0,0,0,0.2);
}*/

.tabsA nav li a {
    display: block;
    font-size: 13px;
    text-decoration: none;
    padding-bottom: 3px;
    font-weight: 700;
}

.tabsA nav li.tab-current a {
}

a .iconsSize {
    background-size: contain !important;
    display: block;
    height: 72px;
    margin: 0 auto;
    text-align: center;
    width: 70px;
}

.tabs-style-linetriangle nav a {
    padding-top: 0px;
}



#greenTabs a {
    color: #43AEAB;
}

#greenTabs.tab-current a::after {
    border-top-color: #43AEAB;
}

#redTabs a {
    color: #F1856C;
}

#redTabs.tab-current a::after {
    border-top-color: #F1856C;
}

#green2Tabs a {
    color: #ffb51e;
}

#green2Tabs.tab-current a::after {
    border-top-color: #ffb51e;
}


#blueTabs a {
    color: #5f91c8;
}

#blueTabs.tab-current a::after {
    border-top-color: #5f91c8;
}




@media screen and (max-width: 58em) {
    .tabs-style-linetriangle nav {
        font-size: 0.6em;
    }

    a .iconsSize {
        width: 40px;
    }

    .tabsA nav li a {
        font-size: 11px;
    }

    .tabs-style-linetriangle nav li.tab-current a::after {
        border-width: 14px;
        margin-left: -14px;
    }
}



@media screen and (max-width: 58em) {
    .tabsA nav a.icon span {
        display: none;
    }

    .tabsA nav a:before {
        margin-right: 0;
    }
}


/*------animation--------*/

.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

    .animated.infinite {
        animation-iteration-count: infinite;
    }

    .animated.hinge {
        animation-duration: 2s;
    }

    .animated.bounceIn {
        animation-duration: .75s;
    }

@keyframes bounceIn {
    from, 20%, 40%, 60%, 80%, to {
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    }

    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3);
    }

    20% {
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        transform: scale3d(.9, .9, .9);
    }

    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        transform: scale3d(.97, .97, .97);
    }

    to {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

.bounceIn {
    animation-name: bounceIn;
}


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


.content-wrap ul {
    display: block;
    list-style: outside none none;
    margin: 0px;
    padding: 0px;
}


.content-wrap li {
    display: inline-block;
    list-style: outside none none;
    margin: 6px;
    min-width: 100px;
    width: calc(14.5% - 10px);
}

.animateIN li {
    /*animation-name: bounceIn;
    animation-duration: .75s;
    animation-fill-mode: both;*/
    vertical-align: top;
}

.animateIN span {
    font-size: 12px;
    display: block;
    margin: 0 auto;
    padding-top: 8px;
}

.animateIN a {
    text-decoration: none;
    color: #5F91C8;
}

.animateIN.colorGreenTxt a {
    text-decoration: none;
    color: #43AEAB;
}

.animateIN.colorRedTxt a {
    color: #F1856C;
    text-decoration: none;
}

.colorgreen2Txt a {
    color: #333;
    text-decoration: none;
}

.tabsicon .animateIN img {
    max-width: 62px;
}

body .content-wrap li {
    width: calc(13% - 10px);
}

.db-summary {
    overflow: auto;
    margin-bottom: 25px;
}

.db-summary-section {
    width: calc(25% - 15px);
    display: inline-block;
    vertical-align: top;
    margin: 5px;
    position: relative;
}


#divDashboardSummary .panel {
    box-shadow: 3px 5px 5px #868e96;
    margin-bottom: unset;
    padding: 2px 5px;
    border-radius: 10px;
}

    #divDashboardSummary .panel h5 {
        font-size: 13px;
    }

#mainz .panel.colorA {
    background: #c6a9a3;
}

#mainz .panel.colorB {
    background: #99BBAD;
}

#mainz .panel.colorC {
    background: #C5A880;
}

#mainz .panel.colorD {
    background: #5B5B5B;
}


#mainz .panel.colorE {
    background: #607D8B;
}


#mainz .panel a i, #mainz .panel i {
    /*color: #fff;*/
}


#mainz .panel a {
    text-decoration: none;
}

    #mainz .panel a h2 {
        color: #fff !important;
    }


#mainz .panel b {
    color: #fff;
    text-shadow: 1px 2px 1px rgba(0,0,0,0.2);
}

#mainz .panel .text-muted {
    color: #fff !important;
    FONT-WEIGHT: 100;
}

.breadcrumb-tbl-resp {
    background: #eaeaea;
}

.breadcrumb_level1 {
    font-weight: 700;
    text-decoration: none;
}

    .breadcrumb_level1:after {
        content: '\f105 ';
        font-family: FontAwesome;
        font-size: 14px;
        margin-left: 9px;
    }


.announsmentTkt2, hrAds {
    z-index: 90;
}


i.fa.fa-bars {
    font-size: 19px;
    margin-top: -4px;
    display: block;
    height: 15px;
    margin-left: 8px;
}











body #menumega ul li, body #menumega ul ul li {
    border-color: #3e6b92 !important;
    border: none !important;
}


#cssmenu.menumega ul li {
    border-color: rgba(0,0,0,0) !important;
}



.iconsfm2 {
    background: url(https://portal.moi.gov.ae/eservices/Images/niceicons/iconFm2.svg);
    background-size: 80px;
    height: 63px;
    width: 39px;
    /* background: red; */
    display: block;
    background-position: center center;
}


.iconsfm {
    background: url(https://portal.moi.gov.ae/eservices/Images/niceicons/iconFm.svg);
    background-size: 70px;
    height: 63px;
    width: 62px;
    /* background: red; */
    display: block;
    background-position: center center;
}

.iconsElecCert {
    background: url(https://portal.moi.gov.ae/eservices/Images/attestation-of-certificate.svg);
    background-size: 70px;
    height: 63px;
    width: 62px;
    /* background: red; */
    display: block;
    background-position: center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

#divElectronicCertificate .p5 {
    box-sizing: border-box;
}

div #divElectronicCertificate .mt15 {
    font-size: 22px;
    line-height: 24px !important;
    max-width: 150px;
    margin-top: 7px !important;
}

@media screen and (max-width: 780px) {
    .complaintNotification,
    .iconsElecCert {
        background-size: 100% !important;
        height: 27px !important;
        width: 27px !important;
    }
}

.iconscert {
    background: url(https://portal.moi.gov.ae/eservices/Images/mobile-icons/cid_cert.svg);
    background-size: 45px;
    height: 63px;
    width: 62px;
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
}

.carPoints {
    background: url(https://portal.moi.gov.ae/eservices/Images/niceicons/carsPoint.svg);
    background-size: 100%;
    height: 59px;
    width: 59px;
    /* background: red; */
    display: block;
    background-position: center center;
    MARGIN-RIGHT: -12PX;
}

.representativeCompanies {
    background: url(https://portal.moi.gov.ae/eservices/Images/RepresentativeCompanies.svg);
    background-size: 80%;
    height: 59px;
    width: 59px;
    /* background: red; */
    display: bldock;
    background-position: center center;
    MARGIN-RIGHT: -12PX;
    background-repeat: no-repeat;
}

.complaintNotification {
    background: url(https://portal.moi.gov.ae/eservices/Images/mobile-icons/complains.svg);
    background-size: 80%;
    height: 59px;
    width: 59px;
    /* background: red; */
    display: block;
    background-position: center center;
    MARGIN-RIGHT: -12PX;
    background-repeat: no-repeat;
}

#gvRepresentativeCompanies_paginate .paginate_button {
    color: #fff !important;
}

    #gvRepresentativeCompanies_paginate .paginate_button.current {
        color: #333 !important;
    }

.caricon {
    background: url(https://portal.moi.gov.ae/eservices/Images/mobile-icons/pay-fines.svg);
    background-size: 100%;
    height: 63px;
    width: 63px;
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
}

.thumbs-up {
    background-repeat: no-repeat;
    background-size: 52px 52px;
    display: block;
    height: 65px;
    position: relative;
}

    .thumbs-up span {
        position: relative;
        color: #fff;
        font-weight: 600;
        top: 45px;
    }

.smart-incidents {
    background: url(https://portal.moi.gov.ae/eservices/Images/mobile-icons/policeeye_dashboardicon.svg);
    background-size: 100%;
    height: 52px;
    width: 52px;
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
}


@media screen and (max-width: 712px) {
    #blueTabs a, #redTabs a, #green2Tabs a, #greenTabs a, #orangeTabs a, #tealTabs a {
        font-size: 0px !important;
    }

    .tabs-style-linetriangle nav a {
        border: none !important;
    }

    .tabsA nav ul li {
        max-width: 60px;
    }


    .caricon, .carPoints, .iconsfm2, .iconsfm, .representativeCompanies, .iconscert, .smart-incidents {
        background-size: 100%;
        height: 27px;
        width: 27px;
    }
}




@media screen and (max-width: 380px) {

    body .content-wrap li {
        min-width: 1px;
        width: calc(29.5% - 10px) !important;
    }

    .tabsicon .animateIN img {
        max-width: 52px !important;
    }
}

@media (max-width: 780px) {
    /*li.sub-service-selected {
        border-bottom-width: 2px !important;
    }
    .sub-service-contents li {
        width: calc(50% - 8px) !important;
        height: auto;
        margin-bottom: 5px;
    }

    .sub-service-tabs span {
        display: none !important;
    }

    .sub-service-tabs li {
        width: 16% !important;
        height: 45px !important;
        padding: 0px !important;
        padding: 5px !important;
        min-width: unset !important;
    }

        .sub-service-tabs li img {
            width: 100%;
            height: 40px;
            padding: 5px;
            vertical-align: middle;
            margin: 0px !important;
        }

    .sub-service-contents li img {
        width: 24px !important;
        height: 24px !important;
    }

    .sub-service-tabs * {
        cursor: default !important;
    }
}

    .sub-service-tabs span {
        display: block;
        margin-top: 5px;
        color: #aaa;
    }*/

    .uc-quick-link-bg1 {
        background-color: #5f91c8;
    }

        .uc-quick-link-bg1 + span {
            color: #5f91c8;
        }

    .uc-quick-link-bg2 {
        background-color: #43AEAB;
    }

        .uc-quick-link-bg2 + span {
            color: #43AEAB;
        }

    .uc-quick-link-bg3 {
        background-color: #f35958;
    }

        .uc-quick-link-bg3 + span {
            color: #f35958;
        }


    .uc-quick-link-bg4 {
        background-color: #ffb51e;
    }

        .uc-quick-link-bg4 + span {
            color: #ffb51e;
        }

    .uc-quick-link-bg5 {
        background-color: #5e8791;
    }

        .uc-quick-link-bg5 + span {
            color: #5e8791;
        }

    .uc-quick-link-bg6 {
        background-color: #1D8348;
    }

        .uc-quick-link-bg6 + span {
            color: #1D8348;
        }

    .uc-quick-link-bg7 {
        background-color: #F012BE;
    }

        .uc-quick-link-bg7 + span {
            color: #F012BE;
        }

    .uc-quick-link-bg8 {
        background-color: #85144b;
    }

        .uc-quick-link-bg8 + span {
            color: #85144b;
        }

    .uc-quick-link-bg9 {
        background-color: #82610B;
    }

        .uc-quick-link-bg9 + span {
            color: #82610B;
        }

    .uc-quick-link-bg10 {
        background-color: #A569BD;
    }

        .uc-quick-link-bg10 + span {
            color: #A569BD;
        }

    .uc-quick-link-bg11 {
        background-color: #335EFF;
    }

        .uc-quick-link-bg11 + span {
            color: #335EFF;
        }

    .uc-quick-link-bg12 {
        background-color: #CEA22E;
    }

        .uc-quick-link-bg12 + span {
            color: #CEA22E;
        }

    @media (max-width: 780px) {
        .db-summary-section {
            width: calc(50% - 15px) !important;
        }
    }

    .tabsicon {
        background-color: #f3f3f3;
        border: solid 1px #e3e3e3;
        margin-bottom: 30px;
    }

    @media (max-width: 350px) {
        .db-summary-section {
            width: calc(100% - 15px) !important;
        }
    }