                            /* //////////////////////////////GENERAL PROPERTIES ???????????? */
@font-face {
    font-family: 'Raleway';
    src: url('../fonts/Raleway-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Inter' ;
    src: url('../fonts/Inter-VariableFont.ttf') format('truetype');
}

h1, h2{
    font-family: Raleway, Cambria, Cochin, Georgia, Times, 'Times New Roman', Inter, serif;
}
a{
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', Inter, serif;
}
.link_logo_h_img, .link_logo_f_img{
    width: 200px;
}

button{
    cursor: pointer;
}
a:link, a:visited{
    color: black;
    text-decoration: none;
}
.remarks, .remarks:link, .remarks:visited{
    color: #2ebaae;
    font-weight: bold;
    cursor: default;
}
.remarks:hover,
.remarks:focus{
    text-decoration: underline;
    cursor: pointer;
}

.light_remarks, .light_remarks:link, .light_remarks:visited{
    color: #2ebaae;
    cursor: default;
    text-decoration-thickness: 0;
    transition: text-decoration-thickness 0.3s;
}
.light_remarks:hover,
.light_remarks:focus{
    text-decoration: underline;
    text-decoration-thickness: 3px;
    cursor: pointer;
}

.sh_login_logo{
    width: 250px;
}

input:focus {
    outline-color: #2ebaaedb;
    outline-width: thin;
    outline-style: solid;
} 
.container{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0;
}

#header a{
    text-decoration: none;
    text-transform: uppercase;

}
.navigation a{
    font-family: Raleway, Inter, Cambria;
}

.logo_container{
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#likes-count {
    margin: 2em 2em 0 0;
    display: flex;
    flex-direction: row;
    justify-content: end;
  }
.add_favourite_container{
    display: flex;
    flex-direction: row;
    justify-content: end;
    border-top: 1px solid rgba(128, 128, 128, 0.251);
}

.flag_button_container {
    display: flex;
    flex-direction: row;
    justify-content: end;
}
.add_favourite_container>div, .flag_button_container>div{
    margin: 1em;
}
.add_favourite_container button, .flag_button_container button{
    background: none; 
    border: none;      
    padding: 0;       
    cursor: pointer;
}
.add_favourite_container button:hover img, .flag_button_container button:hover{
    opacity: 0.7;
}
.add_favourite_container img, .flag_button_container img, .comment_guideline_container img{
    height: 30px;
    width: 30px;
    filter: invert(66%) sepia(21%) saturate(671%) hue-rotate(105deg) brightness(80%) contrast(95%);
    transition: filter 0.3s ease;
}
/* Responsiveness of all articles img */

.article_body .image {
    max-width: 100%;
    margin: 0;
    overflow: hidden;
  }
  
.article_body  img {
    min-width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: cover;
  }
  
.hidden_comment, .notice {
    font-style: italic;
    color: #888;
    margin: 0;
}

.publication_list_item_img_container {
    position: relative;
}
.tag {
  position: absolute;
  bottom: 10px;
  left: 30px;
  background-color: #2ebaae;
  color: white;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: bold;
  border-radius: 4px;
  text-transform: uppercase;
}

.hidden {
    display: none;
}

.show_comment_button {
    background-color: azure;
    border-radius: 12px;
    border: 1px solid #7aa7c7;
    box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system,system-ui,"Segoe UI","Liberation Sans",sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.15385;
    margin: 0;
    outline: none;
    padding: 8px .8em;
    position: relative;
    text-align: center;
    text-decoration: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: baseline;
    white-space: nowrap;
}
.show_comment_button:hover, 
.show_comment_button:focus{
    background-color: #a78edd;
    color: #2c5777;
    transition: ease-out 0.5s;
}

.error-image {
    max-width: 100%;
    height: auto;
    margin: 20px auto;
    display: block;
}
.feedback_sent_container{
    margin: 1em;
}
.remarks_grey{
    color: #888;
}


