
/* ===== Scrollbar CSS ===== */
  /* Firefox */
  * {
    scrollbar-width: thin;
    scrollbar-color: #ccd5ae #ffffff;
  }

  /* Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    width: 10px;
  }

  *::-webkit-scrollbar-track {
    background: #ffffff;
  }

  *::-webkit-scrollbar-thumb {
    background-color: #ccd5ae;
    border-radius: 5px;
    border: 5px ridge #ffffff;
  }


:root {
    --main-color: #CCD5AE;
    --second-color: #FAEDCD;
    --nav-active: #FEFAE0;
}

/* BETŰSTÍLUSOK */
@font-face {
    font-family: Cormorant;
    src: url('../font/CormorantGaramond-Regular.ttf');
}

@font-face {
    font-family: Cormorant-light;
    src: url('../font/CormorantGaramond-Light.ttf');
}

@font-face {
    font-family: Cormorant-medium;
    src: url('../font/CormorantGaramond-Medium.ttf');
}

@font-face {
    font-family: Cormorant-bold;
    src: url('../font/CormorantGaramond-Bold.ttf');
}

@font-face {
    font-family: TT;
    src: url('../font/OldStandardTT-Regular.ttf');
}

.cormorant {
    font-family: Cormorant;
}

.cormorant-light {
    font-family: Cormorant-light;
}

.cormorant-medium {
    font-family: Cormorant-medium;
}

.cormorant-bold {
    font-family: Cormorant-bold;
}

.TT {
    font-family: TT;
}


/* BODY */

.navbar-brand {
    padding-top: var(--bs-navbar-brand-padding-y);
    padding-bottom: var(--bs-navbar-brand-padding-y);
    margin-right: var(--bs-navbar-brand-margin-end);
    font-size: var(--bs-navbar-brand-font-size);
    color: var(--bs-navbar-brand-color);
    text-decoration: none;
    white-space: nowrap;
    margin-left: 15px !important;
}

body {
    background-color: var(--second-color);
    font-family: Cormorant;
}

nav.navbar.navbar-expand-lg.navbar-light.bg-light {
    z-index: 2;
}


/* NAVBAR HEADER */

.nav-item .active {
    background-color: var(--nav-active) !important;
    height: 55px;
    border-radius: 30px;
}

.nav-link,h1 {
    color: #000000;
    text-align: center;
    vertical-align: text-middle;
    font-size: 30px;
    line-height: auto;
    border-style: hidden;
    outline: none;
    font-family: "Cormorant";
}

/* @media (max-width: 1220px) {
    .nav-link,h1{
        font-size: 20px;
    }
}   */


.navbar {
    background-color: var(--main-color) !important;
    min-height: 130px;
}


/* Footer */

footer {
    background-color: var(--main-color);
    font-size: 20px;
}

/* Info */

.back {
    border-radius: 20px;
    text-align: center;
    height: 84px;
    width: 84px;
    border-radius: 30px;
    border: 1px solid rgba(0, 0, 0, 0.20000000298023224);
}

.bi {
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    color: var(--main-color);
    font-size: 50px;
}


.infohatter {
    background-color: #f5f5f5;
    border-radius: 20px;
}

.infohatter-2{
    background-color: #f5f5f5;
    padding: 15px;
    border-radius: 20px;
    padding-left: 10%;
    padding-right: 10%;
}


/* FORM */

form {
    background-color: #f5f5f5;
    border-radius: 20px;
    padding: 25px;
}


input[type=text],
input[type=email],
input[type=tel],
textarea {
    background-color: rgba(217, 217, 217, 0.70) !important;
    font-family: Cormorant !important;
    font-size: 28px !important;
}



@media only screen and (max-width: 600px) {
    input[type=text],
    input[type=email],
    input[type=tel],
    textarea {
        font-size: 15px !important;
    }
}

.form-control:focus {
    border-color: var(--main-color) !important;
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25) !important;
    background-color: rgba(217, 217, 217, 0.20) !important;
} 

.btn-primary {
    background-color: var(--main-color);
    border-color: transparent;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    font-family: Cormorant;
    font-size: 28px;
}

.btn-primary:hover {
    background-color: var(--main-color);
    border-color: transparent;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    font-family: Cormorant;
    font-size: 28px;
}

/* Kozossegimedia */

.btn-secondary {
    background-color: var(--main-color);
    border-radius: 20px;
    /* width: 105px;
    height: 105px; */
    border-color: transparent;
}

.bi-facebook {
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    color: whitesmoke;
    font-size: 50px;
}

.bi-instagram {
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    color: whitesmoke;
    font-size: 50px;
}

.bi-twitter-x {
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    color: whitesmoke;
    font-size: 50px;
}

/* Kerdes maradt? */
.kitoltosor{
    margin-bottom: 200px;
}

.bi-star-fill {
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    color: whitesmoke;
    background-color: var(--main-color);
    border-radius: 20px;
    font-size: 50px;
    padding: 5px;
    padding-left: 15px;
    padding-right: 15px;
}

.kerekites {
    border-radius: 0px 10px 10px 0px;
    padding: 10px;
}

/* FAQ */

.accordion-item {
    background-color: transparent;
}

.accordion{
     --bs-accordion-active-bg: transparent;
}


.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
    font-size: 1rem;
    color: var(--bs-accordion-btn-color);
    text-align: left;
    background-color: transparent;
    border: 0;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: initial;
    border-right-style: initial;
    border-bottom-style: initial;
    border-left-style: initial;
    border-top-color: initial;
    border-right-color: initial;
    border-bottom-color: initial;
    border-left-color: initial;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    border-radius: 0;
    border-color: var(--main-color) !important;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition);
}

.hatter {
    border-radius: 25px;
    z-index: 1;
    position: relative;
}

i.bi.bi-question-circle {
    margin-right: 10px;
}

/* CRICLE BLURE */
.ellipse1 {
    background-color: rgba(255, 181, 52, 0.6499999761581421);
    height: 426px;
    width: 833px;
    position: absolute;
    filter: blur(200px);
    border-radius: 50%;
    z-index: 0;
}

.hatvannegy{
    font-size: 64px;
}

button.accordion-button {
    font-size: 23px;
}

.col-lg-4.kerekites.infohatter {
    margin-top: -100px;
}

/* INDEXELÉS */

@media only screen and (max-width: 800px) {
    .ellipse1 {
        background-color: rgba(255, 181, 52, 0.6499999761581421);
        height: 330px;
        width: 330px;
        position: absolute;
        filter: blur(150px);
        border-radius: 50%;
        z-index: 0;
    }
    .hatvannegy{
        font-size: 34px;
        text-align: center;
    }
}
@media only screen and (max-width: 992px){
    .col-lg-4.kerekites.infohatter {
        margin-top: 0px;
    }
}