/*

Theme Name: dt-the7-child
Author: Stephan Dittmann
Author URI: https://www.dessounds.de
Description: DRHV06_Theme ist das Theme des Dessau-Rosslauer HV 06. Es ist ein Child-Theme von dt-the7. Das Parent-Theme darf daher nicht gelöscht oder bearbeitet werden.
Version: 1.1.0

/************************************** GENERAL STUFF */

/* :root {

    --sth-main-color-tupel:			0, 90, 167;
	--sth-main-color-dark-tupel:	0, 63, 144;
    --sth-main-accent-tupel:    	239, 125, 19;

    --sth-main-color:           rgb(0, 90, 167);

    --sth-main-color-dark:      rgb(0, 63, 144);    
    --sth-main-color-middle:    rgb(0, 121, 189);
    --sth-main-color-bright:    rgb(26, 176, 220);

    --sth-accent:               rgb(239, 125, 19);

    --sth-special-color:        rgb(239, 125, 19);
    --sth-negative:             rgb(175, 3, 3);
    --sth-positive:             rgb(75, 163, 16);

    --sth-white:                rgb(255, 255, 255);
    --sth-grey-bright:          rgb(204, 204, 204);
    --sth-grey-dark:            rgb(102, 102, 102);

} */

/* Colors 

DRHV-Dunkelblau #003f90
DRHV-Standartblau #005aa7
DRHV-Mittelblau #0079bd
DRHV-Hellblau #1ab0dc
DRHV-Orange #ef7d13
DRHV-Rot #af0303
DRHV-Grün #4ba310
DRHV-Hellgrau #CCCCCC
DRHV-Hellgrau #666666

*/
/* **************************************** DRHV - Buttons - Styles */

.drhv_infobox {
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    max-width: 100%;
    min-width: 100px;
    min-height: 150px;
    border: 1px solid;
    overflow: hidden;
}

.content .drhv_infobox a {
    position: absolute;
    display: block;
    height: 100%;
    width: 100%;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    z-index: 5;
}

.content .drhv_infobox a:hover {
    background-color: rgba(var(--sth-main-color), 0.4);
    z-index: 5;
}

.drhv_infobox_bg {
    position: absolute;
    width: 100%;
    height: auto;
    opacity: 0.2;
    z-index: 2;
}

.drhv_infobox .drhv_infobox_bg_color {
    position: absolute;
    display: block;
    height: 100%;
    width: 100%;
}

.drhv_infobox .drhv_infobox_content {
    position: relative;
    padding: 20px 20px;
    z-index: 4;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
}

.drhv_infobox .drhv_infobox_content h4 {
    font-size: x-large;
    text-decoration: none;
    font-weight: 700;
    padding: 0 10px;
}

#content .drhv_infobox .drhv_infobox_content p,
.drhv_infobox .drhv_infobox_content p {
    text-align: center;
    line-height: normal;
}

.drhv_infobox .drhv_infobox_content .infobox_button {
    color: var(--sth-white);
    padding: 2px 5px;
    text-transform: uppercase;
}

.drhv_infobox .drhv_infobox_content .infobox_button:hover {
    background-color: var(--sth-accent);
    color: var(--sth-white);
    padding: 2px 5px;
}

/** Special Colors for some Elements */

.drhv_infobox .drhv_infobox_content .infobox_button.drhv-lightgrey-bg,
.drhv_infobox .drhv_infobox_content .infobox_button.drhv-weiss-bg{
    color: var(--sth-black);
}

/** KNE CTA 1 */

.drhv_cta1_sc {
    display: flex;
    flex-flow: column;
    justify-content: space-evenly;
    border: 1px solid;
    padding: 1rem;
    gap: 1rem;
}

.drhv_cta1_sc .drhv_cta1_btn {
    padding: 5px 5px;
    text-transform: uppercase;
    text-align: center;
    font-weight: 600;
    color: var(--sth-black);
}

.drhv_cta1_sc .drhv_cta1_btn:hover {
    background-color: var(--sth-accent);
}

.drhv_cta1_sc .drhv_cta1_btn.drhv-dunkelblau-bg,
.drhv_cta1_sc .drhv_cta1_btn.drhv-standardblau-bg,
.drhv_cta1_sc .drhv_cta1_btn.drhv-darkgrey-bg,
.drhv_cta1_sc .drhv_cta1_btn.drhv-schwarz-bg {
    color: var(--sth-white);
}

#content .drhv_cta1_sc a,
.drhv_cta1_sc a {
    display: block;
    margin: 1rem;
    text-decoration: none;
}

#content .drhv_cta1_sc a:hover,
.drhv_cta1_sc a:hover {
    color: var(--sth-accent);
}

#content .drhv_cta1_sc p,
.drhv_cta1_sc p {
    line-height: normal;
    font-weight: 500;
    text-align: center;
    font-size: smaller;
    margin: 0;
}

/** DRHV CTA 2 */

.drhv_cta2_sc {
    position: relative;
    min-width: 200px;
    border: 1px solid;
    overflow: hidden;
    /* height: 100%; */
}

.drhv_cta2_sc .drhv_cta2_content a {
    display: flex;
    position: relative;
    z-index: 2;
}

.drhv_cta2_sc .drhv_cta2_content a:hover {
    background-color: rgba(var(--sth-main-color-tupel), .4);
}

.drhv_cta2_sc h4 {
    /* font-size: xx-large; */
    /* line-height: 2.1rem; */
    position: relative;
    padding: 1rem;
    margin: 0;
    text-align: center;
}

.drhv_cta2_sc .drhv_cta2_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.2;
    z-index: 2;
}

.drhv_cta2_sc .drhv_cta2_bg_color {
    position: absolute;
    display: block;
    height: 100%;
    width: 100%;
}

.drhv_cta2_sc .drhv_cta2_icon {
    text-align: center;
    font-size: x-large;
}

.drhv_cta2_sc .drhv_button {
    display: block;
    position: relative;
    padding: 2px 4px;
    align-self: flex-end;
    font-weight: 400;
    font-size: small;
}

#content .drhv_cta2_sc p,
.drhv_cta2_sc p {
    line-height: normal;
    font-weight: 500;
    text-align: center;
    font-size: small;
    margin: 0;
}

#content .drhv_cta2_sc a,
.drhv_cta2_sc a {
    position: relative;
    display: flex;
    flex-flow: column nowrap;
    text-decoration: none;
    justify-content: stretch;
    padding: 1rem;
}

/** CTA Container */

#content .drhv_cta_container_shortcode{

}

#content .drhv_cta_container_shortcode .cta-container-inner{
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    width: 100%;
    flex-flow: row wrap;
    gap: 1rem;
}

#content .drhv_cta_container_shortcode .cta-container-item{
    flex: 1 1 200px;
    /* height: auto; */
    display: grid;
    /* margin: 0; */
    /* padding: 0; */
}

#content .drhv_cta_container_shortcode .cta2-container-item > div{
    /* height: 100%; */
    /* max-height: 300px; */
}

