﻿



.LeftFloat {
    float: left;
}

.RightFloat {
    float: right;
}

.CenterText {
    text-align: center;
    width: auto;
}



.DashboardDiv, .DashboardDivAdmin {
    background-color: transparent;
    border: solid transparent;
    border-radius: 2px;
    /*filter: grayscale(100%);*/
    margin: 10px 0px 10px 10px;
    padding: 10px 10px 10px 10px;
    outline: none;
    overflow: hidden;
    text-align: center;
    height: 200px;
    display: block;
    font-size: 1em;
    box-shadow: #0e2050 0px 0px 0px 0px, #0e2050 0px 0px 1px 0px;
    min-width: 100px;
    max-width: 100px;
}
    /*.DashboardDiv {
    background-color: #d0dcd8;
}*/
    .DashboardDivAdmin *:not(:h1) {
        filter: grayscale(100%) !important;
    }

    .DashboardDiv:hover, DashboardDivAdmin:hover {
        transition: all .3s ease;
        border: solid transparent;
        filter: grayscale(0%);
        box-shadow: #0e2050 1px 2px 3px 1px, #0e2050 1px 1px 2px 1px;
        /*animation: background 3s infinite alternate-reverse linear, background2 12s infinite alternate-reverse linear;*/
    }

    .DashboardDivAdmin:hover {
        transition: all .3s ease;
        border: solid transparent;
        filter: grayscale(0%);
        box-shadow: #0e2050 1px 1px 1px 1px, #0e2050 1px 1px 2px 1px;
    }

    .DashboardDiv:main, .DashboardDiv:focus, .DashboardDivAdmin:main, .DashboardDivAdmin:focus {
        user-select: auto;
    }

    .DashboardDiv:hover:not(:disabled), .DashboardDivAdmin:hover:not(:disabled) {
        filter: brightness(1);
        -webkit-filter: brightness(1);
    }

    .DashboardDiv:disabled, .DashboardDivAdmin:disabled {
        cursor: auto;
    }

    .DashboardDiv:hover:not(:disabled), .DashboardDivAdmin:hover:not(:disabled) {
        filter: brightness(1);
        -webkit-filter: brightness(1);
    }

.Description {
}

.Icon-Large {
    width: 100px;
    height: 100px;
}

.Icon-Medium {
    width: 75px;
    height: 75px;
}

.Icon-Small {
    width: 50px;
    height: 50px;
}

.Icon-Smaller {
    width: 25px;
    height: 25px;
}

.Icon-Smallest {
    width: 20px;
    height: 20px;
}

.Logo {
    width: 60px;
    height: 95px;
    margin-left: 5px;
    margin-top: 25px;
}

.Icon-Disabled {
    filter: brightness(80%);
    filter: grayscale(100%);
}

    .Icon-Disabled:hover {
        filter: grayscale(0%);
        filter: brightness(150%);
    }

/*/////////////Resposive*/
.PaymentGatewayBox {
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 10px;
    transition: background-color 0.2s ease;
    text-align: center;
    cursor: pointer;
    width: 100px;
    max-width: 100px;
    min-width: 100px;
}

    .PaymentGatewayBox:hover {
        border-width: 1px;
        border-radius: 10px;
        border-color: #808080;
        background-color: #e1e0e0;
    }

    .PaymentGatewayBox.active {
        background-color: #e1e0e0;
        border: 1px solid #808080;
    }
/*/////////////Logo*/

@media (min-width: 600px) {
    .Logo {
        width: 60px;
        height: 95px;
        margin-left: 5px;
        margin-top: 16px;
    }

    .sidebar {
        width: 200px;
    }

    .DashboardDiv, .DashboardDivAdmin {
        min-width: 315px;
        max-width: 315px;
    }
}

@media (max-width: 600px) {
    .Logo {
        width: 40px;
        height: 55px;
    }

    .DashboardDiv, .DashboardDivAdmin {
        min-width: 98%;
        max-width: 98%;
    }
}

@media (max-width: 400px) {
    .Logo {
        width: 30px;
        height: 45px;
    }
}

@media (max-width: 200px) {
    .Logo {
        width: 20px;
        height: 35px;
    }
}

@media (max-width: 50px) {
    .Logo {
        width: 15px;
        height: 25px;
    }
}
