@import url("https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i");

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
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;
}

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}

ul, li {
  padding: 0;
  margin: 0;
  list-style: none;
}

header, nav, section, article, aside, footer, hgroup {
  display: block;
}

* {
  box-sizing: border-box;
}

html, body {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  background-color: #fff;
  font-size: 16px;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.body-bg {
  font-family: 'Poppins', sans-serif;
  overflow-x: hidden;
  background-image: url(../images/polygon-bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  height: 100vh; /* Set height to 100% of the viewport height */
  margin: 0; /* Remove default margin */
  padding: 0; /* Remove default padding */
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  text-decoration: none !important;
}

a.orange-text {
  color: #ed563b !important;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0px;
  margin-bottom: 0px;
}

ul {
  margin-bottom: 0px;
}

p {
  font-size: 14px;
  line-height: 25px;
  color: #4a4a4a;
}

p.white-version {
  font-size: 14px;
  line-height: 25px;
  color: #fff;
}

/* 
---------------------------------------------
global styles
--------------------------------------------- 
*/
html,
body {
  background: #fff;
  font-family: 'Poppins', sans-serif;
}

::selection {
  background: #ed563b;
  color: #fff;
}

::-moz-selection {
  background: #ed563b;
  color: #fff;
}

@media (max-width: 991px) {
  html, body {
    overflow-x: hidden;
  }
  .mobile-top-fix {
    margin-top: 30px;
    margin-bottom: 0px;
  }
  .mobile-bottom-fix {
    margin-bottom: 30px;
  }
  .mobile-bottom-fix-big {
    margin-bottom: 60px;
  }
}

.section-heading {
  /*text-align: center;*/
  margin-top: 50px;
  margin-bottom: 20px;
}

.section-subheading {
  margin-bottom: 40px;
}

.section-heading .container {
  /*text-align: center;*/
  margin-top: 20px;
  margin-bottom: 20px;
}

.sub-section-heading {
  margin-bottom: 40px;
}

.section-heading h2 {
  font-size: 32px;
  font-weight: 800;
  color: #232d39;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 0px;
  margin-bottom: 10px;
}

.section-subheading h2 {
  font-size: 32px;
  font-weight: 800;
  color: #232d39;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.section-heading h2 em {
  font-style: normal;
  color: #ed563b;
}

.section-heading img {
  margin: 20px auto;
}

.dark-bg h2 {
  color: #fff;
}

.dark-bg p {
  color: #fff;
}

.main-button a {
  display: inline-block;
  font-size: 15px;
  padding: 12px 20px;
  background-color: #ed563b;
  color: #fff;
  text-align: center;
  font-weight: 400;
  text-transform: uppercase;
  transition: all .3s;
  border-radius: 5px;
}

.main-button a:hover {
  background-color: #f9735b;
  color: #fff;
}

/* 
---------------------------------------------
chosen stuff
--------------------------------------------- 
*/

a.chosen-single {
  width: 176.667px !important;
  height: 38px !important;
}
.chosen-container-single .chosen-single {
  display: block !important;
  width: auto !important;
  height: calc(2.25rem + 2px) !important;
  padding: .375rem .75rem !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  color: #495057 !important;
  background-color: #fff !important;
  background-clip: padding-box !important;
  border: 1px solid #ced4da !important;
  border-radius: .25rem !important;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out !important;

}

.chosen-container-single .chosen-single span {
  color: #495057;
}

.chosen-container-single .chosen-single div b {
  width: 176.667 !important;
  height: calc(2.25rem + 2px) !important;
  margin-top: 6px !important;
}

/* 
---------------------------------------------
universal stuff
--------------------------------------------- 
*/

.universal-margin-bottom-20 {
  margin-bottom: 20px;
}

.universal-margin-bottom-10 {
  margin-bottom: 10px;
}

.universal-margin-top-40 {
  margin-top: 40px;
}

.universal-container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: 20px;
  margin-left: 20px;
}

.universal-bold {
  font-weight: 700;
  text-transform: uppercase;
}



/* 
---------------------------------------------
chosen
--------------------------------------------- 
*/

a.chosen-single {
  height: 38px;
}

.chosen-container-single .chosen-single {
  display: block;
  width: auto;
  height: calc(2.25rem + 2px);
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: .25rem;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;

}

.chosen-container-single .chosen-single span {
  color: #495057;
}

.chosen-container-single .chosen-single div b {
  width: 176.667;
  height: calc(2.25rem + 2px);
  margin-top: 6px;
}

/* 
---------------------------------------------
index admin box
--------------------------------------------- 
*/

.box_text {
  margin-bottom: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.dashboard_box {
  background-size: 100% 100% !important;
  background-repeat: no-repeat;
  margin-bottom: 20px;
  width: 350px;
  height: 185px;
  border-radius: 15px;
  margin-bottom: 20px;
  padding: 15px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.work_text:hover {
  opacity: 1;
}

.work_text {
  text-align: center;
  opacity: 1;
  transition: ease-in all 0.5s;
  cursor: pointer;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-start; /* Aligns text to the top */
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
}

/* 
---------------------------------------------
header
--------------------------------------------- 
*/

.logo {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.login-logo {
    align-items: center;
    text-decoration: none;
}

.logo img {
    width: 45px;
    height: 40px; /* Make the logo responsive */
    margin-right: 10px;
}

.login-logo img {
    width: 90px;
    height: 80px; /* Make the logo responsive */
    margin-right: 10px;
}

.logo-footer {
    text-align: right;
    text-decoration: none;
}


.logo-footer img {
    width: 234px;
    height: 208px; /* Make the logo responsive */
    margin-right: 10px;
    align-items: right;
}

.background-header {
  background: rgba(250,250,250,0.99) !important;
  height: 80px!important;
  position: fixed!important;
  top: 0px;
  left: 0px;
  right: 0px;
  box-shadow: 0px 0px 10px rgba(0,0,0,0.15)!important;
}

.background-header .logo,
.background-header .main-nav .nav li a {
  color: #232d39!important;
}

.background-header .main-nav .nav li:hover > a {
  color: #ed563b!important;
}

.background-header .nav li a.active {
  color: #ed563b!important;
}

.header-area {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: 100;
  height: 80px;
  background: rgba(250,250,250,0.1);
  -webkit-transition: all .5s ease 0s;
  -moz-transition: all .5s ease 0s;
  -o-transition: all .5s ease 0s;
  transition: all .5s ease 0s;
}

.header-area .main-nav {
  min-height: 80px;
  background: transparent;
}

.header-area .main-nav .logo {
  line-height: 80px;
  color: #fff;
  font-size: 24px;
  font-weight: 800;
  text-transform: uppercase;
  float: left;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.header-area .main-nav .logo em {
  font-style: normal;
  color: #ed563b;
  font-weight: 900;
  margin-left: 5px;
}

.header-area .main-nav .nav {
  float: right;
  margin-top: 27px;
  margin-right: 0px;
  background-color: transparent;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  position: relative;
  z-index: 999;
}

.header-area .main-nav .nav li {
  padding-left: 10px;
  padding-right: 10px;
}

.header-area .main-nav .nav li a {
  display: block;
  font-weight: 500;
  font-size: 11px;
  color: #4a4a4a;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  height: 40px;
  line-height: 40px;
  border: transparent;
  letter-spacing: 1px;
}

.header-area .main-nav .nav li a {
  color: #fff;
}

.header-area .main-nav .nav li:hover > a,
.header-area .main-nav .nav li > a.active {
  color: #ed563b!important;
  opacity: 1;
}

.background-header .main-nav .nav li:hover > a,
.background-header .main-nav .nav li > a.active {
  color: #ed563b!important;
  opacity: 1;
}

.header-area .main-nav .menu-trigger {
  cursor: pointer;
  display: block;
  position: absolute;
  top: 23px;
  width: 32px;
  height: 40px;
  text-indent: -9999em;
  z-index: 99;
  right: 40px;
  display: none;
}

.header-area .main-nav .menu-trigger span,
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #1e1e1e;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
}

.background-header .main-nav .menu-trigger span,
.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after {
  background-color: #1e1e1e;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #1e1e1e;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
  width: 75%;
}

.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after {
  background-color: #1e1e1e;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  content: "";
}

.header-area .main-nav .menu-trigger span {
  top: 16px;
}

.header-area .main-nav .menu-trigger span:before {
  -moz-transform-origin: 33% 100%;
  -ms-transform-origin: 33% 100%;
  -webkit-transform-origin: 33% 100%;
  transform-origin: 33% 100%;
  top: -10px;
  z-index: 10;
}

.header-area .main-nav .menu-trigger span:after {
  -moz-transform-origin: 33% 0;
  -ms-transform-origin: 33% 0;
  -webkit-transform-origin: 33% 0;
  transform-origin: 33% 0;
  top: 10px;
}

.header-area .main-nav .menu-trigger.active span,
.header-area .main-nav .menu-trigger.active span:before,
.header-area .main-nav .menu-trigger.active span:after {
  background-color: transparent;
  width: 100%;
}

.header-area .main-nav .menu-trigger.active span:before {
  -moz-transform: translateY(6px) translateX(1px) rotate(45deg);
  -ms-transform: translateY(6px) translateX(1px) rotate(45deg);
  -webkit-transform: translateY(6px) translateX(1px) rotate(45deg);
  transform: translateY(6px) translateX(1px) rotate(45deg);
  background-color: #1e1e1e;
}

.background-header .main-nav .menu-trigger.active span:before {
  background-color: #1e1e1e;
}

.header-area .main-nav .menu-trigger.active span:after {
  -moz-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -ms-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -webkit-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  transform: translateY(-6px) translateX(1px) rotate(-45deg);
  background-color: #1e1e1e;
}

.background-header .main-nav .menu-trigger.active span:after {
  background-color: #1e1e1e;
}

.header-area.header-sticky {
  min-height: 80px;
}

.header-area.header-sticky .nav {
  margin-top: 20px !important;
}

.header-area.header-sticky .nav li a.active {
  color: #ed563b;
}

@media (max-width: 1200px) {
  .header-area .main-nav .nav li {
    padding-left: 12px;
    padding-right: 12px;
  }
  .header-area .main-nav:before {
    display: none;
  }
}

@media (max-width: 767px) {
  .header-area .main-nav .logo {
    line-height: 80px;
    color: #1e1e1e;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    float: left;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  } 

  .logo img {
    margin-right: 10px;
  }

  .header-area.header-sticky .nav li a:hover,
  .header-area.header-sticky .nav li a.active {
    color: #ed563b!important;
    opacity: 1;
  }
  .header-area {
    background-color: #f7f7f7;
    padding: 0px 15px;
    height: 80px;
    box-shadow: none;
    text-align: center;
  }
  .header-area .container {
    padding: 0px;
  }
  /*.header-area .logo {
    margin-left: 30px;
  }*/
  .header-area .menu-trigger {
    display: block !important;
  }
  .header-area .main-nav {
    overflow: hidden;
  }
  .header-area .main-nav .nav {
    float: none;
    width: 100%;
    display: none;
    -webkit-transition: all 0s ease 0s;
    -moz-transition: all 0s ease 0s;
    -o-transition: all 0s ease 0s;
    transition: all 0s ease 0s;
    margin-left: 0px;
    overflow: visible !important;
  }
  .header-area .main-nav .nav li:first-child {
    border-top: 1px solid #eee;
  }
  .header-area .main-nav .nav li:last-child {
    width: 100%;
    background-color: #ed563b;
    color: #fff;
  }

  .header-area.header-sticky .nav {
    margin-top: 80px !important;
  }
  .header-area .main-nav .nav li {
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #eee;
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .header-area .main-nav .nav li a {
    height: 50px !important;
    line-height: 50px !important;
    padding: 0px !important;
    border-top: 1px solid #eee !important;
    background: #f7f7f7 !important;
    color: #232d39 !important;
  }
  .header-area .main-nav .nav li a:hover {
    background: #eee !important;
    color: #ed563b!important;
  }
  .header-area .main-nav .nav li.submenu ul {
    position: relative;
    visibility: inherit;
    opacity: 1;
    z-index: 1;
    transform: translateY(0%);
    transition-delay: 0s, 0s, 0.3s;
    top: 0px;
    width: 100%;
    box-shadow: none;
    height: 0px;
  }
  .header-area .main-nav .nav li.submenu ul li a {
    font-size: 12px;
    font-weight: 400;
  }
  .header-area .main-nav .nav li.submenu ul li a:hover:before {
    width: 0px;
  }
  .header-area .main-nav .nav li.submenu ul.active {
    height: auto !important;
  }
  .header-area .main-nav .nav li.submenu:after {
    color: #3B566E;
    right: 25px;
    font-size: 14px;
    top: 15px;
  }
  .header-area .main-nav .nav li.submenu:hover ul, .header-area .main-nav .nav li.submenu:focus ul {
    height: 0px;
  }
}

@media (min-width: 767px) {
  .header-area .main-nav .nav {
    display: flex !important;
  }
}


/* 
---------------------------------------------
banner
--------------------------------------------- 
*/

.main-banner {
  position: relative;
}

.main-banner-admin {
  position: relative;
  height: 200px; /* Set the desired height */
  width: 400px; /* Automatically adjust the width to maintain aspect ratio */
}

.banner-image {
    height: 620px; /* Set the desired height */
    width: 1349px; /* Automatically adjust the width to maintain aspect ratio */
    display: block; /* Ensure the image is displayed as a block element */
    margin: 0 auto; /* Center the image horizontally */
}

.banner-image-admin {
    height: 250px;
    width: 1349px;
    display: block; /* Ensure the image is displayed as a block element */
    margin: 0 auto; /* Center the image horizontally */
}

#bg-video {
    min-width: 100%;
    min-height: 100vh;
    max-width: 100%;
    max-height: 100vh;
    object-fit: cover;
    z-index: -1;
}

#bg-video::-webkit-media-controls {
    display: none !important;
}

.image-overlay {
    position: absolute;
    background-color: rgba(35,45,57,0.8);
    top: 0;
    left: 0;
    bottom: 0px;
    width: 100%;
}

.main-banner .caption {
  text-align: center;
  position: absolute;
  width: 80%;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}

.main-banner .caption-admin {
  text-align: center;
  position: absolute;
  width: 80%;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}

.main-banner .caption h6 {
  margin-top: 0px;
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.5px;
}

.main-banner .caption h2 {
  margin-top: 40px;
  margin-bottom: 25px;
  font-size: 48px;
  text-transform: uppercase;
  font-weight: 800;
  color: #fff;
  letter-spacing: 1px;
}

.main-banner .caption-admin h2 {
  margin-top: 100px;
  margin-bottom: 25px;
  font-size: 48px;
  text-transform: uppercase;
  font-weight: 800;
  color: #fff;
  letter-spacing: 1px;
}

.main-banner .caption h2 em {
  font-style: normal;
  color: #ed563b;
  font-weight: 900;
}

/*
---------------------------------------------
Float Contact
---------------------------------------------
*/

#block-kontaktfixed {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  z-index: 99;
  transition: right 0.2s ease-in-out;
}

#block-kontaktfixed ul li {
  display: flex;
  margin-bottom: 5px;
  justify-content: flex-end;
}

#block-kontaktfixed ul li a {
  background: #ed563b;
  color: #fff;
  padding: 10px;
  text-decoration: none;
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  font-size: 30px;

}

#block-kontaktfixed ul li a:hover div {
  display: flex; /* or display: block; depending on your styling */
}

