/****************************************
*  Site specific css definitions
****************************************/

html,
body {
  background:#FFFFFF;
  text-align:center;
}

div.void {
  border:0px;
  margin:0px;
  padding:0px;
  height:1px;
  width:1px;
  max-height:1px;
  max-width:1px;
  font-size:1px;
  line-height:1px;
  visibility:hidden;
}

table.page {
  width:998px;
  margin:0px auto 0px auto;
}

div.divider {
  border:0px;
  margin:10px 0px 20px 0px;
  height:1px;
  max-height:1px;
  font-size:1px;
  line-height:1px;
  background:#A4CD87;
}

td.main {
  background:#ffffff url(/images/layout/stitches-bg.jpg);
  background-position:50% 0%;
}

/******************************
  Background Color Styles
*******************************/

.bg-purple {
  background-color:#b39cca;
}

.bg-burlap {
  background-color:#ffd987;
}

.bg-lily {
  background-color:#ca9cb3;
}

/******************************
  Header Styles
*******************************/

td.header {
  height:150px;
}

td.header td.logo {
  width:345px;
}

td.header td.logo img {
  margin:55px 41px 0px 42px;
}

/******************************
  Navigation Styles
*******************************/

td.navigation {
  padding-right:42px;
}

td.navigation a {
  color:#6e6e6e;
}

div.menu div.sub-menu {
  font:normal 20px/24px 'CooperHewitt', Arial;
  text-transform:uppercase;
  text-align:right;
  margin-top:0px;
}

div.menu div.sub-menu a {
  display:inline-block;
  padding:30px 10px 10px 10px;
  position:relative;
  transition:0.3s all;
}

div.menu div.sub-menu a:hover {
  color:#a4cd87;
}

div.menu div.sub-menu a + a:before {
  content:"\25aa";
  position:absolute;
  color:#6e6e6e;
  left:-5px;
}

div.menu div.button-menu {
  margin-bottom:40px;
}

div.menu div.button-menu input {
  font:normal 20px/20px 'CooperHewitt', Arial;
  padding:20px 70px 19px 25px;
  width:300px;
  border:1px solid #9e9fa2;
}

div.menu div.button-menu div {
  position:relative;
  display:inline-block;
  float:right;
  
}

div.menu div.button-menu div img {
  position:absolute;
  right:24px;
  top:16px;
  cursor:pointer;
}

div.menu > ul > li {
  font:normal 26px/32px 'CooperHewitt', Arial;
  text-transform:uppercase;
  position:relative;
  display:inline-block;
}

div.menu > ul > li a {
  transition:0.3s all;
}

div.menu > ul > li:hover a {
  color:#a4cd87;
}

div.menu > ul > li + li {
  margin-left:24px;
}

div.menu ul {
  list-style:none;
  padding:0px;  
}

div.menu > ul > li li{
  font:normal 20px/24px 'CooperHewitt', Arial;
  text-transform:none;  
}

div.menu > ul > li li + li {
  border-top:2px solid #ededed;
}

div.menu > ul > li li:hover a {
  color:#ffffff;
  background:#a4cd87;  
}

div.menu > ul > li li a {
  padding:22px 0px 22px 22px;
  display:block;
  transition:0.3s all;
}

div.menu > ul > li > ul {
  max-height:0;
  position:absolute;
  background:#ffffff;
  border-left:1px solid #777777;
  border-right:1px solid #777777;  
  z-index:99;
  width:200px;
  left:calc(50% - 100px);
  overflow:hidden;
  transition:0.3s all;
}

div.menu > ul > li > ul li:first-child {  
  border-top:1px solid #777777;
}

div.menu > ul > li > ul li:first-child > a { 
  padding:42px 0px 22px 22px;
}

div.menu > ul > li > ul:before {
  content:"\25be";
  color:#f2a332;
  position:absolute;
  top:-13px;
  border-radius:50%;
  border:1px solid #777777;
  left:calc(50% - 15px);
  background:#ffffff;
  padding:0px 10px;
}

@-moz-document url-prefix() { 
  div.menu > ul > li > ul:before {
     padding:0px 5px !important;
  }
}

div.menu > ul > li:hover > ul,
div.menu > ul > li#sub-on > ul {
  max-height:500px;
  border-bottom:1px solid #777777;
}

/******************************
  Top Content Styles
*******************************/

