@import url('https://fonts.googleapis.com/css?family=Nunito:300,400,700,900');



:root {

  --color-primary: 0 40 84;

  --color-accent: 255 149 45;

  --color-bg: 248 250 252;

  --color-text: 15 23 42;

}



input,

textarea,

select,

ol,

ul,

li,

a,

p,

h1,

h2,

h3,

h4,

h5,

h6 {

  margin: 0;

  text-decoration: none;

  outline: none;

  list-style: none;

  padding: 0;

}



html {

  scroll-behavior: smooth;

}



a,

a:hover,

a:focus,

*:focus-visible {

  cursor: pointer;

  -webkit-transition: all 0.4s ease 0s;

  -moz-transition: all 0.4s ease 0s;

  transition: all 0.4s ease 0s;

  text-decoration: none;

  outline: none;

}



button:focus {

  outline: none;

  border: none;

}



button:focus,

input:focus {

  box-shadow: none !important;

}



button {

  cursor: pointer;

}



*,

*:after,

*:before {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}



body {

  margin: 0;

  padding: 0;

  text-wrap: balance;

  scroll-behavior: smooth;

  overflow-x: hidden;

  font-family: 'Nunito', sans-serif;

}



.custome-blur {

  background: rgba(255, 255, 255, 0.2);

  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

  backdrop-filter: blur(50px);

  -webkit-backdrop-filter: blur(50px);

}



.dot-bg {

  background-image: url(../images/chess-scaled.png);

  background-size: 5%;

}



.card-blur {

  background: rgba(255, 255, 255, 0.2);

  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

  backdrop-filter: blur(10px);

  -webkit-backdrop-filter: blur(10px);

  border: 1px solid #19a0d57a;

}



.dark-light {

  background: linear-gradient(90deg,

      rgba(5, 5, 5, 0.53) 0%,

      rgba(237, 221, 83, 0) 100%);

}



.mainmenu ul {

  display: flex;

  gap: 32px;

}



.mainmenu li.ti a {

  font-family: 'Nunito' !important;

  font-weight: 600 !important;

  font-size: 14px !important;

  margin-left: 5px !important;

  padding: 20px 0;

}



.mainmenu ul.sub-menu {

  display: none;

  position: absolute;

  background: #fff;

  min-width: 220px;

  z-index: 9999;

  padding: 10px;

  top: 60px;

  border-radius: 12px;

  box-shadow: 0px 20px 60px 0px rgba(0, 0, 0, 0.15);

}



.mainmenu ul.sub-menu li a {

  border-radius: 6px;

  width: 100%;

  display: block;

  padding: 15px;

  margin: 0 !important;

}



.district-content p {

  margin-bottom: 20px;

  color: rgb(55 65 81);

  font-size: 18px;

  line-height: 1.6;

  text-wrap: wrap;

}



.mainmenu ul.sub-menu li a:hover {

  background: #002854;

  color: #fff;

  width: 100%;

  display: block;

}



.mainmenu .ti-map-pin:after {

  content: "\ea5f";

}





.mainmenu li:hover>ul.sub-menu {

  display: block;

}



.contactform p span {

  margin-bottom: -10px;

  display: block;

}



.pagination-wrapper ul.page-numbers,

.pagination .nav-links {

  display: flex;

  gap: 20px;

  justify-content: center;

}



.pagination-wrapper ul.page-numbers li a,

.pagination-wrapper ul.page-numbers li span,

.pagination .nav-links a,

.pagination .nav-links span {

  list-style: none;

  border: 1px solid rgb(209 213 219);

  border-radius: 5px;

  padding: 10px 15px;

  color: #000;



  &:hover {

    background: #002854;

    border-color: #002854;

    color: #fff;

  }

}



.pagination-wrapper ul li .page-numbers.current,

.pagination .nav-links span.current,

.pagination .nav-links .current {

  background: #002854;

  border-color: #002854;

  color: #fff;

}



form#searchform div {

  border: 1px solid #002854;

  width: fit-content;

  margin: auto;

  background: #eee;

  border-radius: 8px;

}



form#searchform div input {

  background: transparent;

  padding: 20px;

}



form#searchform div input[type="submit"] {

  background: #002854;

  color: #fff;

  padding: 20px;

}


 .bannercontent h1 {
    font-size: 2.25rem;
    font-weight:500;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 1.25rem;
    flex-wrap: wrap;
    color: white;
    margin-bottom: 1.5rem;
  }

  .bannercontent h1 strong {
    background-color: #002854; 
    color: white;
    border-radius: 0.375rem; 
    padding-left: 1.5rem;
    padding-right: 1.5rem; 
    padding-top: 0.75rem; 
    padding-bottom: 0.75rem; 
    white-space: nowrap;
    display: inline-block;
  }

  .bannercontent p {
    color: white;
    margin-bottom: 2rem;
  }

  @media (min-width: 768px) {
    .bannercontent h1 {
      font-size: 3.75rem; 
    }
    
    .bannercontent p {
      font-size: 1.25rem;
      line-height: 1.75rem;
      padding-left: 4rem;
      padding-right: 4rem;
    }
  }