/*
===========================================================
PRINCEVILLE HIGH SCHOOL
Premium Private School Design System
Built on the original Edu Meeting template structure
===========================================================
*/

/* =========================================================
   01. BRAND SYSTEM
========================================================= */

:root {

  --pv-navy: #0B1F3A;
  --pv-deep-navy: #061426;
  --pv-blue: #142E52;

  --pv-gold: #C9A24D;
  --pv-light-gold: #E6C879;
  --pv-dark-gold: #A98232;

  --pv-white: #FFFFFF;
  --pv-off-white: #F7F8FA;
  --pv-light-grey: #EEF1F5;
  --pv-grey: #7B8491;
  --pv-dark: #1C2633;

  --pv-shadow: 0 18px 50px rgba(6, 20, 38, 0.12);
  --pv-shadow-soft: 0 10px 30px rgba(6, 20, 38, 0.08);

  --pv-radius: 18px;
  --pv-transition: all 0.35s ease;

}


/* =========================================================
   02. RESET
========================================================= */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
figure,
header,
nav,
section,
article,
aside,
footer,
figcaption {

  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;

}


html,
body {

  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  background-color: var(--pv-white);
  font-size: 16px;

  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

}


* {

  box-sizing: border-box;

}


ul,
li {

  padding: 0;
  margin: 0;
  list-style: none;

}


header,
nav,
section,
article,
aside,
footer,
hgroup {

  display: block;

}


img {

  width: 100%;
  overflow: hidden;

}


a {

  text-decoration: none !important;
  color: var(--pv-navy);
  transition: var(--pv-transition);

}


a:hover {

  color: var(--pv-gold);

}


p {

  font-size: 14px;
  line-height: 26px;
  color: var(--pv-grey);

}


h1,
h2,
h3,
h4,
h5,
h6 {

  margin-top: 0;
  margin-bottom: 0;

}


::selection {

  background: var(--pv-gold);
  color: var(--pv-white);

}


::-moz-selection {

  background: var(--pv-gold);
  color: var(--pv-white);

}


/* =========================================================
   03. GLOBAL STYLES
========================================================= */

body {

  overflow-x: hidden;

}


.container {

  max-width: 1200px;

}


.section-heading {

  text-align: center;
  margin-bottom: 60px;

}


.section-heading h2 {

  position: relative;
  display: inline-block;

  font-size: 34px;
  font-weight: 700;
  line-height: 1.3;

  color: var(--pv-white);

  letter-spacing: 0.2px;

}


.section-heading h2:after {

  content: '';

  display: block;

  width: 55px;
  height: 3px;

  margin: 18px auto 0;

  background: var(--pv-gold);

}


.main-button-red a,
.main-button-yellow a {

  display: inline-block;

  padding: 14px 28px;

  border-radius: 50px;

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 0.8px;

  text-transform: uppercase;

  transition: var(--pv-transition);

}


.main-button-red a {

  color: var(--pv-white);

  background: var(--pv-gold);

  box-shadow: 0 8px 20px rgba(201, 162, 77, 0.25);

}


.main-button-red a:hover {

  color: var(--pv-white);

  background: var(--pv-dark-gold);

  transform: translateY(-3px);

  box-shadow: 0 12px 25px rgba(201, 162, 77, 0.35);

}


.main-button-yellow a {

  color: var(--pv-navy);

  background: var(--pv-white);

}


.main-button-yellow a:hover {

  color: var(--pv-white);

  background: var(--pv-gold);

  transform: translateY(-3px);

}


/* =========================================================
   SUB HEADER
========================================================= */

.sub-header {

  position: relative;
  z-index: 110;

  display: block;

  height: 20px;
  line-height: 46px;

  background: #061426;

}


.sub-header .left-content p {

  margin: 0;

  color: rgba(255, 255, 255, 0.75);

  font-size: 11px;

  letter-spacing: 0.5px;

}


.sub-header .right-icons {

  text-align: right;

}


.sub-header .right-icons ul {

  margin: 0;

}


.sub-header .right-icons ul li {

  display: inline-block;

  margin-left: 18px;

}


.sub-header .right-icons ul li a {

  color: rgba(255, 255, 255, 0.75);

  font-size: 14px;

}


.sub-header .right-icons ul li a:hover {

  color: #C9A24D;

}


/* =========================================================
   05. HEADER
========================================================= */

.header-area {

    position: absolute;

    top: 66px; /* 46px sub-header + 20px gap */

    left: 0;

    right: 0;

    z-index: 100;

    height: 90px;

}


.header-area .main-nav {

    position: relative;

    min-height: 90px;

    height: 90px;

    padding: 0 28px;

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

    border-radius: 18px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    box-shadow: 0 10px 35px rgba(6, 20, 38, 0.15);

}


.header-area .main-nav .logo {

  display: flex;

  align-items: center;

  height: 90px;

}