#block-kontaktfixed ul li a div {
  display: none;
  align-items: flex-start; /* Adjust alignment as needed */
  flex-direction: column;
  padding-right: 30px; /* Adjust padding as needed */
}

#block-kontaktfixed ul li a div span {
  display: block;
  margin-bottom: 5px;
}

#block-kontaktfixed ul li a div .h5 {
  font-weight: bold;
}

#block-kontaktfixed ul li a div .phone {
  color: #fff; /* Adjust color as needed */
}

#block-kontaktfixed ul li a div .small {
  font-size: 0.8em; /* Adjust font size as needed */
  color: #fff; /* Adjust color as needed */
}


/*
---------------------------------------------
Images
---------------------------------------------
*/

.project-img {
  display: flex; 
  align-items: center; 
  justify-content: center;
  height: 100%; /* Add this line to ensure the container takes the full height */
}

.project-img-2 img {
    width: 250px; /* Adjust the width as needed */
    height: 150px; /* Adjust the height as needed */
    margin-bottom: 20px;
}

.image-thumb img {
    width: 300px; /* Adjust the width as needed */
    height: 200px; /* Adjust the height as needed */
    margin-bottom: 20px;
}

.image-thumb-2 img {
  width: 360px; /* Adjust the width as needed */
  height: 240px; /* Adjust the height as needed */
  border-color: #fff;
  border: 1px;
  border-radius: 5px;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
  transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.img-fixed {
  height: 370px;
  width: 540px;
  transition: transform 0.3s ease-in-out;
}

.project-img-fixed {
  height: 400px;
  width: 830px;
  transition: transform 0.3s ease-in-out;
}

.img-modal {
  max-width: 150%; /* Increase the maximum width to 150% of its original size */
  max-height: 100vh; /* Set a maximum height to prevent overflow, relative to the viewport height */
}

.image-container {
  position: relative;
  cursor: pointer;
}

.img-zoom {
  transform: scale(1.2); /* Adjust the scale factor for your desired zoom level */
}

.testimonial-img {
  height: 100px;
  width: 100px;

}

/*
---------------------------------------------
features
---------------------------------------------
*/

#features {
  margin-bottom: 80px;
}

