html,body{
    width: 100%;
    height: 100%;
    margin: 0;
    box-sizing: border-box;
}
.navigation{
    box-shadow: 0;
}
.brand-logo{
    margin-left: 0%;
    border:0px solid red;
    padding: 0;
    padding-bottom: 0;
    height: inherit;
   
}
.brand-logo img{
    margin: 0;
    margin-bottom: 0;
    height: inherit;
}
.menu_link{
    display: inline-block;
}
.navi_tab{
    margin-left: 15%;
    margin-right: 0%;
}
.navi_tab li{
    font-weight: bold;
}
.log_sign{
    margin-right: 10%;
}
.li_user_view{
    display: inline-block;
    border-bottom: inset 2px red;
   
}

.sign{
    padding:2%;
    width: 80px;
    height: 40px;
    font-size: 15px;
    border: 0;
    border-radius: 5px;
    font-weight: bold;
}
.log_sign li > a{
    font-size: 15px;
    font-weight: bold;
}
.search_form{
    border: 0px solid red;
    width: 30%;
    margin-left: 2%;
    padding: 0;
    display: inline-block;
    
}
.search_form input[type="search"]{
    border: 0px solid green;
    margin-left: 0;
    margin-top:0;
    
    
}
/*deuxième place detail du cours*/
.course_detail_place  {
    border: 0px solid green;
    margin-bottom: 0;
}
.course_detail_place .row {
    border: 0px solid black;
    margin-bottom: 0;
    height: 100%;
}
.course_detail_place .row .video_place{
    border: 0px solid red;
    height: 650px;
    padding: 0;
    margin: 0;
}
.course_detail_place .after_vid_place{
    height: auto;
    /*/background-color: yellow;/*/ /*la meilleur partie*/
   
}
.vid_desc{
    border: 0px dashed green;
}
.vid_desc_elmt .title{
    text-transform: capitalize;
    font-weight: bold;
    font-size: 30px;
    border: 0px solid red;
    margin-top: 0;
    margin-bottom: 0;
}
.vid_desc_elmt .author{
    
    border: 0px solid rgb(30, 255, 0);
    margin-top: 0;
}
.comment_part .com_title, .add_com_title{
    
    border: 0px solid teal;
    padding-left: 30px;
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 0;
}
.collection .secondary-content{
    font-size: 14px;
    color: black;
}
.collection .secondary-content i{
    font-size: 14px;
    color: black;
}
/* doucement ici*/
.relate_vid{
    box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}
.relate_vid blockquote{
    font-size: 30px;
    border-color: rgb(90, 90, 90);
    font-weight: bold;
    margin-top: 15px;
}
.the_comment{
    border: 0px dashed maroon;
    height: 400px;
    overflow: auto;
}
.input-field textarea:focus + label.active {
    color: black;
   
  }
  .input-field label {
    color: grey;
  }
 .add_com textarea.materialize-textarea:focus:not([readonly]){
    border-bottom: 1px solid black;
    box-shadow: 0 1px 0 0 black; /*pour changer la couleur du textearea*/
 }
/*les videos*/
.card_curr_vid .card .card-action .reveal_activ{
    cursor:pointer;
    text-transform:uppercase;
}
    .vid_action{
        margin-left:10%;
    }
    .vid_action span{
        margin: 6px;
    }
.card_curr_vid .card .card-title{
    font-size: 18px;
    font-weight: bold;
}
.relate_vid .see_more{
    margin-bottom: 6px;
}
/*video fin*/


/*partie de description*/
    .read-more-container{
        display: flex;
        flex-direction: column;
        color: #111;
        gap: 1rem;
    }
    .container-text{
        padding: 2rem;
        background-color: #fff;
        border-radius: 2px;
        line-height: 1.4rem;
        box-shadow: 0 0 1rem rgba(0,0,0,.1);
    }
    .read-more-btn{
        color: #0984e3;
        cursor: pointer;
    }
    .read-more-text{
        display: none;
    }
    .read-more-text--show{
        display: inline;
    }

      .moreText {
        display: none;
      }
      /* .read-more-btn {
        padding: 15px 60px;
        background-color: rgb(149, 170, 197);
        color: rgb(53, 49, 49);
        border: none;
        outline: none;
        font-size: 20px;
        cursor: pointer;
      } */
      .text.show-more .moreText {
        display: inline;
      }
      .text.show-more .dots {
        display: none;
      } 
      .hide_con{
        display: none;
      }


/*fin de la partie*/

/*la partie de reponse au commentaire que je modifie comme ca*/
    .the_comment .rep_com{
        border-color: green;
        padding: 0;
        padding-top: 15px;
        

    }
    .rep_com li{
        border: 0px solid black;
        
        height: 50px;
       
    }

/*fin de la partie*/
/*ajout de certains modifie*/
    .card-title,.author{
        text-transform: capitalize;
    }
    span.title{
        font-weight: bold;
        text-transform: uppercase;
    }
/*fin modification*/


/*le bouton pour revenir en haut*/
#button {
    display: inline-block;
    background-color: #FF9800;
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 4px;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: background-color .3s, 
      opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
  }
  #button::after {
    content: "\2B9D";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    font-size: 2em;
    line-height: 50px;
    color: #fff;
  }
  #button:hover {
    cursor: pointer;
    background-color: #333;
  }
  #button:active {
    background-color: #555;
  }
  #button.show {
    opacity: 1;
    visibility: visible;
  }
  /*fin bouton*/

  /*la modification du scroll bar (pour commentaire)*/

    /* width */
 .the_comment::-webkit-scrollbar {
    width: 1px;
  }
  
  /* Track. conteneur de scroll bar*/
  .the_comment::-webkit-scrollbar-track {
    background: #f1f1f1; 
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  }
   
  /* Handle. la bar en elle meme */
  .the_comment::-webkit-scrollbar-thumb {
    background: #888; 
  }
  
  /* Handle on hover. au survol de la barre */
  .the_comment::-webkit-scrollbar-thumb:hover {
    background: #555; 
  }
        

  /*fin modif*/

/* le footer */
footer .footer-copyright p a {
    border: 0px solid black;
    display: inline-block;
    padding-bottom: 0px;
    padding-top: 0px;
    margin-right: 6px;
    
}
footer .footer-copyright p a img{
    border: 0px solid black;
    width: 35px;
    height: 35px;
    filter: grayscale(100%);
}
footer .footer-copyright p a:hover img{
   
    filter: none;
}
.copy_right{
    width: 250px;
   
    margin-top: 2%;
}
/*dropdown content*/
.dropdown-content {
    background-color: #FFFFFF;
    margin: 0;
    display: none;
    min-width: 300px; /* Changed this to accomodate content width */
    max-height: auto;
      margin-left: -1px; /* Add this to keep dropdown in line with edge of navbar */
    overflow: hidden; /* Changed this from overflow-y:auto; to overflow:hidden; */
    opacity: 0;
    position: absolute;
    white-space: nowrap;
    z-index: 1;
    will-change: width, height;
  }

  @media screen and (max-width:990px) {
    .search_form{
     float: right;
     width: 100%;
     text-align: center;
    }
    
   }