body {
   background: black;
   background-image: url("https://overthesea.neocities.org/nitw/images/background.jpg");
   background-size: cover;
   height: 100%;
   margin: auto;
   margin-top:10px
   padding: 5px;
   font-family: 'nitw', Tahoma;
   font-weight: regular;
   display:flex;
   align-items: center;
   justify-content: center;
   color:white;
}

   @font-face {font-family: 'nitw';
 src: url('https://overthesea.neocities.org/nitw/nitw.otf');}
      

h1,
h2 {
   text-align: center;
   font-family: 'nitw';
   font-weight:normal;
      
}
h1 {
   font-size: 3em;
   margin-bottom:20px
}

h2 {
   font-size: 2em;
   margin-bottom:20px
}

h3 {
   margin-top: 15px;
   font-weight:bold;
}

a {color:orangered}

summary {
  cursor: pointer;
}

img 
{max-width:100%}


/* containers */

 .container {
        width:80%;
    max-width:1400px;
        height:auto;
     background:none;
        padding: 0px;
        margin: 0 auto;
      margin-top:2%;
      margin-bottom:5%;
      display:flex;
      border:none;
     opacity:1;
    color:white;
                }

.sidebarl {
   font-size:14px;
   border:0px dashed rgba(255, 255, 255, 1);
   height:auto;
   padding-top: 5px;
   padding-bottom: 5px;
   overflow:auto;
   flex:25%;
   margin:10px;
   order: -1;
     }

.sidebarr {
   font-size:14px;
   border:0px dashed rgba(255, 255, 255, 1);
   height:auto;
   padding-top: 5px;
   padding-bottom: 5px;
   overflow:auto;
   flex:25%;
   margin:10px;
   order: 5;
  }

 main {
     padding: 5px;
     margin: 5px;
     color:white;
     flex:50%;
     height:auto;
     border:0px dashed white;
     order: 2;
}

.box {
     overflow-y:scroll;
     box-shadow: 0px 0px 22px 0px rgba(0,0,0,0.65);  
}

.about {
   background:rgba(0, 0, 0, 0.8);
   border-radius:20px;
    height:27em;
   margin:10px 0px 10px;
}

 p {margin:10px}

.notebook {color:black;
   border-radius:5px;
    border: 4px solid black;
    background:ivory;
    height:200px;
    margin:5px;
    padding: 0px 0px 7px}

.doodle {width:80%;
height:auto}

.sbbox{ background:rgba(0, 0, 0, 0.8);
   border-radius:20px;
    height:250px;
   margin:10px 0px 10px;}


/* details */

::selection {
  background: rgba(255, 0, 0, 0.4);
}

  .link:hover {
    transition: 0.4s;
  filter:drop-shadow(0 0 0.75rem rgba(255,255,255,0.8))
  } 
  
  .glow:hover {
    transition: 0.4s;
  filter:drop-shadow(0 0 0.75rem rgba(255,255,255,0.5))
  }
  
    .glow {
    transition: 0.9s;

  }


@media(max-width:750px){
 
   
   .container {
        display:flex;
        flex-direction: column;
        margin:0px auto;
        margin-top:1%;
        width:90%;
      }
   
   main {
        flex:100%;
        order:1;
        height:auto;
      }

    .sidebarl {
        flex:100%;
        order:7;
        height:auto;
      }
   
       .sidebarr {
        flex:100%;
        order:5;
        height:auto;
      }
      
      .notebook {height:400px;}
   
  .about {
     height:auto;}