.feature-item {
  display: inline-block;
  margin-bottom: 60px;
}

.feature-item .left-icon img {
  float: left;
  margin-right: 30px;
}

.feature-item .right-content {
  display: inline;
}

.feature-item .right-content h4 {
  margin-top: 0px;
  margin-bottom:  7px;
  letter-spacing: 0.25px;
  color: #232d39;
  font-size: 19px;
  font-weight: 600;
  text-transform: capitalize;
}

.feature-item .right-content a.text-button {
  margin-top: 7px;
  display: inline-block;
  font-size: 13px;
  text-transform: uppercase;
  color: #ed563b;
  font-weight: 500;
}

/*
---------------------------------------------
subscribe
---------------------------------------------
*/

#call-to-action {
  padding: 120px 0px;
  background-image: url(../images/cta-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
}

.cta-content h2 {
  font-size: 36px;
  text-transform: uppercase;
  font-weight: 800;
  color: #fff;
  letter-spacing: 1px;
}

.cta-content-dark h2 {
  font-size: 36px;
  text-transform: uppercase;
  font-weight: 800;
  color: #4a4a4a;
  letter-spacing: 1px;
}

.cta-content h2 em {
  font-style: normal;
  color: #ed563b;
}

.cta-content-dark h2 em {
  font-style: normal;
  color: #ed563b;
}

