@import url("mainColors.css?v1.200");
@import url("header.css?v1.200");
@import url("gallery.css?v1.200");
@import url("video.css?v1.200");
@import url("blog.css?v1.200");

html{
    background:#f0f0f0;
    background-image: url(img/body_bg.jpg);
    background-size: 500px;
}

body{
    background:#f0f0f0;
    background-image: url(img/body_bg.jpg);
    background-size: 500px;
    display:none;
}
button{
    cursor: pointer;
}
/* Overrides */
.lead{
    font-weight: 350;
}
.dropdown-menu .nav-link{
    white-space: nowrap;

}
/* Main */
#pageContent{
    padding-top: 2.5em;
    min-height: 100%;
}
.container-fluid{
    min-height:100%;
}
.mainPageContent{
    z-index:0;
    padding-top: 3em;
    padding-bottom: 3em;
    background:#ffffff;
    background-image: url(img/page_bg.jpg);
    min-height: 100%!important;
}
.realPageContent{
    min-height: 100%;
}
/* Footer */
.footer{
    background-image: url(img/footer.png);
    background-size: 40em;
    background-repeat: no-repeat;
    height: 10em;
    width: 100%;
    background-position-x: center;
    display: flex;
    align-items: end;
    justify-content: center;
}
.footer .content{
    color: #8c8c8c;
    margin-bottom: 2em;
}
/* Content Base */
.part {
   display: block;
}
.part .videoTitle.over{
    margin-top: 1em;
}
.part .videoTitle.below{
    margin-bottom: 1em;
}
.bottomMargin-1{
    margin-bottom:1em;
}
.bottomMargin-2{
    margin-bottom:2em;
}



/* -------------------------------------------------------------------------------------------------- Menu */
.nav-link.active{
    font-weight:bold;
    color:var(--arx-media-bd-color)!important;
}
.nav-item .dropdown-item.active, .nav-item .dropdown-item:active{
    background-color:#ffffff!important;
    font-weight:bold!important;
    color:var(--arx-media-bd-color)!important;
}

.nav-item ul{
    padding-inline-start:0
}
.nav-item li{
    margin-left: 0.5em;
    list-style: none;
}
.nav-item .subsub.nav-link{
    display: block;
    padding-left: 1.5em;
}



/* Content */
.asTitle{
    color:var(--arx-media-bd-color);
    font-size: 1.5em;
}
.asMainTitle{
    margin-top:1em;
    margin-bottom:2em;

}
.alignCenter{
    text-align:center;
}
.alignRight{
    text-align:right;
}
.italic{
    font-style:italic;
}
.justified{
    text-align: justify;
}
.marginTop{
    margin-top:1em;
}
.marginBottom{
    margin-bottom:1em;
}
.centerBlock{
    margin-left: auto;
    margin-right:auto;
}
.centerCell > div{
    margin-left: auto;
    margin-right: auto;
}
.centered{
    margin-left:auto;
    margin-right:auto;
}

.mainPageContent h1{
    text-align: center;
    border-bottom: 1px solid;
    margin-bottom: 1em;
    padding: 0.5em;
}
.mainPageContent h1 img{
    max-height: 2em;
}
.mainPageContent h2{
    font-size: 1.5em;
    padding-bottom: 0.5em;
    padding-top: 0.5em;
    border-bottom: 1px dotted #808080;
    margin: 0 0 1em 0;
    color: var(--arx-media-bd-color);
}
.mainPageContent h3{
    font-size: 1.2em;
    padding-bottom: 0.5em;
    padding-top: 0.5em;
    margin: 0 0 1em 0;
    color: var(--arx-media-bd-color);
}
/* Layout */
.mainPageContent .fitImage img{
    max-width: 100%;
    height: auto;
    max-height: 100%;
}
.mainPageContent .fitImage-90 img{
    max-width: 90%;
    height: auto;
    text-align: center;
    max-height: 100%;
}
.mainPageContent .fitImage-80 img{
    max-width: 80%;
    height: auto;
    text-align: center;
    max-height: 100%;
}
.mainPageContent .fitImage-70 img{
    max-width: 70%;
    height: auto;
    max-height: 100%;
}

.textPart p{
    margin:0!important
}

.textPart.summary{
    font-size: 1em;
    color: #808080;
}
/* Medias */

