﻿html {scroll-behavior: smooth;}
body {font-family: "DM Sans", serif !important;}
div:after {content: '';display: block;clear: both;}
a {text-decoration: none !important;}
#DivHeaderOuterTop {color: #000;}
.portal-top-row {background-color: #fdfdfd;font-size: .9em;color: #fff;height: 40px !important;line-height: 40px !important;border-bottom: 1px solid #ddd;}
.portal-top-row a {color: #000;}
#DivLoginDtls {display: inline-block;}
.DivHeaderRight {display: flex;justify-content: space-evenly;gap: 10px;}
.portal-top-row .font01 {font-size: 16px;height: 40px;width: 40px;background: none;border: 0;color: #000;transition: all 1s ease-out;}
/* Portal header */
.portal-header {background-color: #fff;padding: 10px;position: relative;box-shadow: 5px 7px 26px -5px rgba(104, 113, 123, .1);}
.mpo-logo img {height: 50px;}
.login-window {font-size: 15px;font-weight: 500;color: #000 !important;}
.login-window img {height: 20px;}
.partition {color: #000 !important;opacity: 0.4 !important;}
.loginLinks {color: #fff;}
.loginLinks a {color: #fff;padding: 8px 20px;display: block;width: 100%;}
.loginLinks img {height: 20px;filter: gra;}
.loginLinks:hover {opacity: .95;}
.DivHeadermid .dropdown-toggle {background-color: transparent !important;padding: 5px 20px;margin-left: 10px;padding: 2px 8px;
align-items: center;border: 1px solid #fff;font-size: 12px;border-radius: 25px;display: flex;}
.DivHeadermid .btn-group ul {padding: 0 !important;margin: 0 !important;}
.DivHeadermid .btn-group ul li a {border: 0;background: transparent;color: #1c2d3a;border-radius: 0;font-size: 14px;font-weight: 500;
text-transform: capitalize;padding: 2px 10px;display: block;line-height: 1.9;transition: all .5sease;position: relative;}
.DivHeadermid .btn-group ul li a:hover {border-radius: 0.3rem;}
.DivHeadermid .dropdown-item {font-size: 12px;color: #000 !important;}
.dropdown-item img {height: 15px;width: 15px;opacity: .1;transition: .5s;}
.portal-menu .dropdown-item:hover img {opacity: 1 !important;}
.DivHeadermid .dropdown-toggle::before {background: url("../images/svgicns/languageicn.svg") no-repeat;content: "";width: 15px;height: 15px;display: block;
margin-right: 5px;}
.DivHeaderLeft a {position: relative;padding-right: 5px;}
.DivHeaderLeft a:last-child:after {display: none;}
.DivHeaderLeft a:after {content: '';border-right: 1px solid #fff;position: absolute;right: 0;top: 2px;height: 83%;}
.DivHeaderLeft a:hover {color: #d0eaff;}
/* Menu bar */
.portal-menu {background-color: #464E72 !important;}
.navbar-toggler {width: 50px;height: 50px;padding: 0;border-radius: 50%;transition: 0.3s ease-in-out;flex-shrink: 0;}
.navbar-toggler:focus {box-shadow: none;}
.portal-menu .navbar-nav .nav-link.active, .portal-menu .navbar-nav .nav-link.show {color: #fff;}
.portal-menu .nav-link {color: #fff;font-size: 16px;}
.portal-menu .nav-link:focus, .portal-menu .nav-link:hover {color: #b1dcff;}
.portal-menu .navbar {padding: 0 0 !important;}
.portal-menu .dropdown-menu.show {border: 0;overflow: hidden;transition: all .5s ease;}
/* Menu Dropdown design */
@media screen and (max-width: 991px) {
.navbar-collapse.collapse:not(.show) {display: block;}
.navbar-collapse {position: fixed;top: 0;left: 0;background: #212529;width: 215px;height: 100%;
z-index: 9999;padding: 25px;transform: translateX(-215px);transition: 0.5s ease-in-out;display: block;}
.navbar-collapse.show {transform: translateX(0px);}
.nav-overlay {position: absolute;background: #0000007d;width: 100vw;height: 100vh;top: 0;left: 0;z-index: 2;transform: translateX(-100vw);display: block;}
.nav-overlay.active {transform: translateX(0);}

.Map {
    height: 100% !important;
 width:100% !important;float:none !important;
}
.ContactDtlAdd {
    width: 100% !important;
    float: none  !important;
}
}
/* Hero Screen home */
.portal-banner {height: 400px;position: relative;z-index: 0;overflow: hidden;}
.portal-banner:after {}
.sliderContent {position: absolute;left: 0;width: 100%;height: 100%;top: 0%;background-color: transparent !important;z-index: 1;padding: 200px 0 0 0;}
.portal-banner h1 {font-size: 26px;font-weight: 200;color: #fff;margin: 0;padding: 10px 30px;line-height: 1;display: inline;
border-radius: 0 30px 30px 0;backdrop-filter: blur(15px);}
.welcome-para span {font-size: 30px;font-family: "Audiowide", serif;margin: 0 0 10px;}
.portal-banner h3 {margin: 0;padding: 0;font-size: 30px;}
.portal-banner-side {position: absolute;z-index: -1;right: 0;top: 0;width: 500px;height: 500px;}
.mpmap-banner-side {position: absolute;z-index: -1;right: 20px;margin: 0 auto;text-align: center;top: 30px;opacity: .1;width: 400px;}
.welcome-links a {border-radius: 3px;padding: 7px 20px;color: #000;font-size: 14px;}
.findButton {background-color: #fff;}
.exploreButton {background-color: #ffe78a;}
/* Carousel */
.home-demo .item {background: #fff;}
.home-demo .boxSwipe {padding: 15px 30px;margin: 0;border-radius: 15px;min-height: 182px;box-shadow: 0px 14px 22px -9px #bbcbd8;border: 2px solid #98b7d0;}
.section {padding: 50px 0 20px;}
.section h2 {font-size:25px;font-weight: 900;margin: 0 0 10px;}
.subheading-para {color: #000000b2;}
.boxSwipe img {display: block;}
.owl-carousel .owl-item img {display: block;width: auto !important;margin:0 auto;}
.owl-carousel .owl-stage-outer {min-height: 213px !important;}
.owl-prev {width: 38px;height: 38px;border-radius: 5px;top: -89px;right: 58px;left: unset;background: #1937B2 !important;position: absolute;}
.owl-next {width: 38px;height: 38px;border-radius: 5px;top: -89px;right: 0;background: #1937B2 !important;position: absolute;}
.owl-theme .owl-nav [class*="owl-"] {color: #FFF !important;font-size: 27px !important;cursor: pointer;}
.owl-dots {/*display: none;*/}
/* Citizen Services */
.citizen-services {position: relative;z-index: 0;background: rgba(237, 237, 237, 0.5);
/*background-image: linear-gradient(to right top, #f0f0f0, #efeff2, #eeeef4, #eceef6, #e9edf8, #e9edf8, #e8ecf7, #e8ecf7, #eaecf4, #ebebf1, #ebebee, #ebebeb);*/
}
.citizen-services:after {content: '';position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: url(../images/linecraft.png) 80% 0 no-repeat;
opacity: .5;z-index: 0;display: flex;justify-content: center;align-items: center;rotate: 180deg;z-index: -1;}
.nav-link img {height: 20px;margin-right:5px;}
.serviceMore-links {text-align: center;}
.citizen-services .nav-link {color: #000;font-size: 17px;border: 0 !important;box-shadow: 0 0 4px transparent;border: 0 !important;outline: 0 !important;}
.citizen-services .nav-link:hover {
color: #000 !important;box-shadow: 0 0 4px transparent;border: 0 !important;outline: 0 !important;}
.citizen-services .nav-link.active {
border-left: 1px solid transparent !important;
border-top: 1px solid transparent !important;
border-right: 1px solid transparent !important;
border-bottom: 2px solid #546c7f !important;
background-color: transparent !important;
outline: none !important;
box-shadow: 0 0 4px transparent;
}
.nav-link:focus-visible {outline: 0;box-shadow: 0 0 4px transparent;}
.nav-tabs {}
.nav-link:focus-visible {outline: 0;box-shadow: 0 0 0 transparent !important;}
/* tab services */
.serviceBox {text-align: center;/*background: rgb(52,29,255);
background: linear-gradient(10deg, rgba(255, 255, 255, 0.53) 0%, rgba(221, 236, 254, 0.26) 100%);*/
background-color: #fff;margin-bottom: 20px;transition: .5s ease-in-out;border: 0 !important;
border-radius: 16px !important;}
.serviceBox:hover {}
.nav-tabs {display: flex;justify-content: space-between;}
.colstyle {display: inline-flex;}
.moreService {border: 0 !important;border-radius: 30px;background-color: #ddd;color: #000;display: block;padding: 5px 20px;}
.btn.btn-gradient {-webkit-appearance: none;border: 0;outline: 0;position: relative;background: #1937B2;
/*background: linear-gradient(45deg, #85A0B1 10%, #FF5EBF 90%);*/background-size: auto;background-size: 200% 100%;padding: 0.5rem 2rem;
color: white;border-radius: 100px;transition: 0.3s;}
.btn.btn-gradient:hover {
/*-webkit-animation: bruh 3s linear infinite;
animation: bruh 3s linear infinite;*/opacity: .9 !important;background: #1937B2;color: #fff;}
@-webkit-keyframes bruh {
0% {
background-position: 0 0;
}

50% {
background-position: 100% 0;
}

100% {
background-position: 0 0;
}
}

@keyframes bruh {
0% {
background-position: 0 0;
}

50% {
background-position: 100% 0;
}

100% {
background-position: 0 0;
}
}

.serviceBox a {
color: #000;
font-weight: 500;
line-height: 1.2;
padding: 20px;
display: block;
min-height: 164px;
width: 100%;
height: 100%;
}
.serviceBox a span 
{
       font-size: 16px;
    font-weight: 600;
    margin: 5px 0;
    display: block;
}
.serviceBox:hover {
transform: translateY(-10px);
}

.serviceBox small span {
opacity: .5;
display: block;font-weight:400;
font-size: 12px !important;
}

.tab-content {
background-color: transparent !important;
border: 0 !important;
}

.mpGov-logo {
display: block;
margin: 0 auto 5px;
width: 60px;
height: 60px;
}

/* Search Button Service Search */

.webdesigntuts-workshop form:before {
background: #444;
background: linear-gradient(left, #151515, #444, #151515);
top: 192px;
}

.webdesigntuts-workshop form:after {
background: #000;
background: linear-gradient(left, #151515, #000, #151515);
top: 191px;
}

.webdesigntuts-workshop form {
/*! background: #111; */
/*! background: linear-gradient(#1b1b1b, #111); */
/*! border: 1px solid #000; */
border-radius: 5px;
/*! box-shadow: inset 0 0 0 1px #272727; */
display: inline-block;
font-size: 0px;
float: right; /*margin-right: 100px;*/
position: relative;
z-index: 1;
}

.webdesigntuts-workshop input {
/*! background: #222; */
/*! background: linear-gradient(#eaecf4, #e9edf8); */
border: 0;
border-radius: 5px 0 0 5px;
/*! box-shadow: 0 2px 0 #cbcbcb; */
color: #888;
display: block;
float: left;
font-size: 14px;
font-weight: 500;
height: 40px;
margin: 0;
padding: 0 10px;
width: 200px;
}

.webdesigntuts-workshop {
margin-left: auto;
}

.ie .webdesigntuts-workshop input {
line-height: 40px;
}

.webdesigntuts-workshop input::-webkit-input-placeholder {
color: #888;
}

.webdesigntuts-workshop input:-moz-placeholder {
color: #888;
}

.webdesigntuts-workshop input:focus {
animation: glow 800ms ease-out infinite alternate;
/*background: #222922;
background: linear-gradient(#eaecf4, #e9edf8);
border-color: #393;
box-shadow: 0 0 5px rgba(0,255,0,.2), inset 0 0 5px rgba(0,255,0,.1), 0 2px 0 #000;*/
color: #212529;
outline: none;
}

.webdesigntuts-workshop input:focus::-webkit-input-placeholder {
color: #efe;
}

.webdesigntuts-workshop input:focus:-moz-placeholder {
color: #efe;
}

.webdesigntuts-workshop button {
background: #1937B2;
/*background: linear-gradient(45deg, #105A87 10%, #FABFE2 90%);*/
box-sizing: border-box;
border: 0;
border-left-color: #000;
border-radius: 0 5px 5px 0;
/*box-shadow: 0 2px 0 #cbcbcb;*/
color: #fff;
display: block;
float: left;
font-size: 14px;
font-weight: 500;
height: 40px;
line-height: 40px;
margin: 0;
padding: 0;
position: relative;
width: 80px;
transition: .5s ease;
}

.webdesigntuts-workshop button:hover,
.webdesigntuts-workshop button:focus {
/*background:#105A87;
-webkit-transition:0.5s ease-in-out;
-moz-transition:0.5s ease-in-out;
-ms-transition:0.5s ease-in-out;
-o-transition:0.5s ease-in-out;
transition:0.5s ease-in-out;
outline: none;*/
opacity: .8;
}

.webdesigntuts-workshop button:active {
background: #292929;
background: linear-gradient(#393939, #292929);
box-shadow: 0 1px 0 #000, inset 1px 0 1px #222;
top: 1px;
}

/*@keyframes glow {
0% {
border-color: #e9ecf5;
box-shadow: 0 0 5px rgb(234, 236, 245), inset 0 0 5px rgba(0,255,0,.1), 0 2px 0 #000;
}
100% {
border-color: #85a0b1;
box-shadow: 0 0 20px rgb(133, 160, 177), inset 0 0 10px rgb(133, 160, 177), 0 2px 0 #000;
}
}*/



@media only screen and (max-width: 600px) {
.DivHeaderLeft {
display: none;
}

.loginLinks {
display: none;
}

.portal-menu {
background-color: #f2f2f2;
}

.nav-overlay {
position: fixed;
}

.owl-dots {display:none;}
.aboutUs-services .mission-img {
object-fit: cover; margin-bottom : 10px !important;
}
.boxSwipe h3 {
text-align:center;
}
.boxSwipe span {
text-align:center !important;
}
/*.portal-banner {
height: 100% !important;
}*/
.modern-client .comment-right {
margin-left: 0 !important;
}

.img-testimonial {
display: none;
}
.modern-client > div {
display: none;
transition: opacity 0.5s ease-in-out;
}

.modern-client > div.active {
display: block;
}
.colstyle {
display: block;
width: 100%;
}

.webdesigntuts-workshop form {
padding: 10px;
background: transparent;
border: 1px solid transparent;
}

.webdesigntuts-workshop input {
width: 100%;
border-radius: 5px 5px;
border: 1px solid #000;
margin-bottom: 10px;
}

.webdesigntuts-workshop button {
width: 100%;
border-radius: 5px 5px;
}

.webdesigntuts-workshop form {
width: 90%;
margin: 0 auto !important;
float: none;
height: 100%;
display: block;
}

.webdesigntuts-workshop {
display: none;
}

.countsWrapper .col {
width: 100%;
flex: none;
margin-bottom: 20px;
}

.portal-banner-side {
top: unset !important;
bottom: 0;
opacity: .4;
}

.owl-nav {
display: none;
}

.citizen-services .nav-link {
width: 100%;
}

/*.serviceMore-links {
display: none;
}*/

.about-mpo--content {
text-align: center;
}

.section h2 {
text-align: center;
}

.subheading-para {
text-align: center;
}

.portal-banner span {
display: block;
}

.portal-banner h3, .portal-banner h1, .portal-banner span, .portal-banner p {
text-align: center;
}

.welcome-links a {
display: block;
margin-bottom: 10px;
}

.footerInnertxt, .corporateAdd {
text-align: center;
margin-bottom: 30px;
}

.social-box {
justify-content: center;
}

.chat-screen {
right: 8px !important;
width: 313px !important;
}
}

.navbar-expand-lg .navbar-nav .dropdown-menu {
/*position: absolute;
min-width: 220px;
padding:0 0;*/
position: absolute;
left: 0;
z-index:9;
box-shadow: 0 1px 5px #5a5a5a33;
padding: 15px 0;
background: #fff;
min-width: 235px;
border-radius: 5px;
transition: all .5s ease;
}

.portal-menu .dropdown-item {
border: 0;
background: transparent;
color: #1c2d3a;
border-radius: 0;
font-size: 14px;
font-weight: 500;
text-transform: capitalize;
padding: 2px 10px;
display: block;
line-height: 1.9;
transition: all .5s ease;
position: relative;
}

.portal-menu .dropdown-item:hover {
color: #ec588c;
}

/* Counter Box */
.counter {
background-color: #f5f5f5;
padding: 20px 0;
border-radius: 5px;
}

.count-title {
font-size: 40px;
font-weight: normal;
margin-top: 10px;
margin-bottom: 0;
text-align: center;
}

.count-text {
font-size: 13px;
font-weight: normal;
margin-top: 10px;
margin-bottom: 0;
text-align: center;
}

.fa-2x {
margin: 0 auto;
float: none;
display: table;
color: #4ad1e5;
}

.aboutUs-services {
position: relative;
z-index: 0;
}

.aboutUs-services:after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: url(../images/linecraft.png) 80% 0 no-repeat;
opacity: .5;
z-index: -1;
}

.countsWrapper {
position: relative;
padding: 20px 0;
}
/*
#footer {
 
background-color: #1c1b20;
padding: 20px 0 0;
}

.resolution {
padding: 10px 0;
font-size: 14px;
text-align: center;
color: #fff;
background-color: #000;
}

.footerInnertxt a {
color: #fff !important;
display: block;
font-size: 14px;
opacity: .8;
 
transition: .2s ease;
padding: 5px 0;
}

.footerInnertxt a:hover {
color: #ff9800 !important;text-decoration:underline !important;
}
*/
/* Back to top */
#button {
display: inline-block;
background-color: #FF9800;
width: 50px;
height: 50px;
text-align: center;
border-radius: 4px;
position: fixed;
bottom: 180px;
right: 30px;
transition: background-color .3s, opacity .5s, visibility .5s;
opacity: 0;
visibility: hidden;
z-index: 1000;
}
/*#button::after {
content: "\f077";
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
font-size: 2em;
line-height: 50px;
color: #fff;
}*/
#button:hover {
cursor: pointer;
background-color: #819EAE;
transition: 500ms ease-in-out;
}

#button:hover img {
margin-top: -5px;
transition: 500ms ease-in-out;
}

#button:active {
background-color: #555;
}

#button.show {
opacity: 1;
visibility: visible;
}

#footer h6 {
color: #fff;
font-weight: 500;
position: relative;
display: inline-block;
font-size: 17px;
margin-bottom: 20px;
}

#footer h6::after {
content: '';
position: absolute;
left: 0;
bottom: -5px;
width: 40%;
height: 2px;
background-color: #fff;
transition: .5s ease;
}

#footer h6::before {
content: '';
position: absolute;
left: 0;
bottom: -5px;
width: 100%;
height: 2px;
background-color: #0b83de;
transition: .5s ease;
opacity: 0;
}

#footer h6:hover::after {
content: '';
width: 70%;
opacity: .5;
}

#footer h6:hover::before {
content: '';
position: absolute;
left: 0;
bottom: -5px;
width: 100%;
height: 2px;
background-color: #04477b;
transition: .5s ease;
opacity: 1;
}
#footer h5 {
color: #fff;
font-weight: 500;
position: relative;
display:block;
font-size: 15px;
margin-bottom: 20px;
}
#footer p {
color: #fff;
opacity: .8;
font-size: 14px;
margin: 0;
}

.socialLinks {
padding: 20px 0 0;
border-bottom: 1px solid #06509f;
}

.social-box {
padding: 10px 0 10px 0;
}

.social-box {
display: flex;
margin: 0;
padding: 0;
}

.social-box li {
list-style: none;
margin: 0;
padding: 0;
}

.social-box li a {
position: relative;
width: 30px;
height: 30px;
display: block;
text-align: center;
margin: 0 5px;
border-radius: 50%;
padding: 3px;
box-sizing: border-box;
text-decoration: none;
background: linear-gradient(0deg, #ddd, #fff);
transition: .5s;
}

.social-box li a:hover {
box-shadow: 0 10px 15px rgba(0,0,0,0.3);
text-decoration: none;
}


.social-box li a img {
height: 15px;
}

.socialLinks h3 {
font-size: 20px;
color: #fff;
font-weight: 500;
position: relative;
display: inline-block;
}

.socialLinks h3:after {
content: '';
position: absolute;
left: 0;
bottom: -5px;
width: 40%;
height: 2px;
background-color: #fff;
transition: .5s ease;
}

.socialLinks:hover h3:after {
content: '';
width: 100%;
opacity: .5;
}

/* ChatBot */

/* Dropdown window */
/* Dropdown window */
.DivHeaderBut .dropbtn {
background-color: #3498DB;
color: white;
padding: 15px 20px;
font-size: 14px;
border: none;
/* line-height: 31px; */
cursor: pointer;
display: inline-block;
background-image: url(../images/svgicns/accessibilitytoolicnmain.svg);
background-position: center;
background-repeat: no-repeat;
/* height: 31px; */
top: -5px;
position: relative;
}

.DivHeaderBut .dropbtn:hover, .DivHeaderBut .dropbtn:focus {
background-color: #2980B9;
}

.DivHeaderBut .dropdown {
position: relative;
display: inline-block;
top: 0;
}

.dropdown-content {
display: none;
position: absolute;
background-color: #f1f1f1;
overflow: auto;
right: -79px;
top: 41px;
width: 330px;
z-index: 1000;
border-radius: 16px;
background: #fff;
box-shadow: 0px 6px 16.8px 0px rgba(0,0,0,0.25);
color: #222;
padding: 20px 15px 15px;
}

.DivHeaderBut .dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}

.DivHeaderBut .dropdown a:hover {
background-color: #ddd;
}

.show {
display: block;
}

.user_accessibility {
position: relative;
}

.user_accessibility .access-type::after {
content: "";
border-bottom: 7px solid #fff;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
position: absolute;
left: 49%;
bottom: calc(100% - 1px);
z-index: 2;
}

.user_accessibility .access-type .tool-item {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 10px;
}

.user_accessibility img {
width: 17px;
height: 17px;
display: block;
margin: 0 auto;
}

.user_accessibility .access-type .tool-item button, .user_accessibility .access-type .tool-item a {
border-radius: 4px;
background: #EEE;
color: #222;
border: none;
padding: 10px;
text-align: center;
line-height: 1.2;
font-size: 12px;
font-weight: 600;
}

.user_accessibility .access-type .tool-item button:hover {
background: #85a0b152;
}

.user_accessibility .access-type .tool-item .high-contrast i {
background: url("../images/header-icon.svg#high-contrast-black") no-repeat;
width: 19px;
height: 19px;
}

.decrease-text img {
rotate: 180deg;
}

.tool-title {
font-weight: 600;
}

.tool-name {
font-weight: 600;
}

/**************** Testimonials ******************/
.testimonial {
position: relative;
z-index: 0;
background: rgba(247, 250, 252, 0.5);
/*background-image: linear-gradient(to right top, #f0f0f0, #efeff2, #eeeef4, #eceef6, #e9edf8, #e9edf8, #e8ecf7, #e8ecf7, #eaecf4, #ebebf1, #ebebee, #ebebeb);*/
}
.testimonial .carousel-item
{
    height:100% !important;
}
.modern-client {
display: flex;
align-items: center;
}

.modern-client .img-left {
position: relative;
}

.img-fluid {
max-width: 100%;
height: auto;
}

.modern-client .comment-right {
left: -0px;
padding: 20px;
border-radius: 5px;
min-height: 233px;
/*box-shadow: -2.575px 4.286px 25px #00000012;*/
background-color: #fff;
width: 100%;
/*margin-left: -60px;*/ z-index: 1;
position: relative;
background: #fff;
border: 1px solid rgba(0,0,0,.3);
}

.font-roboto {
position: relative;
display: flex;
min-height: 107px;
overflow: hidden;
}

.commaabsolute {
width: 25px !important;
height: 25px !important;
margin-right: 10px;
}

.carousel-control-next,
.carousel-control-prev /*, .carousel-indicators */ {
filter: invert(100%);
}

.carousel-control-next, .carousel-control-prev {
width: 8% !important;
}

.comment-right {
font-size: 14px;
}

.comment-right h6 {
text-align: left;
font-weight: 600;
}

.comment-right h6 {
display: flex;
}

.comment-right h6 img {
height: 60px;
margin-right: 10px;
width: 60px;
}

.modern-client .img-left img {
border-radius: 5px;
filter: drop-shadow(0 0 35px rgba(0,0,0,.07));
}

.carousel-inner {
position: relative;
width: 85% !important;
/*width: 77% !important;*/
overflow: hidden;
margin: 0 auto;
text-align: justify;
}

.right-height {
background-color: #fff;
}

.carousel {
position: relative;
/*padding: 50px 0;*/
}

.carousel-indicators {
display: none !important;
}
/* Side bar toggle */
/* #openMenuBtn {
position: absolute;
right: 0;
top: 83px;
cursor: pointer;
display: flex;
font-size: 15px;
font-weight: 700;
height: 146px;
border-radius: 0 5px 5px 0;
bottom: calc(50% - 230px);
text-align: center;
text-orientation: mixed;
transform: rotate(180deg);
transition: .45s ease-in-out;
writing-mode: vertical-rl;
align-items: center;
backface-visibility: hidden;
background-color: #435191 !important;
border: 0 !important;
padding: 15px 7px;
} */
#openMenuBtn {
position: absolute;
  right: 0;
  top: 160px;
  bottom: calc(50% - 230px);
  cursor: pointer;
  
  display: -ms-flexbox;       /* IE10 */
  display: flex;
  -ms-flex-align: center;     /* IE10 */
  align-items: center;
  
  font-size: 15px;
  font-weight: 700;
  height: 146px;
  
  text-align: center;
  
  
  border-radius:5px  0 0 5px;
  
  -webkit-transition: .45s ease-in-out;
  -moz-transition: .45s ease-in-out;
  -o-transition: .45s ease-in-out;
  transition: .45s ease-in-out;
  
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  
  background-color: #435191 !important;
  border: 0 !important;
  padding: 15px 7px;
}
.side-menu {
position: fixed;
top: 0;
right: -300px; /* Initially hidden on the right */
width: 300px;
height: 100%;
background-color: #fff;
transition: right .45s ease-in-out;
z-index: 100000;
box-shadow: rgba(0, 0, 0, 0.3) 5px 0px 30px;
}

.side-menu .close-btn {
position: absolute;
top: -4px;
left: 20px;
font-size: 30px;
color: #171717;
cursor: pointer;
}

.side-menu .menu-content {
margin-top: 2px;
padding: 20px;
}

.side-menu .menu-item {
padding: 10px 0;
font-size: 18px;
}

.side-menu .menu-item a {
text-decoration: none;
}

.side-menu .menu-item a:hover {
color: #007bff;
}
/* Scroll Slim styles */
/* Scroll */
.scroll-y {
overflow-y: scroll;
position: relative;
}

div, ol, pre, span, ul {
scrollbar-width: thin;
scrollbar-color: #f6f1ff transparent;
}

.scroll-y::-webkit-scrollbar {
width: 5px;
height: 5px;
}

.scroll-y::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
-webkit-border-radius: 10px;
border-radius: 10px;
}

.scroll-y::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(255, 255, 255, 0.3);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

.scroll-y::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255, 255, 255, 0.3);
}

/* Side bar content toggle notification */
.current_linkcontent h3 {
font-size: 15px;
font-weight: 600;
margin:5px 0;
}

.current_linkcontent ul {
margin:0 !important;
padding: 0;
}

.current_linkcontent ul li {
padding:10px 0;
font-size: 13px;
border-bottom: 1px dashed #ddd;
}

.clickHere {
background-color: #3864d314;
color: #000;
font-size: 13px;
padding: 2px 5px;
border-radius: 0.5rem;
}

.clickHere:hover {
background-color: #ea7663;
color: #fff !important;
}
/** Find KIOSK **/
.findKIOSK {
/*background: #f2f4fb !important;*/
}

.findKIOSK-in {
margin-top: -100px;
position: relative;
background-color: #fff;
padding: 30px;z-index:0 !important;
/*-webkit-box-shadow: 0 2px 80px -10px rgba(0, 0, 0, 0.2);
box-shadow: 0 2px 80px -10px rgba(0, 0, 0, 0.2);*/
border-radius: 12px;
background: #FFF;
background-color: rgb(255, 255, 255);
box-shadow: 0px 0px 34px 0px rgba(133, 133, 133, 0.25);

}

.findKIOSK .form-group label {
font-size: 17px !important;
font-weight: 600;
letter-spacing: normal !important;
line-height: 24px;
}

.findKIOSK-in h4 {
font-weight: 600;
font-size: 20px;
}

.nearby {
position: absolute;
top: 0;
right: 0;
border: 0;
border-radius: 0 !important;
}

.findKIOSK-in {
position: relative;
z-index:1;
overflow: hidden;
}

.kioskImage {
height: 210px;
position: absolute;
right: -30px;
z-index: -1;
opacity: .1;
top: -30px;
}

.findKIOSK-in .searchbtn {
width: 100%;
border-radius: 30px !important;
color: #fff !important;
background-color: #1937B2 !important;
padding:10px 10px 10px 20px !important;
font-size: 14px;
border-color: #1937B2;
display:block !important;
}

.findKIOSK-in .searchbtn:hover {
opacity: .9;
}

.form-select {
display: block;
width: 100%;
padding:10px 10px 10px 20px !important;
font-size: 1rem;
font-weight: 400;
color: #94979E;
background-color: rgba(169, 172, 177, 0.08);
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: right 0.75rem center;
background-size: 16px 12px;
border: 1px solid #BFC1C5;
border-radius: 30px !important;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

.findKIOSK-in .form-control {
height: auto;
border: 1px solid #bfc9d4;
color: #3b3f5c;
font-size: 15px;
letter-spacing: 0 !important;
height: auto;
appearance: auto !important;
border-radius: 3px;
padding: 11px 8px;
}

.field-icon-wrap .icon {
position: relative;
}

.field-icon-wrap .icon img {
position: absolute;
width: 20px;
height: 20px;
top: 7px;
right: 11px;
}

/* CMRF */
.cmrf {
position: relative;
z-index: 0;
overflow: hidden;
}

.cmrfPromote {
max-width: 100%;
}

.cmrf-content h2 {
padding: 0 0 5px;
font-size: 50px;
}

.cmrf-content h2 strong {
color: #ff6b31;
}

.cmrf-content h2 span {
font-size: 28px;
}

.cmrf p {
color: #000;
}

p {
text-align: justify;
}

.scansupport {
padding: 10px 0;
}

.scansupport h2 {
text-align: center;
display: block;
line-height: 1;
font-family: "Satisfy", serif;
font-size: 30px;
color: #48a267;
margin: 0;
}

.cmrf-scanCode {
margin: 0 auto;
text-align: center;
}

.cmrf-scanCode img {
width: 100px;
box-shadow: -50px -50px 0 -46px #ff9800, 50px 50px 0 -46px #ff9800;
margin-bottom: 20px;
}

.cmrf-scanCode span {
display: block;
font-weight: 500;
}

.scansupport strong {
text-align: center;
display: block;
line-height: 1;
font-family: "Satisfy", serif;
font-size: 20px;
color: #000;
margin: 10px 0 0 0;
}

.donateimage {
width: 100%;
position: absolute;
right: -280px;
height: 100%;
top: 0;
opacity: .1;
z-index: -1;
}


/* Slider banner */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

.img-slider {
position: relative;
width: 100vw;
/*! height: 400px; */
}

.img-slider .slider-container {
position: absolute;
width: 300%;
top: 0;
left: 0;
overflow: hidden;
animation: slider 26s infinite;
height: 400px;
}

.img-slider .slider-container .slide {
position: relative;
width: 33.33333333%;
height: 100%;
float: left;
overflow: hidden;
}

.img-slider .slider-container .slide img {
display: block;
max-width: 100%;
height: 100%;
}

.slider-container .slide:after {
content: '';
position: absolute;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,.5);
top: 0;
}

@keyframes slider {
0%, 25%, 100% {
left: 0;
}

30%, 55% {
left: -100%;
}

60%, 85% {
left: -200%;
}
}

.footer_cell {
padding: 15px 0;
}

.footer_one_design {
display: inline-block;
}




/* New responsive changes 24042025 */
@media screen and (max-width: 600px) {
#DivHeaderBut .d-none {
display: block !important;
}

.owl-carousel .owl-item img {
display: block;

margin:0 auto;
}

.findKIOSK-in {
margin-top: 0;
}

.home-demo .boxSwipe {
padding: 9px;
}

.citizen-services .nav-link {
width: 100%;
background-color: #ddd !important;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
background-color: #1937b2 !important;
color: #fff !important;
border-radius: 10px 10px 0 0;
}

.nav-tabs .nav-link {
margin-bottom: 2px !important;
border-radius: 0 0 10px 10px;
}

.citizen-services .nav-link:hover {
color: #fff !important;
background-color: #1937b2 !important;
outline: 0 !important;
}

.nav-link img {
display: none;
}

.findKIOSK-in .form-control {
padding: 12px 18px;
}


.findKIOSK-in .searchbtn {
padding: 12px 18px !important;
}

.portal-header {
background-color: #fff;
padding: 10px 0;
}


}


.navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important;
}

.navbar-toggler {
padding: 0 0 !important;
background-color: transparent;
border: 1px solid #fff !important;
}

.navbar-toggler:focus {
text-decoration: none;
outline: 0;
box-shadow: 0 0 0 #ddd !important;
}

.navbar-toggler {
width: 40px;
height: 40px;
}

.custom-toggler.navbar-toggler {
border-color: lightgreen;
}

@keyframes slidy {
0% {
left: 0%;
}

20% {
left: 0%;
}

25% {
left: -100%;
}

45% {
left: -100%;
}

50% {
left: -200%;
}

70% {
left: -200%;
}

75% {
left: -300%;
}

95% {
left: -300%;
}

100% {
left: -400%;
}
}


div#slider {
overflow: hidden;
}

div#slider figure img {
width: 20%;
float: left;
}

div#slider figure {
position: relative;
width: 500%;
margin: 0;
left: 0;
text-align: left;
font-size: 0;
animation: 30s slidy infinite;
}







@media screen and (max-width: 786px) {

/*.mpo-logo.float-start {float:none !important;}*/
.mpo-logo {text-align:center !important;float:none !important;}
.portal-top-row .font01 {
font-size: 16px;
height: 20px;
width: 20px;
}
.navbar-toggler {
width: 40px;
height: 40px;
margin: 5px;
}
.DivHeaderRight.float-end {
float:none !important;
}

}
@media screen and (max-width: 600px) {
.DivHeaderBut .dropbtn {display:none;}
#footer p {
text-align: center;
}
.portal-innerheader h4 {
    font-size: 30px !important;
    
}
.container-csr {
    width: 90% !important;
    margin: 0 auto;
}
}
@media screen and (min-width: 1200px) {
.container {
max-width:95% !important;
}
body {
font-size:100%;
}
}
.loginLinks {
position:static !important;
margin-top:7px;
}



@media (min-width: 1400px) {
body {
font-size: 18px !important;
}

h1 {
font-size: 3rem !important; /* e.g. 48px */
}

h2 {
font-size: 2.2rem !important;
}

p {
font-size: 1.125rem !important; /* ~18px */
}

.container {
max-width: 1440px !important;
padding: 0 40px;
}

/*.section {
padding: 80px 0 !important;
}*/

div#slider figure {
height: 300px;
}
.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
max-width: 1320px !important;
}
.paneltxt .scroll-y {
height:100vh !important;
}

.aboutUs-services .mission-img {
margin:0 !important;width: 100%;height:auto !important;
}

}




/* Slider banner */
#slider-container {
position: relative;
width: 100%;
max-width: 100%;
margin: auto;
overflow: hidden;
}

#slider {
overflow: hidden;
}

#slider figure {
display: flex;
width: 500%;
margin: 0;
left: 0;
position: relative;
transition: left 0.5s ease-in-out;
animation: 30s slidy infinite;
}

#slider figure img {
width: 20%;
float: left;
}

@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}

/* Control Buttons */
.loginbtn {
background-color:#d1dfff !important;margin-left: 10px;
}
.loginbtn:hover {
background-color:#1b55e2 !important;
} .applykiosk {
color:#fff !important;
background: #1937b2 !important;

}
.applykiosk:hover {
color:#000 !important;
background-color:#d1dfff !important;border:1px solid #d1dfff !important;
}
#prev, #next {
position: absolute;
top: 50%;
transform: translateY(-50%);
background: rgba(0,0,0,0.5);
color: white;
border: none;
padding: 10px 15px;
font-size: 18px;
cursor: pointer;
z-index: 0;
}

#prev {
left: 40px;
}

#next {
right: 40px;
}
.owl-carousel.owl-drag .owl-item{
/*padding:30px 0;*/
}
.owl-carousel.owl-drag .owl-item .home-demo .boxSwipe {
box-shadow: 0px 14px 22px -9px #bbcbd8;
}
.boxSwipe {color:#000;}
.boxSwipe h3
{
    margin:0;
}
 .boxSwipe span{
font-size: 18px;
    font-weight: 600;
    margin: 10px 0 -6px 0;
    display: block;text-align:center;
}
.boxSwipe p 
{
    margin:0;padding:0;    opacity: .5;
    display: block;
    font-weight: 400;
    font-size: 12px !important;
}
 .boxSwipe p span {
    display: block;
    font-weight: 400;
    font-size: 12px !important;
} 
.home-demo .item:hover {
background: #ebf6ff;border-radius:20px;
transition:.5s ease all;
box-shadow: 0px 14px 22px -9px #bbcbd8;
}

.citizen-services {
position: relative;
z-index: 0;
background:#ecf0f2;
z-index: 0;
}

.paneltxt .scroll-y {
overflow-y: scroll;
position: relative;
padding: 16px;
margin-right: -10px;
}
.footerlinks-mpologo img {width:70%; margin-bottom:10px;}
.countsportal {
padding:10px 0 0 0;
}
.countsportal span {
color:#fff;font-size:13px;

}
.aboutUs-services .mission-img {
height: 428px;
display: block;
margin: 0 auto;
border-radius: 10px;
}

/* banner css */
#imageCarousel .carousel-item img {
object-fit: fill;
    height: 100%;
    width: 100%;
}
#imageCarousel .carousel-inner {
margin:0;width:100% !important;
}
.carousel {
position: relative;
z-index: 0;
}
/*.carousel-item {height:350px;} */
/*************************
    CItizen Services page design CSS 
*********************************************/
/* Sidebar */
    .sidebar {
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(10px);
      border-right: 1px solid rgba(255, 255, 255, 0.2);
      min-height: 100vh;
    }

    .sidebar .nav-link {
     color: #fff;
  font-weight: 500;
  padding: 9px 16px;
  border-radius: 8px;
  transition: all 0.3s ease;
  font-size: 14px;
    }

    .sidebar .nav-link:hover,
    .sidebar .nav-link.active {
      background-color: rgba(255, 255, 255, 0.2);
      color: #fff;
    }

    .sidebar-title {
      font-size: 1.5rem;
      font-weight: 600;
      color: white;
    }

    /* Tag Pills (for mobile or filter section) */
    .filter-tags {
      overflow-x: auto;
      white-space: nowrap;
    }

    .filter-tags .btn {
      margin-right: 0.5rem;
      margin-bottom: 1rem;
    }

    /* Service Cards */
    .service-card {
      border: none;
      border-radius: 16px;
      transition: all 0.3s ease-in-out;
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
      background: white;
    }

    .service-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
    }

    .service-logo {
      width: 68px !important;
      height: 68px !important;
      object-fit: contain;
    }

    @media (max-width: 768px) {
      .sidebar {
        display: none;
      }
      #panel, .slide {
       width: 100% !important;  
    }
    }

    .service-card p {
        font-size:13px;text-align:left;
    }
    .sidebar {position:relative;
                 background-image: url('../images/sidebar.jpg');
    background-position:center;
    background-size:cover;
    z-index:0;
              }
    