.cta-content p {
  font-size: 16px;
  color: #fff;
  margin: 15px 0px 25px 0px;
}

.cta-content-dark p {
  font-size: 16px;
  color: #4a4a4a;
  margin: 15px 0px 25px 0px;
}

/*
---------------------------------------------
Project
---------------------------------------------
*/

#project-section {
  padding: 120px 0px;
  background-image: url(../images/cta-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
}

.project-content h2 {
  font-size: 36px;
  text-transform: uppercase;
  font-weight: 800;
  color: #fff;
  letter-spacing: 1px;
}

.project-content-dark h2 {
  font-size: 36px;
  text-transform: uppercase;
  font-weight: 800;
  color: #4a4a4a;
  letter-spacing: 1px;
}

.project-content h2 em {
  font-style: normal;
  color: #ed563b;
}

.project-content-dark h2 em {
  font-style: normal;
  color: #ed563b;
}

.project-content p {
  font-size: 16px;
  color: #fff;
  margin: 15px 0px 25px 0px;
}

.project-content-dark p {
  font-size: 16px;
  color: #4a4a4a;
  margin: 15px 0px 25px 0px;
}

.section-project-left {
  padding-right: 60px;
}
.section-project-right {
  border-left: 2px solid #eaeaea;
  padding-left: 60px;
}

