*{
          margin:0rem;
          padding:0rem;
          user-select:none;
          box-sizing:border-box;
      }
      
      img{width:100%;height:100%;margin:0rem;display: block;}
      a{text-decoration:none}
      
      body{background:rgb(24, 24 ,24);margin:0rem;display:block;padding:0rem;}

      
      section.mobile-intro-header{
        width:100%;
        height:55px;
        background:#000;
        position: relative;
        top:0%;
        z-index:1000000;
        display:flex;
        justify-content: space-between;
      }

      div#mobile-nn-logo{
        height:100%;
        background:none;
        padding:0.2rem;
      }

       div#mobile-nn-site-name{
        height:100%;
        background:none;
        padding:0.4rem;
      }

      header.mobile-nn-header{
        position: relative;
        height: auto ;
        margin-top:none;
      }

     
      div.mobile-hero-bg{
        margin-top:none;
        position: absolute;
      
    
      }

      section.mobile-header-nagivation-mother{
        width:100%;
        height:10%;
        position: absolute;
        top:0%;
        background:none;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      section.mobile-header-nagivation{
        height:100%;
        background:none;
        display:flex;
        color:white;
      }

      div#mobile-header-nagivation-link{
        height:100%;
        padding:1rem;
        margin-right:5rem;
      }

      div.mobile-active-link{
        background:dodgerblue;
        border-bottom-left-radius:20px ;
        border-bottom-right-radius:20px ;
      }
      

      a.mobile-header-nagivation-link{
        text-decoration: none;
      }

      p#mobile-header-nagivation-link-name{
        color:white;
        font-weight: bold;
      }

      


      section.mobile-nemx-logo{
        width:100%;
        height:26%;
        background:none;
        position: absolute;
        top:10%;
        padding-top:1rem;
        display: flex;
        
        justify-content: center;
      }


      @font-face{
         font-family: 'SigmarOneLocal';
         src: url('SigmarOne.ttf')
         format('truetype');

      }

      p#mobile-nemx-logo{
        -webkit-text-stroke: 6px black;
        color:white;
        font-family: 'SigmarOneLocal';
        font-size: clamp(4em, 10.8vw, 10.8rem);
      }



 

    section.mobile-header-content-section{
      width:100%;
      height:54%;
      background:none;
      display: flex;
      padding:0 4rem 0 4rem;
       position: absolute;
      bottom:0%;
      justify-content: space-between;
    }

    section.mobile-header-content-section-left{
      width:30%;
      height:90%;
      background: none;
      margin-top:2%;
    }

    p#mobile-header-left-content-title{
      font-size:1.5rem;
      font-weight:lighter;
      margin-bottom:1rem;
    }

    p#mobile-header-left-content-paragraph{
      margin-bottom:1rem;
      word-spacing: 5px;
      line-height: 20px;
    }

    section.mobile-header-left-content-learn-more-section{
      width:100%;
      height:30%;
      background:none;
      display:flex;
      align-items: center;
    }

    div#mobile-header-left-content-learn-more-button{
      width:40%;
      height:50%;
      background:black;
      border-radius:2rem;  
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
    }

    p#mobile-header-left-content-learn-more-button-title{
      color:white;
      font-weight: bold;
    }

    div#mobile-header-left-content-learn-more-button-arrow{
      position: absolute;
      top:25%;
      right:-10%;
      background: white;
      border:0.1rem solid black;
      width:25%;
      height: 55%;
      border-radius:50% ;
      padding:0.3rem;
    }


    /* HEADER CONTENT SECTION RIGHT */

    section.mobile-header-content-section-right{
      width:30%;
      height:100%;
      background:none;
      display: flex;
      flex-flow:column;
      align-items:flex-end;
      padding:0.5rem;
    }

    section.mobile-profile-card{
      width:70%;
      height:100%;
      background:black;
      border-radius: 2rem;
    }

    img.mobile-profile-card{border-radius:2rem}

    div#mobile-profile-card-image{
       width:100%;
       height:60%;
       background:none;
       border-radius:2rem;
    }

    div#mobile-profile-card-content{
       width:100%;
       height:40%;
       background:none;
       display:flex;
       flex-flow:column;
       align-items: center;
    }


    p#mobile-authorization-section{
      margin-top: 1rem;
    }
    p#mobile-authorization-section,p#mobile-issueer-title{
      margin-bottom:1rem;
      color:white;
    }

    div.mobile-view-section{
      width:60%;
      height:30%;
      background:white;
      border-radius:2rem;
      padding:0.3rem;
      display: flex;
    }

    div#mobile-view-icon{
      width:30%;
      height:100%;
      background:black;
      border-radius:50%;
      padding:0.3rem;

    }

    div#mobile-view-button{
      width:70%;
      height:100%;
      display: flex;
      padding-left:1rem;
      align-items: center;
      background:none;
    }

    p#mobile-view-profile{
      font-weight:bold;
      color: black;
    }

    div#mobile-profile-username{
      width:100%;
      height:5%;
      display:flex;
      background:none;
      align-items: flex-start;
      padding-right :2rem;
      justify-content: flex-end;
      font-weight: bold;
    }





    /*  PRESENTING.... THE FUCKING MAIN */

    
    main.mobile-nemx-main-section{
      width:100%;
      height:100vh;
      background:none;
      display:flex;
    }
    

    
    
    /*  ASIDE  NAVIAGATION */


    aside.mobile-side-navigation{
      width:30%;
      height:100vh;
      background:rgb(24, 24 ,24);
      position: sticky;
      top:0%;
      padding-top:none;
    }



    div.mobile-sidenav-header{
      width: 100%;
      height:10%;
      background:rgb(24, 24 ,24);
      padding:0.2rem 11rem 0.2rem 1rem;
      margin-bottom:2rem;
    }


    section.mobile-sidenav-links-section{
      width:100%;
      height:100%;
      background:none;
      padding-right:1rem;
    }

    section.mobile-sidenav-link-container{
      width:100%;
      height: 10%;
      margin-bottom:1rem;
      display: flex;
      align-items: center;
      border-top-right-radius: 2rem;
      border-bottom-right-radius: 2rem;
      padding:0 0 0 1rem;
      color:white;
    }

    section#mobile-sidenav-link-container-active{
      background:dodgerblue;
      color:black;
    }

    div#mobile-sidenav-link-icon{
      width:13%;
      height:75%;
      background:none;
      padding:0.4rem;
      margin-right:0.5rem;
    }

    select.mobile-sidenav-link-selector{
      width:60%;
      padding: 12px 16px;
      font-size: 16px;
      color: white;
      background:none;
      /*border: 1px solid rgba(255,255,255,0.15);
      */
      border:none;
      appearance: none; /* removes default arrow */
      -webkit-appearance: none;
      -moz-appearance: none;
      margin-right:1rem;
      cursor: pointer;
      font-weight: bold;
    }
     
    section#mobile-sidenav-link.selector-acitve{color: black;}

    select::selection{border:none}


  
    section.mobile-links-options-without-section{
      width:100%;
      height:100%;
      background:none;
      padding-top:3rem;
    }

    div#mobile-sidenav-link-iconno-options{
      width:13%;
      height: 100%;
      padding:0.4rem;
      background:none;
    }
    
    section.mobile-sidenav-no-options-link-container{
      width:100%;
      height:8.5%;
      background:none;
      border-bottom-right-radius:2rem;
      border-top-right-radius:2rem;
      padding-left:1rem;
      display: flex;
      margin-bottom:1rem;
    }

    a#mobile-link-no-options-section, div#mobile-link-no-options-section{
      width:87%;
      height:100%;
      background:none;
    }

     a.mobile-link-no-options-section, div.mobile-link-no-options-section{
      width:72%;
      height:100%;
      background:none;
    }



    /* NUMBER OF BOOKS */


    div.mobile-number-of-books{
      width:15%;
      height:100%;
      background: none;
      display: grid;
      place-items: center;
    }

    div#mobile-number-of-books{
      width:55%;
      height:65%;
      background:dodgerblue;
      border-radius: 50%;
      font-weight: bold;
      display: grid;
      place-items: center;
      color:black;
    }


     div#mobile-link-no-options-section,div.mobile-link-no-options-section{
      padding-left:1.5rem;
      display: flex;
      align-items: center;
     }

     p#mobile-sidenav-no-options-link{
      font-weight: bold;
      font-size:1.1rem;
      color:white;
      font-family: Arial, Helvetica, sans-serif;
     }
  

     section.mobile-aside-profile-area{
      width:100%;
      height:15%;
      background:none;
      padding:0.3rem 0.3rem 0.3rem 1rem;
     }

     div.mobile-aside-profile-area-bar{
      width: 100%;
      height:100%;
      background: rgb(48, 48, 48);
      border-radius:1rem;
      padding:0.5rem;
      display: flex;
     }

     div#mobile-aside-profile-container{
      width:15%;
      height: 100%;
      padding:0.3rem;
      background:none;
     }

     div.mobile-aside-profile-container{
      width:100%;
      height:100%;
      border-radius: 50%;
     }

     div#mobile-aside-profile-info{
      width:70%;
      height:100%;
      background:none;
      color:white;
      font-weight: bold;
      padding:0 0 0 1rem;
      display: flex;
      flex-flow:column;
      justify-content: center;
     }

     div#mobile-aside-profile-icon{
      width:15%;
      height:100%;
      background:none;
      padding:0.3rem;
     }

     img#mobile-aside-profile-picture{border-radius:50%}

     p#mobile-aside-profile-name-title{
      font-size:1.1rem;
     }









    /*  Content FEED */ 

    main.mobile-main-content-feed{
      width:40%;
      background:none;
      border-left:0.1rem solid grey;
      border-right:0.1rem solid grey;
      padding:2rem 4rem 2rem 4rem;
      overflow-y: scroll;
    }