/*CSS SETINGS RESET*/
* {
    margin: 0;
    padding: 0;
}

body {
    font-weight: 400;
    font-family: "Times New Roman", serif;
    /*background-color:#CC0000;*/
}
/*REMOVING HYPERLINKS UNDERLINE*/
a {
    text-decoration: none;
}

.container {
    display: flex;
    flex-direction: column;
    max-width: 1200px;
    margin: 0 auto;
}

.logoContainer {
    font-size: 1.5em;
    font-family: 'Courier New', monospace;
    font-weight: bold;
    float:left;
    list-style-type: none;
    border: 1px solid white;
    border-radius: 0.4em;
    padding: 0.2em;
}

.logoContainer:hover {
    border: 1px solid #CC0000;
}

.logoRR {
    background-color:#CC0000;
    color: white;
    font-size: 1.2em;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    float:left;
    border-width: 0.1em;
    border-radius: 0.4em;
    padding-left: 0.3em;
    padding-right: 0.3em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    margin-left: 0.1em;
    text-shadow: -1px -1px 0 white, 1px -1px 0 white, 1px 1px 0 white, 1px 1px 0 white, -2px -2px 0 #CC0000, 2px -2px 0 #CC0000, 2px 2px 0 #CC0000, 2px 2px 0 #CC0000;

}

.logoRR2 {
    color: #CC0000;
    font-size: 1.2em;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    float: left;
    margin-left: 0.1em;
    letter-spacing: 0.8em;
    #letter-spacing: 1em;
    line-height: 1em;
    text-shadow: -1px -1px 0 white, 1px -1px 0 white, 1px 1px 0 white, 1px 1px 0 white, -2px -2px 0 #CC0000, 2px -2px 0 #CC0000, 2px 2px 0 #CC0000, 2px 2px 0 #CC0000;
    #word-spacing: 0.1em
}

.logo {
    color:#CC0000;
    font-size: 1.3em;
    letter-spacing: .1em;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
}

/********************************************/
/*********MULTIMEDIA SECTION ****************/
.Center_multimedia_Source {
    text-align: center;
}
.Left_multimedia_Source {
    text-align: left;
    margin: 1.5em;
}


.maxGallerySize{
    max-width: 1160px;
}

.gallery {
    max-width: 1160px;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
}

.img [src$=" "]{
    display: none;
}


.gallery img {
    height: 150px;
    border-radius: 0.5em;
    #width: 500px;
    display: inline-block;
    max-width: 100%;
    object-fit: contain;
    position: relative;
}

.gallery img:hover {
    filter: brightness(60%);
}

.gallery img.full {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0; z-index: 999;
    width: 100vw; height: 100vh;
    object-fit: fit;
    opacity: 100%;
    background: rgba(0, 0, 0, 0.7);
}
.gallery img.full:hover {
    z-index: 999;
    transform: none;
    filter: brightness(100%);
    border-radius: 0px;
}

iframe {
    border-radius: 0.5em;
}

.video-class {
    border: 1px solid #9da4ab;
    border-radius: 1em;
    /*margin-bottom: 2em;*/
}

.videoGallery {
    max-width: 1160px;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    place-items: center;
}

.videoDivIndividual{
    margin: 10px;
    float:left;
    width:45%;
}

@media screen and (max-width: 900px) {
    .videoDivIndividual {
        width: 100%;
    }
}

video {
    max-width: 320px;
    max-height: 224px;
    border-radius: 0.5em;
}

@media screen and (min-width: 950px) {
    video {
        max-width: 600px;
        max-height: 240px;
    }
}

[hidden] {
    display: none;
}

video[src=""]{
    display: none;
}

video[src='']{
    display: none;
}

.video [src$=' ']{
    display: none;
}


video[src*='.webm'] {
    display: inline;
}

.galleryVideo {
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
}

.galleryVideo video {
    height: 150px;
    border-radius: 0.5em;
    object-fit: contain;
    position: relative;
}

.videoReplacment {

}