.bg-dark.sidebar {
  --bs-bg-opacity: 1;
  background-color: rgb(70, 78, 114) !important;
}
.DivHeaderBut .small, .DivHeaderBut .medium, .DivHeaderBut .large 
{
	border:0 !important;}
 
 
 
 /* Citizen Home */
 
ul.resp-tabs-list, ul.resp-tabs-list p
 {
  margin: 0px;
  padding: 0px;
  font-size:1.1em;
  color:#888;
}

.resp-tabs-list li {
   color: #fff;
    font-weight: 500;
  
    transition: all 0.3s ease;
    font-size: 14px;
}
 
.resp-tabs-container {
  padding: 0px;
  clear: left;
}

h2.resp-accordion {
  cursor: pointer;
  padding: 5px;
  display: none;
}

.resp-tab-content {
  display: none;
  padding: 15px;
}

.resp-tab-active {
 
  border-bottom: none;
  margin-bottom: -1px !important;
 
  
}
.resp-vtabs .resp-tabs-list li a {
   color: #fff;
    font-weight: 600;
    padding: 9px 16px;
    border-radius: 8px;
    transition: all 0.3s ease;
    font-size: 14px;
    display: block;
}
.resp-tab-active {
  border-bottom: none;
}

.resp-content-active,
.resp-accordion-active { display: block; }

