﻿@charset "UTF-8";
/*อธิบาย
theme.css ให้ระบุสี CI ของ project ที่ต้องการสร้าง Lanidng page
*/

body {
    background-color: #FFFFFF;
    color: #000000;
}

.bg-ci1 {
    background-color: rgb(241, 93, 62) !important;
}

.bg-ci1-75 {
    background-color: rgba(241, 93, 62, .75) !important;
}

.bg-ci1-45 {
    background-color: rgba(241, 93, 62, .45) !important;
}

.bg-ci1-15 {
    background-color: rgba(241, 93, 62, .15) !important;
}

.bg-ci2 {
    background-color: rgb(130, 163, 129) !important;
}

.bg-ci2-75 {
    background-color: rgba(130, 163, 129, .75) !important;
}

.bg-ci2-45 {
    background-color: rgba(130, 163, 129, .45) !important;
}

.bg-ci2-15 {
    background-color: rgba(130, 163, 129, .15) !important;
}

.bg-ci3 {
    background-color: rgb(228, 215, 199) !important;
}

.bg-ci3-75 {
    background-color: rgba(228, 215, 199, .75) !important;
}

.bg-ci3-45 {
    background-color: rgba(228, 215, 199, .45) !important;
}

.bg-ci3-15 {
    background-color: rgba(228, 215, 199, .15) !important;
}


.border-ci1 {
    border-color: rgba(241, 93, 62, 1) !important;
}

.border-ci2 {
    border-color: rgba(130, 163, 129, 1) !important;
}

.border-ci3 {
    border-color: rgba(228, 215, 199, 1) !important;
}

.color-ci1 {
    color: rgba(241, 93, 62, 1) !important;
}

.color-ci2 {
    color: rgba(130, 163, 129, 1) !important;
}

.color-ci3 {
    color: rgba(228, 215, 199, 1) !important;
}

/* backgroud small screen only */
@media (max-width: 991px) {
    .xs-bg-ci1 {
        background-color: rgb(241, 93, 62) !important;
    }

    .xs-bg-ci1-75 {
        background-color: rgba(241, 93, 62, .75) !important;
    }

    .xs-bg-ci1-45 {
        background-color: rgba(241, 93, 62, .45) !important;
    }

    .xs-bg-ci1-15 {
        background-color: rgba(241, 93, 62, .15) !important;
    }

    .xs-bg-ci2 {
        background-color: rgb(130, 163, 129) !important;
    }

    .xs-bg-ci2-75 {
        background-color: rgba(130, 163, 129, .75) !important;
    }

    .xs-bg-ci2-45 {
        background-color: rgba(130, 163, 129, .45) !important;
    }

    .xs-bg-ci2-15 {
        background-color: rgba(130, 163, 129, .15) !important;
    }

    .xs-bg-ci3 {
        background-color: rgb(228, 215, 199) !important;
    }

    .xs-bg-ci3-75 {
        background-color: rgba(228, 215, 199, .75) !important;
    }

    .xs-bg-ci3-45 {
        background-color: rgba(228, 215, 199, .45) !important;
    }

    .xs-bg-ci3-15 {
        background-color: rgba(228, 215, 199, .15) !important;
    }

    .xs-color-black {
        color: #000000 !important;
    }

    .xs-color-white {
        color: #ffffff !important;
    }
}


/* backgroud large screen only */
@media (min-width: 992px) {
    .lg-bg-ci1 {
        background-color: rgb(241, 93, 62) !important;
    }

    .lg-bg-ci1-75 {
        background-color: rgba(241, 93, 62, .75) !important;
    }

    .lg-bg-ci1-45 {
        background-color: rgba(241, 93, 62, .45) !important;
    }

    .lg-bg-ci1-15 {
        background-color: rgba(241, 93, 62, .15) !important;
    }

    .lg-bg-ci2 {
        background-color: rgb(130, 163, 129) !important;
    }

    .lg-bg-ci2-75 {
        background-color: rgba(130, 163, 129, .75) !important;
    }

    .lg-bg-ci2-45 {
        background-color: rgba(130, 163, 129, .45) !important;
    }

    .lg-bg-ci2-15 {
        background-color: rgba(130, 163, 129, .15) !important;
    }

    .lg-bg-ci3 {
        background-color: rgb(228, 215, 199) !important;
    }

    .lg-bg-ci3-75 {
        background-color: rgba(228, 215, 199, .75) !important;
    }

    .lg-bg-ci3-45 {
        background-color: rgba(228, 215, 199, .45) !important;
    }

    .lg-bg-ci3-15 {
        background-color: rgba(228, 215, 199, .15) !important;
    }
}

.link-ci1 {
    color: rgba(241, 93, 62, 1) !important;
}

    .link-ci1:visited {
        color: rgba(241, 93, 62, 1) !important!important!important;
    }

    .link-ci1:hover {
        color: rgba(241, 93, 62, 1) !important!important;
    }

    .link-ci1:active {
        color: rgba(241, 93, 62, 1) !important;
    }

.link-ci2 {
    color: rgba(130, 163, 129, 1) !important;
}

    .link-ci2:visited {
        color: rgba(130, 163, 129, 1) !important;
    }

    .link-ci2:hover {
        color: rgba(130, 163, 129, 1) !important;
    }

    .link-ci2:active {
        color: rgba(130, 163, 129, 1) !important;
    }

.link-ci3 {
    color: rgba(228, 215, 199, 1) !important;
}

    .link-ci3:visited {
        color: rgba(228, 215, 199, 1) !important;
    }

    .link-ci3:hover {
        color: rgba(228, 215, 199, 1) !important;
    }

    .link-ci3:active {
        color: rgba(228, 215, 199, 1) !important;
    }

:root {
    --main-theme-color: rgba(241, 93, 62, 1);
}

.fill-ci1 {
    fill: rgb(241, 93, 62) !important;
}

@media (max-width: 991px) {
    .xs-fill-ci1 {
        fill: rgb(241, 93, 62) !important;
    }
}