.views-row {
  width: 100%;
  padding: 0;
  padding-bottom: 0px;
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eaeaea;

}


/*
--------------------------------------------
Our Classes
--------------------------------------------
*/

#our-classes {
  margin-bottom: 140px;
}

#tabs ul {
  margin: 0;
  padding: 0;
}
#tabs ul li {
  margin-bottom: 30px;
  display: inline-block;
  width: 100%;
}
#tabs ul li:last-child {
  margin-bottom: 0px;
}
#tabs ul li a {
  text-transform: capitalize;
  width: 100%;
  padding: 30px 30px;
  display: inline-block;
  background-color: #fff;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
  border-radius: 5px;
  font-size: 19px;
  color: #232d39;
  letter-spacing: 0.5px;
  font-weight: 600;
  transition: all 0.3s;
}
#tabs .main-rounded-button a {
  text-align: center;
  padding: 20px 30px;
  width: 100%;
  border-radius: 5px;
  display: inline-block;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
  color: #fff;
  font-size: 19px;
  letter-spacing: 0.5px;
  font-weight: 600;
  background-color: #ed563b;
}
#tabs .main-rounded-button a:hover {
  background-color: #f9735b;
}
#tabs ul li a .fa {
  font-size: 32px;
  height: 32px;
  color: #ed563b;
  margin-right: 15px;
  display: inline-block;
}
#tabs ul .ui-tabs-active span {
  background: #faf5b2;
  border: #faf5b2;
  line-height: 90px;
  border-bottom: none;
}
#tabs ul .ui-tabs-active a {
  color: #ed563b;
}
#tabs ul .ui-tabs-active span {
  color: #1e1e1e;
}
.tabs-content {
  margin-left: 30px;
  text-align: left;
  display: inline-block;
  transition: all 0.3s;
}
.tabs-content img {
  max-width: 100%;
  overflow: hidden;
  border-radius: 5px;
}
.tabs-content h4 {
  font-size: 23px;
  font-weight: 700;
  color: #232d39;
  letter-spacing: 0.5px;
  margin-bottom: 20px;
  margin-top: 30px;
}
.tabs-content p {
  font-size: 14px;
  color: #4a4a4a;
  margin-bottom: 28px;
}

/* 
---------------------------------------------
table
--------------------------------------------- 
*/
.tabledata {
  font-size: 11px;
}

/* 
---------------------------------------------
schedule
--------------------------------------------- 
*/

.section-bg {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.section-bg:before {
  content:'';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(35,45,57,0.8);
}

.section-bg > form,
.section-bg .container {
  position: relative;
  z-index: 2
}

#schedule {
  padding: 0px 0px 140px 0px;
}

#schedule table {
  width: 100%;
  text-align: center;
  border: 1px solid #fff;
}

#schedule table tbody {
  border-top: 1px solid #fff; 
}

#schedule table tbody tr {
  border-bottom: 1px solid #fff;
}

#schedule table tbody tr td {
  border-right: 1px solid #fff;
  height: 100px;
}

#schedule table tr td {
  color: #fff;
  font-size: 13px;
  text-transform: capitalize;
  font-weight: 500;
  letter-spacing: 0.25px;
}

.schedule-table.filtering .ts-item {
    opacity: 0;
    transition: all 0.5s;
}

.schedule-table.filtering .ts-item.show {
    opacity: 1;
    transition: all 0.5s;
}

#schedule .filters {
  margin-bottom: 40px;
}
#schedule .filters ul {
  padding: 0;
  text-align: center;
}
#schedule .filters ul li {
  list-style: none;
  display: inline;
  cursor: pointer;
  position: relative;
  margin-right: 10px;
  font-size: 15px;
  font-weight: 500;
  color: #fff;
  text-transform: capitalize;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#schedule .filters ul li:after {
  content: "/";
  margin-left: 10px;
  color: #fff;
}
#schedule .filters ul li:last-child {
  margin-right: 0px;
}
#schedule .filters ul li:last-child::after {
  display: none;
}
#schedule .filters ul li.active,
#schedule .filters ul li:hover {
  color: #ed563b;
}
#schedule .filters-content {
  margin-top: 50px;
}
#schedule .filters-content .show {
  opacity: 1;
  visibility: visible;
  transition: all 350ms;
}
#schedule .filters-content .hide {
  opacity: 0;
  visibility: hidden;
  transition: all 350ms;
}

/*PANEL*/

.borderccc {
  border-color: #ccc !important;
  border-width: 2px !important;
}

