* {
    box-sizing: border-box;
    scroll-behavior:smooth;
}

.cover {
height:100%;
width: 100%;
display: grid;
z-index: 1;
order: 2;
overflow: hidden;
align-content: center;
}

    .headerContact {
        display: grid;
        width: 100%;
        padding: 20px 0px;
        align-content: center;
        justify-content: center;
    }

        .headerContact h1 {
            justify-self: center;
            font-size: 48px;
            color: #1a1a1d;
            font-weight: bold;
            text-shadow: 3px 3px 0 #d6d5e2;
        }

        .headerContact h3 {
            justify-self: center;
            color: #1a1a1d;
            font-size: 24px;
            width: 100%;
            font-weight: lighter;
        }

        .socialMedia {
            padding: 20px;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            flex-wrap: wrap;  
        }

            .socialContent {
                display: grid;
                padding: 20px;
                margin: 20px auto;
                cursor: pointer;
                transition: all 0.4s;
                text-decoration: none;
            }

                .socialContent:hover {
                    transform: translateY(2%);
                    filter:brightness(95%);
                }

                .socialContent i {
                    font-size: 100px;
                    color: #e3e2f2;
                    margin: 10px 0;

                }

                .socialContent p {
                    margin: 10px 0;
                    font-size: 18px;
                    font-weight: bold;
                    color: #e3e2f2;

                }

        .bodyContact {
        padding: 20px 0px;
        display: grid;
        align-items: center;
        justify-items: center;       
        }

        .formContact {
            height: 90%;
            width: 90%;
            display: grid;
            align-content: center;
        }

        .form-control {
                color: #1a1a1d;
                background: #e3e2f2;
                box-shadow: 4px 4px 0 #d6d5e2;
                height: 70px;
                width: 100%;
                border: none;
                margin-bottom: 20px;
                padding: 0px 20px;
                border-radius: 10px;
                outline: none;
                transition: all 0.4s;
            }


            .form-control::placeholder {
                color: #1a1a1d;
            }

            .form-control:focus {
                transform: scale(1.01);
            }

            .form-message {
                color: #1a1a1d;
                background: #e3e2f2;
                box-shadow: 4px 4px 0 #d6d5e2;
                height: 200px;
                width: 100%;
                border: none;
                margin-bottom: 10px;
                padding:20px 20px;
                border-radius: 10px;
                outline: none;
                transition: all 0.4s;
                resize: vertical;
            }

            .form-message::placeholder {
                color: #1a1a1d;
            }

            .form-message:focus {
                transform: scale(1.01);
            }

            .formContact button {
                cursor: pointer;
                color: #fff;
                background: #c3073f;
                height: 50px;
                width: 120px;
                font-weight: 500;
                float: right;
                outline: none;
                border: none;
                transition: all 0.4s;
            }

            .formContact button:hover {
                background: #b20a3a;
            }

        .mobileContact {
            padding: 20px 0;
            width: 100%;
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            transition: all 0.4s;
        }

            .mobileContact a {
                display: flex;
                text-decoration: none;
                transition: all 0.4s;
                align-items: center;
                padding: 10px 30px;
            }

            .mobileContact a:hover {
                transform: translateY(2%);
                filter:brightness(95%);
            }

            .mobileContact a i {
                font-size: 50px;
                color: #e3e2f2;
            }

            .mobileContact a p {
                font-size: 30px;
                color: #e3e2f2;
                margin: 10px;
            }