td.top-content {
  height:450px;
  background-image:url('/images/layout/fabric-bg.png');
  position:relative;
  overflow:hidden;  
}

div.skew-upper,
div.skew-lower {
  background:#ffffff;
  height:100px;
  position:absolute;
  right:0px;
  left:0px;
}

div.skew-upper {
  transform:skewY(-2deg);
  top:-50px;
}

div.skew-lower {
  transform:skewY(2deg);
  bottom:-50px;
  overflow:hidden;
}

div.skew-lower div {
  background:#ffffff url('/images/layout/stitches-bg.jpg');
  transform:skewY(-2deg);
  background-position:50% 100%;
  margin-top:-120px;
  height:200px;
}

td.top-content td.body {
  vertical-align:middle;
  padding:0px 400px 0px 42px;
  background-repeat:no-repeat;
  background-position:100% 70%;
  background-size:48%;
}

/******************************
  Column One Styles
*******************************/

td.main td.col-one {
  width:380px;
}

td.main td.col-one td.body {
  padding:0px 21px 63px 42px;
}

td.col-one img {
  margin:0px auto 30px auto;
}

table.upcoming-events tr td:first-of-type p {
  display:inline-block;
  width:85px;
  background:#77787b;
  color:#FFFFFF;
  font-size:26px;
  line-height:28px;
  padding:10px 0px 8px 0px;
}

table.upcoming-events td + td {
  padding-left:20px;
  vertical-align:middle;
}

/******************************
  Column Two Styles
*******************************/

td.main td.col-two td.body {
  padding:0px 42px 63px 21px;
}

/******************************
  Page Overlay Styles
*******************************/

div.overlay {
  position:fixed;
  height:100%;
  width:100%;
  top:-101%;
  left:0px;
  background:rgba(110, 110, 110, 0.9);
  z-index:999;
  overflow:auto;
  text-align:center;
  transition:all 1s;
}

div.overlay-on {
  top:0px;
}

div.overlay td.body {
  vertical-align:middle;
  text-align:center;
}

div.overlay td.body > div {
  margin:40px 0px 40px 0px;
}

div.overlay td.content {
  width:100%;
  max-width:650px;
  padding:42px;
  background:#FFFFFF;
}

div.overlay a.close {
  float:right;
  margin:-15px -15px 0px 0px;
  border-radius:50%;
  border:2px solid #6a6a6a;
  padding:7px 10px;
  font:normal 30px/30px Arial;
  color:#6a6a6a;
}

div.overlay a.close:hover {
  background:#6a6a6a;
  color:#FFFFFF;
}

/******************************
  Text Styles
*******************************/

@font-face {
  font-family:'CooperHewitt';
  src:url('/library/fonts/CooperHewitt-Book-webfont.eot');
  src:url('/library/fonts/CooperHewitt-Book-webfont.eot?#iefix') format('embedded-opentype'),
       url('/library/fonts/CooperHewitt-Book-webfont.woff2') format('woff2'),
       url('/library/fonts/CooperHewitt-Book-webfont.woff') format('woff'),
       url('/library/fonts/CooperHewitt-Book-webfont.ttf') format('truetype'),
       url('/library/fonts/CooperHewitt-Book-webfont.svg#cooper_hewittbook') format('svg');
  font-weight:normal;
  font-style:normal;
}

@font-face {
  font-family:'CooperHewitt';
  src:url('/library/fonts/CooperHewitt-Bold-webfont.eot');
  src:url('/library/fonts/CooperHewitt-Bold-webfont.eot?#iefix') format('embedded-opentype'),
       url('/library/fonts/CooperHewitt-Bold-webfont.woff2') format('woff2'),
       url('/library/fonts/CooperHewitt-Bold-webfont.woff') format('woff'),
       url('/library/fonts/CooperHewitt-Bold-webfont.ttf') format('truetype'),
       url('/library/fonts/CooperHewitt-Bold-webfont.svg#cooper_hewittbold') format('svg');
  font-weight:bold;
  font-style:normal;
}

p,
li {
  font:normal 18px/26px 'CooperHewitt', Arial;
  color:#6e6e6e;
  margin:0px 0px 14px 0px;
}

td.footer p {
  color:#ffffff;
  line-height:28px;
  border-right:1px solid #929292;
}

li {
  margin:0px 0px 0px 0px;
}