.isolatedImageContainer {
    display: inline-flex;
    align-items: flex-start;
}
.isolatedImageContainer img {
    border: 3px solid #ffffff;
    display: block;
    border-radius: 0.5em;
    box-shadow: 0px 0px 22px;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
.isolatedImageContainer.black img {
    border-color:#000000;
}
@media (max-width: 768px) {
    .isolatedImageContainer img {
        margin-bottom:1em;
        max-width: 80%;
    }

}


.imageSubtitle{
    background: #c84300;
    color: #ffffff;
    display: inline-block;
    padding: 0 1em 0.25em 1em;
    border-radius: 0 0 0.25em 0.25em;
    border: 1px solid #9fa2a1;
    position: relative;
    z-index: 0;
}
@media (max-width: 768px) {
    .imageSubtitle{
        position: relative;
        top: -1em;
    }
}
/* News */
.news{
    width: 100%;
    margin-bottom: 1em;
}

.news .newsHeader{
    display: flex;
    align-items: end;
    justify-content: space-between;
    width: 100%;
    border-bottom: 1px solid var(--arx-media-bd-color);
    margin-bottom: 0.25em;
    padding-bottom: 0.25em;
}
.news .newsContent{
    display: flex;
    align-items: start;
    width: 100%;
}
.news .newsContent .imgContainer{
    border-radius: 0em 5em 5em 5em;
    background: var(--arx-media-bd-color);
    padding: 0.25em;
    text-align: right;
}
.news .newsContent img{
    max-height:4em;
    border-radius: 5em;
    border: solid 2px #ffffff;
}

.news .newsHeader h3{
    padding-bottom: 0;
    padding-top: 0;
    margin: 0 0 0 0;
}
.news .newsHeader h3 .category{
    font-size: 0.75em;
    color: #000;
}

.news .link{
    display: flex;
    align-items: start;
    gap: 1em;
    margin-bottom: 0.25em;
}

.news .link .icon, .row.iconLinkContainer .icon{
    font-size: 1em;
    padding: 0.4em;
    /* background: #ffffff; */
    border-radius: 2em;
    color: #c84301;
    text-align: center;
}
.newsLink{
    flex-wrap: nowrap;
}
.notAvailable{
    background: var(--arx-media-bd-color);
    color: #ffffff;
    padding: 0.1em 0.5em 0.25em 0.5em;
    border-radius: 0.5em;
    display: inline-block;
    transform: rotate(349deg);
    font-size: 0.8em;
    margin-right: 0.5em;
}
.row.iconLinkContainer{
    align-items: start;
    margin-bottom: 1em;
}
@media (min-width: 768px) {
    .row.iconLinkContainer{
        margin-bottom: 0;
    }
}
@media (min-width: 768px) {
    .row.iconLinkContainer{
        align-items: center;
    }
}
/* Forms */
label{
    font-weight: bold;
    padding-left: 0.5em;
    font-style: italic;
}
form ::placeholder {
    color: blue;
    font-size: 0.9em;
  }
form button{
    background-color: var(--arx-media-bd-color)!important;
    border-color: var(--arx-media-bd-color)!important;
}
form .form-group button{
    margin-top: 0;
    width: 100%;
}
.validation .error, .contactValidation .error{
    font-style: italic;
    color:#a00000;
}
.status.inForm, .validation.inForm{
    display: block;
}
.status.outForm, .validation.outForm{
    display: none;
}
@media (min-width: 768px) {
    .inFormStatus{
        display: none;
    }
    .status.outForm, .validation.outForm{
        display: block;
    }
    form .form-group button {
        margin-top: 2em;
        width: 100%;
    }
}
.status .error, .contactStatus .error{
    background: #a0000080;
    padding: 1em;
    border-radius: 0 0.5em 0.5em;
    border: 1px solid #a00000;
    font-weight: bold;
}
.status .success, .contactStatus .success{
    background: #00a00080;
    padding: 1em;
    border-radius: 0 0.5em 0.5em;
    border: 1px solid #00a000;
    font-weight: bold;
}
/* languageSelector */
.languageSelector a{
    cursor:pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Links */
.mainPageContent a.txtLink{
    position: relative;
    /* left: -0.5em; */
    /* top: calc(-0.6em/2 - 2px); */
    /* top: calc(0.6em/2 - 3px); */
    top: calc(0.6em/2 + 0px);
    /* display: inline-flex; */
    color: var(--arx-media-a-color);
    font-weight: 350;
    padding: 0.1em 1em 0.25em 2em;
    border-radius: 0.5em;
    /* line-height: 0; */
    margin-bottom: 0.25em;
    border: 1px solid #0085c800;
    border-left: 0 none;
    /* border-width: 3px; */
    /* border-style: solid; */
    background: linear-gradient(90deg, #0085c800 25%, #0085c810);
    cursor: pointer;
}
.mainPageContent a.txtLink:hover{
    text-decoration: none;
    color: var(--arx-media-a-color);
    border: 1px solid #d0d0d0;
    background: #0085c81a;
}
.mainPageContent a.txtLink:before {
    position: absolute;
    content: "\f105";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    left: 0.5em;
    top: 0.2rem;
    /* top: 50%; */
}
.mainPageContent a.txtLink:hover:before{
    content: "\f101";
    left: 0.75em;
}

.bordersContainer{
    z-index: -1;
    opacity: 0;
}
.bordersContainer.ready{
    opacity: 0.8;
    transition: opacity 4s;
}
.bordersContainer.hiddenBorders{
    visibility: hidden;
}
.border-left{
    display:none;
    position: absolute;
    background-image: url(img/border.jpg);
    background-position-x: center;
    width: 25px;
    height: 25px;
    top: 5em;
    left: 30px;
    opacity: 0.5;
}

.inlineButton{
    position: relative;
    /* left: -0.5em; */
    /* top: calc(-0.6em/2 - 2px); */
    /* top: calc(0.6em/2 - 3px); */
    display: inline-flex;
    color: var(--arx-media-a-color)!important;
    font-weight: 350;
    padding: 0.25em;
    border-radius: 0.5em;
    /* line-height: 0; */
    /* margin-bottom: 0.25em; */
    border: 1px solid #0085c800;
    /* border-left: 1px transparent; */
    /* border-width: 3px; */
    /* border-style: solid; */
    background: linear-gradient(90deg, #0085c800 25%, #0085c810);
    cursor: pointer;
}
.inlineButton:hover{
    color: var(--arx-media-a-color);
    border: 1px solid #d0d0d0;
    background: #0085c81a;
}

.orangeBox{
    background: #c84300;
    color: #ffffff;
    padding: 0.5em;
    border-radius: 0.25em;
}
.iframeContainer iframe {
    border-radius: 0.5em;
    /* border: 1px solid #ff8000!important; */
    /* margin:  2px; */
}

.steamIcon {
    font-size: 2em;
}

.isolatedLink{
    margin: 0.5em auto;
    border: 2px solid #1b387d;
    border-radius: 0.5em;
    padding: 0.5em;
    background: #1b387db0;
    color: #ffffff;
}
.isolatedLink a, .isolatedLink a:hover, .isolatedLink a:visited{
    color: #ffffff;
}