.header-area .main-nav .logo img {

  /* Adjust these values whenever you want */
  width: 190px;
  height: 75px;

  object-fit: contain;

  /* Remove the restriction that is making the logo tiny */
  max-width: none;
  max-height: none;

}


.header-area .main-nav .nav {

  display: flex;

  align-items: center;

  gap: 4px;

}


.header-area .main-nav .nav li {

  position: relative;

}


.header-area .main-nav .nav li a {

  display: block;

  padding: 12px 14px;

  color: var(--pv-navy);

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 0.2px;

  transition: var(--pv-transition);

}


.header-area .main-nav .nav li a:hover,
.header-area .main-nav .nav li a.active {

  color: var(--pv-gold);

}


.header-area .main-nav .nav li a.active:after {

  content: '';

  position: absolute;

  bottom: 4px;

  left: 14px;

  right: 14px;

  height: 2px;

  background: var(--pv-gold);

}


.header-area .main-nav .nav li.has-sub > a:after {

  content: '\f107';

  font-family: 'FontAwesome';

  margin-left: 6px;

  font-size: 10px;

}


.header-area .main-nav .nav li ul.sub-menu {

  position: absolute;

  top: 100%;

  left: 0;

  width: 230px;

  background: var(--pv-white);

  border-top: 3px solid var(--pv-gold);

  border-radius: 0 0 12px 12px;

  box-shadow: var(--pv-shadow);

  opacity: 0;

  visibility: hidden;

  transform: translateY(10px);

  transition: var(--pv-transition);

}


.header-area .main-nav .nav li:hover ul.sub-menu {

  opacity: 1;

  visibility: visible;

  transform: translateY(0);

}


.header-area .main-nav .nav li ul.sub-menu li {

  width: 100%;

}


.header-area .main-nav .nav li ul.sub-menu li a {

  padding: 13px 18px;

  border-bottom: 1px solid var(--pv-light-grey);

  font-size: 12px;

}


.header-area .main-nav .nav li ul.sub-menu li:last-child a {

  border-bottom: none;

}


.header-area .main-nav .nav li ul.sub-menu li a:hover {

  padding-left: 24px;

  background: var(--pv-off-white);

}


.header-area.header-sticky {

  position: fixed;

  top: 0;

  background: transparent;

  transition: var(--pv-transition);

}


.header-area.header-sticky.background-header {

  top: 0;

  background: var(--pv-white);

  box-shadow: 0 5px 20px rgba(6, 20, 38, 0.08);

}


.header-area.header-sticky.background-header .main-nav {

  border-radius: 0;

  box-shadow: none;

}


.menu-trigger {

  display: none;

}


/* =========================================================
   06. HERO BANNER
========================================================= */

.main-banner {

  position: relative;

  height: 850px;

  min-height: 700px;

  overflow: hidden;

}


#bg-video {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  z-index: 1;

}


.video-overlay {

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 2;

  background:

    linear-gradient(
      90deg,
      rgba(6, 20, 38, 0.94) 0%,
      rgba(11, 31, 58, 0.75) 45%,
      rgba(11, 31, 58, 0.30) 100%
    );

}


.main-banner .header-text {

  height: 100%;

  display: flex;

  align-items: center;

}


.main-banner .caption {

  max-width: 700px;

  padding-top: 80px;

}


.main-banner .caption h6 {

  color: var(--pv-light-gold);

  font-size: 14px;

  font-weight: 700;

  letter-spacing: 3px;

  text-transform: uppercase;

  margin-bottom: 22px;

}


.main-banner .caption h2 {

  color: var(--pv-white);

  font-size: 58px;

  line-height: 1.15;

  font-weight: 700;

  letter-spacing: -1px;

  margin-bottom: 25px;

}


.main-banner .caption p {

  max-width: 610px;

  color: rgba(255, 255, 255, 0.82);

  font-size: 15px;

  line-height: 29px;

}


.main-banner .caption .main-button-red {

  margin-top: 35px;

}


/* =========================================================
   07. SERVICES / PRINCIPLES
========================================================= */

.services {

  margin-top: -115px;

  position: absolute;

  width: 100%;

  z-index: 5;

}


.services .item {

  position: relative;

  overflow: hidden;

  min-height: 290px;

  background:

    linear-gradient(
      145deg,
      var(--pv-navy),
      var(--pv-deep-navy)
    );

  border: 1px solid rgba(201, 162, 77, 0.35);

  border-radius: var(--pv-radius);

  text-align: center;

  color: var(--pv-white);

  padding: 38px 30px;

  box-shadow: var(--pv-shadow);

  transition: var(--pv-transition);

}


.services .item:before {

  content: '';

  position: absolute;

  top: -80px;

  right: -80px;

  width: 180px;

  height: 180px;

  border-radius: 50%;

  border: 1px solid rgba(201, 162, 77, 0.22);

}


