@charset "utf-8";

body {
    font: 14px "Calibri", Arial, sans-serif;background-color:#251F22;color:#eee;
    
}
.body-light {background-color:#fff;color:#111; }
.entirepage {width:100%;color:#eee;} 
.entirepage-light {width:100%;color:#111;} 
.topinfobar {color:#883;background-color:#251F22;width:100%;}
.topinfobar-light{color:#883;background-color:#ffffff;width:100%;}
.toptitebar {border:1px solid; border-color:#ccc; background-color:#251F22; width:100%;border-radius:1px;}
.toptitebar-light {border:1px solid; border-color:#24d; background-color:#fff;  width:100%;border-radius:1px;}

.title {font-size:26pt;}
.title-light {font-size:26pt;}
.subtitle {font-size:22pt;}
.subtitle-light {font-size:22pt;}
.counter {font-size:24pt; text-align:center;}
.counter a:link {font-size:24pt; }

.biglinks {text-align:center;}
.biglinks-light {text-align:center;}
.biglinks a:link {color: rgba(251, 255, 0, 0.788);}
.biglinks a:visited {color: rgb(255, 123, 0);}
.biglinks a:hover {color: rgb(255, 0, 0);}
.biglinks a:active {color: blue;}
.biglinks-light a:link {color: rgb(55, 0, 255);}
.biglinks-light a:visited {color: rgb(234, 0, 255);}
.biglinks-light a:hover {color: rgb(255, 0, 0);}
.biglinks-light a:active {color: rgb(0, 255, 0);}

.linksicon {width:32px;height:32px;display:block;}

.pagesettings {background-color: #453F42; border: 2px solid rgba(30, 21, 80, 0.5);border-radius: 4px;}
.pagesettings-light {background-color: #ddd; border: 2px solid #666;border-radius: 4px;}
.pagesettings input {width:31px; height:28px;vertical-align:text-top;}
.pagesettings-light input {width:31px; height:28px;vertical-align:text-top;}
.viewsettings {background-color: #453F42; border: 1px solid rgba(30, 21, 80, 0.5); margin-top: -2px;border-radius:  4px;}
.viewsettings-light {background-color: #ddd; border: 1px solid #666; margin-top: -2px;border-radius:  4px;}
.viewsettings input {width:31px; height:28px;vertical-align:text-top;}
.viewsettings-light input {width:31px; height:28px;vertical-align:text-top;}
.viewsettings2 {background-color: #453F42; border: 1px solid rgba(30, 21, 80, 0.5); margin-top: -2px;border-radius:  4px;}
.viewsettings-light2 {background-color: #ddd; border: 1px solid #666; margin-top: -2px;border-radius:  4px;}
.viewsettings2 input {width:31px; height:28px;vertical-align:text-top;}
.viewsettings-light2 input {width:31px; height:28px;vertical-align:text-top;}
.pageview {border:12px solid rgba(30, 21, 80, 0.5);display:block;border-radius:20px;}
.pageview2 {border:2px solid  rgba(30, 21, 80, 0.5);display:flex;}
.pageview-light {border:12px solid rgb(0, 225, 255);display:block;border-radius:20px;}
.pageview2-light {border:2px solid #067;display:flex;}
.sectiontitle {border-bottom:3px solid #000; display:inline-flex;}
.sectiontitle-light {border-bottom:3px solid #9f9; display:inline-flex;}
.sectiontitle input {width:26px; height:24px;vertical-align:text-top;}
.sectionimgdiv {width:120px;height:160px;padding:20px;display:inline;}



.topsection {padding:5px; display:flex;}
.imageholder img {width:312px;height:312px;padding:5px;display:inline;border-radius:27%;}
.captionholder {padding:5px; padding-left:30px; display:inline-block;font-size:18px;}
.biglinks {display:inline-flex;padding:7px;color:#eee;}
.biglinks-light {display:inline-flex;padding:7px;color:#eee;}
.links {padding:12px;display:block;margin:auto}
.titlebar {display:block}
.image1 {display:block;margin:10px;height:auto;text-align:center;align-items:flex-start}
.info1 { text-align:center}
.image2 {display:block;margin:10px;height:auto;text-align:center;align-items:flex-start}
.info2 {text-align:center}
.image3 {display:block;margin:10px;height:auto;text-align:center;align-items:flex-start}
.info3 { text-align:center}
.image4 {display:block;margin:10px;height:auto;text-align:center;align-items:flex-start}
.info4 { text-align:center}
.picpic {width:100%}
.bigpic {width:100%;height:auto;align-items:flex-start;display:block;}
.football {text-align:right}
.dsquare:focus {outline: solid;border-radius:3px;}
.dsquare:hover {outline: solid 4px;border-radius:3px;}
.dsquare {
    float: left;
    align-items:bottom;
    
    margin-right: 3px;
    margin-left: 3px;
    margin-top: 2px;
    margin-bottom: 3px;
    padding: 0;
    border-radius:3px;
    width: 48%;
  }
.clear {clear:both;}

.image-caption-wrap {
    position: relative;
    top:200px;
    margin-left:6px;
    margin-top: 5px;
    line-height: 1.15;
    display: flex;
    flex-flow: row-reverse;
    align-items: center;
    padding: 15px 20px;
    width: 256px;
    height:auto;
  }
   .image-caption-wrap:before {
    content: '\f05a';
    font-size: 2em;
  }
  .image-caption {
    opacity: 0.01;
    padding-right: 10px;
  }
  .image-caption-wrap:hover .image-caption {
    opacity: 0.9;
    color: #fff;
  }
  .image-caption-wrap:hover .Isquare .image-caption-wrap:hover{
    outline: solid 4px; border-radius:3px;
    
  }
  .image-caption-wrap:hover {
    background: black !important;
    opacity: 0.6 !important;
  }
  .board-row:after {
    clear: both;
    content: "";
    display: table;
    text-align:center;
  }
  .game-board {
    clear: both;
    content: "";
    display: table;
    text-align:center;
  }
  .Isquare {
    background: #fff;
    border: 1px solid #999;
    float: left;
    align-items:bottom;
    height: 300px;
    margin-right: 3px;
    margin-left: 3px;
    margin-top: 2px;
    margin-bottom: 3px;
    padding: 0;
    text-align: center;
    width: 300px;
  }
  .Isquareplug {
    background: #fff;
    
    float: left;
  
    margin-right: 3px;
    margin-left: 3px;
    margin-top: 2px;
    margin-bottom: 3px;
    padding: 0;
    text-align: center;
   
  }
  .Isquare:focus {
    outline: solid;border-radius:3px;
  }
  .Isquare:hover {
    outline: solid 4px; border-radius:3px;
  }