﻿:root {
    --pastel-green: #91aba1;
    --pastel-pink: #f6adb9;
    --txtGreen: #1b1f1e;
}

body {
    font: Mitra;
}

.title {
    margin-top: 10vmax;
    font-family: laleZar;
    text-align: center;
    width: 35vw;
    height: 5vw;
    background-color: var(--pastel-pink);
    color: white;
    font-size: 3vw;
    padding-top: 1vw;
    border-radius: 45px 0 0 45px;
    margin-left: 32.5vw;
    margin-bottom: 3vw;
}

.evenItem {
    float: left;
    width: 30vw;
    height: 25vw;
    background-color: var(--pastel-green);
    margin-left: 2vw;
    margin-bottom: 3vw;
    border-radius: 45px;
    text-align: center;
}

    .evenItem p {
        width: 10vw;
        float: left;
        font-family: laleZar;
        font-size: 1.5vw;
        margin-bottom: 0;
        margin-left: 3.3vw;
        color: white;
    }

.oddItem {
    text-align: center;
    float: left;
    width: 30vw;
    height: 25vw;
    background-color: var(--pastel-pink);
    margin-left: 2vw;
    margin-bottom: 3vw;
    border-radius: 45px;
}

    .oddItem p {
        width: 10vw;
        float: left;
        font-family: laleZar;
        font-size: 1.5vw;
        margin-bottom: 0;
        margin-left: 3.3vw;
        color: white;
    }

.before, .after {
    float: left;
    background: url(../images/galleyItems/imgShape.png) !important;
    width: 15vw;
    height: 22vw;
    background-size: cover !important;
    background-repeat: no-repeat;
    text-align: center;
    margin-right: -0.3vw;
}

    .before img {
        width: 13vw;
        height: 13vw;
        border-radius: 50%;
        margin-top: 4vw;
        border: 1px solid;
    }

        .before img:hover {
            opacity: 0.7;
        }

    .after img {
        width: 13vw;
        height: 13vw;
        border-radius: 50%;
        margin-top: 4vw;
        border: 1px solid;
    }

        .after img:hover {
            opacity: 0.7;
        }
