﻿body {
    line-height: inherit;
    margin: 0;
    font-size: 14px !important;
    font-family: 'Raleway', sans-serif !important;
}

a:hover {
    text-decoration: none !important;
}

.main-body {
    width: 100%;
    font-family: 'Raleway', sans-serif;
    min-height: 100%;
}

.top-menu {
    background-color: rgb(30, 188, 27);
    color: rgb(255, 255, 255);
    font-weight: 400;
    width: 100%;
    padding: 1.5rem 3rem;
    align-items: center;
    display: flex;
}

.menu-title {
    display: inline-block !important;
    color: rgb(255, 255, 255);
    font-family: Cabin, sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 32px;
}

.my-account {
    background: transparent;
    border-radius: 8px;
    color: #67f173;
    border: 2px solid #67f173;
    padding: 1.75rem 2rem;
    font-size: 2rem !important;
    line-height: 2rem !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: 0 auto;
    display: table;
}

.my-account:hover {
    --tw-bg-opacity: 1;
    opacity: .9;
    --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    text-decoration: none;
    color: #67f173;
}

.top-banner {
    background-image: url("../../images/bg-top-banner.jpg");
    background-position: center 100%;
    background-size: cover;
    min-height: 240px;
    display: flex;
    align-items: center;
    text-align: center;
    height: 100%;
    padding-top: 3em;
    padding-bottom: 4em;
}


.top-banner-title {
    color: #FFFFFF;
    font-family: 'Cabin', sans-serif;
    font-weight: 700;
    font-size: 3.5em;
}

.top-banner-subtitle {
    color: #FFFFFF;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    font-size: 1.7em;
    padding-bottom: 1em;
}

.button-site {
    background: transparent;
    border-radius: 8px;
    color: #67f173;
    border: 2px solid #67f173;
    padding: 1em;
    margin: 3em;
}

.button-site:hover {
    color: #55c75f;
}


@media screen and (min-width: 400px) {

}

.container {
    width: 100%;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
}

.topics-images {
    text-align: center;
    padding: 1em 2em;
    display: grid;
}

.topics-images h2 {
    color: #111827;
    font-family: 'Cabin', sans-serif;
    font-weight: 700;
    font-size: 48px;
    line-height: 56px;
}

.topic-image {
    width: 100%;
    border: none;
    margin: auto;
    object-fit: cover;
    border-radius: 1rem;
    object-position: center;
    margin-bottom: 1em;
}

.topic-image-h-1 {
    height: 15em;

}

.topic-image-h-2 {
    height: 25em;
}

.register {
    background: #3e8f3e;
    width: 100%;
    padding: 2em;
    min-height: 10em;
    color: #FFFFFF;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    padding-bottom: 0.5em;
}


.register h1 {
    font-size: 2.5em;
    font-weight: bold;
}

.register p {
    font-size: 1.5em;
}

.register .row {
    padding: 0.2em 0.5em;
}

.register-next-button {
    margin-left: 70%;
    text-align: center;

}

.register-input {
    width: 100%;
    background: rgba(255, 255, 255, 0.4);
    border: none;
    border-radius: 0.3em;
    color: white;
    font-size: 1.5em;
    padding: 0.25em;
}

.register-checkbox {
    width: 1.5em;
    height: 1.5em;
    margin: 0.5em;
}

.about {
    background: white;
    width: 100%;
    padding: 2em;
    min-height: 20em;
    align-items: center;
    text-align: center;
    display: flex;
}

.about .about-title {
    font-size: 3em;
    font-weight: bold;
    font-family: 'Cabin', sans-serif;
}

.about .about-subtitle {
    font-size: 1.5em;
    font-family: 'Raleway', sans-serif;
}

.footer {
    background: rgb(30, 188, 27);
    width: 100%;
    padding: 2em;
    min-height: 6em;
    color: white;
}

.footer p {
    font-size: 1.2em;
    font-family: 'Raleway', sans-serif;
}

.lds-spinner {
    color: official;
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-spinner div {
    transform-origin: 40px 40px;
    animation: lds-spinner 1.2s linear infinite;
}

.lds-spinner div:after {
    content: " ";
    display: block;
    position: absolute;
    top: 3px;
    left: 37px;
    width: 6px;
    height: 18px;
    border-radius: 20%;
    background: #fff;
}

.lds-spinner div:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: -1.1s;
}

.lds-spinner div:nth-child(2) {
    transform: rotate(30deg);
    animation-delay: -1s;
}

.lds-spinner div:nth-child(3) {
    transform: rotate(60deg);
    animation-delay: -0.9s;
}

.lds-spinner div:nth-child(4) {
    transform: rotate(90deg);
    animation-delay: -0.8s;
}

.lds-spinner div:nth-child(5) {
    transform: rotate(120deg);
    animation-delay: -0.7s;
}

.lds-spinner div:nth-child(6) {
    transform: rotate(150deg);
    animation-delay: -0.6s;
}

.lds-spinner div:nth-child(7) {
    transform: rotate(180deg);
    animation-delay: -0.5s;
}

.lds-spinner div:nth-child(8) {
    transform: rotate(210deg);
    animation-delay: -0.4s;
}

.lds-spinner div:nth-child(9) {
    transform: rotate(240deg);
    animation-delay: -0.3s;
}

.lds-spinner div:nth-child(10) {
    transform: rotate(270deg);
    animation-delay: -0.2s;
}

.lds-spinner div:nth-child(11) {
    transform: rotate(300deg);
    animation-delay: -0.1s;
}

.lds-spinner div:nth-child(12) {
    transform: rotate(330deg);
    animation-delay: 0s;
}

@keyframes lds-spinner {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.error-message {
    color: #ea884f;
    font-weight: bold;
    font-size: 1.2em;
}


.select2-container--default .select2-selection--single {
    width: 100%;
    background: rgba(255, 255, 255, 0.4);
    border: none;
    border-radius: 0.3em;
    color: white;
    font-size: 1.5em;
    padding: 0.25em;
}

.select2-container .select2-selection--single {
    height: auto;
    min-height: 2em;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b{
    border-color: #fff transparent transparent transparent;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{
    border-color: transparent transparent #fff transparent;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: aliceblue;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: white;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    background: rgba(255, 255, 255, 0.2);
}

.partner-container {
    padding: 0.5em;
}

.partner {
    padding: 1em;
    border-radius: 0.3em;
    background: rgba(255, 255, 255, 0.2);
    min-height: 5em;
}

.partner-container a {
    color: white;
}

.partner-container a:hover {
    color: #95f5d4;
}

.partner-name {
    text-align: center;
    font-size: 1.3em;
    font-weight: bold;
}

.partner-icon{
    width: 1.5em;
    height: 1.5em;
}