/* ====common css start here===== */
@charset "utf-8";

/* new 14-03-2024 */
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Piazzolla:ital,opsz,wght@0,8..30,100..900;1,8..30,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Playball&display=swap');

:root {
  --color-black: #000;
  --color-white: #fff;
  --color-red: #034972;
  --color-cream: #fbf6d4;
  --color-orange: #f58020;
  --color-dark: #373c40;
  --color-light-gray: #c9d5db;
  --color-green: #00fc9c;
  --color-blue: #034972;
  --color-sky-blue: #1395e1;
  --color-text-gray: #636262;
  --color-gray: #707070;
  --pera-font: "Poppins", sans-serif;
  --heading-font: "Piazzolla", serif;
  --roboto-font: "Roboto", sans-serif;
  --architects-font: "Architects Daughter", cursive;

  --btn-font: "Be Vietnam Pro", sans-serif;
  --font-banner: "Bebas Neue", sans-serif;
}

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-family: var(--pera-font);
}

/* ==========loader common css========== */

.loader img {
  width: 150px;
}

.loaderWrap {
  position: fixed;
  height: 100%;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 9991;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(255 255 255 / 88%);
  transition: all 300ms ease-in-out;
}

.loader-off.loaderWrap {
  opacity: 0;
  visibility: hidden;
}

/* ============Loader Two CSS Start=============== */

@keyframes loader {
  0% {
    transform: rotate(-45deg);
  }

  50% {
    transform: rotate(-135deg);
  }

  100% {
    transform: rotate(-225deg);
  }
}

@keyframes span-1 {
  0% {
    transform: translate(0);
  }

  50% {
    transform: translate(-50px, 0);
    border-color: #ee4d68;
  }

  100% {
    transform: translate(0);
  }
}

@keyframes span-2 {
  0% {
    transform: translate(0);
  }

  50% {
    transform: translate(50px, 0);
    border-color: #875678;
  }

  100% {
    transform: translate(0);
  }
}

@keyframes span-3 {
  0% {
    transform: translate(0);
  }

  50% {
    transform: translate(0, -50px);
    border-color: #ff9900;
  }

  100% {
    transform: translate(0);
  }
}

@keyframes span-4 {
  0% {
    transform: translate(0);
  }

  50% {
    transform: translate(0, 50px);
    border-color: #00e4f6;
  }

  100% {
    transform: translate(0);
  }
}

.loader2 {
  width: 50px;
  height: 50px;
  position: relative;
  animation: loader 2s infinite ease-in-out;
}

.loader2 span {
  width: 50px;
  height: 50px;
  position: absolute;
  left: 0;
  top: 0;
  border: 4px solid #0b1b48;
}

.loader2 span:nth-child(1) {
  animation: span-1 2s ease-in-out infinite;
}

.loader2 span:nth-child(2) {
  animation: span-2 2s ease-in-out infinite;
}

.loader2 span:nth-child(3) {
  animation: span-3 2s ease-in-out infinite;
}

.loader2 span:nth-child(4) {
  animation: span-4 2s ease-in-out infinite;
}

/* ============Loader Two CSS End=============== */
/* ------Scrollbar CSS Start----- */

/* Chrome, Edge, and Safari */
.notslistmain::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.notslistmain::-webkit-scrollbar-track {
  background: var(--color-cream);
}

.notslistmain::-webkit-scrollbar-thumb {
  background-color: var(--color-red);
  border-radius: 0px;
  border: 0px solid var(--color-white);
  border-radius: 5px;
}

/* ------Scrollbar CSS End----- */
body {
  margin: 0;
  padding: 0;
  font-size: 13px;
  line-height: 23px;
  color: var(--color-black);
  font-weight: 500;
  font-family: var(--para-font);
  overflow: hidden;
}

html,
body {
  overflow-x: hidden;
}

p {
  padding: 0;
  color: var(--color-black);
  font-weight: 400;
  line-height: 1.6;
  font-size: 14px;
}

p:last-child {
  margin-bottom: 0;
}