@media screen and (max-width: 767px) {
     /* ////////////////////////////////////// PARTIALS /////////////// */

    /*////////////////////////////////////// Author_card ////////////// */
        .author_publication_list {
            width: 100%;
        }
        
        .author_card {
            display: flex;
        }
        
        .author_card_profile_picture {
            min-width: 70px;
            max-width: 70px;
            min-height: 70px;
            max-height: 70px;
            border-radius: 100%;
        }
        
        .author_image {
            margin: 0 0.5em;
        }
        
        .author_content {
            margin: 0 0.5em;
        }
        
        .author_publication_list_item {
            width: 100%;
            min-height: 400px;
        }
        
        .author_publication_list_item img {
            width: 100%;
            height: auto;
            object-fit: cover;
        }
  /* //////////////////////////////// MAIN /////////////////////// */
        .logo_container{
            background-color: #ffffff;
            border-bottom:1px solid rgba(128, 128, 128, 0.251);
        }

        .navigation{
            width: 100%;
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            flex: 1;
            margin: 0 auto;
            font-weight: 400;
            color: #959595;
            background-color: #ffffff;
            position: sticky;
            top: 0px;
        }
        
        .navigation ul{
            overflow: hidden;
            list-style-type: none;
            align-content: space-evenly;
            transition: max-height 0.5s ease-out;
        }
        .navigation li{
            margin: 0 0 0.5em 0;
            padding: 0.5em 0 0.5em 0;
        }
        .navbar_container a{
            color: #2ebaae;
        }
        .navbar_container > ul{
            max-height: 0px;
        }
        .menu_icon{
            margin: auto;
            display: flex;
            background-color: #959595;
            width: 100%;
        }
        .navigation input[type=checkbox]{
            display: none;
        }
        
        .navigation input[type=checkbox]:checked + ul{
            max-height: 500px;
            flex-flow: column wrap;
        }
        .navigation label{
            display: inline-block;
            background-image: url("../icons/menu.png");
            background-position: center;
            background-size: cover;
            height: 50px;
            width: 50px;
            margin: 0.2em auto 0.2em auto;
            border-radius: 10px;
            text-align: center;
            background-color: #d4dbccf7;
        }
        .navigation label img{
            border-radius: 7px;
            background-color: #f4f4f4;
        }
        .navbar_container{
            flex: 1;
            width: 100%;
        }
        #account ul{
            list-style-type: none;
            display: flex;
            align-items: center;
            margin: 5px;
        }
        /* #account li{
            padding-left: 1em;
        } */
        
        #account > p{
            background-color: azure;
            border-radius: 12px;
            border: 1px outset #2ebaae;
            box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
            box-sizing: border-box;
            cursor: pointer;
            display: inline-block;
            /* font-family: -apple-system,system-ui,"Segoe UI","Liberation Sans",sans-serif; */
            font-size: 13px;
            font-weight: 400;
            line-height: 1.15385;
            /* margin: 0; */
            outline: none;
            padding: 8px .8em;
            position: relative;
            text-align: center;
            text-decoration: none;
            user-select: none;
            -webkit-user-select: none;
            touch-action: manipulation;
            vertical-align: baseline;
            white-space: nowrap;
        }
        #account > p:hover{
            background-color: rgb(46, 186, 174, 0.1);
        }
        .login_link{ 
            padding: 1em;
        }
        .login_link:hover{
        border-radius: 9px;
        /* background-color: rgb(46, 186, 174, 0.1); */
        }
        .logout_link{
            padding: 1em;
            color: #1d2b1e;
        }
        .logout_link:hover{
        border-radius: 9px;
        background-color: rgb(46, 186, 174, 0.1);
        }
        
        #account img{
            border: 2px solid transparent;
            border-radius: 50%;
            background: 
            linear-gradient(to right, white, white), 
            linear-gradient(to bottom right, #2ebaae , #0414fc); 
            background-clip: padding-box, border-box;
            background-origin: padding-box, border-box;
        }
        
        body{
            background-color: #f4f4f4;
            margin: 0;
        }
        
        main{
            flex: 1;
        }
                                            /* main index */
        
        #index{
            display: flex;
            flex-direction: column;
        
        }
        #section{
            display: flex;
            flex-direction: column;
            background-color: #ffffff;
            margin: 0 0 2em 0;
        }
        section{
            width: 100%;
        }
        
        #cover_section article{
            margin-top: 1em;
            width: 100%;
            min-height: 400px;
        }
        
        .cover_container a{
            display: flex;
            flex-direction: column;
        }
        
        .details_container {
            flex: 1;
            text-align: center;
        }
        
        .image_container{
            width: 100%;
            overflow: hidden;
        }
        
        .image_container img{
            width: 100%;
            height: auto;
            object-fit: cover;
        }
        
        .article_container{
            width: 300px;
        }
        
        .article_container h1{
            margin: 0;
        }
        
        .post_container{
            width: 100%;
            height: 400px;
            overflow: hidden;
        }
        .post_container img{
            width: 320px;
            height: auto;
            object-fit: cover;
        }
        .post_container h2{
            margin: 0;
        }
        
        #main_publications_create{
            margin-top: 3em;
        }
        
        #main_publication_preview{
            margin-top: 3em;
        }
        
        #main_section{
            display: flex;
            justify-content: space-evenly;
            flex-wrap: wrap;
            margin-top: 2em;
        }
        .article_container{
            padding: 10px;
        }
        .article_container:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        #secondary_section{
            margin-top: 2em;
            display: flex;
            justify-content: space-evenly;
            flex-wrap: wrap;
        }
        
        #secondary_section article{
            display: inline-block;
        }
        
        #aside{
            width: 100%;
            margin: 0 0 3em 0;
        }
        .aside_update{
            background-color: #ffffff;
        }
        .aside_trending{
            background-color: #ffffff;
        }
        .updated_list_wrap{
            display: flex;
            flex-direction: column;
            margin-bottom: 1em;
        }
        
        .empty_updated_list{
            text-align: center;
        }
        .updated_list_item{
            display: flex;
            margin: 0em 0em 1em 0em;
            flex: 1;
        }
        aside h1{
            font-size: 19px;
        }
        aside h2{
            text-align: center;
        }
        aside img{
            margin-left: 1em;
            margin-right: 1em;
            border-radius: 10%;
        }
        .trending_list_wrap{
            display: flex;
            flex-direction: column;
            margin-bottom: 1em;
        }
        
        .trending_list_item{
            display: flex;
            margin: 0em 0em 1em 0em;
            flex: 1;
        }
        
        #footer{
            margin-top: 1em;
            min-height: 120px;
            font-family: 'Raleway';
            font-size: 14px;
            background-color: #ffffff;
            border: 1px solid rgba(128, 128, 128, 0.251);
        }
        #footer h1{
            text-transform: uppercase;
            margin-left: 1.2em;
            font-weight: bolder;
        }
        #footer h1 a{
            text-decoration: none;
        }
        .logo_container_f {
            display: flex;
            justify-content: center;
            margin-top: 1em;
        }
         .contacts_container {
            /* width: 400px; */
            margin: 1em 0.5em 1em 0.5em;
            justify-content: center;
            display: flex;
            flex-wrap: wrap;
            flex-direction: column;
        }
        .contact_social {
            display: flex;
            justify-content: center;
        }
          .link_social {
            display: flex;
            align-items: center;
        }
        .contact_logo_size {
            width: 40px;
            margin: 0 0.5em 0 0;
        }
        
        /*///////////////////////////////////////  SEARCH   ////////////////////////////////////////////*/
        
        #main_search{
            margin-top: 2em;
            margin-bottom: 1em;
            text-align: center;
        }
        .search_header{
            font-size: 24px;
        }
        
        .search_input{
            width: 300px;
            height: 40px;
            border: 2px solid #2ebaae;
            border-radius: 50px;
        }
        .form{
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        .form button{
            width: 150px;
            height: 40px;
            border: 2px outset #2ebaae;
            border-radius: 10px;
            background-color: azure;
        }
        
        .form button:active{
            background-color: #2ebaae;
            border: none;
        }
        .search_form{
            background-color: #ffffff;
            padding: 1em 0 1em 0;
        }
        .search_button {
            padding: 5px;
        }
        .search_img {
            width: 24px;
            height: 24px;
        }
        .search_results{
            display: flex;
            flex-wrap: wrap;
            margin: 1em;
            padding: 1em 0em 1em 0em;
            justify-content: center;
            background-color: #ffffff;
        }
        .search_articles{
            width: 300px;
            margin: 1em;
            padding: 1em;
        }
        .search_articles:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        .search_articles > img{
            border-radius: 5px;
        }
        .pagination{
            margin: 3em 0 2em 0;
            padding: 2em 0 2em 0;
            font-size: 18px;
        
        }
        .step-links{
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .step-links a{
            text-decoration: none;
            color: #ffffff;
            background-color: #959595;
            opacity: 0.5;
            border-radius: 12px;
            margin: 0.3em;
            padding: 0.5em;
        }
        
        .step-links a:hover{
            background-color: #2ebaae;
            color: azure;
        }
        
        
        /*///////////////////////////////////////   PUBLICATIONS LIST    ////////////////////////////////////////////*/
        
        #main_publications_list{
            margin-top: 2em;
            background-color: #ffffff;
            padding: 1em;
            text-align: center;
        }
        
        .flex_container{
            display: flex;
            flex-wrap: wrap;
            justify-content: space-evenly;
        }
        .publication_list_item{
            width: 350px;
            margin-top: 1em;
            padding: 9px;
        
        }
        .publication_list_item:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        .publication_list_item img{
            border-radius: 5px;
            position: relative;
        }
        .publication_list_item a{
            text-decoration: none;
        }
        .publication_list_item a:link, .publication_list_item a:visited{
            color: #000000;
        }
        .publication_list_item a:hover{
            color: #2ebaae;
        }
        
        
        /*///////////////////////////////////////  CONTACT   ////////////////////////////////////////////*/
        
        #contact_section{
            text-align: center;
            background-color:#ffffff;
            padding: 1em 0 1em 0;
        }
        
        #contact_section_header{
            text-align: center;
            margin-top: 3em;
            padding: 1em;
        }
        
        .contact_form_container{
            padding: 1em;
        }
        
        .feedback_form {
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        
        .feedback_form p{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .feedback_textarea{
            text-align: center;
            width: 100%;
            height: 100px;
            border: 1px solid #2ebaae;
            border-radius: 30px; 
        }
        .feedback_textarea:focus {
            outline-color: #2ebaaedb;
            outline-width: thin;
            outline-style: solid;
        }
        .feedback_textinput{
            width: 250px;
            height: 30px;
            border: 1px solid #2ebaae;
            padding-left: 1em;
            border-radius: 30px;
        }
        
        .feedback_submit_button {
            display: block;
            margin-top: 1em;
            height: 40px;
            width: 80px;
            border-radius: 20px;
            border: 2px outset #2ebaae;
            background-color: azure;
        }
        
        .feedback_submit_button:hover{
            background-color: aliceblue;
        }
        .feedback_submit_button:active{
            background-color: #2ebaae;
            border: none;
        }
        
        
        .feedback_sent_section {
            padding: 1em;
        }
        
        
        /*////////////////////////////////////////////LOGIN PAGE //////////////////////////////////////////////////////////*/
        
        .authentication_page{
            padding-bottom: 4em;
            margin-top: 3em;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
            justify-content: center;
            align-items: center;
        
        }
        
        .messages_list {
            background-color: #fff;
            padding: 1em;
            border-radius: 12px;
            list-style-type: none;
            box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.30);
        }
        
        
        .login_container{
            display: flex;
            flex-direction: column;
            align-items: center;
            /* width: 100%; */
            border: 1px solid azure;
            border-radius: 13px;
            background-color: #ffffff;
            box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.30);
            padding: 2em;
            margin: 3em;
        }
        .login_container h1, h2{
            font-family: Raleway, Inter;
        }
        .login_container form{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .login_container form p{
            margin-bottom: 0.5em;
            display: flex;
            flex-direction: column;
        }
        
        .login_container form input{
            width: 250px;
            height: 30px;
            border: 1px solid #959595;
            border-radius: 30px;
            padding-left: 1em;
        }
        
        .login_container ul {
            display: flex;
            flex-direction: column;
            margin: 0;
            padding: 0;
            list-style-type: none;
        }
          
        .login_container li {
            padding: 2px;
            margin: 2px;
            font-style: italic;
            color: #888;
        }
          

        .login_container form button{
            margin: auto;
            width: 150px;
            height: 40px;
            border: 1px outset #2ebaae;
            border-radius: 15px;
            background-color: azure;
        }
        
        .login_container form button:hover{
            background-color: aliceblue;
        }
        
        .login_container form button:active{
            background-color: #2ebaae;
            border: none;
        }
        #id_remember{
            width: 15px;
            height: 15px;
            border: 2px solid #2ebaae;
            border-radius: 30px;
            padding-left: 1em;
        }
        
        .third-party_container{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        
        .provider_list{
            list-style-type: none;
            display: flex;
            padding: 0;
        }
        
        .provider_item a{
            display: inline-block;
            margin: 0.5em;
            padding: 0.5em;
            /* height: 50px;
            width: 50px; */
        }
        .provider_item a:hover{
            background-color: rgb(46, 186, 174, 0.1);
            border-radius: 7px;
        }
        
        /*////////////////////////////////PUCLICATION DETAIL////////////////////////////////////////////*/
        
        .banner_parent{
            background-color: cornflowerblue;
            height: 100px;
        }
        .publication_specific_caracteristics{
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: -3em;
        }
        .title_and_keywords_container{
            margin-left: 2em;
        }
        .publication_detail_icon{
            border-radius: 10px;
        }
        .publication_keywords_container ul{
            display: flex;
            margin: 0;
            padding: 0;
        }
        .publication_keywords_container li{
            list-style-type: none;
            color: rgb(48, 94, 212);
            margin-right: 1em;
            border-radius: 4px;
            background-color: rgba(48, 94, 212, 0.1);
            padding: 0.1em 1em 0.1em 1em;
        }
        .wrapper_publication_body{
            display: flex;
            flex-direction: column-reverse;
            width: 100%;
            margin: 1em 0 1em 0;
        }
        .back_to_publication_link {
            list-style-type: none;
            color: rgb(48, 94, 212) !important;
            margin-right: 1em;
            border-radius: 4px;
            background-color: rgba(48, 94, 212, 0.1);
            padding: 0.1em 1em 0.1em 1em;
            }
        .description_part{
            display: block;
            min-height: 100vh;
            width: 100%;
            padding: 1em;
            background-color: #ffffff;
        }
        .publication_detail_aside{
            width: 100%;
            background-color: rgba(48, 94, 212, 0.1);
            color: rgb(15, 49, 133);
        
        }
        .publication_general_informations_items{
            margin: 1em 1em 1em 1em;
            padding: 0em 0em 0em 1em;
        }
        .publication_general_informations_items_topic{
            margin: 0em 0em 0.4em 0em;
            font-weight: 400;
            font-size: 14px;
        }
        .publication_general_informations_items_specification{
            padding: 0;
            margin: 0;
            font-weight: 700;
            /* font-size: 18px; */
        }
        
        .add_favourite_container {
            margin: 1em;
        }
  
        /*///////////////////////////////////////ARTICLE DETAIL////////////////////////////////////////////*/
        
        .article_section_container{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .article_section{
            min-height: 100vh;
            margin: 0;
            padding: 1em 0em 1em 0em;
            width: 100%;
            background-color: #ffffff;
        }
        .article_header_wrap {
            margin: auto;
            text-align: center;
        }
        
        .article_description{
            font-size: 20px;
        }
        .article_body{
            margin: auto;
            padding: 1em;
        }
        .articles_suggestion_section{
            width: 100%;
            background-color: #ffffff;
            /* padding: 1em; */
            display: flex;
            flex-wrap: wrap;
            box-shadow: 5px 5px 10px #959595;
            justify-content: space-evenly;
        
        }
        .article_suggestion{
            width: 350px;
            margin-top: 1em;
            padding: 9px;
        
        }
        .article_suggestion:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        .article_suggestion img{
            border-radius: 5px;
        }
        .article_suggestion a{
            text-decoration: none;
        }
        .article_suggestion a:link, .article_suggestion a:visited{
            color: #000000;
        }
        .article_suggestion a:hover{
            color: #2ebaae;
        }
        
        
        
        .comment_input_section{
            width: 100%;
            background-color: #ffffff;
            margin: 2em 0em 1em 0em;
            padding: 1em 0 1em 0;
            
        }
        #id_content {
            border-radius: 22px;
            border: 1px solid;
            border-color:  rgba(128, 128, 128, 0.5);
            transition: border-color ease-in 0.2s;
            padding: 1em 0 1em 1em;
            height: 100px;
            resize: none;
            outline: none;
        }
        #id_content:focus{
            border-color: #2ebaae;
        }
        .comment_input form {
            display: flex;
            flex-direction: column;
        }
        .comment_input_container{
            width: 100%;
        }
        .comment_input_header{
            padding: 1em;
        }
        .comment_input{
            width: 90%;
            margin: auto;
        }
        .comment_input form{
            width: 100%;
            margin: auto;
        }
        .comment_input form textarea{
            width: 100%;
            margin: auto;
        }
        .reply_textarea{
            width: 100%;
            height: 100px;
            margin: 1em;
        }
        .comment_submit_button {
            display: block;
            margin-top: 1em;
            height: 40px;
            width: 80px;
            border-radius: 20px;
            border: 2px outset #2ebaae;
            background-color: azure;
        }
        
        .comment_submit_button:hover{
            background-color: aliceblue;
        }
        .comment_submit_button:active{
            background-color: #2ebaae;
            border: none;
        }
        .comment_list_section{
            padding: 1em;
            width: 90%;
            background-color: #ffffff;
            
        }
        
        
        .submit_button {
        background-color: azure;
        border-radius: 12px;
        border: 1px solid #7aa7c7;
        box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
        box-sizing: border-box;
        cursor: pointer;
        display: inline-block;
        font-family: -apple-system,system-ui,"Segoe UI","Liberation Sans",sans-serif;
        font-size: 13px;
        font-weight: 400;
        line-height: 1.15385;
        margin: 0;
        outline: none;
        padding: 8px .8em;
        position: relative;
        text-align: center;
        text-decoration: none;
        user-select: none;
        -webkit-user-select: none;
        touch-action: manipulation;
        vertical-align: baseline;
        white-space: nowrap;
        }
        
        .submit_button:hover,
        .submit_button:focus {
        background-color: #b3d3ea;
        color: #2c5777;
        }
        
        .submit_button:focus {
        box-shadow: 0 0 0 4px rgba(0, 149, 255, .15);
        }
        
        .submit_button:active {
        background-color: #a0c7e4;
        box-shadow: none;
        color: #2c5777;
        }
        
        .reply_container {
            border-left: 3px solid #2ebaae;
            padding-left: 1em;
        }
        .author_profile_picture_and_comment_container{
            display: flex;
            flex-direction: column;
            margin: 1em 0em 0em 0em;
        }
        .author_and_profile_picture_container{
            display: flex;
        }
        .comment_container{
            padding-left: 1em;
            display: flex;
            flex-direction: column;
            align-items: normal;
        }
        .comment_author{
            margin: 1em;
            font-size: 16px;
            font-weight: 900;
        }
        .comment_content{
            margin-top: 0.5em;
            margin-right: 1em;
        }
        
        .reply_author{
            margin-bottom: 0px;
        }
        .reply_content{
            margin-top: 0.5em;
        }
        
        .profile_picture{
            width: 50px;
            height: 50px;
            border-radius: 7px;
        }
        
        .exception{
            display: flex;
        }
        .exception section{
            background-image: url("../../exceptions/under_maintenance.png");
            background-color: #ffffff;
            background-repeat: no-repeat;
            background-size: contain ;
            background-position: center;
            flex: 1;
            margin: 0.5em;
        }
        .exception section h1{
            text-align: center;
        }

        .results_header_container {
            background-color: #fff;
            padding: 1em;
          }

}


