:root {
    /* --color-main: #4d0000; */
    --color-main: #a13f3f;
    --color-second: #CEAC50;
    --color-text: #444444;
    --color-white: #FFFFFF;
    --color-text-lite: #5e5e5e;
}

html {font-size: 16px;}

body {
  font-family: "Raleway";
  font-weight: 500;
  font-style: normal;
  color: var(--color-text);
  background-color: #f9f8f1;
}

a, a:hover {
  transition: ease-in-out all .3s;
}


h1, h2, h3, h4, h5, h6, .title {
  font-family: 'ST-Izhora-free';
  font-weight: normal;
  font-style: normal;
}

h1, h2, .title {
  color: var(--color-main);
}

h3, h4, h5, h6 {
  color: var(--color-text-lite);
}

.color-main {color: var(--color-main)}
.color-second {color: var(--color-second)}
.color-text {color: var(--color-text)}
.color-white {color: var(--color-white)}
.color-gray-200 {color: var(--bs-gray-200)}

.color-bg-main {background-color: var(--color-main)}
.color-bg-second {background-color: var(--color-second)}
.color-bg-text {background-color: var(--color-text)}
.color-bg-white {background-color: var(--color-white)}
.color-bg-gray-200 {background-color: var(--bs-gray-200)}

.gradient-bg-blue {
  background: var(--color-blue-2);
  background: linear-gradient(90deg, var(--color-blue-1) 0%, var(--color-blue-2) 100%);
}