a {
  color: var(--color-blue);
  display: inline-block;
  vertical-align: top;
  text-decoration: none;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

a:hover,
a:focus {
  color: var(--color-white);
  text-decoration: none;
  box-shadow: none;
  outline: none;
}

figure {
  margin: 0;
  padding: 0;
  display: block;
}

img {
  max-width: 100%;
}

h1,
h2,
.heading {
  font-family: var(--heading-font);
  color: var(--color-black);
  position: relative;
  letter-spacing: 0;
  margin-bottom: 18px;
  font-size: 36px;
  font-weight: 500;
  line-height: 1.3;
}

h1 strong,
h2 strong,
.heading strong {
  font-weight: 500;
}

h3,
h4,
h5,
.subheading {
  font-family: var(--subheading-font);
  color: var(--color-blue);
  font-size: 20px;
  line-height: normal;
  font-weight: 500;
}

ol,
ul {
  margin: 0;
  padding: 0;
}
.form-control {
  height: 45px;
  border: 1px solid #e1e1e1;
  padding: 10px 15px;
  background-color: var(--color-white);
  font-size: 13px;
  color: var(--color-gray);
  font-weight: 500;
  letter-spacing: 0;
  border-radius: 5;
  box-shadow: none !important;
  font-family: var(--para-font);
}

select.form-control:not([size]):not([multiple]) {
  height: 50px;
}

textarea.form-control {
  height: 100px;
  resize: none;
}

.form-control::placeholder {
  color: var(--color-gray);
  font-family: var(--para-font);
}

.form-control:focus {
  border-color: var(--color-orange);
}

.sec-space {
  padding: 70px 0;
}

button:focus {
  outline: none;
}
.bg-custom {
  background: #fbfbfb;
}

/* comone button design */
.button-solid {
  background: transparent;
  color: var(--color-white);
  font-size: 13px;
  padding: 12px 22px;
  min-width: 150px;
  border: solid 1px var(--color-white);
  border-radius: 4px;
  font-weight: 500;
  transition: 0.5s;
}

.button-solid:hover {
  background-color: var(--color-white);
  color: var(--color-black);
}
.button-solid.btn-orange {
  background: var(--color-orange);
  color: var(--color-black);
  border-color: var(--color-orange);
}

.button-solid.btn-orange:hover {
  color: var(--color-orange);
  background-color: var(--color-black);
  border-color: var(--color-black);
}

.button-solid.btn-white {
  background: var(--color-white);
  color: var(--color-black);
}

.button-solid.btn-white:hover {
  color: var(--color-white);
  background-color: transparent;
}

.button-solid.border-btn {
  border: solid 1px var(--color-gray);
  color: var(--color-black);
}
.button-solid.border-btn:hover {
  color: var(--color-white);
  border: solid 1px var(--color-black);
  background-color: var(--color-black);
}

.button-solid.border-btn-white {
  border: solid 1px var(--color-white);
  color: var(--color-white);
}
.button-solid.border-btn-white:hover {
  color: var(--color-black);
  border: solid 1px var(--color-white);
  background-color: var(--color-white);
}

/*--------------Menu Section Start--------------*/

.menutop {
  background: #033959;
  padding: 3px 0;
}
.menutop .navbar {
  padding: 0;
}
.menutop ul {
  margin-bottom: 0;
  display: flex;
  flex-wrap: wrap;
}
.menutop ul li {
  display: inline-block;
  position: relative;
}
.menutop ul.sochalicon li {
  margin-right: 5px;
}
.menutop ul.sochalicon li a {
  color: var(--color-white);
  width: 27px;
  height: 27px;
  background-color: var(--color-white);
  line-height: 29px;
  text-align: center;
}

.menutop ul.sochalicon li a i {
  color: var(--color-red);
  font-size: 16px;
}
.right-text li {
  padding-right: 8px;
  padding-left: 8px;
  line-height: normal;
}

.right-text li a {
  color: var(--color-white);
  text-transform: uppercase;
  font-family: var(--pera-font);
  font-size: 13px;
  font-weight: 400;
}
.right-text li::after {
  content: "";
  right: 0;
  position: absolute;
  width: 1px;
  border-right: solid 1px;
  border-color: #00fc9c;
  height: 80%;
  top: 50%;
  transform: translateY(-50%);
}

.right-text li:last-child {
  padding-right: 0;
}
.right-text li:last-child::after {
  border: 0;
}

#myHeader {
  position: relative;
  min-height: 140px;
  top: 0;
  z-index: 999;
  width: 100%;
}

.menu_nav {
  background-color: #034972;
  /* background-image: linear-gradient(180deg, #CA1D3C 0%, #034972 100%); */
}

.menumain {
  width: 100%;
  z-index: 9999;
  transition: all 0.5s ease;
  position: relative;
  background-color: #f2f2fe;
  padding: 0px 0;
}

.menumain nav.navbar {
  padding-top: 0;
  padding-bottom: 0;
  transition: all 0.5s ease;
}
.menu_nav .stellarnav > ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.menu_nav .stellarnav > ul > li > a {
  color: var(--color-white);
  font-family: var(--roboto-font);
  font-size: 12px;
  font-weight: 300;
  text-transform: capitalize;
  line-height: 15px;
  border-right: 1px solid #0f6090;
}
.menu_nav .stellarnav ul ul {
  background-color: #fbf6d4;
}
.menu_nav .stellarnav li li a {
  padding: 8px 10px;
  font-family: var(--roboto-font);
  font-size: 13px;
  font-weight: 400;
  color: #034972;
  border-bottom: 1px solid #f9eecd !important;
  border-right: 1px solid #034972;
}
.menu_nav .stellarnav li li a:hover {
  background-color: #034972;
  color: #fbf6d4;
}

.brand-logo {
  display: flex;
  position: relative;
  padding: 0px 0;
  flex-wrap: wrap;
  align-items: center;
}

.brand-logo h1 {
  font-family: var(--heading-font);
  margin-bottom: 0;
  font-size: 35px;
  font-weight: 600;
  color: #2c191900;
  letter-spacing: 0.5px;
}
.gredenttext {
  background: linear-gradient(
    to left,
    #abd866 10%,
    #ee3b62 30%,
    #2c3e90 70%,
    #89482e 80%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  background-size: 500% auto;
  animation: textShine 4s ease-in-out infinite alternate;
}
@keyframes textShine {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}

.brand-logo h4 {
  font-size: 20px;
  font-weight: 700;
  color: var(--color-black);
  font-family: var(--heading-font);
  margin-bottom: 0;
  line-height: 1.3;
  letter-spacing: 0.2px;
}

.brand-logo img {
  max-width: 450px;
  width: 100%;
}
.brand-logo figure {
  margin-right: 10px;
}

/* 
.navbar .navbar-collapse > ul {
  flex-wrap: wrap;
  display: flex;
  margin: 0;
  justify-content: center;
  width: 100%;
}
.navbar .navbar-collapse ul li{
  list-style: none;
  margin: 0;
  padding: 0;
}
.navbar .navbar-collapse ul li a {
  color: var(--color-black);
  font-size: 13px;
  font-weight: 400;
  padding: 24px 5px;
  margin: 0px 15px;
  display: inline-block;
}

.navbar .navbar-collapse ul ul.dropdown-menu {
  box-shadow: 0 1px 6px rgb(32 33 36 / 28%);
  padding: 0;
  border: 0;
  overflow: hidden;
  background: var(--color-white);
  border-radius: 0;
  margin: 0;
}

.navbar .navbar-collapse ul ul.dropdown-menu li {
  padding: 0;
}

.navbar .navbar-collapse ul ul.dropdown-menu li a {
  display: block;
  padding: 8px 15px;
  border-left: solid 2px transparent;
  margin-left: 0;
  color: var(--color-black);
  font-weight: 400;
  font-size: 13px;
}

.navbar .navbar-collapse ul ul.dropdown-menu li a:hover {
  color: var(--color-black);
  border-left: solid 2px var(--color-blue);
  background-color: #f8f9fa !important;
}

.dropdown-toggle::after {
  width: 10px;
  height: 8px;
  border: 0;
  background-image: url(../images/down-aro.png);
  background-repeat: no-repeat;
  background-position: center;
  top: 3px;
  position: relative;
  background-size: contain;
} */

/* styke menu  */
.sticky .menu_nav {
  position: fixed;
  top: 0;
  z-index: 999;
  width: 100%;
  background-color: #034972;
  -webkit-animation-name: animationFade;
  -o-animation-name: animationFade;
  animation-name: animationFade;
  -webkit-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
  box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
}

/* menu fixd animation */

@-webkit-keyframes animationFade {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@-o-keyframes animationFade {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    -o-transform: none;
    transform: none;
  }
}

@keyframes animationFade {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    -o-transform: none;
    transform: none;
  }
}

