html {
    scroll-behavior: smooth;
}
 /*
:root {
    --color-1: #04744d;
    --color-2: #2FCE65;
    --color-3: #F5F5F5;
    --color-4: #FFD489;
    --black: #282830;
    --grey: #414245;
}
*/

 
:root {
    --color-1: #FA8437;
    --color-2: #D8ECEF;
    --color-3: #FFEFC7;
    --white: #F6F4EF;
    --black: #282830;
    --grey: #ECEBE5;
    --grey-text: #6B7280;
}


.bg-color-1 {
    background-color: var(--color-1);
}

.bg-color-2 {
    background-color: var(--color-2);
}

.bg-color-3 {
    background-color: var(--color-3);
}

.bg-color-4 {
    background-color: var(--color-4);
}

.bg-black {
    background-color: var(--black);
}

.bg-grey {
    background-color: var(--grey);
}

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

.bg-white-teplo {
    background-color: var(--white);
}

.color-1 {
    color: var(--color-1);
}

.color-2 {
    color: var(--color-2);
}

a.color-2 {
    color: var(--color-2);
}


.color-3 {
    color: var(--color-3);
}

.color-4 {
    color: var(--color-4);
}

.black {
    color: var(--black);
}

.grey {
    color: var(--grey)
}

.grey-text {
    color: var(--grey-text);
}

.white {
    color: white;
}


.regular-20 {
    font-size: 20px;
    line-height: 26px;
}

.regular-18 {
    font-size: 18px;
    line-height: 24px;
}

.regular-16 {
    font-size: 16px;
    line-height: 22px;
}

.regular-14 {
    font-size: 14px;
    line-height: 20px;
}

.regular-12 {
    font-size: 12px;
    line-height: 10px;
}


.flex-row-to-column {
    width: 100%;
    display: flex;
}

.flex-row {
    width: 100%;
    display: flex;
}

.flex-column {
    width: 100%;
    display: flex;
    flex-direction: column;
} 

.justify-between {
    justify-content: space-between;
}

.justify-start {
    justify-content: flex-start;
}

.justify-around {
    justify-content: space-around;
}

.justify-center {
    justify-content: center;
}

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

.align-left {
    align-items: left;
}

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

body {
    margin: 0;
    font-family: 'Plus Jakarta Sans', 'Helvetica', 'Arial', sans-serif;
    color: var(--black);
}

h1 {
    font-family: 'Plus Jakarta Sans', 'Helvetica', 'Arial', sans-serif;
}

p {
    color: var(--black);
}

ul {
    color: var(--black);
}

blockquote {
    border-left: var(--black) solid 3px;
    padding-left: 1rem;
    margin-left: 0;
} 

.medium-container {
    margin: 0 auto;
    max-width: 720px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.large-container {
    margin: 0 auto;
    max-width: 1280px;
    padding-left: 1rem;
    padding-right: 1rem;
}


a {
    text-decoration: none;
}

#content {
    width: 100%;
    padding-top: 2.2rem;
}


.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 24px;
    border-radius: 28px;
    font-size: 16px;
    font-weight: 500;
    line-height: 18px;
    color: black;
    vertical-align: middle;
    cursor: pointer;
    border: none;
    text-shadow: none;
    box-shadow: none;
    transition: all 0.12s linear 0s !important;
}

.btn-black {
    color: #fff;
    background-color: var(--black);
    box-shadow: 0 2px 6px #1018280F;
}

.btn-color-1 {
    color: #fff;
    background-color: var(--color-1);
    box-shadow: 0 2px 6px #1018280F;
}

.btn-white {
    color: var(--black);
    background-color: #fff;
    box-shadow: 0 2px 6px #1018280F;
    border: 1px solid var(--grey);
}

.btn-bottom {
    margin-left: 1rem;
}

.btn-svg-icon {
    margin-right: 10px;
    margin-top: 1px;
}

sup {
    vertical-align: top;
    position: relative;
    top: -0.3em;
    font-size: 0.6em;
}

sub {
    vertical-align: bottom;
    position: relative;
    top: 0.4em;
    font-size: 0.6em;
}

object {
    fill: var(--color-2);
    stroke: var(--color-2);
}

.cta-container {
    margin-top: 3rem;
    padding: 2rem 0rem 4.5rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cta-text {
    text-align: center;
    margin: 1rem 0 2rem 0;
    font-size: 20px;
    font-weight: 600;
}


@media (max-width: 900px) {
    .flex-row-to-column {
        flex-direction: column;
    }

    .btn-bottom {
        margin-left: 0;
        margin-top: 1rem;
    }
}


.form-container {
    width: 100%;
}

/* Style for the form labels */
.form-container label {
    font-weight: 600;
    margin-top: 15px;
    margin-bottom: 8px;
    display: block;
    color: #333;
}

/* Style for the form input fields */
.form-container input[type="text"],
.form-container input[type="number"],
.form-container input[type="email"],
.form-container textarea,
.form-container select {
    width: 100%;
    padding: 10px 0px 10px 15px;
    border: 1px solid #e1e4e8;
    border-radius: 5px;
    font-size: 16px;
    outline: none;
    transition: border-color 0.3s ease;
}

.form-container input[type="text"]:focus,
.form-container input[type="number"]:focus,
.form-container input[type="email"]:focus,
.form-container textarea:focus,
.form-container select:focus {
    border-color: #0366d6;
}

/* Button styles */
.form-container button {
    padding: 10px 20px;
    background-color: #0366d6;
    border: none;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s ease;
}

.form-container button:hover {
    background-color: #024ea2;
}

/* Additional styles for form elements if needed */
.form-container textarea {
    resize: vertical;
    min-height: 100px;
}

.legend {
    font-size: 13px; 
    font-style: italic;
    color: #999999;
    margin-top: 0;
    margin-top: 0.5rem;
} 

aside {
    background-color: var(--color-4);
    padding: 2rem;
    border-radius: 3px;
}