ul {
  margin:0px 0px 10px 0px;
}

div.nomargin p:first-of-type {
  margin-top:-14px;
}

h1 {
  font:bold 50px/50px 'CooperHewitt', Arial;
  color:#545454;
  text-align:left;
  text-transform:uppercase;
  margin:42px 0px 7px 0px;
}

h2 {
  font:bold 50px/50px 'CooperHewitt', Arial;
  color:#a4cd87;
  margin:0px 0px 14px 0px;
  text-transform:uppercase;
}

td.main h2:not(:first-child) {
  margin:40px 0px 14px 0px;
}

h3 {
  font:bold 24px/32px 'CooperHewitt', Arial;
  color:#6e6e6e;
  margin:0px 0px 14px 0px;
}

td.footer h3 {
  font:normal 30px/36px 'CooperHewitt', Arial;
  color:#ffffff;
  margin:0px 0px 30px 0px;
}

td.top-content h3 {
  color:#545454;
  font:normal 30px/36px 'CooperHewitt', Arial;
}

/*******************************
  Sponsor Logo Styles
*******************************/

p.sponsor-txt {
  background:#f1f2f2;
  border-top:1px solid #d7d8d8;
  border-bottom:1px solid #d7d8d8;
  display:block;
  padding:10px 0px;
  text-align:center;
  margin:0 !important;
  color: #6e6e6e !important;
}

div.sponsor-logos {
  background:#ffffff;
  padding:35px 0px;
  text-align:center;
}

div.sponsor-logos td.body {
  text-align:center;
}

div.sponsor-logos img {
  display:inline-block;
}

div.sponsor-logos a + a img {
  margin-left:60px;
}

/*******************************
  Footer Styles
*******************************/

td.footer {
  height:80px;
  background:#6e6e6e;
}

td.footer td.col-one {
  width:380px;
}

td.footer td.col-one td.body {
  padding:42px 42px 42px 42px;
}

td.footer td.col-two td.body {
  padding:42px 42px 42px 42px;
}

/******************************
  Form Styles
*******************************/

input.text,
select.text,
textarea.text {
  font:normal 16px/16px 'CooperHewitt', Arial;
  padding:15px 20px 15px 20px;
  width:100%;
  border:1px solid #9e9fa2;
}

select.text {
  color:#9e9fa2;
  padding:0px 20px 0px 20px !important;
}

select.text option {
  font:normal 16px/16px 'CooperHewitt', Arial;
  padding:15px 20px 15px 20px;
}

#select-wrpr {
  background-color: white;
  width: 404px;
  overflow: hidden;
  background-image: url("/images/layout/select-arrow.png");
  background-size: 8px;
  background-repeat: no-repeat;
  background-position: 360px;
  border: 1px solid #f2f2f2;
}

#select-styled { 
  text-transform: uppercase;
  border: none;
  background: transparent;
  padding-top: 18px !important;
  padding-bottom: 18px !important;
  width: 440px;
  outline: none;
  color: #b4b4b4;
}

#select-styled option {
  padding-top: 2px;
  padding-bottom: 2px;
}

/******************************
  Link Styles
*******************************/

a {
  color:#ff9601;
  text-decoration:none;
  outline:none;
  transition:0.3s all;
}

a:hover {
  color:#a4cd87;
}

a.button {
  display:inline-block;
  color:#ffffff !important;
  background:#f2a332;
  font:normal 20px/20px 'CooperHewitt', Arial;
  text-transform:uppercase;
  padding:15px 30px 15px 30px;
  text-align:center;
  transition:0.3s all;
  margin:0px 0px 10px 0px;
}

a.button:hover {
  background:#a4cd87;
}

td.col-one a {
  width:100%;
  padding-left:0px;
  padding-right:0px;
}

td.footer a {
  color:#a4cd87;
  text-decoration:none;
}

td.footer td.col-one a:last-child {
  margin-top:8px;
  padding-top:4px;
  border-top:2px dotted #a1a1a1;
  display:inline-block;
}

td.footer a.button {
  background:#a4cd87;
  color:#ffffff;
}

td.footer a.button:hover {
  background:#f2a332;
}

td.footer a.button + a.button {
  margin-left:8px;
}

td.navigation a.button {
  font:normal 26px/26px 'CooperHewitt', Arial;
  padding:18px 48px;
}