.bordergreen {
  border-color: #3a6238 !important;
  border-width: 2px !important;
}

.borderred {
  border-color: #c82333 !important;
  border-width: 2px !important;
}

.borderyellow {
  border-color: #ffc107 !important;
  border-width: 2px !important;
}

.borderorange {
  border-color: #ed563b !important;
  border-width: 2px !important;
}

.panel {
  /*border-color: #eee !important;*/
  font-size: 12px !important;
}

.panel-green {
  border-color: #3a6238 !important;
  font-size: 12px !important;
}

.panel {
  margin-bottom: 25px;
  background-color: #fff;
  border: 1px solid transparent;
    border-top-color: transparent;
    border-top-width: 1px;
    border-right-color: transparent;
    border-right-width: 1px;
    border-bottom-color: transparent;
    border-bottom-width: 1px;
    border-left-color: transparent;
    border-left-width: 1px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
  box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

.bg-light {
  background-color: #f8f9fa !important;
}

.panel-heading {
  font-weight: bolder !important;
  border-bottom: 2px solid #ddd;
  border-top: 2px solid #ddd;
  padding: 10px 5px 10px 30px !important;
  letter-spacing: 2px !important;
  font-weight: bolder;
}

.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

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

.text-info {
  color: #3a6238 !important;
}

.text-info-red {
  color: #c82333 !important;
}

.text-info-yellow {
  color: #ffc107 !important;
}

.text-info-orange {
  color: #ed563b !important;
}


.font14 {
  font-size: 18.6px !important;
}

.font18 {
  font-size: 24px !important;
}

.col-xs-3 {
  width: 25%;
}

.col-xs-9 {
  width: 65%;
}

.mr-2, .mx-2 {
  margin-right: .5rem !important;
}

.panel-footer {
  padding: 10px 15px;
  background-color: #fff;
  border-top: 1px solid #ddd;
}

.panel-footer-green {
  padding: 10px 15px;
  background-color: #3a6238;
  border-top: 1px solid #ddd;
}

.panel-footer-red {
  padding: 10px 15px;
  background-color: #c82333;
  border-top: 1px solid #ddd;
}

.panel-footer-yellow {
  padding: 10px 15px;
  background-color: #ffc107;
  border-top: 1px solid #ddd;
}

.panel-footer-orange {
  padding: 10px 15px;
  background-color: #ed563b;
  border-top: 1px solid #ddd;
}

.text-primary {
  color: #6c757d !important;
}

.text-secondary {
  color: #fff !important;;
}

.text-red {
  color: #c82333 !important;
}

.text-yellow {
  color: #ffc107 !important;
}

.text-orange {
  color: #ed563b !important;
}


/* Style for the card-login class */
.container-login {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Set the container height to fill the viewport */
}

.card-login {
    max-width: 540px;
    width: 100%; /* Ensure the card fills the container width */
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    background-color: #fff;
}

/* Style for the Login button within the card */

.card-login .btn-primary:hover {
    background-color: #f9735b;
    border-color: #f9735b;
}

.card-header {
  padding: .75rem 1.25rem;
  margin-bottom: 0;
  background-color: #fff;
  border-bottom: 0px solid rgba(0,0,0,.125);
}

/* Style for the index card */
.card2 {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  max-width: auto;
  margin: auto;
  font-family: arial;
  border-radius: 10px;
}

.card-body {
  background-color: #fff;
  border-radius: 10px;
}

.card-body-2 {
  background-color: #fff;
  border-radius: 10px;
  margin-top: 20px;
  width: 1110px;
  padding: 20px;
}

/* Custom CSS to adjust card width */
.custom-card {
      max-width: 600px; /* You can adjust the width as needed */
      margin: 0 auto; /* Center the card horizontally */
      margin-top: 40px;
    }

.error-text {
  margin-bottom: 10px;
}

/* Carousel */

.carousel-inner .carousel-item img {
    height: 100%;
    vertical-align: center;
    /*object-fit: cover;*/
}

/* Search Bar Style */

.wrapper{
  max-width: 450px;
  margin: 30px auto;
}

.wrapper .search-input{
  background: #fff;
  width: 100%;
  border-radius: 5px;
  position: relative;
  box-shadow: 0px 1px 5px 3px rgba(0,0,0,0.12);
}

.search-input input{
  height: 55px;
  width: 100%;
  outline: none;
  border: none;
  border-radius: 5px;
  padding: 0 60px 0 20px;
  font-size: 18px;
  box-shadow: 0px 1px 5px 3px rgba(0,0,0,0.12);
}

.search-input.active input{
  border-radius: 5px 5px 0 0;
}

.search-input .autocom-box{
  padding: 0;
  opacity: 0;
  pointer-events: none;
  max-height: 280px;
  overflow-y: auto;
}

.search-input.active .autocom-box{
  padding: 10px 8px;
  opacity: 1;
  pointer-events: auto;
}

.autocom-box li{
  list-style: none;
  padding: 8px 12px;
  display: none;
  width: 100%;
  cursor: default;
  border-radius: 3px;
}

.search-input.active .autocom-box li{
  display: block;
}
.autocom-box li:hover{
  background: #ed7d31;
}

.search-input .icon2{
  position: absolute;
  right: 0px;
  top: 0px;
  height: 55px;
  width: 55px;
  text-align: center;
  line-height: 55px;
  font-size: 20px;
  color: #ed563b;
}

/* Input search */

/* 
---------------------------------------------
trainers
--------------------------------------------- 
*/

/* Add this CSS class for resetting card layout */
.reset-layout {
    display: block !important;
    margin-right: 10px;
}

#trainers { 
  padding-bottom: 90px;
  padding-left: 15px;
  padding-right: 15px;
}

