/*
- Colors -

Grey color:
Grey: #afafaf

Section color:

Primary:
Light blue: #3ae8fc
Orange: #c15520
White: #fff

Secondaty colors:
Zalm: #f9b69b
Very light blue: #c5fcff
Dark blue: #050931

Tints:
Btn hover: #b0f6fe

- Fonts -
Primary font:
Raleway
 */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

*:focus {
    outline: 4px dotted #c15520;
}

html {
    font-size: 62.5%;
    scroll-behavior: smooth;
}

body {
    font-family: "Raleway", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.grecaptcha-badge {
    visibility: hidden !important;
}

a {
    text-decoration: none;
    color: #fff;
}

h2 {
    font-size: 4.4rem;
}

/* ****************************** */
/* GENERAL REUSABLE COMPONENTS */
/* ****************************** */

.container {
    /* 1140px */
    max-width: 120rem;
    margin: 0 auto;
    padding: 0 3.2rem;
}

.grid {
    display: grid;
    row-gap: 9.6rem;
    column-gap: 6.4rem;
}

.grid--2-cols {
    grid-template-columns: repeat(2, 1fr);
}

.grid--3-cols {
    grid-template-columns: repeat(3, 1fr);
}

.grid--4-cols {
    grid-template-columns: repeat(4, 1fr);
}

.grid--5-cols {
    grid-template-columns: repeat(5, 1fr);
}

.btn,
.btn:link,
.btn:visited {
    display: inline-block;
    text-decoration: none;
    font-size: 2rem;
    font-weight: 600;
    padding: 1.6rem 3.2rem;
    border-radius: 9999px;

    /* Only necessary for .btn */
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s;

    background-color: #c15520;
    color: #fff;
}

.btn:hover,
.btn:active {
    background-color: #e0aa90;
    color: #3f3f3f;
}

.btn-animated {
    animation: moveInBottom 1s ease-out .75s;
    animation-fill-mode: backwards;
}

.btn-form {
    font-size: 1.6rem;
    margin-top: 1.2rem;
}