/* PlanetCatfish ADDITIONAL Styles (e.g. not those present but altered from phpBB style)
 ---------------------------------------- */
@import url("/css/sm-blue.css");

body {
  background: none;
  font-family: Calibri, Tahoma, Verdana, Arial, Helvetica, sans-serif;
  background-color: white;
}

/* Header */
#pclayer0 {
  background: black;
  position: absolute;
  z-index: 10;
  width: 100%;
  left: 0px;
  height: 101px;
  top: 0px;
}

/* Dither */
#pclayer1 {
  background: black;
  background: linear-gradient(black, whitesmoke);
  position: absolute;
  z-index: 11;
  width: 100%;
  left: 0px;
  top: 100px;
  height: 28px;
}

/* Full Cat Graphic */
#pclayer2 {
  position: absolute;
  z-index: 12;
  left: 0px;
  top: 46px;
  width: 200px;
  height: 100px;
}

/* Half Cat Graphic */
#pclayer3 {
  position: absolute;
  z-index: 13;
  left: 0px;
  top: 46px;
  width: 110px;
  height: 100px;
}

/* Head Cat Graphic */
#pclayer4 {
  position: absolute;
  z-index: 14;
  left: 0px;
  top: 40px;
  width: 46px;
  height: 100px;
}

/* PlanetCatfish Graphic */
#pclayer5 {
  position: absolute;
  z-index: 15;
  left: 200px;
  top: 46px;
}

/* Sponsor */
#pclayer6 {
  position: absolute;
  z-index: 16;
  right: 2px;
  top: 52px;
  padding-bottom: 12px;
}

/* Smart menu */
#pclayer7 {
  position: absolute;
  z-index: 17;
  align-content: end;
  top: 0px;
}

/* Main content wrapper */
#pclayer8 {
  z-index: 0;
  width: 100%;
  position: absolute;
  top: 128px;
}

@media (max-width: 700px) {

  #pclayer0 { height: 107px;}  /* Header in black*/
  #pclayer1 { top: 106px; height: 28px;} /* Dither */
  #pclayer5 { top: 60px;     /* PlanetCatfish logo */
              left: 42px;
              height: 22px;
              background-image: url(/gif/branding/planetcatfish_black_small_responsive.gif);
              background-position: top left;
              background-repeat: no-repeat;}
  #pclayer6 { top: 0px; height: 60px;} /* Sponsor */
  #pclayer7 { top: 60px;} /* Smart menu */
  #pclayer8 { top: 123px;} /* Main content */

  .singlethird, .rhsthird, .doublethird, .rhsdoublethird, .ajax_quickfind_results {
      width: 98%;
    }

  .tablerowtitle1, .tablerowtitle2 {
    min-width: 10px;
  }
}

/* Move logo and sponsor text if screen wide*/
@media screen and (min-width: 1530px) {
  #pclayer5 {
    right: 2px;
    top: 52px;
  }

  #pclayer6 {
    top: 1px;
  }
}

#wrap {
  margin-top: 66px;
  /* Ensure quick links and everything afterwards sits under the PC header */
  max-width: 1700px;
}

.page-body {
  margin-top: 8px;
  margin-bottom: 8px;
  margin-right: 4%;
  margin-left: 4%;
}

.navbar {
  background: silver;
  background: linear-gradient(white, silver);
}

.forabg, .forumbg {
  background-color: gray;
  background-image: none;
  background: linear-gradient(to bottom, whitesmoke 0%, gray 2px, whitesmoke 92px, gray 100%);
}

a:link, .postlink, .button-secondary:focus, .button-secondary:hover, .button:focus .icon, .button:hover .icon, .signature a {
  text-decoration: none;
  font-weight: bold;
  color: purple;
}

a:visited, .postlink:visited, .signature a:visited {
  text-decoration: none;
  font-weight: bold;
  color: darkgreen;
}

a:active, .postlink:active, .signature a:active {
  text-decoration: none;
  font-weight: bold;
  background: green;
  color: yellow;
}