#trainers .trainer-item {
  background-color: #fff;
  border-radius: 5px; /* Uncomment this line if needed */
  border: 2px solid #eaeaea; /* Add border property */
  box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
  padding: 15px;
  margin-bottom: 30px;
  width: 350px;
  /*height: 359px;*/
  margin-right: 20px;
  transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

#trainers .trainer-item:hover {
  transform: scale(1.05); /* Enlarge the card on hover */
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2); /* Add a subtle shadow on hover */
}

#trainers .trainer-item img {
  width: 100%;
  border-radius: 5px;
}

#trainers .trainer-item span {
  font-size: 13px;
  font-weight: 500;
  color: #ed563b;
  display: inline-block;
  margin-top: 25px;
  margin-bottom: 10px;
}

#trainers .trainer-item h4 {
  font-size: 19px;
  font-weight: 600;
  color: #232d39;
  letter-spacing: 0.5px;
  margin-bottom: 18px;
}

#trainers .trainer-item p {
  margin-bottom: 20px;
}

ul.social-icons li {
  display: inline-block;
  margin-right: 12px;
}

ul.social-icons li:last-child {
  margin-right: 0px;
}

ul.social-icons li a {
  color: #232d39;
  transition: all .3s;
}

ul.social-icons li a:hover {
  color: #ed563b;
}


/* 
---------------------------------------------
contact
--------------------------------------------- 
*/

#contact-us {
  margin-top: 140px;
}

#contact-us .container-fluid .col-lg-6 {
  padding: 0px;
}

#contact-us .contact-form {
  padding: 80px;
  background-image: url(../images/contact-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

#contact-us .contact-form #contact {
  background-color: #fff;
  padding: 40px;
  border-radius: 5px;
}

div.contact-us {
  background-color: #fff;
  padding: 40px;
  border-radius: 5px;
}

.contact-form select,
.contact-form input,
.contact-form textarea {
  color: #4a4a4a;
  font-size: 13px;
  border: 1px solid #ddd;
  background-color: #fff;
  width: 100%;
  height: 40px;
  outline: none;
  line-height: 40px;
  padding: 0px 10px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin-bottom: 30px;
}

.contact-form textarea {
  height: 150px;
  resize: none;
}

.contact-form ::-webkit-input-placeholder { /* Edge */
  color: #4a4a4a;
}

.contact-form :-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #4a4a4a;
}

.contact-form ::placeholder {
  color: #4a4a4a;
}

.contact-form button {
  display: inline-block;
  font-size: 13px;
  padding: 11px 17px;
  background-color: #ed563b;
  color: #fff;
  text-align: center;
  font-weight: 400;
  text-transform: uppercase;
  transition: all .3s;
  border: none;
  outline: none;
  margin-top: -8px;
}

.contact-form button:hover {
  background-color: #f9735b;
}




/* 
---------------------------------------------
footer
--------------------------------------------- 
*/

footer-2 {
  text-align: center;
  padding: 30px 0px;
  margin-bottom: 10px;
}

footer p {
  color: #212529;
  font-size: 13px;
}

footer p a {
  cursor: pointer;
  color: #212529;
}

footer p a:hover {
  color: #ed563b;
}

footer {
  margin-top: 40px;
  margin-left: 40px;
  margin-bottom: 40px;
  display: flex;
}

.border-top {
    border-top: 1px solid #000; /* Adjust the color and thickness as needed */
    margin-top: 40px; /* Adjust the spacing as needed */
    padding-top: 20px; /* Adjust the spacing as needed */
}

.contact-info {
  padding-right: 40px;
  width: 300px;
}

.contact-info h3 {
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 20px;
}

.contact-info p {
    margin: 5px 0;
}

.footer-links a {
    text-decoration: none;
}

.form-row-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* 
---------------------------------------------
preloader
--------------------------------------------- 
*/

.js-preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #232d39;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    opacity: 1;
    visibility: visible;
    z-index: 9999;
    -webkit-transition: opacity 0.25s ease;
    transition: opacity 0.25s ease;
}