.services .item:hover {

  transform: translateY(-8px);

  border-color: var(--pv-gold);

}


.services .item .icon {

  position: relative;

  z-index: 1;

  width: 65px;

  height: 65px;

  margin: 0 auto;

  display: flex;

  align-items: center;

  justify-content: center;

}


.services .item .icon img {

  max-width: 65px;

  max-height: 65px;

  object-fit: contain;

}


.services .item h4 {

  margin-top: 24px;

  margin-bottom: 14px;

  font-size: 18px;

  font-weight: 600;

  color: var(--pv-white);

}


.services .item p {

  color: rgba(255, 255, 255, 0.68);

  font-size: 13px;

  line-height: 23px;

}


/* Carousel arrows */

.services .owl-nav {

  display: inline-block !important;

  text-align: center;

  position: absolute;

  width: 100%;

  top: 50%;

  transform: translateY(-25px);

}


.services .owl-nav .owl-prev,
.services .owl-nav .owl-next {

  outline: none;

  position: absolute;

}


.services .owl-nav .owl-prev {

  left: -75px;

}


.services .owl-nav .owl-next {

  right: -75px;

}


.services .owl-nav .owl-prev:before,
.services .owl-nav .owl-next:before {

  display: inline-block;

  font-family: 'FontAwesome';

  color: var(--pv-navy);

  font-size: 22px;

  font-weight: 700;

  background-color: var(--pv-white);

  width: 48px;

  height: 48px;

  border-radius: 50%;

  line-height: 48px;

  box-shadow: var(--pv-shadow-soft);

}


.services .owl-nav .owl-prev:before {

  content: '\f104';

}


.services .owl-nav .owl-next:before {

  content: '\f105';

}


/* =========================================================
   08. UPCOMING / DISCOVER PRINCEVILLE
========================================================= */

section.upcoming-meetings {

  background:

    linear-gradient(
      rgba(6, 20, 38, 0.94),
      rgba(11, 31, 58, 0.96)
    ),

    url(./images/meetings-bg.jpg);

  background-position: center center;

  background-attachment: fixed;

  background-repeat: no-repeat;

  background-size: cover;

  padding-top: 240px;

  padding-bottom: 110px;

}


section.upcoming-meetings .section-heading {

  text-align: center;

}


section.upcoming-meetings .categories {

  background: var(--pv-white);

  border-radius: var(--pv-radius);

  padding: 38px;

  margin-right: 35px;

  box-shadow: var(--pv-shadow);

}


section.upcoming-meetings .categories h4 {

  font-size: 19px;

  font-weight: 700;

  color: var(--pv-navy);

  margin-bottom: 25px;

  padding-bottom: 20px;

  border-bottom: 1px solid var(--pv-light-grey);

}


section.upcoming-meetings .categories ul li {

  display: block;

  margin-bottom: 15px;

}


section.upcoming-meetings .categories ul li a {

  position: relative;

  display: block;

  padding-left: 18px;

  color: var(--pv-dark);

  font-size: 14px;

  font-weight: 500;

}


section.upcoming-meetings .categories ul li a:before {

  content: '\f105';

  font-family: 'FontAwesome';

  position: absolute;

  left: 0;

  color: var(--pv-gold);

}


section.upcoming-meetings .categories ul li a:hover {

  color: var(--pv-gold);

  padding-left: 24px;

}


section.upcoming-meetings .categories .main-button-red {

  border-top: 1px solid var(--pv-light-grey);

  padding-top: 28px;

  margin-top: 22px;

}


section.upcoming-meetings .categories .main-button-red a {

  width: 100%;

  text-align: center;

}


.meeting-item {

  margin-bottom: 30px;

  background: var(--pv-white);

  border-radius: var(--pv-radius);

  overflow: hidden;

  box-shadow: var(--pv-shadow-soft);

  transition: var(--pv-transition);

}


.meeting-item:hover {

  transform: translateY(-8px);

  box-shadow: var(--pv-shadow);

}


.meeting-item .thumb {

  position: relative;

  overflow: hidden;

}


.meeting-item .thumb img {

  height: 220px;

  object-fit: cover;

  transition: var(--pv-transition);

}


.meeting-item:hover .thumb img {

  transform: scale(1.06);

}


.meeting-item .down-content {

  position: relative;

  padding: 28px 25px 28px 92px;

}


.meeting-item .down-content .date {

  position: absolute;

  left: 25px;

  top: 28px;

  width: 45px;

  height: 55px;

  background: var(--pv-gold);

  display: flex;

  align-items: center;

  justify-content: center;

}


.meeting-item .down-content .date h6 {

  color: var(--pv-white);

  font-size: 21px;

  font-weight: 700;

}