.gradient-blue {
  background: -webkit-linear-gradient(0deg, var(--color-blue-1), var(--color-blue-2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gradient-main {
  background: -webkit-linear-gradient(0deg, var(--color-main), var(--color-second));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.tx-08 {font-size: .8rem;}
.tx-09 {font-size: .9rem;}
.tx-1 {font-size: 1rem;}
.tx-12 {font-size: 1.2rem;}
.tx-15 {font-size: 1.5rem;}
.tx-18 {font-size: 1.8rem;}
.tx-2 {font-size: 2rem;}
.tx-25 {font-size: 2.5rem;}
.tx-3 {font-size: 3rem;}
.tx-35 {font-size: 3.5rem;}
.tx-4 {font-size: 4rem;}
.tx-45 {font-size: 4.5rem;}
.tx-5 {font-size: 5rem;}

.lh-1 {line-height: 1 !important;}
.lh-12 {line-height: 1.2 !important;}

.frame-space-before-extra-large { margin-top: 10rem; }
.frame-space-after-extra-large { margin-bottom: 10rem; }
.frame-space-before-large { margin-top: 8rem; }
.frame-space-after-large { margin-bottom: 8rem; }
.frame-space-before-medium { margin-top: 6rem; }
.frame-space-after-medium { margin-bottom: 6rem; }
.frame-space-before-small { margin-top: 4rem; }
.frame-space-after-small { margin-bottom: 4rem; }
.frame-space-before-extra-small { margin-top: 2rem; }
.frame-space-after-extra-small { margin-bottom: 2rem; }

.ce-headline-center {
  text-align: center;
}

.back-to-top {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    right: 15px;
    bottom: 15px;
    z-index: 996;
    background: var(--color-second);
    width: 40px;
    height: 40px;
    border-radius: 4px;
    transition: all 0.4s;
}

.back-to-top i {
    font-size: 28px;
    color: #fff;
    line-height: 0;
}

.back-to-top.active {
    visibility: visible;
    opacity: 1;
}


#header {
  background-color: var(--color-main);
}

#header.fixed-top {
  box-shadow: 0 0 20px rgba(0,0,0,.2);
}

#hero {
  position: relative;
  width: 100%;
  height: 40vh;
}

#hero{
  background-image: url(../img/depth.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
} 

main {
  margin-top: 0 !important; 
}

main.scrolled-offset {
  margin-top: 62px !important; 
}

.frame ul li, .frame ol li {
  margin-top: 0;
  margin-bottom: 1rem;
}

a {
  color: var(--color-main);
  text-decoration: none;
}

a:hover {
  color: var(--color-second);
}

/*---------------------------# Navigation Menu-----------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {
  padding: 0;
}

.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}

.navbar li {
  position: relative;
}

.navbar>ul>li {
  //white-space: nowrap;
  padding: 20px 20px;
}

.navbar a,
.navbar a:focus {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 3px;
  font-size: 15px;
  font-weight: 600;
  color: #ffffff;
  //white-space: nowrap;
  transition: 0.3s;
  position: relative;
  text-decoration: none;
}

.navbar ul li.dropdown ul li a {
  color: var(--color-text);
}

.navbar a i,
.navbar a:focus i {
  font-size: 12px;
  line-height: 0;
  margin-left: 5px;
}

.navbar>ul>li>a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: -6px;
  left: 0;
  background-color: var(--color-main-light);
  visibility: hidden;
  width: 0px;
  transition: all 0.3s ease-in-out 0s;
}

.navbar a:hover:before,
.navbar li:hover>a:before,
.navbar .active:before {
  visibility: visible;
  width: 100%;
}

.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover>a {
  color: var(--color-second);
}

.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 28px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
}

.navbar .dropdown ul li {
  min-width: 300px;
}

.navbar .dropdown ul a {
  padding: 10px 20px;
  font-weight: 400;
}

.navbar .dropdown ul a i {
  font-size: 12px;
}

.navbar .dropdown ul a:hover,
.navbar .dropdown ul .active:hover,
.navbar .dropdown ul li:hover>a {
  color: var(--color-second);
}

.navbar .dropdown:hover>ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}

.navbar .dropdown .dropdown:hover>ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}

.logo {
   width: 250px;
}

ul.nav-left {
  padding-left: 0;
} 

ul.nav-left a {
  color: var(--color-text);
  text-decoration: none;
}

ul.nav-left a:hover {
  background-color: var(--color-main);
  color: var(--color-white);
}

ul.nav-left a.active {
  border-left: 2px solid var(--color-second);
}

.bookshelf {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: -110px;
}

.book2-shadow {
    position: absolute;
    bottom: 0;
    left: 0;
    bottom: -2px;
}

.book2-cover {
    transition: all .5s ease 0s;
    perspective: 1500px;
}

@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }

  .navbar .dropdown .dropdown:hover>ul {
    left: -100%;
  }
}

/**
* Mobile Navigation 
*/
.mobile-nav-toggle {
    font-size: 35px;
    cursor: pointer;
    line-height: 0;
    transition: 0.5s;
    border: 2px solid #fff;
    color: #fff;
    border-radius: 5px;
}

.mobile-nav-toggle:hover {
    background-color: var(--color-main-light);
    color: var(--color-second) !important;
    border: 2px solid var(--color-second) !important;

}

.lite-link {
  color: #fff;
}

.lite-link:hover {
  color: var(--color-second);
}

.mobile-nav-toggle.bi-x {
  color: #fff;
}

/*@media (max-width: 1200px) {
  .mobile-nav-toggle {
    display: block;
  }

  .navbar ul {
    display: none;
  }
}*/

.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(9, 9, 9, 0.9);
  transition: 0.3s;
  z-index: 999;
}

.navbar-mobile .mobile-nav-toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}

.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  background-color: #fff;
  overflow-y: auto;
  transition: 0.3s;
}

.navbar-mobile a,
.navbar-mobile a:focus {
  padding: 10px 20px;
  font-size: 15px;
  color: #222222;
}

.navbar-mobile>ul>li {
  padding: 0;
}

.navbar-mobile a:hover:before,
.navbar-mobile li:hover>a:before,
.navbar-mobile .active:before {
  visibility: hidden;
}

.navbar-mobile a:hover,
.navbar-mobile .active,
.navbar-mobile li:hover>a {
  color: var(--color-main-light);
}

.navbar-mobile .getstarted,
.navbar-mobile .getstarted:focus {
  margin: 15px;
}

.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}

.navbar-mobile .dropdown ul li {
  min-width: 200px;
}