.Article {
    text-align: justify;
    text-justify: inter-word;
    border: 1px solid #9da4ab;
    margin-top: 0.7em;
    border-radius: 1em;
    padding-left:0.7em;
    padding-right: 1em;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.Article-header {
    margin: 1em;
    text-align: left;
    letter-spacing: 0.09em;
}

.Article-header-title {
    margin-top: 1em;
    margin-left: 0.5em;
    margin-bottom: 1em;
    text-align: left;
    font-size: 3em;
}

.Article-details {
    color: #9da4ab;
    font-size: 0.9em;
    padding-left:0.9em;
    margin: 1em;
}

.Article-details-author-name{
    color:black;
    font-style: oblique;
    font-size: 1.1em;
    margin: 1em;
}

.PreRetti {
    text-align: justify;
    text-justify: inter-word;
    border: 1px solid #9da4ab;
    margin-top: 0.7em;
    border-radius: 1em;
    padding-left:0.7em;
    padding-right: 1em;
    word-wrap: break-word;
    font-family: "Times New Roman", serif;
    text-indent: 1em;

}

pre {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
    font-family: "Times New Roman", serif;
    text-align: justify;
    text-justify: inter-word;
    text-indent: 2em;
    margin-top: 0.7em;
    line-height: 1.5;
    margin-left: 1em;
    margin-right: 1em;
}

.links-section {
    color: #939ba3;
    font-size: 0.8em;
    padding-left:0.9em;
    font-family: 'Courier New', monospace;
    margin: 1em;
}

.myspan {
    color: #CC0000;
}

.media-section-red {
    color: #CC0000;
    font-size: 1.3em;
    font-family: 'Courier New', monospace;
    padding-right: 1em;
    margin-left: 0.8em;
    margin-bottom: 0.8em;
}

.media-section-blue {
    color: #007cff;
    font-size: 1.3em;
    font-family: 'Courier New', monospace;
    padding-right: 1em;
    margin-left: 0.8em;
    margin-bottom: 0.8em;
    margin-top: 1em;
}

.Article-link {
    color: #007cff;
    #font-size: 0.8em;
    font-family: 'Courier New', monospace;
    padding-right: 1em;
    font-size: 1.1em;
}

.Article-link:visited {
    color: #CC0000;
    font-family: 'Courier New', monospace;
    #font-size: 0.8em;
    font-size: 1.1em;
    padding-right: 1em;
}
.Article-link:hover {
    color: #CC0000;
    font-weight: bold;
    #font-size: 0.8em;
    font-size: 1.1em;
    font-family: 'Courier New', monospace;
    padding-right: 1em;
}

.menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 0.7em;
    margin-bottom: 0.7em;
    text-decoration: none;
    list-style-type: none;
}

.menu-item {
    width: 100%;
    padding: 16px;
    #border-bottom: 1px  #FFD700 solid;
    #border-bottom: 1px  #CC0000 solid;
    #color: #007cff;
    text-align: center;
    display: none;
    text-decoration: none;
    font-size: 1em;
    color: #CC0000;
    font-family: Helvetica, Arial, sans-serif;
    letter-spacing: .1em;
    font-weight: bold;
}

.expanded > .menu-item{
    display: block;
    list-style-type: none;
    font-size: 1em;
    font-family: Helvetica, Arial, sans-serif;
    letter-spacing: .1em;
    text-decoration: none;
}

.menu-item > a {
    #color: #CC0000;
    color: #007cff;
}

.menu-item > a:hover {
    #background-color:#CC0000;
    color: white;
    border-radius: 0.3em;
    padding: 0.5em;
    border-width: 0.7em;
    background-color: #007cff;
}

.menu-toggle > a {
    background-color:#CC0000;
    color: white;
    font-size: 1.3em;
    padding-left: 0.3em;
    padding-right: 0.3em;
    padding-top: 1.2em;
    padding-bottom: 1.2em;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    border-radius: 0.3em;
    border-color: #CC0000;
    border-width: 0.5em;
    list-style-type: none;
    text-decoration: none;
    letter-spacing: .1em;
    margin-left: 0.1em;
    float: right;
}
.menu-toggle > a:hover {
    background-color:white;
    color: #CC0000;
    list-style-type: none;
    text-decoration: none;
}

.page-head-listing {
    color: white;
    font-family: Helvetica, Arial, sans-serif;
    letter-spacing: .3em;
    font-weight: bold;
    text-align: center;
    font-size: 1.4em;
}

.page-list-description {
    color: white;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    text-align: center;
    font-weight: bold;
    margin-top: 0.9em;
    letter-spacing: .1em;
    line-height: 0.8em;
}

.page-list-description-special {
    #color: #CC0000;
    color: #FFD700;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    text-align: center;
    #font-weight: bold;
    margin-top: 0.9em;
    letter-spacing: .1em;
    line-height: 1.5;
    text-shadow: -1px -1px 0 white, 1px -1px 0 white, 1px 1px 0 white, 1px 1px 0 white, -2px -2px 0 white, 2px -2px 0 white, 2px 2px 0 white, 2px 2px 0 white;
}