.meeting-item .down-content h4 {

  color: var(--pv-navy);

  font-size: 17px;

  line-height: 24px;

  font-weight: 700;

  margin-bottom: 8px;

}


.meeting-item .down-content p {

  font-size: 13px;

  line-height: 22px;

}


/* =========================================================
   09. APPLY NOW / CTA SECTION
========================================================= */

section.apply-now {

  background:

    linear-gradient(
      135deg,
      rgba(6, 20, 38, 0.97),
      rgba(11, 31, 58, 0.94)
    ),

    url(./images/apply-bg.jpg);

  background-position: center center;

  background-attachment: fixed;

  background-repeat: no-repeat;

  background-size: cover;

  padding: 130px 0;

}


section.apply-now .item {

  background:

    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.08),
      rgba(255, 255, 255, 0.03)
    );

  border: 1px solid rgba(201, 162, 77, 0.28);

  border-radius: var(--pv-radius);

  padding: 38px;

  margin-bottom: 25px;

}


section.apply-now .item h3 {

  color: var(--pv-white);

  text-transform: uppercase;

  font-size: 22px;

  line-height: 30px;

  font-weight: 700;

  margin-bottom: 18px;

}


section.apply-now .item p {

  color: rgba(255, 255, 255, 0.72);

  margin-bottom: 22px;

}


.accordions {

  border-radius: var(--pv-radius);

  padding: 30px;

  background-color: var(--pv-white);

  margin-left: 35px;

  box-shadow: var(--pv-shadow);

}


.accordions .accordion {

  border-bottom: 1px solid var(--pv-light-grey);

}


.accordions .last-accordion {

  border-bottom: none;

}


.accordion-head {

  padding: 21px 10px;

  font-size: 16px;

  font-weight: 700;

  color: var(--pv-navy);

  cursor: pointer;

  transition: var(--pv-transition);

}


.accordion-head .icon {

  float: right;

  color: var(--pv-gold);

  transition: transform 200ms ease-in-out;

}


.accordion-head.is-open {

  color: var(--pv-gold);

}


.accordion-head.is-open .icon {

  transform: rotate(45deg);

}


.accordion-body {

  overflow: hidden;

  height: 0;

  transition: height 300ms ease-in-out;

}


.accordion-body > .content {

  padding: 0 10px 22px;

}


.accordion-body > .content p {

  font-size: 13px;

  line-height: 24px;

}


/* =========================================================
   10. ACADEMIC PROGRAMMES / COURSES
========================================================= */

section.our-courses {

  background:

    linear-gradient(
      rgba(247, 248, 250, 0.96),
      rgba(247, 248, 250, 0.96)
    ),

    url(./images/meetings-bg.jpg);

  background-position: center center;

  background-attachment: fixed;

  background-repeat: no-repeat;

  background-size: cover;

  padding-top: 130px;

  padding-bottom: 125px;

}


section.our-courses .section-heading h2 {

  color: var(--pv-navy);

}


.our-courses .item {

  background: var(--pv-white);

  border-radius: var(--pv-radius);

  overflow: hidden;

  box-shadow: var(--pv-shadow-soft);

  transition: var(--pv-transition);

}


.our-courses .item:hover {

  transform: translateY(-8px);

  box-shadow: var(--pv-shadow);

}


.our-courses .item > img {

  height: 210px;

  object-fit: cover;

}


.our-courses .item .down-content {

  background-color: var(--pv-white);

}


.our-courses .item .down-content h4 {

  padding: 24px;

  font-size: 17px;

  line-height: 25px;

  color: var(--pv-navy);

  text-align: center;

  border-bottom: 1px solid var(--pv-light-grey);

}


.our-courses .item .down-content .info {

  padding: 20px 24px;

}


.our-courses .item .down-content .info p {

  color: var(--pv-grey);

  font-size: 13px;

  text-align: center;

}


.our-courses .owl-nav {

  text-align: center;

  position: absolute;

  width: 100%;

  top: 50%;

  transform: translateY(-45px);

}


.our-courses .owl-nav .owl-prev,
.our-courses .owl-nav .owl-next {

  outline: none;

  position: absolute;

}


.our-courses .owl-nav .owl-prev {

  left: -70px;

}


.our-courses .owl-nav .owl-next {

  right: -70px;

}


.our-courses .owl-nav .owl-prev:before,
.our-courses .owl-nav .owl-next:before {

  display: inline-block;

  font-family: 'FontAwesome';

  color: var(--pv-navy);

  font-size: 22px;

  font-weight: 700;

  background-color: var(--pv-white);

  width: 48px;

  height: 48px;

  border-radius: 50%;

  line-height: 48px;

  box-shadow: var(--pv-shadow-soft);

}


.our-courses .owl-nav .owl-prev:before {

  content: '\f104';

}


.our-courses .owl-nav .owl-next:before {

  content: '\f105';

}


