/* common to both */

body {
  font-family: 'Open Sans',sans-serif;
  margin: 0;
  padding: 0;
}

.noSelect {
  user-select:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -o-user-select:none;
  user-drag:none; -webkit-user-drag:none; -khtml-user-drag:none; -moz-user-drag:none; -o-user-drag:none;
}

.bg-blue {
  background-image:linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0,0,0,0.2)), url(../images/background_better.jpg);
}
.bg-green {
  background-image:linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0,0,0,0.2)), url(../images/background_green.jpg);
}

#content_middle2, #content_middle4Table {
  /* background-attachment:fixed; */ /* Didn't like it here... */
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  /*
    background-image:linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0,0,0,0.2)), url(../images/background_better.jpg);
  */
}

.footer {
  background: #292870;
  color: #fff;  
}

.column-1-3, .column-2-3, .column-3-3 {
  width: 32%;
  display: inline-block;
  margin:0; 
  padding:0;
  text-align: center;
  vertical-align: middle;  
  color: #fff;
  font-weight: bold;
  font-size: 1.2em;
}

.column-1-3 a, .column-2-3 a, .column-3-3 a {
  text-decoration: none;
  color: #fff;
}

@media screen and (max-width:640px){
  .column-1-3, .column-2-3, .column-3-3 {
    width: 100% !important;
    display: block !important;
  }
}

.titleList-4-Table {
  color:#efab47;
  font-size:16px;
  text-decoration:none;
  padding:0;
}
.titleList-4-Table:hover {
  color: #A13A16;
}

.ancor-4-subList {
  padding-bottom:5px;
  align-items:center;
  text-decoration:none;
}
.ancor-4-subList:hover {
  color:#A13A16;  
}

.table-container-4-subList {
    position:relative;
}

.table-border-4-subList {
    position:absolute;
    margin-left:11px;
    left:0;
    top:2px;
    height:calc(100% - 10px);
    border-left:2px solid #efab47;
}

.vertical-line {
    position: relative;
}
.vertical-line::before {
    content: '';
    position: absolute;
    left: 12px;
    top: 0;
    bottom: 28px;
    width: 2px;
    background-color: #EFAB47;
}

.displayNone {
  display:none;
}

.BlepeteToraHeader {
  font-size:1.8em !important;
  margin-top:0 !important;
}
@media screen and (max-width:640px){
  .BlepeteToraHeader {
    font-size:1.1em !important;
  }
}

.categTab {
  padding:4px 20px;
  border:1px solid #efab47;
  margin:10px;
  font-size:1rem;
}
@media screen and (max-width:640px) {
  .categTab {
    font-size:0.7rem;
  }
}

#crawlHelpDiv {
  float:right;
  border:2px solid #cc3333;
  border-radius:8px;
  padding:1px 5px;
  font-size:0.7rem;
  margin:-20px 0 -162px 0;
  background-color:black;
  color:white;
}

#crawlHelpTable {
  margin-bottom:2px;
}

@media screen and (max-width:900px) {
  #crawlHelpDiv {
    margin:-20px 0 -92px 0;
  }  

  #crawlHelpTable {
    font-size:1em;
  }  
}

@media screen and (max-width:640px) {
  #crawlHelpDiv {
    margin:-20px 0 -85px 0;
  }  

  #crawlHelpTable {
    font-size:0.9em;
  }  
}

.container {
  display: flex;
  flex-wrap: wrap;
}

.boxINcontainer {
  flex: 1 1 200px;
  min-width: 200px;
}

.thumb4cover {
  position:relative;
  display:inline-block;
}

.img4cover {
  padding:5px 8px 0 8px;
  height:215px;
  width:150px;
}

.corner-triangle {
  position: absolute;
  top: 5;
  right: 8;
  pointer-events: none; /* so clicks pass through */
}

.subListNumber2 {
  position:relative;   /* absolute positioning inside */
  border-collapse:collapse;
}

.subListNumber2::before {
  content: "";
  position: absolute;
  left:12px;                /* stick to the left side */
  top:25px;                 /* start 25 from the top */
  height:calc(100% - 32px); /* span of the table height */
  width:2px;                /* thickness of the "border" */
  background:#efab47;
}

#listInfo {
    margin-left:195px;font-size:0.8rem;
}

@media screen and (max-width:640px) {
  #listInfo {
    margin-left:20px;font-size:0.8rem;
  }
}

#schoolSelector {
    margin-top:-3px;font-size:0.8rem;
}

@media screen and (max-width:640px) {
  #schoolSelector {
    margin-top:-6px;font-size:0.7rem;
  }
}


.message2UserA {
  color: yellow !important;
  font-weight: 650;
}

#message2UserAll {
  position:absolute;
  z-index: 200;
  top:0;
  height:100%;
  width:100%;
}
#message2UserW {
  display:inline-block;
  position:fixed;
  top:30%;
  height:200px;
  width:300px;
  transform:translate(-150px,0);
  background-color:#DE8203;
  border:5px solid #ffdb81;
  border-radius:24px;
  box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
  -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}
#message2UserBG {
  display:block;
  height:100%;
  width:100%;
  background-color:black;
  opacity:0.5;
}
.message2UserButton {
  box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.55);
  -webkit-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.55);
  -moz-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.55);
  padding:4px;
  width:70px;
  color:#de8203;
  background-color:#ffdb81;
  border-radius:8px;
  font-weight:900;
}

.fakeAtag {
  cursor:pointer;
  color:#ffffee;
  text-decoration:underline;
}

/* 0: Free / 2: Subscription-Shown / 4: Subscription-Hidden / 9: FHW ONLY */

/* First cell inside CircleItemTR-2: 10px transparent, then colored */
tr._NOT-USED_CircleItemTR-2 > td:first-child, tr._NOT-USED_SquareItemTR-2 > td:first-child {
  background: linear-gradient(to right, transparent 26px, rgba(255, 0, 0, 0.5) 10px);
}
/* All other cells inside CircleItemTR-2: 100% solidly colored */
tr._NOT-USED_CircleItemTR-2 > td:not(:first-child), tr._NOT-USED_SquareItemTR-2 > td:not(:first-child) {
  background-color:rgba(255, 0, 0, 0.5);
}

.CircleItemTR-4 { display:none !important; }
.CircleItemTR-9 { display:none !important; }