/* menu animation end */

.book-btn {
  display: inline-block;
  padding: 10px 22px;
  color: var(--color-black) !important;
  background-color: var(--color-orange);
  font-size: 13px;
  text-transform: uppercase;
  border-radius: 4px;
}

.book-btn:hover {
  background-color: var(--color-white);
  color: var(--color-black) !important;
}

.certifecation {
  position: relative;
  padding-left: 32px;
  color: var(--color-white);
  font-size: 13px;
  font-weight: 400;
  text-align: center;
}

.certifecation figure img {
  width: 50px;
}
.certifecation h4 {
  font-size: 18px;
  font-weight: 700;
  color: #11931e;
  font-family: var(--heading-font);
  margin-bottom: 0;
  letter-spacing: 0.5px;
}

/*--------------Menu Section End--------------*/

/* =================scroll top css start here================ */

.go-top {
  bottom: 32px;
  transform: translateY(-98%);
  opacity: 1;
  visibility: visible;
  right: 30px;
  border-radius: 100%;
  z-index: 9;
  background: var(--color-red);
  display: inline-block;
  width: 50px;
  height: 50px;
  line-height: 45px;
  text-align: center;
  color: #fff;
  position: fixed;
  cursor: pointer;
  box-shadow: 0px 4px 6px rgb(32 33 36 / 28%);
  display: none;
  -webkit-animation-name: animationFade;
  -o-animation-name: animationFade;
  animation-name: animationFade;
  -webkit-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
}

.go-top.show {
  display: block;
}

