:root {
    --caption-bk-color: #ed8c07AA ;
    --caption-color: white ;
    --h-color : #6c6966;
    --lavender-lite : #e6e6ef;

}

* {
    font-family: 'Nunito', Roboto, sans-serif;
}

body {
    font-size: 20px;
    line-height: 1.5;
}

h1, h2, h3, h4, h5 {
    color: var(--h-color);
}

a {
    text-decoration: none;
}

#frame1 {
    background-color: #f5f6fa;
}

.frame1-image-holder {
    position: relative;
    max-width: 550px;
}

.frame1-image-holder img {
    max-height: 100%;
    max-width: 100%;
}

.frame1-image-holder .caption {
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: var(--caption-bk-color);
    color: var(--caption-color);
    font-size: 22px;
    padding: 0.5em;
}

#frame-you {
    background-color: white;
}

.frame2-image-holder {
    width: 200px;
}

.frame2-image-holder img {
    border-radius: 50%;
    width: 200px;
    height: 200px;
    box-shadow: rgba(77, 77, 77, 0.7) 2px 2px 10px;
}

.frame2-image-holder div {
    font-size: 13px;
    text-align: center;
}

#frame-us {
    background-color: var(--lavender-lite);
}

#frame-orange h1, #frame-orange h2, #frame-orange h3, #frame-orange h4, #frame-orange h5 {
    color: #ffffff;
}

#frame-orange {
    background-color: #ffb45e;
    color: #222222;
    padding: 2em;
}

@media screen and (min-width: 700px) {
    #frame-orange {
        background-image: url("/images/lp/girl-idea-bkg.jpg");
        background-position: right;
        background-repeat: no-repeat;
        background-size: cover;
        padding: 2em 5em;
    }
}

.frame-orange-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 0.5em;
}

.frame-orange-item {
    border-radius: 50%;
    border: solid 2px white;
    padding: 5px;
    background-color: #ffedde;
    margin-right: 1em;
}

.small-circle {
    background-color: #eeeeee;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

#frame-site {
    background-color: white;
    color: #6c6966;
}

.site-item {
    flex-grow: 1;
    width: 350px;
    height: auto;
    padding: 2em;
    border: solid 1px #e8e8e8;
    border-radius: 10px;
    box-shadow: 0 0 15px #eeeeee;

}

.site-item-icon {
    border-radius: 50%;
    background-color: #f5f6fa;
    width: 80px;
    height: 80px;
    padding: 10px;
    text-align: center;
    margin-bottom: 1em;
}

.site-item-icon img {
    width: 100%;
    height: 100%;

    filter: invert(66%) sepia(74%) saturate(419%) hue-rotate(339deg) brightness(102%) contrast(99%);
}

#frame-contest {
    background-color: var(--lavender-lite);
}

#frame-contest a {
    color: inherit;
    text-decoration: underline;
}

#frame-prices {
    background-color: white;
    color: #6c6966;
}
#frame-instruction {
    background-color: var(--lavender-lite);
    color: #6c6966;
}

#frame-prices .row-item {

}

#frame-prices .card-header {
    background-color: lightslategray;
    color: white;
}

#frame-prices .card-body {
    background-color: var(--lavender-lite);
}

.row-item {
    list-style-type: circle;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    line-height: 1.2;
}

.price-cards .card {
    max-width: 450px;
}

.price-cards .card-header {
    min-height: 100px;
}

ul.lp-6 li {
    line-height: 1.2;
}