.resp-tab-content { border: 1px solid #c1c1c1; }

h2.resp-accordion {
 
  border: 1px solid #eee;
  border-top: 0px solid #c1c1c1;
  margin: 0px;
  padding: 10px 15px;
}

h2.resp-tab-active {
  border-bottom: 0px solid #c1c1c1 !important;
  margin-bottom: 0px !important;
  padding: 10px 15px !important;
}

h2.resp-tab-title:last-child {
  border-bottom: 12px solid #c1c1c1 !important;
  background: blue;
}
 
/*-----------Vertical tabs-----------*/
 
.resp-vtabs ul.resp-tabs-list {
  float: left;
  width:20%;
}
 
.resp-vtabs .resp-tabs-list li {
    display: block;
}
.resp-vtabs .resp-tabs-container {
  padding: 0px;
  float: left;
  width: 79%;
  border-radius: 4px;
  clear: none;
}

.resp-vtabs .resp-tab-content { border: none; }

.resp-vtabs li.resp-tab-active {
  border: none;
  border-right: solid 5px #438bc8;
  position: relative;
  z-index: 1;
  border-bottom:solid 1px #fff;
  margin-right: 0 !important;
 
  background-color:#fff;
}

.resp-arrow {
  width: 0;
  height: 0;
  float: right;
  margin-top: 3px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 12px solid #c1c1c1;
}

h2.resp-tab-active span.resp-arrow {
  border: none;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 12px solid #9B9797;
}
 
/*-----------Accordion styles-----------*/

 h2.resp-tab-active { background: #f2f2f2 !important; }

.resp-easy-accordion h2.resp-accordion { display: block; }

.resp-easy-accordion .resp-tab-content { border: 1px solid #c1c1c1; }

.resp-easy-accordion .resp-tab-content:last-child { border-bottom: 1px solid #c1c1c1 !important; }

.resp-jfit {
  width: 100%;
  margin: 0px;
}

.resp-tab-content-active { display: block; }

h2.resp-accordion:first-child { border-top: 1px solid #ddd !important; } 
/*Here your can change the breakpoint to set the accordion, when screen resolution changed*/
  @media only screen and (max-width: 768px) {

ul.resp-tabs-list { display: none; }

h2.resp-accordion { display: block; color:#000; font-weight:100; }

.resp-vtabs .resp-tab-content { border: 1px solid #eee; }

.resp-vtabs .resp-tabs-container {
  border: none;
  float: none;
  width: 100%;
  min-height: initial;
  clear: none;
}

.resp-accordion-closed { display: none !important; }

.resp-vtabs .resp-tab-content:last-child { border-bottom: 1px solid #c1c1c1 !important; }
}

 
.reset {
  
    color: #fff;
    font-size: 13px !important;
    
}
.fcdvtable input 
{
	margin:0 !important;
}
/* 12.10.2020 */
 .resp-tab-item .resp-tab-active {
border-right:10px solid red !important;
}
.resp-tab-active {
    border-right:10px solid #c1c1c1 !important;
    
}

  .tab-link
        {
            padding: 10px;
            color: black;
            text-decoration: none;
        }
        
        .tab-link.active
        {
             background-color: rgba(255, 255, 255, 0.2);
    color: #fff;
        } 
        
     
        .item-content .card 
        {
        width: 32%;
    float: left;
    margin: 0 10px 10px 0;
    
}
      
      
  
input[type="radio"], input[type="checkbox"] 
{
     vertical-align: middle;
     margin-right:3px;
}