﻿/*Background*/
.main-content {
    background-image: url(/custom/img/821.jpg);
}

#g-mainbar {
    box-shadow: 0px 0px 75px 85px #fff;
}

@media (min-width: 1440px){
    #g-mainbar{
        min-height: 825px;
    }
}

/*Brand colors*/
.tfa{
    /*Yellow*/
    background-color: RGBA(242, 224, 144, .2);
}
.capella{
    /*Blue*/
    background-color: RGBA(102, 119, 153, .2);
}
.flavourart{
    /*Red*/
    background-color: RGBA(245, 130, 48, .2);
}
.flavourwest{
    /*Orange*/
    background-color: RGBA(221, 119, 136, .2);
}
.flavorah{
    /*Magenta*/
    background-color: RGBA(240, 50, 230, .2);
}
.inawera{
    /*Yellow*/
    background-color: RGBA(255, 225, 25, .2);
}
.liquidbarn{
    /*Lime*/
    background-color: RGBA(210, 245, 60, .2);
}
.lorann{
    /*Cyan*/
    background-color: RGBA(70, 240, 240, .2);
}
.purilum{
    /*Green*/
    background-color: RGBA(60, 180, 75, .2);
}
.vampirevape{
    /*Purple*/
    background-color: RGBA(145, 30, 180, .2);
}
.wonderflavour{
    /*Blue*/
    background-color: RGBA(0, 130, 200, .2);
}

/* Login */
.puff-login {
    width: 100%;
    text-align: center;
}
a.logBtn,
a.regBtn{
    width: 100%;
}
a.logBtn > span,
a.regBtn > span{
    width: 50%;
    font-size: 20px;
}

/* Login for component */
#loginComp > div {
    width: 100%;
    padding-top: 100px;
}
#loginComp .regBtn > span{
    margin: auto;
}
/* Messages */
#g-top > .g-container{
    width: 100%
}
.g-system-messages{
    height: 100%
}
#system-message{
    padding: 0;
    text-align: center;
}
.alert-notice,
.alert-success{
    color: #000;
    background-color:#7efd8e;
    position: absolute;
    width: 90%;
}
.alert-notice > .close,
.alert-success > .close{
    font-size: 50px;
}
.alert-notice p,
.alert-success p{
    margin: 0;
}
.alert-notice h4,
.alert-success h4{
    color: #000;
}