style.less

@primary-color: #e66f00;
@secondary-color: #99ccff;
@ternary-color: white;
@background-color: #eeeeee;
@primary-color-transparent: rgba(0, 0, 0, 0.5);
@primary-color-transparent07: rgba(0, 0, 0, 0.7);
@border-color: #7585e5;
@menu-color: #0099cc;

.page {
    margin: 0;
    padding: 0;
    background-color: @background-color;
    font-family: /*Tahoma, Verdana, Segoe,*/ sans-serif;
    //background-size: cover;
}

.row {
    margin: 0;
    padding: 0;
}

.vertical-separator {
    display: box;
    margin-bottom: 3em;
}

///////////////////////////////////////// MENU ////////////////////////////////////////

.menu {

    ul {
        position: fixed;
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: @primary-color-transparent07;
        min-width: 100%;
        z-index: 9999;

        li {
            float: left;

            a {
                display: block;
                text-align: center;
                padding: 15px;
                color: white;
                text-decoration: none;
            }
        }
    }
}

/////////////////////////////////////// HEADER ////////////////////////////////////////

.header {
    padding: 0em;
    margin: 0em;
    text-align: left;
    margin-bottom: 1em;
    background-size: cover;
    background-color: @primary-color;
    height: 100%;
    color: white;

    .centered {
        margin-left: 20%;
        margin-right: 20%;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);

        h1 {
            background-color: @primary-color-transparent07;
            padding: 1em;
        }

        p {
            margin-top: 1em;
            display: box;
            background-color: @primary-color-transparent;
            padding: 1em;
            text-align: justify;
        }
    }
};



/////////////////////////////////////// FOOTER ////////////////////////////////////////

.footer {
    padding: 2em;
    padding-top: 100px;
    margin: 0;
    margin-top: 2em;
    text-align: center;
    margin-bottom: 1em;
    background-size: cover;
    background-color: @primary-color;
    //width: 100%;
    height: 200px;
    overflow: hidden;
    color: white;
};

/////////////////////////////////////// BANNER ////////////////////////////////////////

.banner-basic {
    padding: 1em;
    text-align: center;
    margin: 0px;
    margin-top: 1em;
    background-color: @primary-color;
    color: white;
};

.banner-basic h2 {
    padding: 1em;
}

.banner-basic p {
    padding: 2em;
}

/////////////////////////////////////// IMAGE BANNER ////////////////////////////////////////

.banner-image {
    padding: 1em;
    text-align: center;
    margin: 0px;
    margin-top: 1em;
    background-size: cover;
    color: white;
};

.banner-image h2 {
    padding: 1em;
    background-color: @primary-color-transparent;
    margin-top: 0;
}

.banner-image p {
    padding: 2em;
}

/////////////////////////////////////// CARUSEL ////////////////////////////////////

.carusel-basic {
    background-color: @ternary-color;
    margin: 2em 1em 2em 1em;
    border-radius: 5px;
}

.carusel-basic h2 {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    background-color: @ternary-color;
    color: black;
    margin: 0em;
    padding: 0em;
    padding-top: .5em;
    padding-bottom: .3em;
    text-align: center;
}

.carusel-basic p {
    padding: 2em;
    padding-top: 0.5em;
    text-align: justify;
}

//////////////////////////////// CARUSEL IMAGE ////////////////////////////////////

.carusel-image {
    background-color: @ternary-color;
    margin: 2em 1em 2em 1em;
    border-radius: 5px;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}

.carusel-img-div {
    background: none;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    min-height: 200px;
    background-size: cover;
}

.carusel-image h2 {
    background-color: @ternary-color;
    color: black;
    margin: 0em;
    padding: 0em;
    padding-top: .5em;
    padding-bottom: .3em;
    text-align: center;
}

.carusel-image p {
    padding: 2em;
    padding-top: 0.5em;
    text-align: justify;
}

/////////////////////////// INFO IMAGE ///////////////////////////////////////////

.info-image-image {
    position: relative;
    min-height: 300px;
    background-color: @ternary-color;
    color: black;
    margin: 1em;
    padding: 0em;
    padding-top: .5em;
    padding-bottom: .3em;
    text-align: center;
    border-radius: 5px;
    background-size: cover;

}

.info-image-text {
    background-color: @ternary-color;
    min-height: 300px;
    margin: 1em;
    border-radius: 5px;
}

.info-image-text h2 {
    color: black;
    margin: 0em;
    padding: 0em;
    padding-top: .5em;
    padding-bottom: .3em;
    text-align: center;
}

.info-image-text p {
    padding: 2em;
    padding-top: 0.5em;
    text-align: justify;
}