

/***** BUTTON CLASSES *****/
/* basic buttton - red */
.btnBasic {
    display: inline-block;
    padding: 12px 17px;
    border-radius: 3px;
    border: 2px solid #cc0000;
    background-color: #cc0000;
    background-image: none;
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    text-decoration: none;
    cursor: pointer;
    text-decoration: none;
}
    .btnBasic:hover {
        background-color: #eb0000;
        border-color: #eb0000;
        color: #fff;
        text-decoration: none;
    }

.btnSecond {
    background-color: transparent;
}
.btnSecond:hover,
.btnBlackbg .btnSecond:hover
 {
    color: #000;
    background-color: #eee;
    border-color: #eee;
    }

/* background specific buttons */
/* currently 4 groups - btnLightbg, btnBlackbg, btnRedbg, btnRed2bg  */
/* currently 4 buttons and 1 filter style */

.btnLightbg {}
    .btnLightbg .btnBasic {}
    .btnLightbg .btnPrime {background-color: #34a8d6; border-color: #34a8d6;}
        .btnLightbg .btnPrime:hover {background-color: #3fbff2; border-color: #3fbff2;}
    .btnLightbg .btnInactive {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
        .btnLightbg .btnInactive:hover {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
    .btnLightbg .btnSecond {color: #000; border-color: #000; background: transparent;}
        .btnLightbg .btnSecond:hover {border-color: #999; background-color: #999;}
    .btnLightbg .btnFilter {background-color: #eb0000; border-color: #eb0000;}

.btnBlackbg {}
    .btnBlackbg .btnBasic {}
    .btnBlackbg .btnPrime {background-color: #34a8d6; border-color: #34a8d6;}
        .btnBlackbg .btnPrime:hover {background-color: #3fbff2; border-color: #3fbff2;}
    .btnBlackbg .btnInactive {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
        .btnBlackbg .btnInactive:hover {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
    .btnBlackbg .btnSecond {color: #fff; border-color: #fff; background: transparent;}
    .btnBlackbg .btnFilter {background-color: #eb0000; border-color: #eb0000;}

.btnRedbg {}
    .btnRedbg .btnPrime {}
    .btnRedbg .btnBasic {background-color: #000; border-color: #000;}
        .btnRedbg .btnBasic:hover {background-color: #464646; border-color: #464646;}
    .btnRedbg .btnInactive {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
        .btnRedbg .btnInactive:hover {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
    .btnRedbg .btnSecond {color: #fff; border-color: #fff; background: transparent;}
        .btnRedbg .btnSecond:hover { color: #000; background-color: #eee; border-color: #eee;}
    .btnRedbg .btnFilter {background-color: #464646; border-color: #464646;}

.btnRed2bg {}
    .btnRed2bg .btnPrime {}
    .btnRed2bg .btnBasic {background-color: #000; border-color: #000;}
        .btnRed2bg .btnBasic:hover {background-color: #464646; border-color: #464646;}
    .btnRed2bg .btnInactive {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
        .btnRed2bg .btnInactive:hover {background-color: transparent; border-color: #9c9c9c; color: #9c9c9c; cursor: not-allowed !important;}
    .btnRed2bg .btnSecond {color: #fff; border-color: #fff; background: transparent;}
        .btnRed2bg .btnSecond:hover { color: #000; background-color: #eee; border-color: #eee;}
    .btnRed2bg .btnFilter {background-color: #464646; border-color: #464646;}


@media screen and (max-width:800px) {
    .btnBasic {
        padding: 11px 57px;
        font-size: 15px;
    }
}
