:root {
    --alternative-color--light: #e3f2df;
    --alternative-color--dark: #F3DBAD;
    --focus-outline-color: orange;
}

* {
    /*box-sizing: border-box;*/
}


/*******************
Content blocks
********************/
.content {
    margin: auto;
    padding: 5px 20px 20px 20px;
    width: 750px;
}


/************************************
Sections with color background
*************************************/
section {
    width: 100%;
    position: relative;
    color: var(--alternative-color--dark);
}

    section a {
        font-weight: bold;
        transition: outline .1s linear;
    }

.alt-background {
    background: var(--alternative-color--dark);
    color: var(--alternative-color--light);
}

    .alt-background h2,
    .alt-background h3,
    .alt-background h4 {
        color: white;
    }

    .alt-background a {
        color: white;
    }

        .alt-background a:focus {
            outline-color: orange;
        }

    .alt-background .slick-slide {
        background: #fff;
        margin: 10px;
        position: relative;
        height: 100px;
        color: var(--alternative-color--dark);
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .alt-background .slick-slide p {
            margin: 0;
            font-size: 36px;
        }

    .alt-background hr {
        background: rgb(255,255,255,.3);
    }



/**************
Demos
***************/
/** All sliders */
.slick-autoplay-toggle-button,
.slick-prev .slick-prev-icon, .slick-next .slick-next-icon,
.slick-dots li button .slick-dot-icon,
.slick-dots li.slick-active button .slick-dot-icon {
    /*color: white;*/
    /*color: #7E5048;*/
    color: #F75013;
}


/** Variable width */
.adaptive-height .slick-slide,
.lazy .slick-slide,
.fade .slick-slide {
    height: auto;
    min-height: 100px;
}