.js-preloader.loaded {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

@-webkit-keyframes dot {
    50% {
        -webkit-transform: translateX(96px);
        transform: translateX(96px);
    }
}

@keyframes dot {
    50% {
        -webkit-transform: translateX(96px);
        transform: translateX(96px);
    }
}

@-webkit-keyframes dots {
    50% {
        -webkit-transform: translateX(-31px);
        transform: translateX(-31px);
    }
}

@keyframes dots {
    50% {
        -webkit-transform: translateX(-31px);
        transform: translateX(-31px);
    }
}

.preloader-inner {
    position: relative;
    width: 142px;
    height: 40px;
    background: #232d39;
}

.preloader-inner .dot {
    position: absolute;
    width: 16px;
    height: 16px;
    top: 12px;
    left: 15px;
    background: #fff;
    border-radius: 50%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation: dot 2.8s infinite;
    animation: dot 2.8s infinite;
}

.preloader-inner .dots {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    margin-top: 12px;
    margin-left: 31px;
    -webkit-animation: dots 2.8s infinite;
    animation: dots 2.8s infinite;
}

.preloader-inner .dots span {
    display: block;
    float: left;
    width: 16px;
    height: 16px;
    margin-left: 16px;
    background: #fff;
    border-radius: 50%;
}


/* 
---------------------------------------------
responsive
--------------------------------------------- 
*/


@media (max-width: 992px) {

  .main-banner .caption h2 {
    font-size: 32px;
  }
  #features {
    margin-bottom: 110px;
  }
  #features .feature-item {
    margin-bottom: 30px;
  }
  #our-classes .tabs-content {
    margin-left: 0px;
    margin-top: 30px;
  }
  #trainers .trainer-item {
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
  padding: 15px;
  margin: 0 auto;
  margin-bottom: 30px;
  width: 350px;
  height: 359px;
  }
  #contact-us .contact-form {
    padding: 30px;
  }
  #contact-us .contact-form #contact {
    padding: 30px;
  }

  element {
    position: absolute;
    transform: translate3d(110px, 50px, 0px);
    top: 0px;
    left: 0px;
    will-change: transform;
  }

  .dropdown-menu.show {
    display: block;
    position: absolute;
    transform: translate3d(-50%, -67%, 0) !important; /* Adjusted for center alignment */
    top: 100% !important;
    left: 50% !important; /* Center the dropdown menu */
    width: 382px; /* Set the width to match the nav */
    z-index: 1001 !important; /* Ensure the dropdown is above other elements */
    will-change: transform;
  }

  .dropdown-menu {
    position: absolute !important;
    top: 100% !important;
    left: 50% !important; /* Center the dropdown menu */
    width: 382px; /* Set the width to match the nav */
    transform: translate3d(-50%, -67%, 0) !important; /* Adjusted for center alignment */
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
  }

  .dropdown-item {
  display: block;
  width: 100%;
  padding: .25rem 1.5rem;
  clear: both;
  font-weight: 400;
  color: #212529;
  text-align: center;
  white-space: nowrap;
  background-color: transparent;
}

.project-img-fixed {
  height: 200px;
  width: 330px;
  transition: transform 0.3s ease-in-out;
}

}

@media (max-width: 450px) {
  .feature-item .right-content a.text-button {
    margin-left: 130px;
  }
}

.dropdown-menu {
  background: rgba(0,0,0,0.2);
  padding: 0;
  border-radius: 0;
}

.background-header .dropdown-menu {
  background: rgba(250,250,250,0.9);
}

.dropdown-menu a {
  line-height: 1.3;
  color: #fff;
}


.background-header .main-nav .nav li a:hover,
.background-header .main-nav .nav li a.active,
.dropdown-menu a.active,
.dropdown-menu a:hover {
  background: transparent;
  color: #ed563b!important;
  position: relative;
}

.pagination-lg .page-link {
  color: #ed563b;
}

.btn-primary {
  border-color: #ed563b;
  background-color: #ed563b;
}

.btn-primary:not(:disabled):not(.disabled).active, 
.btn-primary:not(:disabled):not(.disabled):active, 
.show>.btn-primary.dropdown-toggle,
.btn-primary:active,
.btn-primary:active:focus,
.btn-primary:focus,
.btn-primary:hover {
  background-color: #f9735b;
  border-color: #f9735b;
  outline: none;
}

.icon {
  width: 72px;
  height: 72px;
  border: none;
  border-radius: 10px;
  color: #fff;
  background-color: #ed563b;
  font-size: 30px;
  margin-bottom: 20px;
  margin-top: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.icon2 {
  border: none;
  border-radius: 10px;
  font-size: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 450px) {
  .icon {
    width: 72px;
    height: 72px;
    border: none;
    border-radius: 10px;
    color: #fff;
    background-color: #ed563b;
    font-size: 30px;
    margin-bottom: 20px;
    margin-top: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    margin-bottom: 20px;
    margin-top: 20px;
  }

  .col-md-10 {
    text-align: center !important; /* Center align the text */
  }

  .col-md-6 {
    padding-left: 0px;
    padding-right: 0px;
  }

  div.col-lg-6 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }

}

a {
  color: #ed563b;
}

a:focus,
a:hover {
  color: #f9735b;
}