a:hover, .postlink:hover, .signature a:hover {
  border-radius: 2px;
  text-shadow: 0px 1px 0px black000;
  text-decoration: none;
  font-weight: bold;
  color: yellow;
  background: purple;
  background-image: linear-gradient(to bottom, indigo, purple);
}

.bg1 {
  background-color: whitesmoke;
}

.bg2 {
  background-color: silver;
}

.bg3 {
  background-color: lightgray;
}

.tabs .tab>a {
  background: lightgray;
  background-image: linear-gradient(to bottom, lightgray 0%, silver 100%);
  color: black;
}

.tabs .tab>a:hover {
  text-decoration: underline;
  background: lightgray;
  color: black;
}

.tabs .activetab>a, .tabs .activetab>a:hover {
  background-color: silver;
  background-image: linear-gradient(to bottom, lightgray 10%, silver);
  border-color: lightgray;
  box-shadow: 0 1px 1px whitesmoke inset;
  color: dimgray;
}

.tabs .activetab>a:hover {
  text-shadow: none;
  color: black;
}

.navigation a {
  color: purple;
  background: lightgray;
  background: linear-gradient(to right, lightgray 66%, silver);
}

.navigation a:hover {
  color: yellow;
  background: purple;
  background: linear-gradient(to right, purple 66%, silver);
}

.navigation .active-subsection {
  color: dimgray;
  background: purple;
}

.navigation .active-subsection a:hover {
  text-shadow: none;
  background: white;
}

.dropdown-extended .header {
  background-color: whitesmoke;
  background-image: linear-gradient(to bottom, whitesmoke 0%, silver 100%);
}

ul.forums {
  background-color: silver;
  background-image: linear-gradient(to bottom, lightgray 0%, silver 100%);
}

li.row {
  border-top-color: white;
  border-bottom-color: dimgray;
}

li.row:hover {
  background-color: whitesmoke;
}

.content h2, .panel h2 {
  color: black;
  border-bottom-color: silver;
}

ul.forums {
  background-color: lightgray;
}

ul.topiclist li {
  color: gray;
}

.panel {
  background-color: whitesmoke;
}

.bg1 {
  background-color: lightgray;
}

.bg2 {
  background-color: lightgray;
}

.bg3 {
  background-color: silver;
}

#tabs .tab>a {
  background: lightgray;
  color: purple;
}

#tabs .tab>a:hover {
  border-radius: 2px;
  text-shadow: 0px 1px 0px black000;
  text-decoration: none;
  font-weight: bold;
  color: yellow;
  background: purple;
  background-image: linear-gradient(to bottom, indigo, purple);
}

#tabs .activetab>a, #tabs .activetab>a:hover {
  background: silver;
  background: linear-gradient(to bottom, silver 0%, lightgray 100%);
  border-color: lightgray;
  box-shadow: 0 1px 1px whitesmoke inset;
  color: dimgray;
}

#tabs .activetab>a:hover {
  color: black;
}

input {
  font-size: small;
}

.greendownarrow {
  float: right;
  padding-right: 10px;
}

.notextwrap {
  white-space: nowrap;
}

a:hover.no_background {
  background: transparent;
}

/* -----------------------------------------------------------------------------------------------
 PC specific CSS (if it begins with arn_ then it SHOULD be used in common/css but be locally defined)
 ------------------------------------------------------------------------------------------------*/
#ajax_quickfind_results {
  box-shadow: 0px 0px 32px darkgrey;
}

.arn_heading {
  background-color: lightgray;
  border: 1px solid #111111;
  text-shadow: 0px 1px 0px whitesmoke;
  border-radius: 8px 8px 0px 0px;
  box-shadow: inset 2px 4px 8px lightgray;
  border-left: 1px;
  border-right: 1px;
  border-top: 1px;
  border-bottom: 1px solid green;
  background: linear-gradient(lightgray, whitesmoke);
}

.article {
  padding: 12px;
  border-radius: 4px;
  background: whitesmoke;
  background: linear-gradient(whitesmoke, white);
}