.page-head-listing-background {
    background-color:#CC0000;
    border-radius: 0.3em;
    padding: 0.5em;
    border-width: 0.7em;
    margin: 0.7em 0;
}

.page-head-listing-background-no-color {
    #background-color:#CC0000;
    border-radius: 0.3em;
    padding: 0.5em;
    border-width: 0.7em;
    margin: 0.7em 0;
}


.PageList-border {
    margin: auto;
    list-style: none;
}


.PageList-border > li {
    #width: 100%;
    padding: 16px;
    border-bottom: 1px  #9da4ab solid;
    text-align: center;
    text-decoration: none;
    font-size: 1.3em;
    color: #CC0000;
    font-family: Helvetica, Arial, sans-serif;
    letter-spacing: .1em;
    font-weight: bold;
}


.PageList-border > li > a {
    color: #CC0000;
}

.PageList-border > li > a:hover {
    background-color:#CC0000;
    color: white;
    border-radius: 0.3em;
    padding: 0.5em;
    border-width: 0.7em;
}

.pageListingPageDescription{
    color: #007cff;
    #color: #9da4ab;
    font-weight: normal;
    font-size: 0.8em;
    margin-top: 1em;
    #font-family: 'Courier New', monospace;
}


.list-border {
    margin: auto;
    list-style: none;
}
.list-border > li {
    font-size: 1.2rem;
    border: 1px #6d6d6d solid;
    padding: 16px;
    text-align: center;
}

.in-Article-red-bar-pictures-and-video-separator {
    color: white;
    font-family: Helvetica, Arial, sans-serif;
    letter-spacing: .3em;
    font-weight: bold;
    text-align: center;
    font-size: 1em;
}

.article-list-item {
    margin-bottom: 16px;
    display: flex;
    border: 1px solid #9da4ab;
    border-radius: 1em;
}

.article-list {
    list-style-type: none;
}

.term-of-use{
    #margin-left: 3em;
    #margin-right: 3em;
    margin: 4em;
}

.article-listing-container {
    margin-top: 0.7em;
    border-radius: 1em;
    padding-left:0.7em;
    padding-right: 1em;
    word-wrap: break-word;
    overflow-wrap: break-word;
    #word-break: break-all;
    text-align: justify;
    text-justify: inter-word;
    margin-bottom: 0.7em;
}

.article-listing-item-content > * {
    margin: 8px 0;
}

.article-list-item-title {
    font-size: 1.6rem;
    margin-left: 0.8em;
}

.Read-More {
    color: #007cff;
    font-size: 1.3em;
    font-family: 'Courier New', monospace;
    padding-right: 1em;
    margin-left: 0.8em;
    margin-bottom: 0.8em;

}

.Read-More:visited {
    color: #CC0000;
    font-family: 'Courier New', monospace;
    font-size: 1.3em;
    padding-right: 1em;
    margin-left: 0.8em;
    margin-bottom: 0.8em;
}
.Read-More:hover {
    color: #CC0000;
    font-weight: bold;
    font-size: 1.3em;
    font-family: 'Courier New', monospace;
    padding-right: 1em;
    margin-left: 0.8em;
    margin-bottom: 0.8em;
}

.user-page-head-listing-background {
    background-color:#007cff;
    border-radius: 0.3em;
    padding: 0.5em;
    border-width: 0.7em;
    margin: 0.7em 0;
    color: #007cff;
    text-decoration: none;
    border-color: #007cff;
}


.Article-heading-page-listing {
    text-align: center;
    margin: 16px 0;
    font-size: 2em;
    color: black;
    letter-spacing: .3em;
    font-weight: bold;
    border: 1px solid #9da4ab;
    border-radius: 0.4em;
    padding: 0.6em;
}

.Article-heading-page-listing-blue {
    text-align: center;
    margin: 16px 0;
    font-size: 2em;
    font-weight: bold;
    color: #007cff;
    text-shadow: -1px -1px 0 white, 1px -1px 0 white, 1px 1px 0 white, 1px 1px 0 white, -2px -2px 0 #CC0000, 2px -2px 0 #CC0000, 2px 2px 0 #CC0000, 2px 2px 0 #CC0000;
    letter-spacing: .3em;
    font-weight: bold;
    border: 1px solid #007cff;
    background: #e5efff;
    border-radius: 0.4em;
    padding: 0.6em;
}

