BODY {
    background: #FFFFFF;
    font: normal 20px "Open Sans";
    color: #525252;    
}  

.navbar-toggler {
    border: 0;
}

.navbar-toggler:focus {
    box-shadow: none;
}

.toggler-bar {
    display: block;
    background: #525252;
    border: 2px solid #525252;
    width: 30px;
    height: 0px;
    margin-bottom: 7px;
    border-radius: 4px;
}

#header_slogen {
    font-size: 1.5em; 
}               

@media (min-width: 992px) {   
    #header_slogen {
        font-size: 2em; 
    }
}

#header_menu .nav-item {
    padding: 0 0.25em;
}

#header_menu .nav-link {
    color: #525252;
    text-decoration: none;
    padding: 0;
}

#header_menu .nav-link.active {
    border-bottom: 2px solid #525252;
}

H2 {
    font-size: 1.5em;
}

H2 SPAN {
    display: inline-block;
    width: 0.6em;
    height: 0.6em;      
    border-radius: 50%;
    margin: 0 0.25em;
}

@media (min-width: 992px) {
    #rolunk {
        overflow: visible;
    }
}

#rolunk SPAN {
    background: #0dbecf;
}

#cel SPAN,
#kontakt H2 SPAN {
    background: #1ae6ab;
}

@media (min-width: 992px) { 
    #cel {
        position: absolute;
        right: min(16.6666667%,100px);
        writing-mode: vertical-rl;
        text-orientation: mixed;
        rotate: 180deg; 
    }
}

#main_bg {
    position: absolute;
    width: 100%;
    min-width: 448px;
    aspect-ratio: 1;
    border: 30px solid #0dbecf;
    border-radius: 50%;
    z-index: -1;
    bottom: 2.5%; 
    margin-left: 50%;
    transform: translateX(-50%); 
    max-width: 600px;   
}

@media (min-width: 765px) {
    #main_bg {
        width: 50%;
        min-width: 448px;
        left: -15%; 
        top: 0;
        bottom: unset;
        transform: unset;
        margin-left: 0;
    }
}

@media (min-width: 992px) {
    #main_bg {   
        
    }
}

#berles_bg {     
    color:#1ae6ab;
    font-size: 17em;
    line-height: 0;
}

@media (min-width: 992px) {
    #berles_bg {     
        font-size: 18em;
    }
}

.berles_span {
    display: block;
    width: 5em;
    height: 1em; 
    background: #0dbecf;   
}

@media (min-width: 992px) {
    .berles_span {
        width: 1em;
    }
} 

.container-fluid {
    max-width: 1320px !important;
    overflow-x: clip;
}

#kulacsok_text {
    background: #0dbecf;
    padding-left: 16.666667%;
}    

#kontakt {
    max-width: 2100px !important;
}                

#contact_form_bg {
    background: #0dbecf;
    border-radius: 50%;
    aspect-ratio: 1;
    min-width: 600px;
    max-width: 600px;
}

#contact_form {       
    width: 50%;
    max-width: 260px;
    margin: 15% auto 0;
}

#contact_form INPUT[type="text"],
#contact_form INPUT[type="email"],
#contact_form INPUT[type="text"]:focus, 
#contact_form INPUT[type="email"]:focus, 
#contact_form TEXTAREA, 
#contact_form TEXTAREA:focus {  
    border-radius: 0px;
    border: none;
    box-shadow: none;
    color: #525252; 
}

#contact_form INPUT[type="checkbox"] {
    border: none;  
    font-size: 16px; 
}  

.form-check-input:focus {     
    border: none;
    box-shadow: none;
}

.form-check-input:checked {
    background-color: #1ae6ab;
    border: none;
    box-shadow: none;
}

#contact_form LABEL {
    font-size: 16px;
    flex: 2 1 0;
    text-align: left;
}

#contact_form LABEL A {
    color: #1ae6ab;
}

#contact_form BUTTON[type="submit"] {
    display: block;
    width: 50%;
    max-width: 260px;
    background: #FFFFFF;
    border-radius: 0px;
    border: none;
    box-shadow: none;
    color: #525252;
    text-align: center;      
} 

#contact_form INPUT.error {
    background: #FFFFFF url('../images/input_error_bg.jpg') right 0.375rem center / contain no-repeat;
}

#contact_messages_box {
    min-width: 600px;
    min-height: 2em; 
    font-weight: 600;
}

#contact_messages P {
    margin: 0 !important;
}

#contact_messages P.error {
    color: #FF0000;
}

@media (max-width: 767px) {
    #contact_form_bg {
        margin-left: 50%;
        transform: translateX(-50%);
    }
    
    #contact_messages_box {
        margin-left: 50%;
        transform: translateX(-50%);
    }
}
       
#contact_bg_left {
    position: absolute;
    width: 40%;
    z-index: -1; 
    bottom: -200px;
    left: calc(50% - 500px);  
}

#contact_bg_left_circle {
    min-width: 400px;   
    max-width: 400px;  
    aspect-ratio: 1;
    border: 30px solid #1ae6ab;
    border-radius: 50%;
}

#contact_bg_right {
    position: absolute;
    width: 70%;   
    min-width: 700px;  
    max-width: 1000px;
    aspect-ratio: 1;
    border: 30px solid #1ae6ab;
    border-radius: 50%;
    z-index: -1;
    bottom: 20%; 
    margin-left: 50%;     
}

@media (min-width: 768px) {
    #contact_bg_right {
        bottom: 10%;
    }
    
    #contact_bg_left {
       left: calc(8.33% - 200px);
    }
    
}

@media (min-width: 992px) {
    #contact_bg_left {
       left: calc(25% - 200px);
    }
}

@media (min-width: 1200px) {
    #contact_bg {    
        left: -5%;
    }
}

FOOTER {
    background: #0dbecf;
    color: #FFFFFF;
}

FOOTER A {
    display: block;
    color: #FFFFFF;
    text-decoration: none;
}