@media screen and (min-width: 768px) and (max-width: 1023px) {
/* ////////////////////////////////////// PARTIALS /////////////// */

/*////////////////////////////////////// Author_card ////////////// */
        .author_card {
            display: flex;
            align-items: center;
            padding: 0.5em;
        }
        .author_card_profile_picture {
            height: 80px;
            border-radius: 100%;
        }
        .author_image {
            padding: 0.5em;
        }

        .author_publication_list {
        /* padding: 1em 6em 1em 6em;
        margin: 0 5em; */
        }
        .author_publication_flex_container {
            flex-direction: column;
        }
        .author_publication_list_item_details{
            margin: 0 1em;
            display: flex;
            flex-direction: column;
            align-items: baseline;
        }
        .author_publication_list_item > a{
            display: flex;
            /* justify-content: space-between; */
            margin: 2em 0;
            
        }
        .author_publication_list_item h3{
            margin: 0 1em;
        }

/* ////////////////////////////// MAIN  ///////////////// */
        body{
            background-color: #f4f4f4;
            margin: 0;
        }
        main{
            flex: 1;
        }

        .logo_container{
            background-color: #ffffff;
            border-bottom:1px solid rgba(128, 128, 128, 0.251);
        }
        .navigation{
            width: 100%;
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            flex: 1;
            margin: 0 auto;
            font-weight: 400;
            color: #959595;
            background-color: #ffffff;
            position: sticky;
            top: 0px;
        }
        
        .navigation ul{
            overflow: hidden;
            list-style-type: none;
            align-content: space-evenly;
            transition: max-height 0.5s ease-out;
        }
        .navigation li{
            margin: 0 0 0.5em 0;
            padding: 0.5em 0 0.5em 0;
        }
        .navbar_container a{
            color: #2ebaae;
        }
        .navbar_container > ul{
            max-height: 0px;
        }
        .menu_icon{
            margin: auto;
            display: flex;
            background-color: #959595;
            width: 100%;
        }
        .navigation input[type=checkbox]{
            display: none;
        }
        
        .navigation input[type=checkbox]:checked + ul{
            max-height: 500px;
            flex-flow: column wrap;
        }
        .navigation label{
            display: inline-block;
            background-image: url("../icons/menu.png");
            background-position: center;
            background-size: cover;
            height: 50px;
            width: 50px;
            margin: 0.2em auto 0.2em auto;
            border-radius: 10px;
            text-align: center;
            background-color: #d4dbccf7;
        }
        .navigation label img{
            border-radius: 7px;
            background-color: #f4f4f4;
        }
        .navbar_container{
            flex: 1;
            width: 100%;
        }
        #account ul{
            list-style-type: none;
            display: flex;
            align-items: center;
            margin: 5px;
        }
        /* #account li{
            padding-left: 1em;
        } */
        
        #account > p{
            background-color: azure;
            border-radius: 12px;
            border: 1px outset #2ebaae;
            box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
            box-sizing: border-box;
            cursor: pointer;
            display: inline-block;
            /* font-family: -apple-system,system-ui,"Segoe UI","Liberation Sans",sans-serif; */
            font-size: 13px;
            font-weight: 400;
            line-height: 1.15385;
            /* margin: 0; */
            outline: none;
            padding: 8px .8em;
            position: relative;
            text-align: center;
            text-decoration: none;
            user-select: none;
            -webkit-user-select: none;
            touch-action: manipulation;
            vertical-align: baseline;
            white-space: nowrap;
        }
        #account > p:hover{
            background-color: rgb(46, 186, 174, 0.1);
        }
        .login_link{ 
            padding: 1em;
        }
        .login_link:hover{
        border-radius: 9px;
        /* background-color: rgb(46, 186, 174, 0.1); */
        }
        .logout_link{
            padding: 1em;
            color: #1d2b1e;
        }
        .logout_link:hover{
        border-radius: 9px;
        background-color: rgb(46, 186, 174, 0.1);
        }
        
        #account img{
            border: 2px solid transparent;
            border-radius: 50%;
            background: 
            linear-gradient(to right, white, white), 
            linear-gradient(to bottom right, #2ebaae , #0414fc); 
            background-clip: padding-box, border-box;
            background-origin: padding-box, border-box;
        }
                               /* main index */

        #index{
            display: flex;
            flex-direction: column;

        }
        #section{
            display: flex;
            flex-direction: column;
            background-color: #ffffff;
            margin: 0 0 2em 0;
        }
        section{
            width: 100%;
        }

        #cover_section article{
            margin-top: 1em;
            width: 100%;
            min-height: 400px;
        }

        .cover_container a{
            display: flex;
            flex-direction: column;
        }

        .details_container {
            flex: 1;
            text-align: center;
        }

        .image_container{
            width: 100%;
            overflow: hidden;
        }

        .image_container img{
            width: 100%;
            height: auto;
            object-fit: cover;
        }

        .article_container{
            width: 300px;
        }

        .article_container h1{
            margin: 0;
        }

        .post_container{
            width: 100%;
            height: 400px;
            overflow: hidden;
        }
        .post_container img{
            width: 320px;
            height: auto;
            object-fit: cover;
        }
        .post_container h2{
            margin: 0;
        }

        #main_publications_create{
            margin-top: 3em;
        }

        #main_publication_preview{
            margin-top: 3em;
        }

        #main_section{
            display: flex;
            justify-content: space-evenly;
            flex-wrap: wrap;
            margin-top: 2em;
        }
        .article_container{
            padding: 10px;
        }
        .article_container:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        #secondary_section{
            margin-top: 2em;
            display: flex;
            justify-content: space-evenly;
            flex-wrap: wrap;
        }

        #secondary_section article{
            display: inline-block;
        }

        #aside{
            width: 100%;
            margin: 0 0 3em 0;
        }
        .aside_update{
            background-color: #ffffff;
        }
        .aside_trending{
            background-color: #ffffff;
        }
        .updated_list_wrap{
            display: flex;
            flex-direction: column;
            margin-bottom: 1em;
        }

        .empty_updated_list{
            text-align: center;
        }
        .updated_list_item{
            display: flex;
            margin: 0em 0em 1em 0em;
            flex: 1;
        }
        aside h1{
            font-size: 19px;
        }
        aside h2{
            text-align: center;
        }
        aside img{
            margin-left: 1em;
            margin-right: 1em;
            border-radius: 10%;
        }
        .trending_list_wrap{
            display: flex;
            flex-direction: column;
            margin-bottom: 1em;
        }

        .trending_list_item{
            display: flex;
            margin: 0em 0em 1em 0em;
            flex: 1;
        }

        #footer{
            margin-top: 1em;
            min-height: 120px;
            font-family: 'Raleway';
            font-size: 14px;
            background-color: #ffffff;
            border: 1px solid rgba(128, 128, 128, 0.251);
        }
        #footer h1{
            text-transform: uppercase;
            margin-left: 1.2em;
            font-weight: bolder;
        }
        #footer h1 a{
            text-decoration: none;
        }

        .logo_container_f {
            display: flex;
            justify-content: center;
            margin-top: 1em;
        }
         .contacts_container {
            /* width: 400px; */
            margin: 1em 0.5em 1em 0.5em;
            justify-content: center;
            display: flex;
            flex-wrap: wrap;
            flex-direction: column;
        }
        .contact_social {
            display: flex;
            justify-content: center;
        }
          .link_social {
            display: flex;
            align-items: center;
        }
        .contact_logo_size {
            width: 40px;
            margin: 0 0.5em 0 0;
        }

        /*///////////////////////////////////////  SEARCH   ////////////////////////////////////////////*/

        #main_search{
            margin-top: 2em;
            margin-bottom: 1em;
            text-align: center;
        }
        .search_header{
            font-size: 24px;
        }

        .search_input{
            width: 300px;
            height: 40px;
            border: 2px solid #2ebaae;
            border-radius: 50px;
        }
        .form{
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        .form button{
            width: 150px;
            height: 40px;
            border: 2px outset #2ebaae;
            border-radius: 10px;
            background-color: azure;
        }

        .form button:active{
            background-color: #2ebaae;
            border: none;
        }
        .search_form{
            background-color: #ffffff;
            padding: 1em 0 1em 0;
        }
        .search_results{
            display: flex;
            flex-wrap: wrap;
            margin: 1em;
            padding: 1em 0em 1em 0em;
            justify-content: center;
            background-color: #ffffff;
        }
        .search_articles{
            width: 300px;
            margin: 1em;
            padding: 1em;
        }
        .search_articles:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        .search_articles > img{
            border-radius: 5px;
        }
        .pagination{
            margin: 3em 0 2em 0;
            padding: 2em 0 2em 0;
            font-size: 18px;

        }
        .step-links{
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .step-links a{
            text-decoration: none;
            color: #ffffff;
            background-color: #959595;
            opacity: 0.5;
            border-radius: 12px;
            margin: 0.3em;
            padding: 0.5em;
        }

        .step-links a:hover{
            background-color: #2ebaae;
            color: azure;
        }


        /*///////////////////////////////////////   PUBLICATIONS LIST    ////////////////////////////////////////////*/

        #main_publications_list{
            margin-top: 2em;
            background-color: #ffffff;
            padding: 1em;
            text-align: center;
        }

        .flex_container{
            display: flex;
            flex-wrap: wrap;
            justify-content: space-evenly;
        }
        .publication_list_item{
            width: 350px;
            margin-top: 1em;
            padding: 9px;

        }
        .publication_list_item:hover{
            border-radius: 7px;
            background-color: #80808017;
        }

        .publication_list_item img{
            border-radius: 5px;
            position: relative;
        }
        .publication_list_item a{
            text-decoration: none;
        }
        .publication_list_item a:link, .publication_list_item a:visited{
            color: #000000;
        }
        .publication_list_item a:hover{
            color: #2ebaae;
        }


        /*///////////////////////////////////////  CONTACT   ////////////////////////////////////////////*/

        #contact_section{
            text-align: center;
            background-color:#ffffff;
            padding: 1em 0 1em 0;
        }

        #contact_section_header{
            text-align: center;
            margin-top: 3em;
            padding: 1em;
        }

        .contact_form_container{
            padding: 1em;
        }

        .feedback_form {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .feedback_form p{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .feedback_textarea{
            text-align: center;
            width: 100%;
            height: 100px;
            border: 1px solid #2ebaae;
            border-radius: 30px; 
        }
        .feedback_textarea:focus {
            outline-color: #2ebaaedb;
            outline-width: thin;
            outline-style: solid;
        }
        .feedback_textinput{
            width: 250px;
            height: 30px;
            border: 1px solid #2ebaae;
            padding-left: 1em;
            border-radius: 30px;
        }

        .feedback_submit_button {
            display: block;
            margin-top: 1em;
            height: 40px;
            width: 80px;
            border-radius: 20px;
            border: 2px outset #2ebaae;
            background-color: azure;
        }

        .feedback_submit_button:hover{
            background-color: aliceblue;
        }
        .feedback_submit_button:active{
            background-color: #2ebaae;
            border: none;
        }


        .feedback_sent_section {
            padding: 1em;
        }
        

        /*////////////////////////////////////////////LOGIN PAGE //////////////////////////////////////////////////////////*/

        .authentication_page{
            padding-bottom: 4em;
            margin-top: 3em;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
            justify-content: center;
            align-items: center;

        }

        .messages_list {
            background-color: #fff;
            padding: 1em;
            border-radius: 12px;
            list-style-type: none;
            box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.30);
        }

        
        .login_container{
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 350px;
            border: 1px solid azure;
            border-radius: 13px;
            background-color: #ffffff;
            box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.30);
            padding: 3em;
        }
        .login_container h1, h2{
            font-family: Raleway, Inter;
        }
        .login_container form{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .login_container form p{
            margin-bottom: 0.5em;
            display: flex;
            flex-direction: column;
        }

        .login_container form input{
            width: 250px;
            height: 30px;
            border: 1px solid #959595;
            border-radius: 30px;
            padding-left: 1em;
        }

        .login_container ul {
            display: flex;
            flex-direction: column;
            margin: 0;
            padding: 0;
            list-style-type: none;
        }
          
        .login_container li {
            padding: 2px;
            margin: 2px;
            font-style: italic;
            color: #888;
        }

        .login_container form button{
            margin: auto;
            width: 150px;
            height: 40px;
            border: 1px outset #2ebaae;
            border-radius: 15px;
            background-color: azure;
        }

        .login_container form button:hover{
            background-color: aliceblue;
        }

        .login_container form button:active{
            background-color: #2ebaae;
            border: none;
        }
        #id_remember{
            width: 15px;
            height: 15px;
            border: 2px solid #2ebaae;
            border-radius: 30px;
            padding-left: 1em;
        }

        .third-party_container{
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .provider_list{
            list-style-type: none;
            display: flex;
            padding: 0;
        }

        .provider_item a{
            display: inline-block;
            margin: 0.5em;
            padding: 0.5em;
            /* height: 50px;
            width: 50px; */
        }
        .provider_item a:hover{
            background-color: rgb(46, 186, 174, 0.1);
            border-radius: 7px;
        }

        /*////////////////////////////////PUCLICATION DETAIL////////////////////////////////////////////*/

        .banner_parent{
            background-color: cornflowerblue;
            height: 100px;
        }
        .publication_specific_caracteristics{
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: -3em;
        }
        .title_and_keywords_container{
            margin-left: 2em;
        }
        .publication_detail_icon{
            border-radius: 10px;
        }
        .publication_keywords_container ul{
            display: flex;
            margin: 0;
            padding: 0;
        }
        .publication_keywords_container li{
            list-style-type: none;
            color: rgb(48, 94, 212);
            margin-right: 1em;
            border-radius: 4px;
            background-color: rgba(48, 94, 212, 0.1);
            padding: 0.1em 1em 0.1em 1em;
        }
        .wrapper_publication_body{
            display: flex;
            flex-direction: column-reverse;
            width: 100%;
            margin: 1em 0 1em 0;
        }
        .back_to_publication_link {
            list-style-type: none;
            color: rgb(48, 94, 212) !important;
            margin-right: 1em;
            border-radius: 4px;
            background-color: rgba(48, 94, 212, 0.1);
            padding: 0.1em 1em 0.1em 1em;
            }
        .description_part{
            display: block;
            min-height: 100vh;
            width: 100%;
            padding: 1em;
            background-color: #ffffff;
        }
        .publication_detail_aside{
            width: 100%;
            background-color: rgba(48, 94, 212, 0.1);
            color: rgb(15, 49, 133);

        }
        .publication_general_informations_items{
            margin: 1em 1em 1em 1em;
            padding: 0em 0em 0em 1em;
        }
        .publication_general_informations_items_topic{
            margin: 0em 0em 0.4em 0em;
            font-weight: 400;
            font-size: 14px;
        }
        .publication_general_informations_items_specification{
            padding: 0;
            margin: 0;
            font-weight: 700;
            /* font-size: 18px; */
        }


        /*///////////////////////////////////////ARTICLE DETAIL////////////////////////////////////////////*/

        .article_section_container{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .article_section{
            min-height: 100vh;
            margin: 0;
            padding: 1em 0 1em 0em;
            width: 100%;
            background-color: #ffffff;
        }
        .article_header_wrap {
            margin: auto;
            text-align: center;
        }

        .article_description{
            font-size: 20px;
        }
        .article_body{
            margin: auto;
            padding: 1em;
        }
        .articles_suggestion_section{
            width: 100%;
            background-color: #ffffff;
            /* padding: 1em; */
            display: flex;
            flex-wrap: wrap;
            box-shadow: 5px 5px 10px #959595;
            justify-content: space-evenly;

        }
        .article_suggestion{
            width: 350px;
            margin-top: 1em;
            padding: 9px;

        }
        .article_suggestion:hover{
            border-radius: 7px;
            background-color: #80808017;
        }

        .article_suggestion img{
            border-radius: 5px;
        }
        .article_suggestion a{
            text-decoration: none;
        }
        .article_suggestion a:link, .article_suggestion a:visited{
            color: #000000;
        }
        .article_suggestion a:hover{
            color: #2ebaae;
        }



        .comment_input_section{
            width: 100%;
            background-color: #ffffff;
            margin: 2em 0em 1em 0em;
            padding: 1em 0 1em 0;
            
        }
        #id_content {
            border-radius: 22px;
            border: 1px solid;
            border-color:  rgba(128, 128, 128, 0.5);
            transition: border-color ease-in 0.2s;
            padding: 1em;
            height: 100px;
            resize: none;
            outline: none;
        }
        #id_content:focus{
            border-color: #2ebaae;
        }
        .comment_input form {
            display: flex;
            align-items: center;
        }
        .comment_input_container{
            width: 100%;
        }
        .comment_input_header{
            padding: 1em;
        }
        .comment_input{
            width: 90%;
            margin: auto;
        }
        .comment_input form{
            width: 100%;
            margin: auto;
        }
        .comment_input form textarea{
            width: 100%;
            margin: auto;
        }
        .reply_textarea{
            width: 100%;
            height: 100px;
            margin: 1em;
        }
        .comment_submit_button {
            display: block;
            margin: 1em;
            height: 40px;
            width: 80px;
            border-radius: 20px;
            border: 2px outset #2ebaae;
            background-color: azure;
        }

        .comment_submit_button:hover{
            background-color: aliceblue;
        }
        .comment_submit_button:active{
            background-color: #2ebaae;
            border: none;
        }
        .comment_list_section{
            padding: 1em;
            width: 90%;
            background-color: #ffffff;
            border-radius: 9px;
            
        }


        .submit_button {
        background-color: azure;
        border-radius: 12px;
        border: 1px solid #7aa7c7;
        box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
        box-sizing: border-box;
        cursor: pointer;
        display: inline-block;
        font-family: -apple-system,system-ui,"Segoe UI","Liberation Sans",sans-serif;
        font-size: 13px;
        font-weight: 400;
        line-height: 1.15385;
        margin: 0;
        outline: none;
        padding: 8px .8em;
        position: relative;
        text-align: center;
        text-decoration: none;
        user-select: none;
        -webkit-user-select: none;
        touch-action: manipulation;
        vertical-align: baseline;
        white-space: nowrap;
        }

        .submit_button:hover,
        .submit_button:focus {
        background-color: #b3d3ea;
        color: #2c5777;
        }

        .submit_button:focus {
        box-shadow: 0 0 0 4px rgba(0, 149, 255, .15);
        }

        .submit_button:active {
        background-color: #a0c7e4;
        box-shadow: none;
        color: #2c5777;
        }

        .reply_container {
            border-left: 3px solid #2ebaae;
            padding-left: 1em;
        }
        .author_profile_picture_and_comment_container{
            display: flex;
            flex-direction: column;
            margin: 1em 0em 0em 0em;
        }
        .author_and_profile_picture_container{
            display: flex;
        }
        .comment_container{
            padding-left: 1em;
            display: flex;
            flex-direction: column;
            align-items: normal;
        }
        .comment_author{
            margin: 1em;
            font-size: 16px;
            font-weight: 900;
        }
        .comment_content{
            margin-top: 0.5em;
            margin-right: 1em;
        }

        .reply_author{
            margin-bottom: 0px;
        }
        .reply_content{
            margin-top: 0.5em;
        }

        .profile_picture{
            width: 50px;
            height: 50px;
            border-radius: 7px;
        }

        .exception{
            display: flex;
        }
        .exception section{
            background-image: url("../../exceptions/under_maintenance.png");
            background-color: #ffffff;
            background-repeat: no-repeat;
            background-size: contain ;
            background-position: center;
            flex: 1;
            margin: 0.5em;
        }
        .exception section h1{
            text-align: center;
        }

        .results_header_container {
            background-color: #fff;
            padding: 1em;
          }
}