.Article-heading-page-listing-blue-small-letters {
    text-align: center;
    margin: 16px 0;
    font-size: 1em;
    font-weight: bold;
    color: #007cff;
    text-shadow: -1px -1px 0 white, 1px -1px 0 white, 1px 1px 0 white, 1px 1px 0 white, -2px -2px 0 #CC0000, 2px -2px 0 #CC0000, 2px 2px 0 #CC0000, 2px 2px 0 #CC0000;
    letter-spacing: .3em;
    #font-weight: bold;
    border: 1px solid #007cff;
    background: #e5efff;
    border-radius: 0.4em;
    padding: 0.6em;
}



.user-page-description {
    border: 1px solid #9da4ab;
    border-radius: 0.4em;
    padding: 0.6em;
    font-family: 'Courier New', monospace;
    background: #e7e7e7;
    font-size: 1.2em;
    text-align: center;
    margin: 16px 0;
    line-height: 1.8;
    text-wrap: auto;
}


.user-page-description_backup_grey {
    border: 1px solid #9da4ab;
    border-radius: 0.4em;
    padding: 0.6em;
    font-family: 'Courier New', monospace;
    background: #e7e7e7;
    font-size: 1.2em;
    text-align: center;
    margin: 16px 0;
    line-height: 1.8;
    color: black;
    text-wrap: auto;
}


.list-heading,
.list-description {
    border: 1px solid #9da4ab;
    border-radius: 0.4em;
    padding: 0.6em;
    font-family: 'Courier New', monospace;
    background: #e7e7e7;
    font-size: 1.2em;
    text-align: center;
    margin: 16px 0;
    line-height: 1.8;
    color: black;
    text-wrap: auto;
}


.hyperlink_and_description > *{
    display: flex;
    flex-direction: column;
    font-size: 1em;
    margin: 16px;
    border-radius: 0.3em;
    font-family: 'Courier New', monospace;
}

.hyperlink_to_website {
    border: 1px solid #9da4ab;
    border-radius: 0.4em;
    font-size: 1em;
    margin-top: 0px;
    padding: 0.6em;
    font-family: 'Courier New', monospace;
}

.urlDescription {
    border: 1px solid #9da4ab;
    border-radius: 0.4em;
    font-size: 1em;
    margin-top: 0px;
    padding: 0.6em;
    font-family: 'Courier New', monospace;
    background: #e7e7e7;
}

.a{
    text-decoration: none;
}

.register-red-retti {
    background-color:#CC0000;
    color: white;
    font-size: 1.4em;
    font-family: 'Courier New', monospace;
    font-weight: bold;
    border-radius: 0.3em;
    border-style: solid;
    border-color: #CC0000;
    border-width: 0.01em;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
}


.registration-form {
    display: flex;
    flex-direction: column;
    border: 1px solid #9da4ab;
    justify-content: center;
    margin: 50px auto;
    max-width: 800px;
    border-radius: 0.4em;
}

.registration-form > * {
    font-size: 1em;
    margin: 16px;
    border-radius: 0.3em;
}

.registration-form > input, .registration-form > button {
    padding: 0.8em;
}

.create-account-button {
    background-color:#CC0000;
    color: white;
    font-size: 1.2em;
    font-family: 'Courier New', monospace;
    font-weight: bold;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
    border-radius: 0.4em;
    border-style: solid;
    border-color: #CC0000;
    border-width: 0.01em;
}

.create-account-button:hover {
    color: #CC0000;
    background-color:white;
}

.password{
    color: #9da4ab;
    font-size: 0.7em;
    font-family: 'Courier New', monospace;
    text-align: left;
    padding-top: 0.0em;
    padding-bottom: 0.0em;
}

.password_ul{
    margin-top: -0.3em;
    margin-bottom: -0.3em;
}

.you_dont_have_account{
    text-align: center;
}

.login_hyperlinks{
    color: #CC0000;
}

.login_hyperlinks:hover{
    color: #CC0000;
    font-weight: bold;
}

.password_reset_create_account {
    margin-left: 3em;
    margin-right: 3em;
    object-position: center;
}

.registration-link {
    text-align: center;
    margin-top: 32px;
}

.wrong-username-or-password-rectangle {
    background-color:#CC0000;
    font-size: 1.2em;
    font-family: 'Courier New', monospace;
    font-weight: bold;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
    border-radius: 0.4em;
    border-style: solid;
    border-color: #CC0000;
    border-width: 0.01em;
}

.wrong-user-name-or-password {
    color: #CC0000;
    text-align: center;
    font-weight: bold;
    font-family: 'Courier New', monospace;
    font-size: 1.2em;
}