.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}

.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}

.navbar-mobile .dropdown ul a:hover,
.navbar-mobile .dropdown ul .active:hover,
.navbar-mobile .dropdown ul li:hover>a {
  color: var(--color-main-light);
}

.navbar-mobile .dropdown>.dropdown-active {
  display: block;
}

ul.nav-left-child {
    list-style-type: none;
    padding-left: 1rem;
    border-left: 1px solid var(--bs-gray-500);
    margin-left: 0.3rem;
}

ul.nav-left-child li {
    padding: 10px 0;
    line-height: 1;
    transition: all .3s
}

ul.nav-left-child li:hover {
    padding-left: 5px;
    transition: all .3s;
}

.left-menu-l-1 {
  cursor: pointer;
}

.left-menu-l-1 i.bi-chevron-right {
   transition: all .3s;
} 

.left-menu-l-1:not(.collapsed) i.bi-chevron-right {
   transform: rotate(90deg);
   transition: all .3s;
}

ul.foorer-menu {
  list-style-type: none;
  padding-left: 0 !important;
}

.nav-offcanvas a {
  color: var(--color-text);
  text-decoration: none;
}

ul.foorer-menu li a {
  color: var(--color-white);
  text-decoration: none;
}

ul.foorer-menu li a:hover {
  color: var(--color-second);
}

.nav-offcanvas a:hover {
  color: var(--color-main);
}

a.active {
  font-weight: bold;
}
/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
  padding: 20px 0;
  background-color: #f1efe2;
  min-height: 40px;
}

.breadcrumbs h2 {
  font-family: "Raleway";
  color: var(--color-text);
  font-weight: 500 !important;
  font-size: 1.2rem;
  font-weight: 300;
  margin: 0;
}

.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 14px;
}

.breadcrumbs ol li+li {
  padding-left: 10px;
}

.breadcrumbs ol li+li::before {
  display: inline-block;
  padding-right: 10px;
  color: #6c757d;
  content: "/";
}

.breadcrumbs a {
  color: var(--color-text);
  text-decoration: none;
}

.breadcrumbs a:hover {
  color: var(--color-second);
}

.collapse .container, .collapsing .container {
   border-left: 1px solid #b56969;
   margin-left: 10px;
}

.collapse-title {
  font-family: "Raleway";
  color: var(--color-main);
  font-weight: 400;
}

hr.orn1 {
    height: 30px;
    background-image: url(/fileadmin/assets/img/ornbg1.svg);
    background-size: contain;
    background-repeat: repeat-x;
    background-position: center;
    border: none;
    opacity: .5;
  }

hr.orn11 {
    height: 30px;
    background-image: url(/fileadmin/assets/img/ornbg1_.svg);
    background-size: contain;
    background-repeat: repeat-x;
    background-position: center;
    border: none;
    opacity: .5;
  }

hr.orn2 {
    text-align: center;
    height: 30px;
    background-image: url(/fileadmin/assets/img/ornbg2.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: .6;
    border: none;
  }

hr.orn2::before, hr.orn2::after {
    display: inline-block;
    content: "";
    width: 35%;
    border-top: 1px solid #000000;
    margin-top: 14px;
  }

hr.orn2::before {
    margin-right: 100px;
  }

hr.orn2::after {
    margin-left: 100px;
  }

hr.orn3 {
    text-align: center;
    height: 15px;
    background-image: url(/fileadmin/assets/img/ornbg3.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: .6;
    border: none;
  }

hr.orn3::before, hr.orn3::after {
    display: inline-block;
    content: "";
    width: 36%;
    border-top: 1px solid #000000;
    margin-bottom: 8px;
  }

hr.orn3::before {
    margin-right: 80px;
  }

hr.orn3::after {
    margin-left: 80px;
  }

.video-container {
    margin-bottom: 5px;
}
.video-container {
    position: relative;
    padding-bottom: 49.6%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe, .video-container object, .video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.page-link {
    color: var(--link-color) !important;
    background-color: transparent !important;
    border: none !important;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}