/*
 * ====================================================================================================================
 * SUPPORT -- css layout
 * ====================================================================================================================
 */

.support-help-text { font-size: 23px; }

.col-support {
    margin-bottom: 2em;
}

.col-support .col-support-block {
    border:  2px solid white;
    padding: 1em;
    height: 175px;
}
@media(max-width: 768px) {
    .col-support .col-support-block { height: 150px; }
}

.col-support-block:hover {
    opacity: 0.9;
    background-color: rgba(128,128,128,0.1);
}

.col-support a {
    display: block;
    color: inherit;
    text-decoration: none !important;
    height: 155px;
}
@media(max-width: 768px) {
    .col-support a { height: 130px; }
}

.col-support b {
    display: block;
    font-size: 22px;
}

.col-support span {
    font-size:  14px;
    letter-spacing: 0px;
    color:  white !important;
}
.col-support span a {
    display: inline;
    font-size:  14px;
    letter-spacing: 0px;
    text-decoration: underline !important;
    color: var(--cw-color-link) !important;
    height: auto;
}
.col-support span a:hover {
    color:  var(--cw-color-link-active) !important;
}

.col-support i.support-icon {
    display: inline-block;
    font-size: 82px;
    float: left;
    margin-right: 15px;
}

.support-purple {
    border-color: BlueViolet !important;
}
.support-purple i.support-icon, .support-purple b {
    color: BlueViolet !important;
}

.support-orange {
    border-color: Orange !important;
}
.support-orange i.support-icon, .support-orange b {
    color: Orange !important;
}

.support-cyan {
    border-color: Cyan !important;
}
.support-cyan i.support-icon, .support-cyan b {
    color: Cyan !important;
}

.support-yellow {
    border-color: Yellow !important;
}
.support-yellow i.support-icon, .support-yellow b {
    color: Yellow !important;
}

.support-pink {
    border-color: DeepPink !important;
}
.support-pink i.support-icon, .support-pink b {
    color: DeepPink !important;
}

h2.support-header2 {
    margin: 0 0 2em 0;
    padding: 0;
    font-size: 32px;
    font-weight: bold;
    color: black;
}
h2.support-header2 span { color:  blueviolet; }

.support-btn a {
    font-size: 18px;
    text-transform: uppercase;
    word-break: break-word;
    white-space: unset;
    text-align: center;
}

.support-red-btn a {
    display: inline-block;
    width:  100%;
    margin:  0 0 1em 0;
    padding: 1em 1em;
    color: red;
    border: 2px solid red;
    border-radius: 0;
    box-shadow: 2px 2px 0 0 red;
}

h2.support-header3 {
    margin: 0 0 2em 0;
    padding: 0;
    font-size: 32px;
    font-weight: bold;
    color: CadetBlue;
}
h2.support-header3 span { color:  Coral; }

.support-blue-btn span {
    display: inline-block;
    font-size: 48px;
    font-weight: bold;
    color: DarkGray;
    vertical-align: middle;
}

.support-blue-btn a {
    margin:  0;
    padding: 1em 1em;
    color: blue;
    border: 2px solid blue;
    border-radius: 0;
    box-shadow: 2px 2px 0 0 blue;
    background-color: black;
}

h2.support-header4 {
    margin: 0 0 2em 0;
    padding: 0;
    font-size: 32px;
    font-weight: bold;
    color: Green;
}