.container-add-article-page{
    display: flex;
    flex-direction: column;
    max-width: 700px;
    margin: 0 auto;
    clear: page;
}

.list-admin-panel {
    list-style-type: none;
    margin-top: 1em;
}

.add-article-page-button-red {
    background-color:#CC0000;
    color: white;
    font-size: 1.4em;
    font-weight: bold;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
    border-radius: 0.4em;
    border-style: solid;
    border-color: #CC0000;
    border-width: 0.01em;
    max-width: 50em;
    letter-spacing: 0.5em;
    display: block;
    list-style-type: none;
    font-family: 'Courier New', monospace;
    margin-bottom: 1em;
}



.add-article-page-button-red:hover {
    color: #CC0000;
    background-color:white;
    text-decoration: none;
}

.add-article-page-button-blue {
    background-color:#007cff;
    color: white;
    font-size: 1.4em;
    font-weight: bold;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
    border-radius: 0.4em;
    border-style: solid;
    border-color: #007cff;
    border-width: 0.01em;
    max-width: 50em;
    letter-spacing: 0.5em;
    display: block;
    list-style-type: none;
    font-family: 'Courier New', monospace;
    margin-bottom: 1em;
}

.add-article-page-button-blue:hover {
    color: #007cff;
    background-color:white;
    text-decoration: none;
    border-color: #007cff;
}


.main-add-article-container {
    flex: 1;
    border: 1px solid #9da4ab;
    justify-content: center;
    border-radius: 0.4em;
}

.add-article-form {
    display: flex;
    flex-direction: column;
    margin: 0 1em;
    font-family: 'Courier New', monospace;

}

.add-article-form > input, .add-article-form > textarea, .add-article-form > select {
    border-radius: 0.3em;
    resize: none;
    font-family: 'Courier New', monospace;
    padding: 0.6em;
    font-size: 1.1em;
    margin: 16px;

}


.add-article-form > * {
    margin-top: 1em;
}

.promoted {
    width: 4em;
    height: 4em;
}

.checkboxCenter{
    text-align: center;
}

.promotedTextLabel {
    color: white;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    text-align: center;
    font-weight: bold;
    margin-top: 0.9em;
    letter-spacing: .1em;
    line-height: 1.5;
}

.AddArticleLabels{
    font-family: 'Courier New', monospace;
    font-size: 1.1em;
}

.selectPage{
    border-radius: 0.3em;
    resize: vertical;
    font-family: 'Courier New', monospace;
    padding: 0.6em;
    font-size: 1.1em;
    margin: 16px;
}

.selectFileButton {
    background-color: #007cff;
    color: white;
    padding: 0.5rem;
    font-family: 'Courier New', monospace;
    border-radius: 0.3rem;
    cursor: pointer;
    margin-top: 1rem;
}

input {
    margin-top: 1rem;
}

input::file-selector-button {
    font-weight: bold;
    color: dodgerblue;
    padding: 0.5em;
    border: thin solid grey;
    border-radius: 3px;
}

.footer {
    padding: 8px;
    text-align: center;
}

.article-summary {
    display: flex;
    margin-top: 16px;
}

.article-summary-cover {
    object-fit: contain;
    max-width: 200px;
}

.article-summary-info {
    margin-left: 16px;
}

.article-summary-original-title {
    color: #9e9e9e;
    margin-bottom: 16px;
}

.article-summary-item {
    margin: 8px 0;
}

.article-summary-title {
    font-size: 2rem;
}

.article-rating-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    min-width: 200px;
}

.article-rating-form > p {
    text-align: center;
    margin-bottom: 16px;
}

.article-rating-value {
    font-size: 4rem;
    text-align: center;
}

.article-rating-button {
    background-color: #ffc107;
    border: 0;
    padding: 4px;
    font-size: 1.6rem;
    border-radius: 4px;
    opacity: 0.8;
}

.article-rating-button:hover {
    opacity: 1;
}

.article-rating-container > * {
    margin: 8px 0;
}

.article-section {
    margin-top: 16px;
    padding: 16px;
    border: 1px #6d6d6d solid;
}

.article-section-heading {
    margin-bottom: 8px;
}

.article-trailer {
    display: block;
    margin: auto;
}

.error-container {
    margin: 32px auto;
}
.error-container > * {
    display: block;
    text-align: center;
}
.error-header,
.error-icon {
    font-size: 2rem;
    margin: 16px 0;
}

textarea {
    font-family: inherit;
}

.registration-link {
    text-align: center;
    margin-top: 32px;
}
