﻿:root {
    --global-site-font: 'DM Sans', sans-serif;
    --global-site-font-two: 'Fredoka One', cursive;
    --global-site-gray: #727272;
    --global-site-gray-rgb: 114, 114, 114;
    --global-site-white: #ffffff;
    --global-site-white-rgb: 255, 255, 255;
    --global-site-black: #343434;
    --global-site-black-rgb: 52, 52, 52;
    --global-site-base: #05588E;
    --global-site-base-rgb: 104, 49, 142;
    --global-site-primary: #23A0E0;
    --global-site-primary-rgb: 152, 131, 229;
    --global-site-secondary: #26cc8c;
    --global-site-secondary-rgb: 38, 204, 140;
    --global-site-extra: #2bb1ce;
    --global-site-extra-rgb: 43, 177, 206;
    --global-site-extra-two: #f2f0ec;
    --global-site-extra-two-rgb: 242, 240, 236;
    --global-site-bdr-color: #e8e5e0;
    --global-site-bdr-color-rgb: 232, 229, 224;
    --global-site-bdr-radius: 8px;
    --global-site-orange: #FEBC5C;
    --global-site-darkslate: #483d8b;
    --global-site-light-gray: #9e9e9e;
    --global-site-light-green: #f5fbf2;
    --global-site-lighter-green: #d1ecc6
}



.section-title {
    margin-top: 10px;
    margin-bottom: 20px;
}

.section-title__tagline {
    position: relative;
    display: inline-block;
    color: var(--global-site-base);
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

    .section-title__tagline::before {
        position: absolute;
        top: -15px;
        left: 50%;
        background-image: url(../Media/images/tzuk3.png);
        width: 20px;
        height: 20px;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        content: "";
        background-size: 100%;
    }

.section-title__title {
    margin: 0;
    font-size: 20px;
    line-height: 30px;
}

.comment-form__input-box {
    position: relative;
    display: block;
    margin-bottom: 15px;
}

    .comment-form__input-box input[type="text"],
    .comment-form__input-box input[type="password"],
    .comment-form__input-box select,
    .comment-form__input-box input[type="search"],
    .comment-form__input-box input[type="email"] {
        height: 40px;
        width: 100%;
        border: none;
        background-color: var(--global-site-extra-two);
        padding-left: 15px;
        padding-right: 15px;
        border-radius: var(--global-site-bdr-radius);
        outline: none;
        font-size: 14px;
        color: var(--global-site-gray);
        display: block;
    }


.submit-btn {
    height: 40px;
    border-radius: 10px;
    background: var(--global-site-base);
    color: #fff;
    font-weight: 600;
    border: none;
    line-height: 25px;
    width: 100%;
    margin-top: 5px;
    font-size: 14px;
}

    .submit-btn:hover {
        background: var(--global-site-primary);
        transition: ease-out;
        transition-duration: 1s;
    }

.color-global-base {
    color: var(--global-site-base);
}

a {
    color: var(--global-site-gray);
}

    a,
    a:hover,
    a:focus,
    a:visited {
        text-decoration: none;
    }

.thm-btn {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    -webkit-appearance: none;
    appearance: none;
    outline: none !important;
    background-color: var(--global-site-primary);
    color: var(--global-site-white);
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 60px 10px;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    overflow: hidden;
    letter-spacing: 0.1em;
    border-radius: 33px;
    z-index: 1;
    border:none;
}

    .thm-btn:hover {
        color: var(--global-site-white);
        background-color: transparent;
    }

    .thm-btn::before {
        position: absolute;
        content: '';
        background-color: var(--global-site-base);
        width: 100%;
        height: 0%;
        left: 50%;
        top: 50%;
        border-radius: 33px;
        -webkit-transform: translate(-50%, -50%) rotate(-45deg);
        transform: translate(-50%, -50%) rotate(-45deg);
        z-index: -1;
        -webkit-transition: all 500ms ease;
        transition: all 500ms ease;
    }

    .thm-btn:hover::before {
        height: 380%;
    }

.registration-btn {
    position: relative;
    display: inline-block;
    font-size: 12px;
    color: var(--global-site-white);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background-color: var(--global-site-base);
    padding-left: 4px;
    padding-right: 30px;
    padding-top: 4px;
    padding-bottom: 4px;
    border-radius: 33px;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    overflow: hidden;
    width: 100%;
}

    .registration-btn i {
        height: 35px;
        width: 35px;
        background-color: var(--global-site-white);
        border-radius: 50%;
        color: var(--global-site-base);
        text-align: center;
        line-height: 35px;
        display: inline-block;
        margin-right: 16px;
        -webkit-transition: all 0.3s linear;
        transition: all 0.3s linear;
        float:left;
    }

    .registration-btn span {
        padding-top: 4px;
        padding-bottom: 4px;
        line-height: 35px;
    }

    .registration-btn:hover {
        background-color: var(--global-site-black);
        color: var(--global-site-white);
    }

        .registration-btn:hover i {
            background-color: var(--global-site-base);
            color: var(--global-site-white);
        }

.btn-submit {
    border: var(--global-site-base);
}

.bg-purple {
    background-color: var(--global-site-base);
}