﻿// Colors Variables

@clrDarkBlue: #0b3f54;
@clrDarkSkyBlue: #6fc8c0;
@clrYellow: #fed115;
@clrGrayBackground: #fed115;
@whiteColor: #fff;
@blackColor: #000;
@grayColor: #a1a1a1;
@lightGreenColor: #7BCED1;

@PrimaryColor: #0b3f54;
@WhiteColor: #ffffff;
@BlueColor: #144e65;
@YellowColor: #d9a952;



// Fonts Styling Mixin
.FontStyling(@fontfamily,@fontweight,@fontstyle) {
    font-family: @fontfamily;
    font-weight: @fontweight;
    font-style: @fontstyle;
}

// Media Query Brack Points
@small: ~"screen and (max-width: 39.9375em)";
@medium: ~"screen and (min-width: 40em) and (max-width: 63.9375em)";
@mediumBelow: ~"screen and (max-width: 63.9375em)";
@maxwidth360: ~"only screen and (max-width: 360px)";
@maxwidth640: ~"only screen and (max-width: 40rem)";
@maxwidth641: ~"only screen and (max-width: 39.9375rem)";
@maxwidth768: ~"only screen and (max-width: 48em)";
@maxwidth1024: ~"only screen and (max-width: 1024px)";
@minwidth1024: ~"only screen and (min-width: 1024px)";
@maxwidth1100: ~"only screen and (max-width: 1100px)";
@maxwidth767: ~"only screen and (max-width: 47.9375rem)";
@maxwidth1023: ~"only screen and (max-width: 63.9375rem)";
@mediaIPad: ~" only screen   and (min-device-width: 768px)   and (max-device-width: 1024px) ";

/*=== Buttons Style ====*/

.btn {
    .FontStyling(acumin-pro-condensed, 400, normal);
    font-size: 24px;
    text-align: center;
    transition: all 0.3s linear;
    display: inline-block;
    padding: 11px 0;
    cursor: pointer;

    &:active,
    &:focus {
        background-image: none !important;
        outline: 0 !important;
    }

    &.btn-green {
        color: #fff;

        .fa {
            margin-right: 5px;
        }

        &:hover {
        }
    }

    &.btn-yellow {


        .fa {
            margin-right: 5px;
        }

        &:hover {
        }
    }

    &.btn-green-light {
        color: #fff;

        .fa {
            margin-right: 5px;
        }

        &:hover {
        }
    }

    &.btn-border-bottom {
        font-size: 18px;
        background-color: #fff;
        .FontStyling(acumin-pro-condensed, 900, normal);
    }

    &.disabled {
        color: #fff;
        background-color: #6c757d;
        border-color: #6c757d;
        pointer-events: none;
        opacity: 0.65;
    }
}