@media screen and (min-width: 1024px){
    /* ////////////////////////////////////// PARTIALS /////////////// */

    /*////////////////////////////////////// Author_card ////////////// */
        .author_card {
            display: flex;
            align-items: center;
            padding: 0.5em;
        }
        .author_card_profile_picture {
            height: 80px;
            border-radius: 100%;
        }
        .author_image {
            padding: 0.5em;
        }

        .author_publication_list {
        padding: 1em 6em 1em 6em;
        margin: 0 5em;
        }
        .author_publication_flex_container {
            flex-direction: column;
        }
        .author_publication_list_item_details{
            margin: 0 1em;
            display: flex;
            flex-direction: column;
            align-items: baseline;
        }
        .author_publication_list_item > a{
            display: flex;
            /* justify-content: space-between; */
            margin: 2em 0;
            
        }
        .author_publication_list_item h3{
            margin: 0 1em;
        }
  
/* ////////////////////////////////////////// MAIN ////////////////////// */

        #header{
            display: flex;
            align-items: center;
            font-family: 'Raleway';
            height: 100px;
            font-size: 14px;
            background-color: #ffffff;
            border-bottom: 1px solid rgba(128, 128, 128, 0.251);
            position: fixed;
            width: 100%;
            top: 0;
            left: 0;
            z-index: 1000;
        }
        #header h1{
            margin-left: 1.2em;
            font-weight: bolder;
        }
        
        #header a{
            text-decoration: none;
            text-transform: uppercase;
        
        }
        
        .navbar_container a:link, .navbar_container a:visited{
            color: #959595;
        }
        #account a{
            white-space: nowrap;
        }
        #account a:link, #account a:visited{
            color: #1d2b1e;
        }
        
        #header a:hover{
            color: #2ebaae;
        }
        #header a:active{
            color: #2c5777;
        }
            
        .link_logo_h {
            padding: 1em;
        }
        
        .navigation{
            display: flex;
            flex-direction: row;
            flex: 1;
            padding: 0 1em 0 1em;
            font-weight: 400;
            color: #959595;
        }
        .navigation input[type=checkbox]{
            display: none;
        }
        .navbar_container li{
            padding-right: 1.5em;
            border-right: 1px solid green;
            margin-left: 2em;
            display: inline-block;
        }
        .navbar_container{
            width: 80%;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        .navbar_container > ul{
            width: 100%;
        }
        #account{
            margin: auto;
        }
        #account ul{
            list-style-type: none;
            display: flex;
            align-items: center;
            margin: 5px;
        }
        #account img{
            border: 2px solid transparent;
            border-radius: 50%;
            background: 
            linear-gradient(to right, white, white), 
            linear-gradient(to bottom right, #2ebaae , #0414fc); 
            background-clip: padding-box, border-box;
            background-origin: padding-box, border-box;
        }
        .login_link{
            padding: 1em;
            border: 1px solid rgb(46, 186, 174, 0.1);
            border-radius: 9px;
            background-color: rgb(46, 186, 174, 0.1);
        }
        .login_link:hover{
        border-radius: 9px;
        background-color: #2c5777;
        
        }
        .logout_link{
            padding: 1em;
        }
        .logout_link:hover{
        border-radius: 9px;
        background-color: rgb(46, 186, 174, 0.1);
        }
        
        
        body{
            background-color: #f4f4f4;
            margin: 0;
        }
        
        main{
            flex: 1;
            margin-top: 6em;
        }
                                            /* main index */
        #index{
            display: flex;
            padding-bottom: 4em;
            margin-top: 8em;
        }
        
        #index a{
            text-decoration: none;
        }
        #index a:link, #index a:visited{
            color: #000000;
        }
        #index a:hover{
            color: #2ebaae;
        }
        
        #index img{
            border-radius: 5px;
        }
        #section{
            background-color: #ffffff;
            display: block;
            margin-left: 2.5em;
            margin-right: 2em;
            width: 70%;
        }
        
        section{
            padding-top: 1em;
            padding-bottom: 1.5em;
        }
        
        #cover_section article{
            margin-left: 0.7em;
            margin-bottom: 1em;
        }
        
        .cover_container a{
            display: flex;
        }

        .image_container{
            padding: 1em;
        }
        
        .details_container {
            margin-left: 1em;
            flex: 1;
            /* padding: 1em; */
        }
        
        .article_container{
            width: 300px;
        }
        
        .article_container h1{
            margin: 0;
        }
        
        .post_container{
            width: 450px;
        }
        .post_container h2{
            margin: 0;
        }
        
        #main_publications_create{
            margin-top: 3em;
        }
        
        #main_publication_preview{
            margin-top: 3em;
        }
        
        #main_section{
            display: flex;
            justify-content: space-evenly;
            flex-wrap: wrap;
            margin-top: 2em;
        }
        .article_container{
            padding: 10px;
        }
        .article_container:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        #secondary_section{
            margin-top: 2em;
            display: flex;
            justify-content: space-evenly;
            flex-wrap: wrap;
        }
        
        #secondary_section article{
            display: inline-block;
        }
        .post_container{
            padding: 10px;
        }
        .post_container:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        
        #aside{
            width: 30%;
            margin-right: 2.5em;
        }
        .aside_update{
            background-color: #ffffff;
        }
        .aside_trending{
            background-color: #ffffff;
        }
        .updated_list_wrap{
            display: flex;
            flex-direction: column;
            margin-bottom: 1em;
        }
        
        .empty_updated_list{
            text-align: center;
        }
        .updated_list_item{
            display: flex;
            margin: 0em 0em 1em 0em;
            flex: 1;
        }
        aside h1{
            font-size: 19px;
        }
        aside h2{
            text-align: center;
        }
        aside img{
            margin-left: 1em;
            margin-right: 1em;
            border-radius: 10%;
        }
        .trending_list_wrap{
            display: flex;
            flex-direction: column;
            margin-bottom: 1em;
        }
        
        .trending_list_item{
            display: flex;
            margin: 0em 0em 1em 0em;
            flex: 1;
        }
        
        #footer{
            display: flex;
            justify-content: space-between;
            margin-top: 1em;
            min-height: 120px;
            font-family: 'Raleway';
            font-size: 14px;
            background-color: #ffffff;
            border: 1px solid rgba(128, 128, 128, 0.251);
        }
        #footer h1{
            text-transform: uppercase;
            margin-left: 1.2em;
            font-weight: bolder;
        }
        #footer h1 a{
            text-decoration: none;
        }
        
        .contacts_container {
            width: 400px;
            margin: 0.5em 6em 0.5em 0;
            display: flex;
            flex-wrap: wrap;
            flex-direction: column;

        }

        .contact_logo_size {
            width: 40px;
            margin: 0 0.5em 0 0;
        }
        .contact_social {
            display: flex   ;
        }
        .link_social {
            display: flex;
            align-items: center;
        }
        .logo_container_f {
            padding: 2em;
        }
        
        /*///////////////////////////////////////  SEARCH   ////////////////////////////////////////////*/
        
        #main_search{
            margin-top: 8em;
            margin-bottom: 1em;
            text-align: center;
        }
        .search_header{
            font-size: 34px;
        }
        
        .search_input{
            width: 450px;
            height: 40px;
            border: 2px solid #2ebaae;
            border-radius: 50px;
            padding-left: 1em;
        }
        .form{
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .form button{
            display: inline;
            margin-left: 1em;
            width: 40px;
            height: 40px;
            border: 2px outset #2ebaae;
            border-radius: 50%;
            background-color: azure;
        }
        .form button:hover{
            background-color: aliceblue;
        }
        .form button:active{
            background-color: #2ebaae;
            border: none;
        }
        .search_form{
            background-color: #ffffff;
            padding: 1em;
        }
        .search_results{
            display: flex;
            flex-wrap: wrap;
            margin: 1em;
            padding: 1em 0em 1em 0em;
            justify-content: center;
            background-color: #ffffff;
        }
        .search_articles{
            width: 300px;
            margin: 1em;
            padding: 1em;
        }
        .search_articles:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        .search_articles > img{
            border-radius: 5px;
        }
        .pagination{
            margin-top: 3em;
            margin-bottom: 1em;
        }
        
        /*///////////////////////////////////////   PUBLICATIONS LIST    ////////////////////////////////////////////*/
        
        #main_publications_list{
            margin-top: 8em;
            background-color: #ffffff;
            margin-left: 1em;
            margin-right: 1em;
            padding: 1em;
            text-align: center;
        }
        
        .flex_container{
            display: flex;
            flex-wrap: wrap;
            justify-content: space-evenly;
        }
        .publication_list_item{
            width: 350px;
            margin-top: 1em;
            padding: 9px;
        
        }
        .publication_list_item:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        .publication_list_item img{
            border-radius: 5px;
            position: relative;
        }
        .publication_list_item a{
            text-decoration: none;
        }
        .publication_list_item a:link, .publication_list_item a:visited{
            color: #000000;
        }
        .publication_list_item a:hover{
            color: #2ebaae;
        }
        
        
        /*///////////////////////////////////////  CONTACT   ////////////////////////////////////////////*/
        
        #contact_section{
            text-align: center;
            background-color:#ffffff;
            margin: 2em;
        }
        
        #contact_section_header{
            text-align: center;
            margin-top: 3em;
        }
        
        #contact_section_header h1{
            font-size: 43px;
        }
        #contact_section_header p{
            font-size: 19px;
        }
        
        .feedback_form {
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        
        .feedback_form p{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .feedback_textarea{
            text-align: center;
            width: 600px;
            height: 200px;
            border: 1px solid #2ebaae;
            border-radius: 30px; 
        }
        .feedback_textarea:focus {
            outline-color: #2ebaaedb;
            outline-width: thin;
            outline-style: solid;
        }
        .feedback_textinput{
            width: 250px;
            height: 30px;
            border: 1px solid #2ebaae;
            padding-left: 1em;
            border-radius: 30px;
        }
        
        .feedback_submit_button {
            display: block;
            margin-top: 1em;
            height: 40px;
            width: 80px;
            border-radius: 20px;
            border: 2px outset #2ebaae;
            background-color: azure;
        }
        
        .feedback_submit_button:hover{
            background-color: aliceblue;
        }
        .feedback_submit_button:active{
            background-color: #2ebaae;
            border: none;
        }
        
        
        
        /*////////////////////////////////////////////LOGIN PAGE //////////////////////////////////////////////////////////*/
        
        .authentication_page{
            padding-bottom: 4em;
            margin-top: 3em;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
            justify-content: center;
            align-items: center;
        
        }
        
        .messages_list {
            background-color: #fff;
            padding: 1em;
            border-radius: 12px;
            list-style-type: none;
            box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.30);
        }
        
        
        .login_container{
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 350px;
            border: 1px solid azure;
            border-radius: 13px;
            background-color: #ffffff;
            box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.30);
            padding: 3em;
        }
        
        .login_container form{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .login_container form p{
            margin-bottom: 0.5em;
            display: flex;
            flex-direction: column;
        }
        
        .login_container form input{
            width: 250px;
            height: 30px;
            border: 1px solid #959595;
            border-radius: 30px;
            padding-left: 1em;
        }

        .login_container ul {
            display: flex;
            flex-direction: column;
            margin: 0;
            padding: 0;
            list-style-type: none;
        }
          
        .login_container li {
            padding: 2px;
            margin: 2px;
            font-style: italic;
            color: #888;
        }
        
        .login_container form button{
            margin: auto;
            width: 150px;
            height: 40px;
            border: 1px outset #2ebaae;
            border-radius: 15px;
            background-color: azure;
        }
        
        .login_container form button:hover{
            background-color: aliceblue;
        }
        
        .login_container form button:active{
            background-color: #2ebaae;
            border: none;
        }
        #id_remember{
            width: 15px;
            height: 15px;
            border: 2px solid #2ebaae;
            border-radius: 30px;
            padding-left: 1em;
        }
        
        .third-party_container{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        
        .provider_list{
            list-style-type: none;
            display: flex;
            padding: 0;
        }
        
        .provider_item a{
            display: inline-block;
            margin: 0.5em;
            padding: 0.5em;
            /* height: 50px;
            width: 50px; */
        }
        .provider_item a:hover{
            background-color: rgb(46, 186, 174, 0.1);
            border-radius: 7px;
        }
        
        /*////////////////////////////////PUCLICATION DETAIL////////////////////////////////////////////*/
        
        .banner_parent{
            background-color: cornflowerblue;
            height: 280px;
        }
        .publication_specific_caracteristics{
            display: flex;
            align-items: center;
            margin-left: 6em;
            margin-top: -3em;
        }
        .title_and_keywords_container{
            margin-left: 2em;
        }
        .publication_detail_icon{
            border-radius: 10px;
        }
        .publication_keywords_container ul{
            display: flex;
            margin: 0;
            padding: 0;
        }
        .publication_keywords_container li{
            list-style-type: none;
            color: rgb(48, 94, 212);
            margin-right: 1em;
            border-radius: 4px;
            background-color: rgba(48, 94, 212, 0.1);
            padding: 0.1em 1em 0.1em 1em;
        }
        .wrapper_publication_body{
            display: flex;
        }
        .back_to_publication_link {
            list-style-type: none;
            color: rgb(48, 94, 212) !important;
            margin-right: 1em;
            border-radius: 4px;
            background-color: rgba(48, 94, 212, 0.1);
            padding: 0.1em 1em 0.1em 1em;
            }
        .description_part{
            display: block;
            min-height: 100vh;
            width: 70%;
            margin-left: 2em;
            margin-right: 2em;
            padding-left: 1.5em;
            padding-right: 1.5em;
            background-color: #ffffff;
        }
        .publication_detail_aside{
            width: 22%;
            background-color: rgba(48, 94, 212, 0.1);
            color: rgb(15, 49, 133);
        
        }
        .publication_general_informations_items{
            margin: 1em 1em 2em 1em;
            padding: 0em 0em 0em 1em;
            /* border: 1px solid green; */
        }
        .publication_general_informations_items_topic{
            margin: 0em 0em 0.4em 0em;
            font-weight: 400;
            font-size: 14px;
        }
        .publication_general_informations_items_specification{
            padding: 0;
            margin: 0;
            font-weight: 700;
            font-size: 18px;
        }
        .pagination{
            font-size: 18px;
        }
        
        .step-links a{
            text-decoration: none;
            color: #ffffff;
            background-color: #959595;
            opacity: 0.5;
            border-radius: 12px;
            margin-left: 0.1em;
            margin-right: 0.1em;
            padding-top: 0.3em;
            padding-bottom: 0.3em;
            padding-left: 0.5em;
            padding-right: 0.5em;
        }
        
        .step-links a:hover{
            background-color: #2ebaae;
            color: azure;
        }
        
        /*///////////////////////////////////////ARTICLE DETAIL////////////////////////////////////////////*/
        #article{
            margin-top: 6em;
        }

        .article_section_container{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .article_section{
            min-height: 100vh;
            margin: 0;
            padding: 1em 0em 1em 0em;
            width: 100%;
            background-color: #ffffff;
        }
        .article_header_wrap {
            margin: auto;
            text-align: center;
        }
        .article_title{
            font-size: 36px;
        }
        .article_description{
            font-size: 20px;
        }
        .article_body{
            width: 50%;
            margin: auto;
            border-left: 1px solid rgba(128, 128, 128, 0.251);
            padding-left: 3em;
        }
        .articles_suggestion_section{
            width: 100%;
            background-color: #ffffff;
            /* padding: 1em; */
            display: flex;
            flex-wrap: wrap;
            box-shadow: 5px 5px 10px #959595;
            justify-content: space-evenly;
        
        }
        .article_suggestion{
            width: 350px;
            margin-top: 1em;
            padding: 9px;
        
        }
        .article_suggestion:hover{
            border-radius: 7px;
            background-color: #80808017;
        }
        
        .article_suggestion img{
            border-radius: 5px;
        }
        .article_suggestion a{
            text-decoration: none;
        }
        .article_suggestion a:link, .article_suggestion a:visited{
            color: #000000;
        }
        .article_suggestion a:hover{
            color: #2ebaae;
        }
        
        
        
        .comment_input_section{
            margin: 2em 2em 1em 2.5em;
            padding: 1em;
            width: 90%;
            background-color: #ffffff;
            border-radius: 9px;
            
        }

        #id_content {
            border-radius: 22px;
            border: 1px solid;
            border-color:  rgba(128, 128, 128, 0.5);
            transition: border-color ease-in 0.2s;
            padding: 1em;
            height: 100px;
            resize: none;
            outline: none;
        }
        #id_content:focus, #id_content:hover{
            border-color: #2ebaae;
        }
        .comment_input form {
            display: flex;
            align-items: center;
        }

        .comment_submit_button {
            display: block;
            margin: 1em;
            height: 40px;
            width: 80px;
            border-radius: 20px;
            border: 2px outset #2ebaae;
            background-color: azure;
        }
        
        .comment_submit_button:hover{
            background-color: aliceblue;
        }
        .comment_submit_button:active{
            background-color: #2ebaae;
            border: none;
        }
        .comment_list_section{
            margin: 0em 2em 3em 2.5em;
            padding: 1em;
            width: 90%;
            background-color: #ffffff;
            border-radius: 9px;
            
        }
        
        
        .submit_button {
        background-color: azure;
        border-radius: 12px;
        border: 1px solid #7aa7c7;
        box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
        box-sizing: border-box;
        cursor: pointer;
        display: inline-block;
        font-family: -apple-system,system-ui,"Segoe UI","Liberation Sans",sans-serif;
        font-size: 13px;
        font-weight: 400;
        line-height: 1.15385;
        margin: 0;
        outline: none;
        padding: 8px .8em;
        position: relative;
        text-align: center;
        text-decoration: none;
        user-select: none;
        -webkit-user-select: none;
        touch-action: manipulation;
        vertical-align: baseline;
        white-space: nowrap;
        }
        
        .submit_button:hover,
        .submit_button:focus {
        background-color: #b3d3ea;
        color: #2c5777;
        }
        
        .submit_button:focus {
        box-shadow: 0 0 0 4px rgba(0, 149, 255, .15);
        }
        
        .submit_button:active {
        background-color: #a0c7e4;
        box-shadow: none;
        color: #2c5777;
        }
        
        .reply_container {
            border-left: 3px solid #2ebaae;
            padding-left: 1em;
        }
        .author_profile_picture_and_comment_container{
            display: flex;
            flex-direction: column;
            margin: 1em 0em 0em 0em;
        }
        .author_and_profile_picture_container{
            display: flex;
        }
        .comment_container{
            padding-left: 1em;
            display: flex;
            flex-direction: column;
            align-items: normal;
            width: 60%;
        }
        .comment_author{
            margin: 1em;
            font-size: 16px;
            font-weight: 900;
        }
        .comment_content{
            margin-top: 0.5em;
            margin-right: 1em;
        }
        
        .reply_author{
            margin-bottom: 0px;
        }
        .reply_content{
            margin-top: 0.5em;
        }
        
        .profile_picture{
            width: 50px;
            height: 50px;
            border-radius: 7px;
        }
        
        .exception{
            display: flex;
        }
        .exception section{
            background-image: url("../../exceptions/under_maintenance.png");
            background-color: #ffffff;
            background-repeat: no-repeat;
            background-size: contain ;
            background-position: center;
            flex: 1;
            margin: 0.5em;
        }
        .exception section h1{
            text-align: center;
        }

        .results_header_container {
            background-color: #fff;
            padding: 1em;
            margin: 0 1em;
        }
        
}