.our-courses .owl-dots {

  display: inline-block;

  text-align: center;

  width: 100%;

  margin-top: 38px;

}


.our-courses .owl-dots .owl-dot {

  width: 7px;

  height: 7px;

  background-color: var(--pv-grey);

  margin: 0 5px;

  border-radius: 50%;

  outline: none;

  transition: var(--pv-transition);

}


.our-courses .owl-dots .active {

  width: 24px;

  height: 8px;

  border-radius: 4px;

  background-color: var(--pv-gold);

}


/* =========================================================
   11. SCHOOL FACTS
========================================================= */

section.our-facts {

  background:

    linear-gradient(
      rgba(6, 20, 38, 0.92),
      rgba(6, 20, 38, 0.96)
    ),

    url(./images/facts-bg.jpg);

  background-position: center center;

  background-attachment: fixed;

  background-repeat: no-repeat;

  background-size: cover;

  padding: 130px 0 120px;

}


section.our-facts h2 {

  font-size: 36px;

  color: var(--pv-white);

  line-height: 50px;

  font-weight: 700;

  letter-spacing: 0.3px;

  margin-bottom: 40px;

}


.count-area-content {

  text-align: center;

  background:

    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.10),
      rgba(255, 255, 255, 0.04)
    );

  border: 1px solid rgba(201, 162, 77, 0.25);

  border-radius: var(--pv-radius);

  padding: 25px 25px 30px;

  margin: 12px 0;

}


.count-digit {

  margin: 5px 0;

  color: var(--pv-light-gold);

  font-weight: 700;

  font-size: 38px;

}


.count-title {

  font-size: 15px;

  font-weight: 500;

  color: rgba(255, 255, 255, 0.78);

  letter-spacing: 0.3px;

}


.percentage .count-digit:after {

  content: '%';

  margin-left: 3px;

}


.new-students {

  margin-top: 40px;

}


section.our-facts .video {

  text-align: center;

  margin-left: 60px;

  background:

    linear-gradient(
      rgba(11, 31, 58, 0.45),
      rgba(6, 20, 38, 0.75)
    ),

    url(./images/video-item-bg.jpg);

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;

  border-radius: var(--pv-radius);

  overflow: hidden;

}


section.our-facts .video img {

  padding: 165px 0;

  max-width: 58px;

  transition: var(--pv-transition);

}


section.our-facts .video:hover img {

  transform: scale(1.15);

}


/* =========================================================
   12. CONTACT / FINAL CTA
========================================================= */

section.contact-us {

  background:

    linear-gradient(
      rgba(6, 20, 38, 0.97),
      rgba(11, 31, 58, 0.98)
    ),

    url(./images/meetings-bg.jpg);

  background-position: center center;

  background-attachment: fixed;

  background-repeat: no-repeat;

  background-size: cover;

  padding: 120px 0 0;

}


section.contact-us .contact-cta {

  padding: 50px;

  background:

    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.09),
      rgba(255, 255, 255, 0.03)
    );

  border: 1px solid rgba(201, 162, 77, 0.28);

  border-radius: var(--pv-radius);

}


section.contact-us .contact-cta h2 {

  color: var(--pv-white);

  font-size: 30px;

  font-weight: 700;

  margin-bottom: 15px;

}


section.contact-us .contact-cta p {

  color: rgba(255, 255, 255, 0.70);

  margin-bottom: 25px;

}


section.contact-us .right-info {

  background: var(--pv-gold);

  border-radius: var(--pv-radius);

  padding: 35px 30px;

  box-shadow: var(--pv-shadow);

}


section.contact-us .right-info ul li {

  padding: 20px 0;

  border-bottom: 1px solid rgba(255, 255, 255, 0.25);

}


section.contact-us .right-info ul li:first-child {

  padding-top: 0;

}


section.contact-us .right-info ul li:last-child {

  border-bottom: none;

  padding-bottom: 0;

}


section.contact-us .right-info h6 {

  color: var(--pv-white);

  font-size: 12px;

  text-transform: uppercase;

  letter-spacing: 1px;

  margin-bottom: 6px;

}


section.contact-us .right-info span {

  display: block;

  color: var(--pv-white);

  font-size: 13px;

  line-height: 22px;

}


section.contact-us .footer {

  margin-top: 90px;

  padding: 35px 20px;

  text-align: center;

  border-top: 1px solid rgba(255, 255, 255, 0.10);

}


section.contact-us .footer p {

  color: rgba(255, 255, 255, 0.55);

  font-size: 12px;

  line-height: 24px;

}


section.contact-us .footer span {

  color: var(--pv-gold);

  margin: 0 5px;

}


