/* NOTES */

/* Later rules override earlier ones */
/* JS rules are linked to Javascript scripts */

/* TOP LEVEL */
* {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  font-family: Arial, Helvetica, sans-serif;
}

.item,
.whole,
.threequarter,
.twothird,
.half,
.third,
.quarter,
.error {
  width: 100%;
  float: left;
  position: relative;
  padding: 0px;
}

.column_left {
  float: left;
  width: 25%;
}
.column_main {
  float: left;
  width: 50%;
  height: 100%;
}
.column_right {
  float: left;
  width: 25%;
}

.thepage {
  max-width: 1000px;
  margin: auto;
}

.right {
  float: right;
}

p {
  padding: 10px;
  margin: 0px;
}

.larger {
  font-size: 150%;
}

.overalltheme h1 {
  font-size: 500%;
  font-family: "Caveat", cursive;
  padding: 0px 25px 10px 25px;
  margin: 0px;
}

.overalltheme {
  background: url(https://www.ex1st.com/images/site/overwave.png) repeat;
  background-attachment: fixed;
}

form .quarter {
  text-align: right;
  padding: 10px;
}
form input[type="text"],
input[type="email"],
form select,
form .button {
  padding: 10px;
  border: 1px solid #cccccc !important;
  width: 100%;
  vertical-align: text-top;
  font-size: 100%;
  background-color: #ffe6ff;
}

form .button {
  background-image: linear-gradient(to bottom, #44b0e8, #3299df);
  border-radius: 5px;
  margin: -10px;
  font-weight: bold;
  color: white;
}

form input:focus {
  background-color: #cce5ff;
}

/* PARAGRAPHS */
.wide {
  line-height: 180%;
  padding: 25px;
  width: 100%;
}

.wide-para {
  line-height: 180%;
  padding: 25px;
  border-top: 1px solid #888888;
  min-height: 150px;
  width: 100%;
}
.wide-para-img {
  float: left;
}
.wide-para-text {
  margin: 0px 0px 0px 125px;
  display: block;
}

/* TEXT ON BLACK */
.onblack {
  color: #ffffff;
  background-color: #000000;
}
.onblack a:link {
  color: #bbbbbb;
}
.onblack a:visited {
  color: #bbbbbb;
}
.onblack a:hover {
  color: #666666;
}
.onblack a,
.onblack a img {
  text-decoration: none;
}

/* TEXT ON WHITE */
.onwhite {
  color: #000000;
  background-color: #ffffff;
}
.onwhite a:link,
a:link {
  color: #444444;
}
.onwhite a:visited,
a:visited {
  color: #444444;
}
.onwhite a:hover,
a:hover {
  color: #999999;
}

/* MENU BAR */
.menu {
  background: url(https://www.ex1st.com/images/site/overlay.png) repeat;
  color: #ffffff;
  z-index: 10;
}
.menuicon {
  height: 32px;
  width: 52px;
}
.menuicon:active,
.menuicon:hover {
  -webkit-filter: invert(100%) !important;
  filter: invert(100%);
}

/* MENU DROP */
.menutiem,
.submenu p {
  margin-bottom: 1px;
}
.menutiem:hover,
.submenu p:hover {
  border-bottom: 1px solid #ccc;
  margin-bottom: 0px;
}
.menutiem img,
.submenu p img {
  vertical-align: middle;
}

.submenusubJS {
  display: none;
}

/* MENU TOP */
.menutop {
  height: auto;
  width: 100%;
  background: url(https://www.ex1st.com/images/site/shadow.png) no-repeat;
  background-size: 100%;
  /*background-position: center; for small screens see format-divisions.css */
  position: fixed;
  z-index: 5;
}

/* NAVTAB LINK */
.navtab {
  line-height: 120%;
  background: url(https://www.ex1st.com/images/site/overlay.png) repeat;
  color: #ffffff;
  border-radius: 10px;
  box-shadow: 0px 0px 4px #000000;
}

/* TABS */
.tabs {
  background-color: #ff1493;
  font-size: 90%;
  border-top: 1px solid #888888;
  color: #ffffff;
}
.tabs a:link {
  color: #ffffff;
}
.tabs a:visited {
  color: #ffffff;
}
.tabs a:hover {
  color: #ffffff;
}

.activetab,
.inactivetab {
  padding: 10px 15px 10px 10px;
  display: inline-block;
}
.inactivetab {
  background: url(https://www.ex1st.com/images/site/inactivetab.png) no-repeat;
  background-position: right center;
  background-color: #ff1493;
}
.activetab {
  background: url(https://www.ex1st.com/images/site/activetabend.png) no-repeat;
  background-position: right center;
  background-color: #ff00ff;
}
.activetabpre {
  background: url(https://www.ex1st.com/images/site/activetabsta.png) no-repeat;
  background-position: right center;
}

/* SLIGHT FIXES */
/* .menu, .submenusubJS { padding-top:5px; }

/* BASKET */
.basket {
  line-height: 120%;
  background-color: #ff1493;
  color: #ffffff;
  border-radius: 10px;
  box-shadow: 0px 0px 4px #000000;
}
.basket-order a,
.basket a {
  font-weight: bold;
  text-decoration: none;
  font-size: 90%;
  color: #ffffff;
}
.basket-bubble {
  float: left;
  padding: 10px;
  border-radius: 10px;
}
.basket-order {
  background-color: #ff00ff;
  border-radius: 10px;
  width: 100%;
} /* box-shadow: 0px 2px 8px #000000; */
#basket,
#basket .basket-bubble {
  border-radius: 0px;
}
.basket-pop {
  border: 2px solid #ff00ff;
  border-radius: 10px;
  padding: 10px;
}

/* LIGHTBOX */
#lightbox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(https://www.ex1st.com/images/site/overlay.png) repeat;
  text-align: center;
  z-index: 20;
}

/* WIDE SCREEN TOGGLE */
.widescreen {
  display: none;
}
.narrowscreen {
  display: block;
}

/* ERROR */
.error {
  line-height: 180%;
  padding: 25px;
  color: #000000;
  background: url(https://www.ex1st.com/images/site/bg-error.png) repeat;
  background-position: center;
  background-color: #ff9900;
}
.error a:link {
  color: #ffffff;
}
.error a:visited {
  color: #ffffff;
}
.error a:hover {
  color: #ffffff;
}

.error:before {
  font-family: Caveat;
  font-style: normal;
  font-size: 300%;
  padding-bottom: 20px;
  display: block;
  content: "Hey!";
}

.confirm {
  line-height: 180%;
  padding: 25px;
  color: #000000;
  background: url(https://www.ex1st.com/images/site/bg-confirm.png) repeat;
  background-position: center;
  background-color: #00cc00;
}

/* USER STUFF #0066ff */