/* #2a303e, 42 :48 :62  (Rahmen, Text)
#e4004d, 228:0  :77  (Pink, dunkel)
#f94884, 249:72 :132 (Pink, mittel)
#ff77a5, 255:119:165 (Pink, hell)
#01689b, 1  :104:155 (Blau, dunkel)
#2996cb, 41 :150:203 (Blau, mittel)
#47aadc, 71 :170:220 (Blau, hell) */
html {
    margin: 0;
    height: 100%;
}

body {
    font-family: Arial, serif;
    padding: 0;
    margin: 0;
    background-image: url("/images/orcs_at_bonfire.webp")  !important;
    background-color: black; /* Used if the image is unavailable */
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}


/*.card {
    border: 4px solid #2a303e;
    box-shadow: 10px 10px 5px lightgray;
}*/

.card-title{
    margin: 1em
}

.btn-primary {
    background-color: #01689b !important;
}

.btn-primary:hover {
    background-color: #47aadc !important;
    color: black !important;
}

/*.bg-dark {
    background-color: #06063b !important;
}*/

.btn-primary > a {
    text-decoration: none;
    color: white;
}

.iframe-container {
            position: relative;
            width: 100%;
            overflow: hidden;
}

.livemap-iframe-container {
            height: 620px; /* Adjust this as needed */

}

.armory-iframe-container {
            height: 720px; /* Adjust this as needed */

}

.db-viewer-iframe-container {
            height: 720px; /* Adjust this as needed */
}

.iframe-container iframe {
    position: absolute;
    width: 125%; /* Adjust based on the zoom level */
    height: 125%; /* Adjust based on the zoom level */
    top: 0%;
    left: 0%;
    transform: scale(0.801); /* Adjust the scale value for the zoom level */
    transform-origin: 0 0;
    border-radius: 1.5em;
}

.container {
    margin-top: 0px;
}

.card{
    margin: 2em;
    border-radius: 1em;
}

.btn-link{
    text-decoration-color: #e4004d !important;
    color: white !important;
}
.btn-primary:active{
    border-style: none !important;
}
.btn-link:hover{
    color: white !important;
}
.show {
    display: block;
}
.hide {
    display: none;
}

.vertical-overflow-container {
    width: auto;
    overflow-x: hidden;
    overflow-y: scroll;
    height: 23em;
}

.responsiveBox {
    resize: none;
    overflow: auto;
    width: 100%;
    height: 23em;
}
.img-tutorial{
    width: 100%;
}
.img-mapping{
    width: 40%;
}

.loader-img{
    position: absolute;
    width: 25%;
    height: auto;
    top: 20%;
    left: 37.5%;
}



.parentbox {
    text-align: center;  /* align the inline(-block) elements horizontally */
    font-size: 0;         /* remove the gap between inline(-block) elements */
}

.parentbox:before {      /* create a full-height inline block pseudo-element */
    content: ' ';
    display: inline-block;
    vertical-align: middle; /* vertical alignment of the inline element */
    height: 100%;
}

.childbox {
    display: inline-block;
    vertical-align: middle;          /* vertical alignment of the inline element */
    font: 16px/1 Arial, sans-serif;  /* reset the font property */

    padding: 5px;
}


.cms-avatar,.cms-avatar-icon-xs,.cms-avatar-icon-small,.cms-avatar-icon-mid,.cms-avatar-icon-big{display:inline-block;border:1px solid;border-color:grey;border-radius:0.24rem;background-repeat:no-repeat;background-size:cover;margin:0px}
.cms-avatar-icon-xs{width:2.6rem;height:2.6rem}