/* =========================================================
   13. RESPONSIVE DESIGN
========================================================= */

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

  .header-area .main-nav .nav li a {

    padding-left: 10px;
    padding-right: 10px;

  }

  .services .owl-nav .owl-prev {

    left: -25px;

  }

  .services .owl-nav .owl-next {

    right: -25px;

  }

  .our-courses .owl-nav .owl-prev {

    left: -25px;

  }

  .our-courses .owl-nav .owl-next {

    right: -25px;

  }

}


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

  .sub-header {

    display: none;

  }


  .header-area {

    top: 0;

    height: 80px;

  }


  .header-area .main-nav {

    min-height: 80px;

    height: 80px;

    border-radius: 0;

    padding: 0 20px;

  }


  .header-area .main-nav .logo {

    height: 80px;

  }


  .header-area .main-nav .logo img {

    max-height: 65px;

    max-width: 170px;

  }


  .header-area .main-nav .nav {

    display: none;

    position: absolute;

    top: 80px;

    left: 0;

    right: 0;

    width: 100%;

    background: var(--pv-white);

    flex-direction: column;

    align-items: stretch;

    padding: 10px 0;

    box-shadow: var(--pv-shadow);

  }


  .header-area .main-nav .nav li {

    width: 100%;

  }


  .header-area .main-nav .nav li a {

    padding: 14px 25px;

    border-bottom: 1px solid var(--pv-light-grey);

  }


  .header-area .main-nav .nav li a.active:after {

    display: none;

  }


  .header-area .main-nav .nav li ul.sub-menu {

    position: static;

    width: 100%;

    opacity: 1;

    visibility: visible;

    transform: none;

    display: none;

    box-shadow: none;

    border-top: none;

    border-radius: 0;

  }


  .header-area .main-nav .nav li:hover ul.sub-menu {

    display: block;

  }


  .menu-trigger {

    display: block;

    cursor: pointer;

    width: 35px;

    height: 35px;

    text-align: center;

    line-height: 35px;

    border: 1px solid var(--pv-gold);

    border-radius: 6px;

  }


  .menu-trigger span {

    font-size: 0;

  }


  .menu-trigger span:before {

    content: '\f0c9';

    font-family: 'FontAwesome';

    color: var(--pv-navy);

    font-size: 18px;

  }


  .main-banner {

    height: 760px;

    min-height: 650px;

  }


  .main-banner .caption {

    padding-top: 50px;

  }


  .main-banner .caption h2 {

    font-size: 48px;

  }


  .services {

    position: relative;

    margin-top: -80px;

  }


  section.upcoming-meetings {

    padding-top: 100px;

  }


  section.upcoming-meetings .categories {

    margin-right: 0;

    margin-bottom: 35px;

  }


  .accordions {

    margin-left: 0;

    margin-top: 35px;

  }


  section.our-facts .video {

    margin-left: 0;

    margin-top: 40px;

  }

}


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

  .container {

    padding-left: 20px;

    padding-right: 20px;

  }


  .main-banner {

    height: 720px;

    min-height: 620px;

  }


  .main-banner .caption {

    padding-top: 40px;

  }


  .main-banner .caption h6 {

    font-size: 11px;

    letter-spacing: 2px;

  }


  .main-banner .caption h2 {

    font-size: 36px;

    line-height: 1.2;

  }


  .main-banner .caption p {

    font-size: 13px;

    line-height: 24px;

  }


  .services {

    margin-top: -60px;

  }


  .services .item {

    min-height: 260px;

    padding: 30px 25px;

  }


  .services .owl-nav {

    display: none !important;

  }


  .section-heading {

    margin-bottom: 40px;

  }


  .section-heading h2 {

    font-size: 28px;

  }


  section.upcoming-meetings {

    padding-top: 85px;

    padding-bottom: 80px;

  }


  section.upcoming-meetings .categories {

    padding: 28px;

  }


  section.apply-now {

    padding: 80px 0;

  }


  section.apply-now .item {

    padding: 28px;

  }


  .accordions {

    padding: 22px;

  }


  section.our-courses {

    padding-top: 80px;

    padding-bottom: 80px;

  }


  .our-courses .owl-nav {

    display: none;

  }


  section.our-facts {

    padding: 80px 0;

  }


  section.our-facts h2 {

    font-size: 30px;

    line-height: 40px;

  }


  section.our-facts .video img {

    padding: 110px 0;

  }


  section.contact-us {

    padding-top: 80px;

  }


  section.contact-us .contact-cta {

    padding: 30px;

  }


  section.contact-us .contact-cta h2 {

    font-size: 25px;

  }


  section.contact-us .right-info {

    margin-top: 30px;

  }


  section.contact-us .footer {

    margin-top: 60px;

  }

}


/* =========================================================
   14. UTILITY CLASSES
========================================================= */

.text-gold {

  color: var(--pv-gold) !important;

}


.text-navy {

  color: var(--pv-navy) !important;

}


.bg-navy {

  background-color: var(--pv-navy) !important;

}


