/*      OVERALL SITE START      */  

  /*page starter*/
  body {font-family: sans-serif; font-size: 0.9em; letter-spacing:.7px;line-height:18px;}
  
  /*all content container*/
  .wrapper {
      width: 1150px; top: 0; 
      margin: 0 auto;
      margin-top: -10px;
      margin-bottom: -10px; 
      }  
      
  /*left/middle/right container*/
  .sectionwrapper {
      position: relative;
      }
  
  /*header + footer*/
  .header, .footer {
      height: 250px; 
      }
  .footer {
      height: 50px;
      }
  .header img {
      border-top: 0;
      }
  
  /*title section*/
  .title {
      padding: 15px 10px 10px 20px;
      margin-top:7px;
      }
  .title h1, .title h2, .title h3 {
      padding:0; margin: 0;
      }
  
  /*top row links container*/
  .links {
      padding: 5px; 
      padding-top: 3px; 
      padding-bottom: 5px;
      }
      
  .link {
      text-align: center;
      display: inline-block;
      font-weight: bold;
      font-size: 1.16em;
      padding: 5px;
      margin-right: 10px;
      margin-left: 10px;
      }
  
  /*left/middle/right boxes*/
  .left, .middle, .right, .main {
      display: inline-block;
      }
  .left, .right {
      width: 200px;
      position: absolute;
      top: 0;
      }
  .left {
      margin-left: 10px;
      }
  .right {
      margin-right: 10px;
      margin-left: 10px;
      }
  .middle {
      margin-left: 220px;
      width: 710px;
      }
  .main {
      margin-left: 20px;
      width: 1110px;
      }
  
  /*content sections*/
  .section {  
      padding: 10px 10px 10px 10px;
      margin: 10px 0px 15px 0px;
      box-sizing:border-box;
      }
  .section img {
      max-width: 100%;
      height: auto;
      }
  
  .textbox {
    padding:10px;
    box-sizing:border-box;
    }

  /*details section*/
  
  details > summary {
      padding: 6px;
      border: none;
      cursor: pointer;
      overflow: auto;
      }
            
  details > p {
      padding: 7px;
      margin: 0;
      } 
      
  hr {margin: 10px 0 10px 0;}
  
  /*gallery section*/
  #gallery {
    line-height:0;
    -webkit-column-count:3; 
    -webkit-column-gap:3px; 
    -moz-column-count:3;
    -moz-column-gap:3px;
    column-count:3;
    column-gap:3px;
    }

  #gallery img {
    width: 100% !important;
    height: auto !important;
    margin-bottom:5px; /* to match column gap */
    }
  
/*      OVERALL SITE END      */  

      /*divider*/

/*      MAIN SITE IDS START      */  
  #mainbody {
    background: #7fa8c7;
    color: #d5dbd6;
    }
  #mainbody a {color: #7fa8c7;}
  #mainwrapper {
    background: #252633;
    }
  #mainheader {
    background: #252633 url("https://file.garden/ZUJ1y6E0phfIGDZw/Neocities/headers/Marcus");
    overflow: hidden;
    background-size:cover;
    }
  #mainfooter {
    background: #252633;
    }
  #mainlink a {
    color: #f9dfc9;
    }
  #mainsection {
    color: #0d0c14;
    background: #d6dbd6;
    border-top: 5px solid #3b4650;
    border-bottom: 5px solid #3b4650;
    }
  #maintextbox {
    border:3px solid #7fa8c7;
    }
  /*gallery code 1*/
  .gallerycontainer{
  display: flex;
  flex-direction: column; 
  justify-content: space-around;
  }
  .gallerycontainer figure img {margin:10px;height:100%;}
  .gallerycontainer figcaption {text-align:center;padding-bottom:10px;}
  .slideshow-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    }
  .image-gallery {display: flex;}
  .image-container {width:100%;height: 100%;}
  .image-container img {width: 100%; height: 100%;}
          
  .top-img-container {
    display:flex;
    text-align: center;
    margin-top: 2px;
    height:100px;
    overflow-x:scroll;
    }
  .top-img {
    height: 75px; 
    width: auto;
    margin: 0 5px; 
    cursor: pointer;
    }
    
  /*gallery code 2*/
  .image-container-2 {width:100%;height: 100%;}
  .image-container-2 img {width: 100%; height: 100%;}
          
  .top-img-container-2 {
    display:flex;
    text-align: center;
    margin-top: 2px;
    height:100px;
    overflow-x:scroll;
    }
  .top-img-2 {
    height: 75px; 
    width: auto;
    margin: 0 5px; 
    cursor: pointer;
    }
/*      MAIN SITE IDS END      */

      /*divider*/

/*      CHARACTERS START      */
  /*main character page*/
  .oc-container {
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    text-align:center;
    box-sizing: border-box;
    }
  .ocbox {
    width: calc((100% / 4) - 10px);
    padding: 5px; margin: 5px;
    border: 3px solid #7fa8c7;
    box-sizing:border-box;
    color:#222;
    text-decoration:none;
    }
  .ocbox b {
    color:#5c2e13;
    }
    
  .ocbox img {
    width:100%;
    }
    
  .oc-section{display: flex;}
    
  .ocleft {
    margin-left: 10px;
    width:calc(28% - 20px);
    float:left
    }
  
  .ocright {
    margin-right: 10px;
    margin-left: 10px;
    width:calc(72% - 20px);
    float:right
    }
  
  /*individual character pages*/
  .pagedoll {
    max-height: 200px;
    position: fixed;
    right: 1px;
    bottom: 10px;
    z-index: 100;
    }
  .rowcontain {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    }
  .inforows {
    
    font-size: 15px;
    }
  .info {
    display: block;
    text-align: right;
    font-size: 10px;
    letter-spacing: 2px;
    }
    
  .size{font-size:3rem;}
      
  .ribbon {width:20%;}
      
  .item, .shipimg {width:30%;}
      
  .shipinfo {padding:5px;}

/*      CHARACTERS END      */