.go-top::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-image: -moz-linear-gradient(0deg, #265cff 0%, #a2ffab 100%);
  background-image: linear-gradient(to right, #00132b 0%, #00132b 100%);
  background-image: -ms-linear-gradient(0deg, #265cff 0%, #a2ffab 100%);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
  border-radius: 100%;
}

.go-top::after {
  z-index: -1;
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 45px;
  height: 45px;
  -webkit-animation: ripple 1.6s ease-out infinite;
  -moz-animation: ripple 1.6s ease-out infinite;
  -o-animation: ripple 1.6s ease-out infinite;
  animation: ripple 1.6s ease-out infinite;
  opacity: 0;
  background-image: -webkit-linear-gradient(0deg, #03497294 0%, #03497294 100%);
  border-radius: 100%;
}

.go-top i {
  font-size: 20px;
  font-weight: 700;
  padding-left: 4px;
  color: #fff;
  position: absolute;
  top: 43%;
  left: -5px;
  right: 0;
  margin: 0 auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

.go-top i img {
  filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(13deg)
    brightness(104%) contrast(105%);
}

.go-top i:last-child {
  opacity: 0;
  visibility: hidden;
  top: 60%;
}

.go-top:focus i:last-child,
.go-top:hover i:last-child {
  opacity: 1;
  visibility: visible;
  top: 50%;
}

.go-top:focus i:first-child,
.go-top:hover i:first-child {
  opacity: 0;
  top: 0;
  visibility: hidden;
}

@keyframes ripple {
  0%,
  35% {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }

  50% {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0.8;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
  }
}

/* =================scroll top css start here================ */

/* ------------- Banner Section Start ------------- */
.banner-main {
  position: relative;
  overflow: hidden;
  border-radius: 0px 0px 50px 50px;
  box-shadow: 0px 10px 10px 0px rgb(160 119 200 / 60%);
  border-top: solid 0px #034972;
  border-bottom: solid 3.5px #034972;
  border-left: solid 2px #034972;
  border-right: solid 2px #034972;
}
.banner-main::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100px;
  height: 100%;
  background-color: var(--color-white);
  bottom: 0;
}

.banner-main .owl-carousel .owl-stage-outer {
  border-radius: 0px 0px 50px 50px;
  border-bottom: solid 3.5px #034972;
  margin-bottom: 3px;
}
/* .banner-main::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  background: url(../images/banner-buttom.png) no-repeat;
  background-size: 100% 102%;
  width: 100%;
  height: 165px;
  z-index: 9;
  border-bottom: solid 1px #fff;
} */
/* .banner_slide::after {
  content: "";
  background: linear-gradient(180deg, rgba(95, 95, 95, 0) 29.5%, #000000 99.97%);
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
} */
.banner-main .carousel-caption {
  left: unset;
  right: 0;
  top: unset;
  bottom: 60px;
  z-index: 9;
  padding: 0;
  margin: 0;
}
.banner-main h1 {
  font-family: "Roboto Slab", Sans-serif;
  font-size: 25px;
  font-weight: 700;
  font-style: italic;
  color: #0f547d;
  background-color: transparent;
  margin: 0px 0px 0px 0px;
  padding: 20px 20px 20px 20px;
  background-image: radial-gradient(at center center, #f2f2fe 0%, #83b6d4 100%);
  border-style: double;
  border-width: 5px 0px 5px 6px;
  border-color: #0f547d;
  border-radius: 30px 0px 0px 30px;
  box-shadow: -10px 0px 10px 0px rgb(174 196 210 / 60%);
}

.banner-main p {
  color: var(--color-white);
  font-size: 16px;
  font-weight: 300;
}

.carousel-indicators li {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-right: 4px;
  margin-left: 4px;
}

.carousel-indicators {
  bottom: 20px;
}

.owl-dots {
  text-align: center;
  position: absolute;
  bottom: 4px;
  width: 100%;
}
.owl-dots button.owl-dot.active span,
.owl-dots button.owl-dot:hover span {
  background-color: #fbf6d4;
  border-radius: 50%;
  height: 14px;
  width: 14px;
  position: absolute;
  top: 0px;
  left: 0px;
  transition: 0.5s;
}
.owl-dots button.owl-dot {
  border: 1px solid gray;
  background: #fbf6d480;
  border-radius: 50%;
  height: 15px;
  width: 15px;
  position: relative;
  margin: 0 5px;
}

.download-form {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 9;
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.3);
  border-radius: 30px;
  background-color: transparent;
  font-family: "Poppins", Sans-serif;
  font-size: 15px;
  font-weight: 400;
  text-transform: uppercase;
  fill: #ffffff;
  color: #ffffff;
  background-image: linear-gradient(180deg, #ffe602 0%, #af002c 100%);
  border-style: none;
  border-radius: 25px 25px 25px 25px;
  padding: 10px 45px 10px 45px;
  animation: blink 1.5s infinite;
  line-height: 25px;
}

/* ::after{
  
} */

@keyframes blink {
  0% {
    opacity: 0.8;
  }

  50% {
    opacity: 0;
  }

  100% {
    opacity: 0.8;
  }
}

section.sreep {
  padding: 16px 0;
}
.slide-strip {
  border-radius: 30px;
  padding: 0px;
  position: relative;
  overflow: hidden;
  display: flex;
}
.left-m {
  position: relative;
  background-color: transparent;
  background-image: linear-gradient(90deg, #004da7 0%, #ee4f6c 100%);
  width: 130px;
  text-align: center;
  flex-shrink: 0;
}
.left-m img {
  max-width: 45px;
  z-index: 9;
  position: relative;
}

.slide-strip::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(../images/dgh-1.webp);
  opacity: 0.2;
}
.slide-strip a {
  background-color: transparent;
  background-image: linear-gradient(90deg, #ee4f6c 0%, #fbf6d4 100%);
  width: 100%;
}
.slide-strip a marquee {
  line-height: 36px;
  height: 30px;
  font-size: 20px;
  font-family: var(--heading-font);
  font-weight: 500;
}

/* ------------- Banner Section End ------------- */

/* notest start */
.notsmain {
  padding: 10px 0 50px 0;
}

.boxmain {
  background-color: transparent;
  background-image: linear-gradient(
    rgb(255, 225, 230) 0%,
    rgb(212, 231, 253) 100%
  );
  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 3px 0px;
  padding: 14px 18px;
  border-style: solid;
  border-width: 1px;
  border-color: rgb(245, 245, 245);
  border-radius: 20px 0px;
  text-align: center;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
}
.boxmain:hover {
  background-color: transparent;
  background-image: linear-gradient(180deg, #034972 0%, #cdffd0 100%);
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
  border-radius: 0px 20px 0px 20px;
  top: 0;
  transform: translateY(-10px);
  transition: 0.5s;
}

.boxmain::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: transparent;
  background-image: radial-gradient(
    at center center,
    #fff6da 60%,
    #f2295b00 15%
  );
  left: 0;
  top: 100%;
  transition: 0.5s;
}

.boxmain:hover::before {
  top: 0;
}

.boxmain h2 {
  font-size: 14px;
  margin-bottom: 0;
  font-family: var(--heading-font);
  font-weight: 700;
}

.boxmain img {
  height: 65px;
  width: 65px;
  margin-bottom: 5px;
  object-fit: contain;
  position: relative;
}

.button-r {
  background-color: transparent;
  margin: 0px 0px 0px 0px;
  padding: 8px 25px;
  background-image: linear-gradient(45deg, #52ab4d 0%, #b81c1c 100%);
  border-radius: 30px 30px 30px 30px;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  display: block;
  text-align: center;
  line-height: 28px;
  min-height: 48px;
  font-size: 30px;
  color: #fff;
  font-family: var(--heading-font);
  letter-spacing: 0.5px;
  animation: blink 1.5s infinite;
}

.noteslist .nav-pills {
  display: flex;
  margin: 0 -5px;
}
.noteslist .nav-pills li {
  width: 33.33%;
  padding: 0 5px;
}
.noteslist .nav-pills .nav-link {
  width: 100%;
  background-color: transparent;
  padding: 10px 2px 10px 2px;
  color: #fbf6d4;
  background-image: radial-gradient(at center center, #3b7ca2 0%, #034972 100%);
  border-radius: 0;
  font-family: var(--heading-font);
  font-size: 15px;
  font-weight: 600;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: transparent;
  color: #002147;
  background-image: radial-gradient(
    at center center,
    #ffffff 0%,
    #054b74d1 100%
  );
}

.notsbox {
  text-align: left;
  background-color: #fbf6d4;
  margin: 0px 0px 0px 0px;
  padding: 10px 10px 10px 10px;
  margin-bottom: 5px;
}
.notsbox a {
  font-family: var(--heading-font);
  font-size: 14px;
  font-weight: 600;
  display: block;
  color: #002147;
}
.notsbox .date {
  color: #11931e;
  font-size: 13px;
  font-family: var(--roboto-font);
}
.empty-box {
  width: 100%;
  padding: 10px;
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
  text-align: center;
}

.notslistmain {
  height: 400px !important;
  overflow: auto;
}

.btn-vall {
  background-color: #10557d;
  font-family: var(--roboto-font);
  color: var(--color-white);
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
  border-radius: 30px 30px 30px 30px;
  padding: 12px 45px 12px 45px;
  letter-spacing: 0.5px;
  position: relative;
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}
.btn-vall > span::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.3);
  border-radius: 30px;
  z-index: 1;
  backdrop-filter: blur(15px);
}
.btn-vall > span > span {
  position: relative;
  z-index: 99;
}

/* .btn-vall::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(to left, rgba(255, 255, 255, 0.15), transparent);
  transform: skewX(45deg) translate(0);
  transition: 0.5s;
  filter: blur(0px);
} */

.btn-vall::after {
  content: "";
  position: absolute;
  transform: translatex(-50%);
  left: 50%;
  top: 0px;
  width: 30px;
  height: 10px;
  background: #237aad;
  border-radius: 10px;
  transition: 0.5s;
  transition-delay: 0.5;
}

.btn-vall::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translatex(-50%);
  bottom: 0px;
  width: 30px;
  height: 10px;
  background: #a5defe;
  border-radius: 10px;
  transition: 0.5s;
  transition-delay: 0.5;
}

.btn-vall:hover::after {
  top: 0;
  height: 50%;
  width: 80%;
  border-radius: 30px;
}
.btn-vall:hover::before {
  bottom: 0;
  height: 50%;
  width: 80%;
  border-radius: 30px;
}

/* welcome section start */
.welcomesection {
  background: #fbf6d4;
  position: relative;
  padding: 0 0 30px 0;
}
.welcomesection .container {
  position: relative;
}
.welcomesection::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background-color: transparent;
  background-image: linear-gradient(180deg, #fffffffc 0%, #fbf6d400 100%);
}

.sectiontitle h2 {
  font-size: 65px;
  font-weight: 700;
  color: #6ec1e400;
  text-align: center;
  line-height: 1.3;
  margin-bottom: 0;
}

.abtitle {
  border-style: dashed;
  border-width: 0px 0px 0px 1px;
  border-color: #dfdfdf;
  border-radius: 20px 0px 0px 20px;
  padding: 10px;
}
.abtitle h3 {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 500;
  color: #ff0330;
  margin-bottom: 0;
}
.abtitle h2 {
  font-size: 38px;
  font-weight: 600;
  color: #002147;
  margin-bottom: 10px;
}

.abimgmain {
  width: 100%;
  text-align: center;
  position: relative;
}
.abimgmain img {
  width: 90%;
  z-index: 9;
  position: relative;
  top: -15px;
}

.abimgmain::after {
  position: absolute;
  content: "";
  left: 15%;
  top: 5%;
  width: 450px;
  height: 450px;
  background-image: linear-gradient(
    -225deg,
    #862724 0%,
    #3ca904 37%,
    #ff1361 67%,
    #004799 100%
  );
  border-radius: 62% 47% 82% 35% / 45% 45% 80% 66%;
  will-change: border-radius, transform, opacity;
  animation: sliderShape 5s linear infinite;
  display: block;
  z-index: -1;
  animation: sliderShape 5s linear infinite;
  z-index: 0;
}

@keyframes sliderShape {
  0%,
  100% {
    border-radius: 42% 58% 70% 30% / 45% 45% 55% 55%;
    transform: translate3d(0, 0, 0) rotateZ(0.01deg);
  }

  34% {
    border-radius: 70% 30% 46% 54% / 30% 29% 71% 70%;
    transform: translate3d(0, 5px, 0) rotateZ(0.01deg);
  }

  50% {
    transform: translate3d(0, 0, 0) rotateZ(0.01deg);
  }

  67% {
    border-radius: 100% 60% 60% 100% / 100% 100% 60% 60%;
    transform: translate3d(0, -3px, 0) rotateZ(0.01deg);
  }
}

.pinsapaldetails {
  background-color: #034972;
  border-radius: 30px 30px 30px 30px;
  border-style: double;
  border-width: 10px 2px 10px 2px;
  border-color: #a2ffab;
  box-shadow: 0px 0px 50px 0px
    rgba(163.99999999999994, 35.999999999999986, 58.99999999999998, 0.24);
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  padding: 40px 20px;
  display: flex;
}
.pnimg {
  width: 30%;
}
.pindes {
  width: 70%;
  padding-left: 15px;
}
.principal_main {
  background: #fbf6d4;
  padding-bottom: 50px;
}
.pindes h2 {
  font-family: var(--heading-font);
  font-size: 30px;
  font-weight: 700;
  color: #fbf6d4;
  margin-bottom: 10px;
}
.pindes h3 {
  font-family: var(--heading-font);
  font-size: 22px;
  font-style: italic;
  font-weight: 700;
  outline-style: initial;
  outline-width: 0px;
  color: rgb(255, 249, 231);
  font-family: Piazzolla, sans-serif;
  text-align: left;
}
.pindes p {
  font-family: var(--architects-font);
  font-size: 20px;
  font-weight: 400;
  color: var(--color-white);
  line-height: 1.6;
}

.vision {
  border-style: double;
  border-width: 1px 10px 1px 0px;
  border-color: #034972;
  margin: 0px 50px 0px 0px;
  --e-column-margin-right: 50px;
  --e-column-margin-left: 0px;
  padding: 40px 40px 40px 0;
  border-radius: 0px 30px 30px 0px;
  width: 100%;
}

@keyframes vissionbox {
  16.65% {
    transform: skew(-12deg);
  }

  33.3% {
    transform: skew(10deg);
  }

  49.95% {
    transform: skew(-6deg);
  }

  66.6% {
    transform: skew(4deg);
  }

  83.25% {
    transform: skew(-2deg);
  }

  100% {
    transform: skew(0);
  }
}

.vissionbox {
  transform-origin: 100% 0;
  margin-bottom: 10px;
  background-color: #fff;
  padding: 10px 10px 10px 10px;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.26);
  border-style: solid;
  border-width: 2px 0px 0px 0px;
  border-color: #034972;
  border-radius: 0px 0px 10px 10px;
}
.vissionbox h3 {
  margin: 0px 0px 10px 0px;
  padding: 0px 0px 0px 0px;
  color: #002147;
  font-family: "Piazzolla", Sans-serif;
  font-size: 22px;
  font-weight: 700;
  font-style: italic;
}
.vissionbox p {
  font-size: 14px;
}

.vissionbox:active,
.vissionbox:focus,
.vissionbox:hover {
  animation-name: vissionbox;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}
.vissionbox:last-child {
  margin-bottom: 0;
}

/* College Achievement */

.achievement {
  background-color: transparent;
  background-image: linear-gradient(90deg, #ffffff00 0%, #f2f2fe 100%);
}
.achievement h2 {
  font-size: 35px;
  font-weight: 600;
  color: #002147;
}

.product-box {
  width: 100%;
  background-color: #fbf6d4;
}
.product-img {
  width: 100%;
  overflow: hidden;
}
.product-img img {
  transition: 0.5s;
}
.product-box:hover .product-img img {
  transform: scale(1.5);
}

a.pr-title {
  padding: 10px 10px;
  width: 100%;
}
a.pr-title h3 {
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 0;
  font-family: var(--heading-font);
}

/* OWL Aro start */
.owlnav-active .owl-nav {
  display: block;
}

.owlnav-active .owl-nav .owl-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 35px;
  height: 35px;
  /* border: solid 1px #E5EBF3 !important; */
  box-shadow: 0px 3px 6px #00000024;
  background: url(../images/left-i.png) no-repeat center #034972 !important;
  border-radius: 0px;
  left: -5px;
  font-size: 0 !important;
  background-size: 20px !important;
}

.owlnav-active .owl-nav .owl-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 35px;
  height: 35px;
  /* border: solid 1px #E5EBF3 !important; */
  right: -5px;
  box-shadow: 0px 3px 6px #00000024;
  background: url(../images/right-i.png) no-repeat center #034972 !important;
  border-radius: 0px;
  font-size: 0 !important;
  background-size: 20px !important;
}

.owlnav-active.vehicle-list .owl-nav .owl-prev {
  width: 40px;
  height: 40px;
  left: -18px;
}

.owlnav-active.vehicle-list .owl-nav .owl-next {
  width: 40px;
  height: 40px;
  right: -18px;
}

/* OWL Aro End */

/* College Is Start*/
.college_ismain {
  background: #034972;
  padding: 50px 0;
}
.college_ismain .titlec {
  margin-bottom: 30px;
}
.college_ismain .titlec h2 {
  text-align: center;
  font-size: 45px;
  font-weight: 600;
  color: #fbf6d4;
}
.clisbox {
  background-color: #02010100;
  padding: 30px;
  border-style: none;
  border-radius: 5px 5px 5px 5px;
  text-align: center;
}
.clisbox h3 {
  font-family: var(--heading-font);
  margin: 0px 0px 15px 0px;
  padding: 0px 0px 0px 0px;
  color: #fbf6d4;
  font-size: 25px;
  font-weight: 500;
  font-style: italic;
}
.clisbox p {
  color: #ffffff;
  font-family: var(--roboto-font);
  font-size: 15px;
  font-weight: 300;
}

.clisbox:active,
.clisbox:focus,
.clisbox:hover {
  box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.5);
  border-radius: 0px 0px 0px 0px;
  animation-name: elementor-animation-bob-float, elementor-animation-bob;
  animation-duration: 0.3s, 1.5s;
  animation-delay: 0s, 0.3s;
  animation-timing-function: ease-out, ease-in-out;
  animation-iteration-count: 1, infinite;
  animation-fill-mode: forwards;
  animation-direction: normal, alternate;
  transition: 0.5s;
}
@keyframes elementor-animation-bob {
  0% {
    transform: translateY(-8px);
  }

  50% {
    transform: translateY(-4px);
  }

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

@keyframes elementor-animation-bob-float {
  100% {
    transform: translateY(-8px);
  }
}

/* College Is End*/

.clisbox figure img {
  height: 90px;
  width: 90px;
  object-fit: contain;
  margin-bottom: 10px;
}

.clisbox figure {
  color: #ffffff;
  font-family: "Noto Sans", Sans-serif;
  font-size: 15px;
  font-weight: 300;
}

/* counter section start */

.sectiongap {
  padding: 100px 0;
  position: relative;
  background-size: cover;
  background-position: center right;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.counter-box {
  padding: 50px 30px;
  text-align: center;
  transition: 0.5s;
}
.counter-box:hover {
  box-shadow: 0px 0px 50px 0px rgb(255 255 255 / 43%);
}
.counter-number span {
  font-size: 45px;
  color: #fff;
  font-family: var(--heading-font);
}
.counter-number {
  position: relative;
  font-weight: 600;
  margin-bottom: 18px;
}

.counter-number::after {
  content: "";
  position: absolute;
  left: 0;
  top: -5px;
  width: 4px;
  height: 20px;
  background-color: var(--color-cream);
}

.counter-number sup {
  font-size: 22px;
  color: #a2ffab;
  position: absolute;
  top: 0;
}
.counter-text {
  color: #ffffff;
  font-family: "Noto Sans", Sans-serif;
  font-size: 18px;
  font-weight: 400;
}

.elementor-shape {
  direction: ltr;
  left: 0;
  line-height: 0;
  overflow: hidden;
  position: absolute;
  width: 100%;
}
.elementor-shape-top {
  top: -1px;
}
.elementor-shape-top svg {
  height: 35px;
}
.elementor-shape svg {
  display: block;
  left: 50%;
  position: relative;
  transform: translateX(-50%);
  width: calc(100% + 1.3px);
}
.elementor-shape-top .elementor-shape-fill {
  fill: #034972;
}

/* success_plan */

.success_plan {
  padding: 60px 0 20px 0;
  background-color: #fbf6d4;
}
.success_plan h2 {
  font-size: 45px;
  font-weight: 600;
  color: #002147;
  line-height: 1;
}

.success_plan h5 {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 500;
  color: #ff0330;
  line-height: 1;
}

.user-box {
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.26);
  padding: 20px;
  background: #fff;
  text-align: center;
  margin: 10px;
}

.user-img img {
  width: 90px !important;
  height: 90px;
  border-radius: 50%;
  margin: 0 auto 15px auto;
}
.user-box h3 {
  font-family: var(--heading-font);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 0px;
}

.gredenttext.jtitle {
  font-family: "Piazzolla", Sans-serif;
  font-size: 30px;
  font-weight: 700;
  text-transform: uppercase;
  color: #034972;
  text-align: center;
  margin-top: 30px;
}

/* feedbackmain */
.feedbackmain {
  position: relative;
  padding: 130px 0;
  background-color: #034972;
}

.feedbackmain::after {
  content: "";
  background-image: url(../images/rgtfd.gif);
  opacity: 0.2;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
  inset: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.feedbackmain .container {
  z-index: 9;
  position: relative;
}
.detailsbox {
  position: relative;
}
.detailsbox a {
  position: absolute;
  bottom: -17px;
  width: 80%;
  background: #fff;
  text-align: center;
  left: 50%;
  transform: translateX(-50%);
  background-color: #ffffff;
  padding: 10px 10px 10px 10px;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
  font-family: "Piazzolla", Sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #034972;
}
.detailsbox figure {
  overflow: hidden;
}
.detailsbox img {
  transition: 0.5s;
}
.detailsbox:hover img {
  transform: scale(1.1);
}

.feedbackmain .elementor-shape {
  bottom: -1px;
  position: absolute;
  z-index: 99;
}

.feedbackmain .elementor-shape[data-negative="false"].elementor-shape-bottom,
.feedbackmain .elementor-shape[data-negative="true"].elementor-shape-top {
  transform: rotate(180deg);
}

.elementor-shape-bottom svg {
  height: 90px;
}
.elementor-shape-bottom:not([data-negative="true"]) svg {
  z-index: -1;
}

.elementor-shape svg {
  display: block;
  left: 50%;
  position: relative;
  transform: translateX(-50%);
  width: calc(100% + 1.3px);
}

.elementor-shape-fill {
  fill: #fbf6d4;
  transform: rotateY(0deg);
  transform-origin: center;
}

.toplist {
  transform: rotate(0deg) !important;
  bottom: unset !important;
  top: 0 !important;
}

/* newsmain */
.newsmain {
  padding: 50px 0;
  background: #fbf6d4;
  position: relative;
}

.newsmain::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-image: url(../images/gfd-300x300.webp);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: auto;
  opacity: 0.3;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

.newsmain h2 {
  font-size: 35px;
  font-weight: 600;
  color: #002147;
}

.newsmain ul li {
  font-family: var(--heading-font);
  list-style: auto;
  color: #034972;
  transition: color 0.3s;
  font-size: 18px;
  font-weight: 700;
  font-style: italic;
  margin-bottom: 5px;
  margin-left: 18px;
}

/* academic_collaborations */

.academic_collaborations {
  padding: 50px 0;
  position: relative;
  background: #f2f2fe;
}

.academic_collaborations::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-image: url(../images/course-bg.webp);
  opacity: 0.5;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

.academic_collaborations .container {
  position: relative;
  z-index: 1;
}

.academic_collaborations h2 {
  font-family: "Piazzolla", Sans-serif;
  font-size: 45px;
  font-weight: 600;
  color: #002147;
  text-align: center;
}

.collaborations-box {
  background-color: transparent;
  background-image: linear-gradient(180deg, #034972 0%, #fbf6d4 100%);
  padding: 0px 0px 0px 0px;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  border-style: none;
  border-radius: 5px 5px 5px 5px;
  margin: 20px 10px;
  overflow: hidden;
  transition: 0.5s;
}
.collaborations-box figcaption {
  font-family: var(--heading-font);
  padding: 15px 10px;
  line-height: 1.2;
  text-align: center;
  font-size: 16px;
  color: #000;
}

.collaborations-box:hover {
  transform: scale(1.1) rotate(4deg);
}
.collaborations-box:hover figcaption {
  color: var(--color-red);
}

/* eventdiv */

.eventdiv {
  padding: 50px 0;
  background: #fbf6d4;
}
.eventdiv .titlediv h2 {
  font-size: 35px;
  font-weight: 600;
  color: #002147;
}

.eventdiv .nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: #002147 !important;
  color: #fff;
}

.eventdiv .nav-pills .nav-link {
  background-color: #034972;
  margin: 0px 0px 10px 0px;
  color: #fff;
  width: 170px;
  padding: 14px 16px 14px 30px;
  background-image: unset;
  border-radius: 0;
  text-align: left;
  font-size: 14px;
  margin: 0px 0px 10px 0px;
}
.evntbox {
  margin: 0px 0px 30px 0px;
}
.evntbox figure {
  width: 100%;
  position: relative;
  padding-top: 70%;
  margin-bottom: 15px;
  overflow: hidden;
}
.evntbox:hover figure img {
  transform: scale(1.1);
}
.evntbox figure img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  transition: 0.5s;
}
.evntbox figcaption {
  color: #002147;
  transition: all 0.3s ease;
  font-family: var(--heading-font);
  font-size: 18px;
  font-weight: 600;
  font-style: normal;
}
.evntbox:hover figcaption {
  color: var(--color-red);
}

/* Gallery Main Start*/

.gallery-main {
  background-color: #034972;
  border-style: double;
  border-width: 10px 0px 0px 0px;
  border-color: #a2ffab;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  padding: 20px 0px 20px 0px;
  z-index: 0;
  border-radius: 30px 30px 0px 0px;
}
.gallery-main h2 {
  font-size: 35px;
  font-weight: 600;
  color: #fbf6d4;
}
.imggallery {
  padding-top: 80%;
  border-style: double;
  border-width: 0px 5px 0px 5px;
  border-color: #a2ffab;
  border-radius: 10px 10px 10px 10px;
  margin: 0;
  position: relative;
  width: 100%;
  overflow: hidden;
}
.imggallery img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

/* Gallery Main End*/

/* Footer Start */
.footer-main {
  background-color: transparent;
  background-image: linear-gradient(90deg, #002147a6 0%, #03497294 100%);
  position: relative;
}
.footer-main::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url(https://sitalkuchicollege.ac.in/wp-content/uploads/2023/07/dgh-1.png);
  background-position: center center;
  background-repeat: repeat;
  background-size: auto;
  opacity: 0.1;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}
.footermain {
  box-shadow: 0px -13px 10px 0px rgba(0, 0, 0, 0.5) inset;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  border-radius: 20px 20px 20px 20px;
  padding: 20px;
}

.footer-main h2 {
  font-family: "Piazzolla", Sans-serif;
  font-size: 30px;
  font-weight: 500;
  font-style: italic;
  color: #fff;
}

.footer-top {
  padding: 30px 0;
  position: relative;
  z-index: 1;
}

.fbox ul li {
  list-style: none;
  position: relative;
  padding-left: 20px;
  margin-bottom: 3px;
}
.fbox ul li a {
  color: var(--color-white);
  font-family: var(--pera-font);
  font-size: 13px;
  font-weight: 300;
  transition: color 0.3s;
}
.fbox ul li::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: solid 1px #a2ffab;
  left: 0;
  top: 5px;
}
.fbox ul li::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #a2ffab;
  left: 4px;
  top: 9px;
}

.logomain {
  border-radius: 20px 20px 0px 0px;
  border-style: dashed;
  border-width: 0px 1px 0px 1px;
  border-color: #ffffff4d;
  margin: 0px 0px 0px 0px;
  --e-column-margin-right: 0px;
  --e-column-margin-left: 0px;
  padding: 10px;
}
a.brand {
  width: 160px;
}
.logomain p {
  color: var(--color-white);
  font-family: var(--pera-font);
  font-size: 13px;
}
.gredenttext {
  margin-bottom: 10px;
}

.footer-bottom {
  padding: 10px 0;
  background-color: transparent;
  background-image: linear-gradient(180deg, #1a5b81 0%, #033959 100%);
  z-index: 1;
  position: relative;
}

.footer-bottom p {
  color: #fff;
  font-size: 16px;
}
.footer-bottom p a {
  color: var(--color-black);
}
.footer-bottom p a:hover {
  text-decoration: underline;
}
/* Hover effect 1 */
.hovereffect1 {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
}

.hovereffect1 .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.hovereffect1 img {
  display: block;
  position: relative;
  -webkit-transition: all 0.4s linear;
  transition: all 0.4s linear;
}

.hovereffect1 h2 {
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  position: relative;
  font-size: 17px;
  background: rgba(0, 0, 0, 0.6);
  -webkit-transform: translatey(-100px);
  -ms-transform: translatey(-100px);
  transform: translatey(-100px);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  padding: 10px;
  margin-top: 15px;
}

.hovereffect1 a.info {
  text-decoration: none;
  display: inline-block;
  text-transform: uppercase;
  color: #fff;
  border: 1px solid #fff;
  background-color: transparent;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  margin: 50px 0 0;
  padding: 7px 14px;
}

.hovereffect1 a.info:hover {
  box-shadow: 0 0 5px #fff;
}

.hovereffect1:hover img {
  -ms-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}

.hovereffect1:hover .overlay {
  opacity: 1;
  filter: alpha(opacity=100);
}

.hovereffect1:hover h2,
.hovereffect1:hover a.info {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-transform: translatey(0);
  -webkit-transform: translatey(0);
  transform: translatey(0);
}

.hovereffect1:hover a.info {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

.leftBar ul {
  margin: 0 0 30px 0;
  padding: 0;
}
.leftBar ul li {
  list-style-type: none;
  position: relative;
  padding: 0;
  margin-bottom: 9px;
  font: 400 16px "Lato";
  box-shadow: 3px 3px 3px #1f619a;
}
.leftBar ul li:before {
  content: "";
}
.leftBar ul li a {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: 0;
  border: 0;
  border-bottom: 0;
  text-decoration: none;
  transition: all ease-in-out 300ms;
  /*background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #bdfcff 100%);*/
  background: #1d6bc1;
  /*color: #165c98;*/
  color: #fff;
  /*text-shadow: 1px 1px 1px #fff;*/
}
.leftBar ul li a:hover {
  color: #000000;
  background-image: linear-gradient(180deg, #ffffff 0%, #b5d8f7 100%);
  padding: 10px 15px 10px 25px;
}
.content-bg {
  background-image: linear-gradient(180deg, #b5d8f7 0%, #ffffff 100%);
}
/*=====Sidenav Popup======= */
#sidenavPop a {
  position: absolute;
  right: -215px;
  transition: 0.3s;
  padding: 5px 10px;
  width: 270px;
  text-decoration: none;
  font-size: 16px;
  line-height:38px;
  font-weight:bold;
  color: white;
  z-index: 9;
  border-radius: 20px 0px 0px 20px;
  -webkit-box-shadow: -7px 0px 15px -11px rgba(0,0,0,0.75);
	-moz-box-shadow: -7px 0px 15px -11px rgba(0,0,0,0.75);
	box-shadow: -7px 0px 15px -11px rgba(0,0,0,0.75);
	text-shadow: 0px 1px 1px rgba(0,0,0,0.52);
}

#sidenavPop a img {
	width:50px;
	height:auto;
	padding:4px 8px;
	float:left;
}

#sidenavPop a:hover {
  right: 0;
}

#about {
  top: 170px;
  background-image: linear-gradient(to right, #0ba360 0%, #3cba92 100%);
}

#blog {
  top: 220px;
  background-image: linear-gradient(to right, #09203f 0%, #537895 100%);
}

#opac {
  top: 230px;
  background-image: linear-gradient(to right, #204d25 0%, #278331 100%);
}

#contact {
  top: 350px;
  background-image: linear-gradient(to right, #1e3c72 0%, #1e3c72 1%, #2a5298 100%);
}

#feedback {
  top: 290px;
  background-image: linear-gradient(to left, #f43b47 0%, #453a94 100%);
}