.buttonbig {
    background-color: #4CAF50; /*green*/
    border: none;
    color: white;
    padding: 14px 28px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /*safari*/
    transition-duration: 0.4s;
    cursor: pointer;
    font-family: 'Conv_Raleway-Regular';
    font-weight:500;
    border-radius: 6px;
}
.buttonbigBlue {
    background-color: #008CBA; /*blue*/
    border: none;
    color: white;
    padding: 14px 28px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /*safari*/
    transition-duration: 0.4s;
    cursor: pointer;
    font-family: 'Conv_Raleway-Regular';
    font-weight: 500;
    border-radius: 6px;
}

.green_bigger {
    background-color: white;
    color: black;
    border: 2px solid #4CAF50;
}

.green_bigger:hover {
        background-color: #4CAF50;
        color: white;
        box-shadow:0px 8px 16px 0 rgba(0,0,0,0.2) , 0 6px 20px 0 rgba(0,0,0,0.19);

        
    }

.disableGreen {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #4CAF50;
    opacity:0.6;
}

.btnBlue {
    background-color: white;
    border: none;
    color: black;
    padding: 10px 25px;
    text-align: center;
    font-size: 16px;
    margin: 4px 2px;
    transition: 0.3s;
    border-style: solid;
    border-width: 1px;
    border-radius: 15px;
    border-color: #4285f4;
    width: 100px;
    font-family: 'Conv_Raleway-Regular';
}
    .btnBlue:hover {
        background-color: #4285f4;
        color: white;
        /*border-color: white !important;*/
        border-style: solid;
        cursor: pointer;
    }

.blue_bigger {
    background-color: white;
    color: black;
    border: 2px solid lightblue;
}

    .blue_bigger:hover {
        background-color: #008CBA;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.blueReverse_bigger {
    background-color: #008CBA;
    color: white;
    border: 2px solid lightblue;
}

.blueReverse_bigger:hover {
        background-color: white;
        color: black;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.PurpleReverse_bigger {
    background-color: #76448A;
    color: white;
    border: 2px solid #76448A;
}

    .PurpleReverse_bigger:hover {
        background-color: white;
        color: #76448A;
        font-size: 16px;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disableblue {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #008CBA;
    opacity: 0.6;
}


.red_bigger {
    background-color: white;
    color: black;
    border: 2px solid #f44336;
}

    .red_bigger:hover {
        background-color: #f44336;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disablered {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #f44336;
    opacity: 0.6;
}


.gray_bigger {
    background-color: white;
    color: black;
    border: 2px solid #e7e7e7;
}

    .gray_bigger:hover {
        background-color: #e7e7e7;
        color: black;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disablegray {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #e7e7e7;
    opacity: 0.6;
}

.black_bigger {
    background-color: white;
    color: black;
    border: 2px solid #555555;
}

    .black_bigger:hover {
        background-color: #555555;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disableblack {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #555555;
    opacity: 0.6;
}



.buttonsmall {
    background-color: #4CAF50; /*green*/
    border: none;
    color: white;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    margin: 2px 1px;
    -webkit-transition-duration: 0.4s; /*safari*/
    transition-duration: 0.4s;
    cursor: pointer;
    font-family: 'Conv_Raleway-Regular';
    font-weight: 500;
    border-radius: 6px;
}

.green_small {
    background-color: white;
    color: black;
    border: 2px solid #4CAF50;
}

    .green_small:hover {
        background-color: #4CAF50;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disablesmall {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #4CAF50;
    opacity: 0.6;
}



.blue_small {
    background-color: white;
    color: black;
    border: 2px solid #008CBA;
}

    .blue_small:hover {
        background-color: #008CBA;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.blueReverse_small {
    background-color: #008CBA;
    color: White;
    border: 2px solid #008CBA;
}

    .blueReverse_small:hover {
        background-color:white ;
        color: black;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.greenReverse_small {
    background-color: #4CAF50;
    color: White;
    border: 2px solid #4CAF50;
}

    .greenReverse_small:hover {
        background-color: white;
        color: black;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disablesmallblue {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #008CBA;
    opacity: 0.6;
}


.red_small {
    background-color: white;
    color: black;
    border: 2px solid #f44336;
    cursor:pointer;
    border-radius:8px;
}

    .red_small:hover {
        background-color: #f44336;
        color: white;
        /*box-shadow: 0px 2px 4px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);*/
        cursor: pointer;
        border-radius: 8px;
    }

.disablesmallred {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #f44336;
    opacity: 0.6;
}


.gray_small {
    background-color: white;
    color: black;
    border: 2px solid #e7e7e7;
}

    .gray_small:hover {
        background-color: #e7e7e7;
        color: black;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disablesmallgray {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #e7e7e7;
    opacity: 0.6;
}

.black_small {
    background-color: white;
    color: black;
    border: 2px solid #555555;
}

    .black_small:hover {
        background-color: #555555;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.disableblacksmall {
    cursor: not-allowed;
    background-color: white;
    color: black;
    border: 2px solid #555555;
    opacity: 0.6;
}


.redReverse_bigger {
    background-color: #f44336;
    color: white;
    border: 2px solid #f44336;
}

    .redReverse_bigger:hover {
        background-color: white;
        color: black;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }

.greenReverse_bigger {
    background-color: #4CAF50;
    color: white;
    border: 2px solid #4CAF50;
}

    .greenReverse_bigger:hover {
        background-color: white;
        color: black;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    }


.btn_small_SbPurple {
    background-color: white;
    color: black;
    border: 2px solid #76448A;
    cursor: pointer;
    border-radius: 8px;
}

    .btn_small_SbPurple:hover {
        background-color: #76448A;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
        cursor: pointer;
        border-radius: 8px;
    }

.btn_small_Tepl_Orange {
    background-color: white;
    color: black;
    border: 2px solid #ff7043;
    cursor: pointer;
    border-radius: 8px;
}

    .btn_small_Tepl_Orange:hover {
        background-color: #ff7043;
        color: white;
        box-shadow: 0px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
        cursor: pointer;
        border-radius: 8px;
    }