.bg-gold {

  background-color: var(--pv-gold) !important;

}


.border-gold {

  border-color: var(--pv-gold) !important;

}
.header-area {

    top: 46px;

    height: 150px;

}


.header-area .main-nav {

    height: 150px;

    min-height: 150px;

}


.header-area .main-nav .logo {

    height: 150px;

}


.header-area .main-nav .logo img {

    width: 170px;

    height: auto;

    max-width: none;

    max-height: none;

}
.sub-header {
    position: relative;
    z-index: 110;

    height: 46px;
    line-height: 46px;

    background: #061426;
}
/* ==========================================
   CONTACT PAGE SPACING
========================================== */

.services {
    margin-bottom: 80px;
}

.apply-now {
    margin-top: 40px;
}
/* Contact Page */

body.contact-page .services {
    margin-top: 40px;
    margin-bottom: 70px;
}
/* ==========================================
   WHY FAMILIES CHOOSE PRINCEVILLE
========================================== */

.our-facts .count-area-content{
    min-height:220px;
    padding:35px 30px;
    transition:all .35s ease;
}

.our-facts .count-area-content:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 40px rgba(0,0,0,.25);
}

.our-facts .count-area-content p{
    color:#ffffff;
    margin-top:15px;
    line-height:28px;
    font-size:15px;
}

.our-facts .count-title{
    color:#ffffff;
    font-weight:700;
    margin-bottom:10px;
}
/*=====================================
  STUDENT LIFE INTRO
======================================*/

.student-life-intro{
    padding:100px 0;
    background:#ffffff;
}

.student-life-intro .section-heading{
    margin-bottom:30px;
}

.student-life-intro h6{
    color:#d4af37;
    font-size:14px;
    font-weight:700;
    letter-spacing:2px;
    margin-bottom:15px;
}

.student-life-intro h2{
    color:#1f272b;
    font-size:42px;
    font-weight:700;
    line-height:1.25;
    margin-bottom:25px;
}

.student-life-intro p{
    color:#666;
    font-size:16px;
    line-height:30px;
    margin-bottom:20px;
}

.student-life-image img{
    width:100%;
    border-radius:15px;
    box-shadow:0 20px 50px rgba(0,0,0,.12);
}

@media (max-width:991px){

.student-life-image{
    margin-top:50px;
}

.student-life-intro{
    padding:80px 0;
}

.student-life-intro h2{
    font-size:34px;
}

}
/*==================================
STUDENT LIFE HIGHLIGHTS
===================================*/

.student-life-highlights{
    padding:100px 0;
    background:#f8f9fa;
}

.student-life-highlights .section-heading{
    margin-bottom:60px;
}

.student-life-highlights .section-heading h6{
    color:#d4af37;
    font-weight:700;
    letter-spacing:2px;
    margin-bottom:15px;
}

.student-life-highlights .section-heading h2{
    color:#1f272b;
    font-size:42px;
    font-weight:700;
    margin-bottom:20px;
}

.student-life-highlights .section-heading p{
    max-width:700px;
    margin:0 auto;
    color:#666;
    line-height:30px;
}

.highlight-box{
    background:#fff;
    padding:45px 30px;
    text-align:center;
    border-radius:15px;
    transition:.35s;
    height:100%;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
}

.highlight-box:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(0,0,0,.15);
}

.highlight-box .icon{
    width:80px;
    height:80px;
    background:#172554;
    color:#fff;
    border-radius:50%;
    margin:0 auto 25px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    transition:.3s;
}

.highlight-box:hover .icon{
    background:#d4af37;
}

.highlight-box h4{
    color:#1f272b;
    font-size:22px;
    font-weight:700;
    margin-bottom:15px;
}

.highlight-box p{
    color:#666;
    line-height:28px;
    margin:0;
}

@media(max-width:991px){

.highlight-box{
    margin-bottom:30px;
}

.student-life-highlights{
    padding:80px 0;
}

.student-life-highlights .section-heading h2{
    font-size:34px;
}

}
/*==================================
LIFE AT PRINCEVILLE GALLERY
===================================*/

.student-life-gallery{
    padding:100px 0;
    background:#ffffff;
}

.student-life-gallery .section-heading{
    margin-bottom:60px;
}

.student-life-gallery .section-heading h6{
    color:#d4af37;
    font-weight:700;
    letter-spacing:2px;
    margin-bottom:15px;
}

.student-life-gallery .section-heading h2{
    color:#1f272b;
    font-size:42px;
    font-weight:700;
    margin-bottom:20px;
}

.student-life-gallery .section-heading p{
    max-width:700px;
    margin:0 auto;
    color:#666;
    line-height:30px;
}

.gallery-item{
    position:relative;
    overflow:hidden;
    border-radius:15px;
    margin-bottom:30px;
    box-shadow:0 15px 40px rgba(0,0,0,.10);
}

