html body {
    font-family: 'Poppins';
}

.sticky-wrapper {
    background-color: white;
}

.main-menu .nav li a {
    font-size: 14px;
    color: black;
}

.logo {
    display: flex;
    margin: 9px;
    align-items: center;
    justify-content: center;
}

h1,
h2,
h3,
h4,
h5 {
    color: #5A5A5A;
    font-family: 'Poppins';
}

.mt-11 {
    margin-top: 11px;
}

.dot {
    padding: 15px;
    float: left;
    position: relative;
    height: 77px;
    width: 77px;
    background-color: #bbb;
    border-radius: 50%;
    display: flex;
    justify-content: center; 
    background: linear-gradient(153deg, #422f1e 28.73%, #ad7f53 99.32%);
    margin-right: 12px;
    font-size: 32px;
    color: #ffffff;
}

.dotext {
    padding: 5px;
    float: left;
    position: relative;
    height: 77px;
    /* width: 77px; */
    /* background-color: #bbb; */
    /* border-radius: 50%; */
    display: flex;
    justify-content: center;
    /* background: linear-gradient(153deg, #422f1e 28.73%, #ad7f53 99.32%); */
    margin-right: 12px;
    font-size: 32px;
    color: #ffffff;
}

.bi-file-text {
    font-size: 24px;
}

.dot img {
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 50% !important;
}

.role {
    /*background: linear-gradient(92.7deg, #172958 1.82%, #8a4700 81.58%);*/
    background: linear-gradient(90.16deg, #422f1e 3.33%, #ad7f53 100%);
    padding: 60px 0px 60px 0px;
}

.role h3 {
    color: #FFFFFF;
}

.content {
    padding: 0px 0px 10px 0px;
}

.content-padding {
    padding: 50px 0px 10px 0px;
}

.news-link {
    color: #523317;
    font-size: 13px;
    font-weight: 600;
}

.role-content {
    display: flex;
}

.flex {
    display: flex;
}

.single-footer-item {
    color: white;
}

.single-footer-item h2 {
    color: #fff;
    font-size: 20px;
    line-height: 30px;
}

.single-footer-item p {
    color: #fff;
}

.text-footer-sm {
    font-size: 11px;
}

.footer-right {
    text-align: right;
}

.social-media-icon {
    display: flex;
    flex-direction: row-reverse;
}

.social-media-icon li {
    list-style: none;
    margin: 5px;
}

.social-media-icons {
    display: flex;
    flex-direction: row-reverse;
}

.social-media-icons li {
    list-style: none;
    margin: -2px;
    margin-top: 5px;
}

.playstore {
    margin-top: 16px;
}

.playstore a {
    margin-top: 10px;
}

.footer-copyright .footer-text-center {
    text-align: center;
    color: #fff;
}

.jumbotron-image {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/jdih/bg_2025_2.png");
}

.jumbotron-title {
    color: #fff;
    font-weight: bold;
    font-size: 36px;
}

.jumbotron {
    margin-bottom: 0px !important;
    padding-top: 110px;
    padding-bottom: 110px;
}

.breadcrumb-content {
    padding-top: 30px;
    padding-bottom: 30px;
    background: linear-gradient(90.16deg, #1A1A1D 3.33%, #A0153E 100%);
}

.breadcrumb-title {
    color: #fff;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.content-title {
    color: #525252;
    margin-bottom: 40px;
}

.content .text-content {
    text-align: justify;
    margin-top: 20px;
    color: #3C3C3C;
}

.visi-misi {
    margin-top: 30px;
    background: linear-gradient(180deg, #422f1e 0%, #ad7f53 100%);
    border-radius: 10px;
    padding: 20px;
    text-align: center;
}

.visi {
    text-align: center;
    color: #fff;
}

.visi p,
.misi p,
.visi h3,
.misi h3 {
    color: #fff;
    text-align: center;
}

.misi {
    text-align: center;
    color: #fff;
    margin-top: 20px;
}

.back {
    font-size: 20px;
    font-weight: 300;
    line-height: 36px;
    color: #525252;
    margin-top: 20px;
}

.back:hover {
    font-size: 20px;
    font-weight: 300;
    line-height: 36px;
    color: #026D87;
    margin-top: 20px;
}

accordion-card {
    box-sizing: border-box;
    width: 20%;
}

.container-fluid-new {
    width: 50%;
    height: 50%;
}

.container-slider-infografis {
    width: 100%;
    height: 90%;
}


/* .accordion-header {
    padding: 20px;
} */


/* .accordion-body {
    background: #FFFFFF;
    border: 1px solid #9ACDFF;
    padding: 30px;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 22px;
} */

*/ .custom-input-group {
    margin-top: 20px;
    margin-bottom: 20px;
}

.single-package-item {
    margin-bottom: 30px;
}

.single-packages-item {
    margin-bottom: 30px;
}

.single-package-items {
    margin-bottom: 8px;
    border-radius: 12px;
}

.single-package-item .image {
    border-radius: 9px;
}

.news {
    /* margin-top: 25px; */
}

.news-section-title {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 33px;
}

.news-title {
    display: flex;
    flex-direction: column;
}

.news-title .date {
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: #707070;
    margin-top: 10px;
}

.news-title .title {
    font-weight: 600;
    font-size: 13px;
    line-height: 20px;
    color: #000000;
    margin-top: 5px;
}

.news-title .link {
    font-weight: 600;
    font-size: 13px;
    line-height: 20px;
    color: #523317;
    margin-top: 5px;
}

.news-titles {
    display: flex;
    flex-direction: column;
    font-weight: 600;
    font-size: 12px;
    line-height: 24px;
    color: #1f2855;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    display: inline-block;
}

.news-titles .date {
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: #707070;
    margin-top: 10px;
}

.news-titles .title {
    font-weight: 600;
    font-size: 18px;
    line-height: 20px;
    color: #523317;
    margin-top: 5px;
    margin-bottom: 30px;
}

.news-titles .narasi {
    font-weight: 400;
    font-size: 12px;
    line-height: 20px;
    color: #676969;
    margin-top: 5px;
    margin-bottom: 10px;
}

.news-titles .link {
    font-weight: 600;
    font-size: 13px;
    line-height: 20px;
    color: #523317;
    margin-top: 5px;
}

.pagination {
    padding: 30px 0;
    display: inline-block;
}

.pagination ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.pagination a {
    display: inline-block;
    padding: 10px 18px;
    color: #222;
}


/* ONE */

.p1 a {
    width: 40px;
    height: 40px;
    line-height: 40px;
    padding: 0;
    text-align: center;
}

.p1 a.is-active {
    background-color: #422f1e;
    border-radius: 100%;
    color: #fff;
}

.p2 a {
    width: 38px;
    height: 38px;
    line-height: 38px;
    padding: 0;
    text-align: center;
}

.p2 a.is-active {
    background-color: #422f1e;
    border-radius: 100%;
    color: #fff;
}

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

.video-list {
    margin-top: 12px;
}

.video-list iframe {
    margin-bottom: 16px;
    max-height: 310px !important;
    border-radius: 20px;
}

.video-title {
    font-weight: 600;
    font-size: 12px;
    line-height: 24px;
    color: #1f2855;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    display: inline-block;
}

.gallery-title {
    /* font-weight: 700;
    font-size: 13px;
    line-height: 20px;
    color: #050505; */
    /* max-width: 90%; */
    /* display: inline-block; */
    font-weight: 600;
    font-size: 12px;
    line-height: 24px;
    color: #1f2855;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    display: inline-block;
}

.news-title {
    font-weight: 600;
    font-size: 12px;
    line-height: 24px;
    color: #1f2855;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    display: inline-block;
}

.galery-description {
    color: rgb(255, 255, 255);
    font-size: 15px;
}

.link-foto {
    font-weight: 700;
    font-size: 12px;
    line-height: 20px;
    color: #051e53;
    /* max-width: 90%; */
    display: inline-block;
}

.gallery-box {
    margin-top: 12px;
}

.filtr-item {
    margin-top: 20px;
}

.infografis-title {
    font-weight: 600;
    font-size: 12px;
    line-height: 24px;
    color: #1f2855;
    margin-top: 10px;
    margin-bottom: 10px;
    display: inline-block;
}

.isi-disclaimer {
    font-weight: 500;
    font-size: 12px;
    line-height: 24px;
    color: #fff;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    display: inline-block
}

.faq-question {
    font-weight: 500;
    font-size: 13px;
    line-height: 24px;
    color: #1f2855;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    display: inline-block
}

.faq-answare {
    font-weight: 500;
    font-size: 13px;
    line-height: 24px;
    color: #5e5e5e;
    /* margin-top: 10px;
    margin-bottom: 10px; */
    display: inline-block
}

.text-content-about {
    font-weight: 500;
    font-size: 13px;
    line-height: 24px;
    color: #666666;
    display: inline-block
}

.text-content-prepare {
    font-weight: 500;
    font-size: 13px;
    line-height: 24px;
    color: #666666;
    display: inline-block;
    text-align: justify;
}

.text-content-visi {
    font-weight: 500;
    font-size: 13px;
    line-height: 24px;
    color: #fff;
    display: inline-block
}

.text-content-misi {
    font-weight: 500;
    font-size: 13px;
    line-height: 24px;
    color: #fff;
    display: inline-block
}

.isi-survey {
    font-weight: 500;
    font-size: 12px;
    line-height: 24px;
    color: rgb(89, 89, 89);
    /* margin-top: 10px;
    margin-bottom: 10px; */
    text-align: justify;
    display: inline-block
}

.title-peraturan {
    font-size: 20px;
    color: #fff;
    font-weight: 500;
}

.title-disclaimer {
    font-size: 20px;
    color: #fff;
    font-weight: 500;
}

.br-5 {
    border-radius: 11px;
    margin-top: 45px;
}

.single-package-item-txt {
    padding: 20px;
}

.single-package-item-txt .secondary {
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    color: #4F4F4F;
}

.single-package-item-txt h2 {
    font-weight: 500;
    font-size: 32px;
    line-height: 39px;
    color: #000000;
}

.single-package-item-txt h3 {
    display: inline-block;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #000000;
}

.single-tab-select-box h4 {
    display: inline-block;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #5A5A5A;
}

.single-package-item-txt .title-section {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.title-section .second-text {
    display: flex;
    flex-direction: column;
}

.kamus-hukum {
    padding: 20px;
}

.kamus-hukums {
    padding: 0px;
}

.custom-zoom:hover {
    transform: scale(1.1);
}

.inline-form {
    display: flex;
    flex-direction: row;
}

.custom-table tbody tr .use-bg {
    background-color: rgba(217, 217, 217, 0.38) !important;
}

.inline-form button {
    margin-left: 20px;
}

.no-padding {
    padding: 0px !important;
}

.custom-table thead {
    background: linear-gradient(90.17deg, #523317 3.65%, #422f1e 100%);
    color: white;
    height: 50px;
}

.custom-table tbody tr {
    height: 60px;
}

.custom-table tbody tr td {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #1F2855;
}


/* .custom-table thead tr td,
.custom-table tbody tr td {
    vertical-align: middle;
} */

.mt-1 {
    margin-top: 10px;
}

.mt-2 {
    margin-top: 20px;
}

.mt-3 {
    margin-top: 30px;
}

.container-fluid {
    padding-right: 65px;
    padding-left: 65px;
    margin-right: auto;
    margin-left: auto;
}

.text-normal {
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    /* identical to box height */
    color: #1F2855 !important;
}

.text-normals {
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 24px;
    /* identical to box height */
    color: #1F2855 !important;
}

.text-title {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 27px;
    /* identical to box height */
    color: #1F2855 !important;
    margin-bottom: 10px;
    display: inline-block;
}

.ml-1 {
    margin-left: 10px;
}

.download-btn {
    background: #d5003c;
    border-radius: 8px;
    border-color: #d5003c;
    border-radius: 8px;
    height: 56px;
    width: 100%;
}

.download-btn-hearing {
    background: #d5003c;
    border-radius: 8px;
    border-color: #d5003c;
    border-radius: 8px;
    height: 45px;
    width: 90%;
}

.view-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #8a4700;
    border-radius: 8px;
    border-color: #8a4700;
    border-radius: 8px;
    height: 56px;
    width: 100%;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -ms-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.view-btn:hover {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #8a4700;
    border-radius: 8px;
    border-color: #8a4700;
    border-radius: 8px;
    height: 56px;
    width: 100%;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -ms-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.br-10 {
    border-radius: 10px;
}

.peraturan-title {
    display: flex;
    flex-direction: column;
}

.table> :not(caption)>*>* {
    padding: 0.5rem 0.5rem;
}

.table-peraturan-detail {
    color: #1F2855;
}

.table-peraturan-detail tbody tr td {
    border-top: none;
    border-bottom: none;
}

.table-peraturan-detail tbody tr td:first-child {
    width: 30%;
}

.table-peraturan-detail tbody tr td:nth-child(2) {
    width: 3%;
}

.link-ext-btn {
    border-radius: 25px;
    background-color: #D9D9D9;
    border-color: #D9D9D9;
    color: #523317;
    font-weight: 500;
    font-size: 12px;
    line-height: 21px;
    width: 120px;
    height: 32px;
}

.link-ext-btn:hover {
    color: black;
}

.link-ext-btn i {
    color: black;
    font-size: 18px;
    font-weight: bold;
}

.link-ext-btn img {
    margin-left: 5px;
    width: 10%;
}

.smallImg img {
    width: 100%;
}

.flex {
    display: flex;
}

.card-image {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 15%;
    background: linear-gradient(145.18deg, #422f1e 3.39%, #172958 94.93%);
    border-radius: 10px 0px 0px 10px;
}

.card-image img {
    margin: auto;
    padding-bottom: 20px
}

.card-label-red {
    background: #E12D4D;
    text-align: center;
    position: relative;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 30px;
    border-radius: 0px 0px 0px 10px;
}

.card-label-blue {
    background: #422f1e;
    text-align: center;
    position: relative;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 30px;
    border-radius: 0px 0px 0px 10px;
}

.card-label-green {
    background: #00D47B;
    text-align: center;
    position: relative;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 30px;
    border-radius: 0px 0px 0px 10px;
}

.card-label-yellow {
    background: #D47300;
    text-align: center;
    position: relative;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 30px;
    border-radius: 0px 0px 0px 10px;
}

.card-label-red span,
.card-label-blue span,
.card-label-green span,
.card-label-yellow span {
    color: #fff;
}

.w-full {
    width: 100%;
}

.label-status {
    display: inline-block;
    padding: 2px;
    width: 88px;
    height: 19px;
    background: #422f1e;
    border-radius: 8px;
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 15px;
    text-align: center;
    color: #FFFFFF;
}

.label-active {
    background: #00D47B;
}

.label-nonactive {
    background: #707070;
}

.header-area {
    box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.25);
}


/* 
.navbar-nav>li>.dropdown-menu {
    display: flex;
    flex-direction: column;
    padding: 10px;
}

.dropbtn {
    background-color: white;
    color: black;
    padding: 27px 12px 0px;
    font-size: 14px;
    border: none;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    border-radius: 20px;
    display: none;
    position: absolute;
    background-color: #ffffff;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    top: 100%;
}


.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: #422f1e;
    visibility: visible;
    transition: .5s;
    opacity: 1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    color: #422f1e;
}

.navbar-nav {
    display: flex;
} */

.no-margin {
    margin: 0px;
}

.custom-padding {
    padding-top: 15px;
    padding-bottom: 15px;
}

.link-terkait {
    margin-top: 10px;
    margin-bottom: 20px;
}

.link-logo {
    margin-left: 12px;
    margin-right: 12px;
}

.link-sosmed {
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
}

.disclaimer {
    margin-top: 60px;
    margin-bottom: 60px;
    background: linear-gradient(180deg, #523317 0%, #ad7f53 100%);
    border-radius: 17px;
    padding: 35px;
}

.disclaimer h4,
.disclaimer p {
    color: white;
}

.disclaimer p {
    margin-top: 10px;
}

.grafik {
    margin-top: 40px;
    margin-bottom: 100px;
}

.progress {
    height: 8px;
}

.progress-bar {
    background: linear-gradient(180deg, #523317 0%, #ad7f53 100%);
}

.circle-survey {
    /* width: 24.2rem; */
    height: 16rem;
    background: url(../images/jdih/bg-circle-survey.png) no-repeat 50%;
    /* background-size: 80%; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.bg-white {
    background-color: white;
}

.total-view {
    display: flex;
}

.total-view img {
    float: left;
}

.total-view h4 {
    margin-left: 6px;
}

.card-role {
    padding: 16px;
    min-height: 150px;
}

.role-status {
    position: absolute;
    right: 0;
    top: 0;
    background: #d5003c;
    border-radius: 0px 0px 0px 16px;
    width: 100px;
    text-align: center;
    color: white;
    font-size: 11px;
    height: 24px;
    line-height: 22px;
}

.role-status1 {
    position: absolute;
    right: 0;
    top: 0;
    background: #663810;
    border-radius: 0px 0px 0px 16px;
    width: 100px;
    text-align: center;
    color: white;
    font-size: 11px;
    height: 24px;
    line-height: 22px;
}

.role-status-active {
    position: static;
    left: 0;
    top: 0;
    background: #d5003c;
    border-radius: 0px 0px 16px 0px;
    width: 100px;
    text-align: center;
    color: white;
    font-size: 11px;
    height: 24px;
    line-height: 22px;
}

.role-status-inactive {
    position: static;
    left: 0;
    top: 0;
    background: #c82525;
    border-radius: 0px 0px 16px 0px;
    width: 100px;
    text-align: center;
    color: white;
    font-size: 11px;
    height: 24px;
    line-height: 22px;
}

.mb-1 {
    margin-bottom: 10px;
}

.web-title {
    position: absolute;
    z-index: 1;
    bottom: 50%;
    /* top: 50%; */
    margin-left: 100px;
}

.web-title h1 {
    color: white;
    font-size: 46px;
    line-height: 72px;
}

.rating {
    width: 120px;
    height: 24px;
    position: relative;
    background-color: gray;
}

.rating progress.rating-bg {
    -webkit-appearance: none;
    -moz-appearence: none;
    appearance: none;
    border: none;
    display: inline-block;
    height: 24px;
    width: 100%;
    color: orange;
}

.rating progress.rating-bg::-webkit-progress-value {
    background-color: orange;
}

.rating progress.rating-bg::-moz-progress-bar {
    background-color: orange;
}

.rating svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.slick-prev:before,
.slick-next:before {
    color: red;
}

.btn-detail {
    display: flex;
    justify-content: center;
    align-items: center;
    background: transparent;
    border: 1px solid #ffffff;
    width: 120px;
    height: 35px;
    white-space: nowrap;
    color: #fff;
    font-size: 12px;
    font-family: 'Poppins', sans-serif;
    border-radius: 20px;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -ms-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.btn-detail:hover {
    display: flex;
    justify-content: center;
    align-items: center;
    background: white;
    color: #422f1e;
    border: 1px solid #422f1e;
    width: 120px;
    height: 35px;
    white-space: nowrap;
    font-size: 12px;
    font-family: 'Poppins', sans-serif;
    border-radius: 20spx;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -ms-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.service-content .title {
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #525252;
}

.service-content .subtitle {
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    color: #525252;
}

.search-produk-hukum .title {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    /* identical to box height */
    color: #5A5A5A;
}

.klaster-peraturan .title {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    /* identical to box height */
    color: #525252;
}

.klaster-content {
    display: flex;
    flex-direction: column;
}

.klaster-section {
    display: inline-block;
}

.klaster-content .title {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #525252;
}

.klaster-content .subtitle {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 20px;
    color: #525252;
}

.owl-prev,
.owl-next {
    width: 15px;
    height: 100px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    /*display: block !important;*/
    border: 0px solid black;
}

.owl-prev {
    left: -28px;
}

.owl-next {
    right: -32px;
}

.owl-prev i,
.owl-next i {
    transform: scale(2, 5);
    color: transparent;
}

.owl-one .owl-stage-outer {
    height: 100px;
    padding-left: 1px;
}

.owl-link .owl-stage-outer {
    height: 120px;
}

.linkterkait {
    width: 75%;
    margin-left: 12%;
}

.owl-two .owl-stage-outer {
    padding-left: 1px;
}

.news-section .title {
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 36px;
    /* identical to box height */
    color: #FFFFFF;
}

.news-section .news-title {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    color: #525252;
}

.grafik .subtitle {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    /* identical to box height */
    color: #979797;
}

.navbar {
    box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.25);
}

.modal-backdrop {
    /* z-index: -2; */
}

.accordion {
    /* position: relative; */
    z-index: -100;
}

.accordion-header {
    padding: 5px;
    background: #ffffff;
}

.accordion-button {
    padding: 12px;
    background: #ffffff;
    color: #000000;
}

.accordion-button:not(.collapsed) {
    box-shadow: none;
    color: #036782;
}

.accordion-button:focus {
    border-color: #000000;
}

.accordion-body {
    padding: 9px;
    /* font-family: 'Poppins';
    font-style: normal; */
    font-size: 15px;
    line-height: 22px;
    color: #7c7c7c;
}

.mr-1 {
    margin-right: 2px;
}

.modal-content {
    border-radius: 9px;
}

.modal-dialog {
    height: 100vh !important;
    display: flex;
}

.modal-content {
    margin: auto !important;
    height: fit-content !important;
}

.modal-body {
    padding: 2.5rem;
}

.modal-title {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #000000;
}

.modal-title-survey {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    text-align: center;
    color: #525252;
}

.modal-subtitle-survey {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 36px;
    text-align: center;
    color: #525252;
}

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

.modal-subtitle {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #000000;
}

.modal-text {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    text-align: center;
    color: #464646;
}

.btn-survey {
    background: #d5003c;
    border-radius: 41px;
    height: 45px;
    width: 172px;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    /* identical to box height */
    color: #FFFFFF;
}

.btn-modal {
    width: 190px;
    height: 55px;
    background: #d5003c;
    border-radius: 8px;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    /* identical to box height */
    color: #FFFFFF;
}

.btn-modal:hover {
    width: 190px;
    height: 55px;
    background: #9FDADE;
    border-radius: 8px;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    /* identical to box height */
    color: #FFFFFF;
}

.justify {
    text-align: justify;
}

.rating-input {
    display: inline-block;
    position: relative;
    height: 50px;
    line-height: 50px;
    font-size: 50px;
}

.rating-input label {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    cursor: pointer;
}

.rating-input label:last-child {
    position: static;
}

.rating-input label:nth-child(1) {
    z-index: 5;
}

.rating-input label:nth-child(2) {
    z-index: 4;
}

.rating-input label:nth-child(3) {
    z-index: 3;
}

.rating-input label:nth-child(4) {
    z-index: 2;
}

.rating-input label:nth-child(5) {
    z-index: 1;
}

.rating-input label input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.rating-input label .icon {
    float: left;
    color: transparent;
}

.rating-input label:last-child .icon {
    color: #000;
}

.rating-input:not(:hover) label input:checked~.icon,
.rating-input:hover label:hover input~.icon {
    color: #FFEC43;
}

.rating-input label input:focus:not(:checked)~.icon:last-child {
    color: #000;
    text-shadow: 0 0 5px #09f;
}

* {
    box-sizing: border-box;
}


/* Button used to open the chat form - fixed at the bottom of the page */

.open-button {
    background: linear-gradient(163.43deg, #523317 11.46%, #523317 86.1%);
    color: white;
    padding: 16px 20px;
    border: none;
    cursor: pointer;
    position: fixed;
    bottom: 15px;
    right: 22px;
    border-radius: 50%;
}


/* The popup chat - hidden by default */

.chat-popup {
    display: none;
    position: fixed;
    bottom: 10px;
    right: 15px;
    /* border: 3px solid #f1f1f1; */
    z-index: 9;
    filter: drop-shadow(0px 4px 5px rgba(0, 0, 0, 0.25));
}


/* Add styles to the form container */

.form-container {
    border-radius: 17px;
    max-width: 400px;
    /* padding: 10px; */
    background-color: white;
    padding-bottom: 12px;
}


/* Full-width textarea */

.form-container textarea {
    width: 100%;
    padding: 15px;
    margin: 5px 0 22px 0;
    border: none;
    background: #f1f1f1;
    resize: none;
    /* min-height: 200px; */
}

.form-container .form-control {
    background: #f1f1f1;
}


/* When the textarea gets focus, do something */

.form-container textarea:focus {
    background-color: #ddd;
    outline: none;
}


/* Set a style for the submit/send button */

.form-container .btn {
    /* margin: 14px; */
    background-color: #172958;
    color: white;
    padding: 16px 20px;
    border: none;
    cursor: pointer;
    width: 80%;
    margin-bottom: 10px;
    border-radius: 0px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    color: #FFFFFF;
}


/* Add a red background color to the cancel button */

.form-container .cancel {
    background-color: red;
}


/* Add some hover effects to buttons */

.form-container .btn:hover,
.open-button:hover {
    opacity: 0.8;
}

.chat-title {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 21px;
    color: #FFFFFF;
}

.chat-subtitle {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    text-align: center;
    color: #FFFFFF;
}

.chat-header {
    background: linear-gradient(92.74deg, #8a4700 -20.91%, #523317 94.52%);
    padding: 24px;
    text-align: center;
    border-radius: 17px 17px 0px 0px;
}

.chat-form {
    padding: 14px;
}

.form-control:disabled,
.form-control:read-only {
    background-color: #ffffff;
}


/*switch*/

.switch {
    position: relative;
    display: inline-block;
    margin: 0 5px;
}

.switch>span {
    position: absolute;
    top: 28px;
    pointer-events: none;
    font-family: 'Poppins';
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .06);
    width: 50%;
    text-align: center;
}

input.check-toggle-round-flat:checked~.off {
    color: #1a2a36;
}

input.check-toggle-round-flat:checked~.on {
    color: #fff;
}

.switch>span.on {
    left: 0;
    padding-left: 2px;
    color: #1a2a36;
}

.switch>span.off {
    right: 0;
    padding-right: 4px;
    color: #fff;
}

.check-toggle {
    position: absolute;
    margin-left: -9999px;
    visibility: hidden;
}

.check-toggle+label {
    display: block;
    position: relative;
    cursor: pointer;
    outline: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

input.check-toggle-round-flat+label {
    padding: 2px;
    width: 84px;
    height: 24px;
    background-color: #2098d1;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    -ms-border-radius: 60px;
    -o-border-radius: 60px;
    border-radius: 60px;
}

input.check-toggle-round-flat+label:before,
input.check-toggle-round-flat+label:after {
    display: block;
    position: absolute;
    content: "";
}

input.check-toggle-round-flat+label:before {
    top: 2px;
    left: 2px;
    bottom: 2px;
    right: 2px;
    background-color: #077a90;
    -webkit-moz-border-radius: 60px;
    -ms-border-radius: 60px;
    -o-border-radius: 60px;
    border-radius: 60px;
}

input.check-toggle-round-flat+label:after {
    top: 4px;
    left: 4px;
    bottom: 4px;
    width: 38px;
    background-color: #fff;
    -webkit-border-radius: 52px;
    -moz-border-radius: 52px;
    -ms-border-radius: 52px;
    -o-border-radius: 52px;
    border-radius: 52px;
    -webkit-transition: margin 0.2s;
    -moz-transition: margin 0.2s;
    -o-transition: margin 0.2s;
    transition: margin 0.2s;
}

input.check-toggle-round-flat:checked+label {}

input.check-toggle-round-flat:checked+label:after {
    margin-left: 38px;
}

@media (max-width: 576px) {
    .switch>span {
        top: 13px;
    }
    .switch>span.on {
        /*left: -52px;*/
        left: -18%;
    }
    .switch>span.off {
        /*left: -10px;*/
        right: 55%;
    }
}