/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.link_underline {
  text-decoration: none !important;
}

.graphical_button_container {
    background: -webkit-linear-gradient(#395989, #284162); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#395989, #284162); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#395989, #284162); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#395989, #284162); /* Standard syntax */
    border-radius: 8px;
    box-shadow: 3px 3px 3px #cccccc;
}

.link_underline:hover>.graphical_button_container {
    background: -webkit-linear-gradient(#808285, #58595b); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#808285, #58595b); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#808285, #58595b); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#808285, #58595b); /* Standard syntax */
}

.graphical_button_content {
    display: flex;
    align-items: center;
    justify-content: center;/*
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;*/
    overflow: hidden;
    height: 100%;
}

.graphical_button_text_container {
    flex-grow: 1;
    flex-shrink: 1;
    color: white;
    padding: 15px;
}

 .graphical_button_text {
    height: 100%;
    font-size: 18px;
    text-align: left;
    padding: 0;
    font-family: Myriad-Pro, Calibri, Arial, sans serif;
 }

.graphical_button_image_container {
    flex-grow: 0;
    flex-shrink: 0;
    padding: 15px;
}

.graphical_button_image_container img{
    padding: 0;
 }

 /* Extra Small Devices, Phones */ 
@media only screen and (max-width : 767px) {
    .graphical_button_container {
        height: 90px;
    }

    .graphical_button_text {
        font-size: calc( (0.02 * 100vw) + 15px);
    }

    .graphical_button_image_container {
        max-width: calc( 0.333 * ( 100vw - 60px ) );
    }

}

/* Small Devices, Tablets */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .graphical_button_container {
        height: 85px;
    }

    .graphical_button_text_container {
        padding: 5px;
    }

    .graphical_button_text {
        font-size: 15px;
    }

    .graphical_button_image_container {
        max-width: 85px;
    }
}
/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) and (max-width: 1199px) {
    .graphical_button_container {
        height: 90px;
    }
    .graphical_button_text {
        font-size: 18px;
    }

    .graphical_button_image_container {
        max-width: 90px;
        padding: 5px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .graphical_button_container {
        height: 100px;
    }

    .graphical_button_text {
        font-size: 22px;
    }

    .graphical_button_image_container {
        max-width: 112px;
    }
}