.gallery-item img{
    width:100%;
    height:320px;
    object-fit:cover;
    transition:.5s;
}

.gallery-item:hover img{
    transform:scale(1.08);
}

.gallery-overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:flex-end;
    padding:30px;
    background:linear-gradient(to top,
        rgba(23,37,84,.92),
        rgba(23,37,84,.15));
}

.gallery-overlay h4{
    color:#fff;
    font-size:24px;
    font-weight:700;
    margin:0;
}

@media(max-width:991px){

.student-life-gallery{
    padding:80px 0;
}

.student-life-gallery .section-heading h2{
    font-size:34px;
}

.gallery-item img{
    height:260px;
}

}
/*==================================
LIFE AT PRINCEVILLE GALLERY
===================================*/

.student-life-gallery{
    padding:100px 0;
    background:#ffffff;
}

.student-life-gallery .section-heading{
    margin-bottom:60px;
}

.student-life-gallery .section-heading h6{
    color:#d4af37;
    font-weight:700;
    letter-spacing:2px;
    margin-bottom:15px;
}

.student-life-gallery .section-heading h2{
    color:#1f272b;
    font-size:42px;
    font-weight:700;
    margin-bottom:20px;
}

.student-life-gallery .section-heading p{
    max-width:700px;
    margin:0 auto;
    color:#666;
    line-height:30px;
}

.gallery-item{
    position:relative;
    overflow:hidden;
    border-radius:15px;
    margin-bottom:30px;
    box-shadow:0 15px 40px rgba(0,0,0,.10);
}

.gallery-item img{
    width:100%;
    height:320px;
    object-fit:cover;
    transition:.5s;
}

.gallery-item:hover img{
    transform:scale(1.08);
}

.gallery-overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:flex-end;
    padding:30px;
    background:linear-gradient(to top,
        rgba(23,37,84,.92),
        rgba(23,37,84,.15));
}

.gallery-overlay h4{
    color:#fff;
    font-size:24px;
    font-weight:700;
    margin:0;
}

@media(max-width:991px){

.student-life-gallery{
    padding:80px 0;
}

.student-life-gallery .section-heading h2{
    font-size:34px;
}

.gallery-item img{
    height:260px;
}

}
.our-curriculum{
    padding:100px 0;
    background:#f8f9fc;
}

.curriculum-card{
    background:#fff;
    border-radius:18px;
    padding:40px 35px;
    height:100%;
    transition:.35s;
    box-shadow:0 12px 35px rgba(0,0,0,.08);
    position:relative;
    overflow:hidden;
}

.curriculum-card::before{
    content:'';
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:5px;
    background:#d4af37;
}

.curriculum-card:hover{
    transform:translateY(-12px);
    box-shadow:0 20px 45px rgba(0,0,0,.15);
}

.card-icon{
    width:75px;
    height:75px;
    border-radius:50%;
    background:#172554;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:30px;
    margin-bottom:20px;
}

.curriculum-card:hover .card-icon{
    background:#d4af37;
}

.card-tag{
    display:inline-block;
    background:#eef4ff;
    color:#172554;
    padding:6px 14px;
    border-radius:30px;
    font-size:12px;
    font-weight:700;
    margin-bottom:18px;
}

.curriculum-card h4{
    font-size:24px;
    color:#172554;
    margin-bottom:15px;
}

.curriculum-card p{
    color:#666;
    line-height:28px;
}

.curriculum-card ul{
    list-style:none;
    padding:0;
    margin-top:25px;
}

.curriculum-card li{
    margin-bottom:12px;
    font-weight:500;
}

.curriculum-card li i{
    color:#d4af37;
    margin-right:10px;
}

.curriculum-highlight{
    background:#fff;
    border-radius:20px;
    padding:45px;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
}

.highlight-title{
    color:#d4af37;
    font-weight:700;
    letter-spacing:2px;
    font-size:13px;
}

.curriculum-highlight h3{
    margin:18px 0;
    color:#172554;
}

.subject-cloud{
    margin-top:35px;
}

.subject-cloud span{
    display:inline-block;
    padding:12px 18px;
    margin:8px;
    border-radius:40px;
    background:#172554;
    color:#fff;
    transition:.3s;
    cursor:pointer;
}

.subject-cloud span:hover{
    background:#d4af37;
    transform:scale(1.08);
}

.curriculum-cta{
    background:linear-gradient(135deg,#172554,#0f1b3d);
    color:#fff;
    border-radius:20px;
    padding:45px;
    height:100%;
}

.curriculum-cta h3{
    color:#fff;
    margin-bottom:20px;
}

.curriculum-stats{
    display:flex;
    justify-content:space-between;
    margin:35px 0;
}

.curriculum-stats h2{
    color:#d4af37;
    font-weight:700;
}

.curriculum-stats span{
    font-size:13px;
}