/*
 * === skillshare style sheet ===
 * 
 * all colors:
 * 
 * #7F353B - dark red (text)
 * #DD7889 - darkest pink (rare)
 * #F57D9C - darker pink (most borders)
 * #F596AE - dark pink
 * #FFD9E6 - light pink
 * #FFF875 - yellow highlight
 * #FFFDD1 - tan background
 * #FFF7BC - light yellow (rare)
 * #FFFDBC - light yellow (rare)
 */

/* element-wise styles */
body, p, h1, h2, h3, h4, h5, h6, h7, li, td, input, textarea, select { font-family: Arial, Helvetica, sans-serif; color: #7F353B; font-size:12pt; }
h1, h2, h3 { font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: normal; }
body {margin:10px; min-width:750px; background-color: #ffd9e6; background-image: url('/img/top.gif'); background-repeat: no-repeat; }
p, form, h4 { margin: 0em 10px 0.8em 15px; padding:0px; }
ul, ol { margin: 0em 10px 0.8em 35px; padding:0px;}
ul ul, ul ol, ol ul, ol ol {margin-bottom:0px;}
li { margin: 0px 0px 0px 10px; padding:0px;}
h1 { margin:0px; padding:0px; font-weight:normal; font-size:100%; } 
h2 { margin: 1em 30px 1em 30px; padding:3px; text-align:center;  font-size:110% }
h2 span {background:#FFF875; border: solid #f57d9c 2px; padding: 0.3em 1em; line-height:2em; } 
  /* more styles applied in jQuery */
h3 { margin: 1em 10px 0.5em 5px;  padding:0px; font-size:115%; color: #F57D9C;}
h3.unpublished {text-align:center; background:#F596AE; width:60%; margin:1em auto; color:#7F353B; padding:5px; border:solid #F57D9C 2px;}
h4 { margin: 0.8em 0px 0.2em 10px; font-weight: bold; } 
a, 
a:hover, 
a:link, 
a:visited, 
a:active { color: #7F353B; }
a:hover { background: #FFF875; } 
h2 span a:hover {background:#FFD9E6}
table tr td { padding:0px; margin:0px; }
table.formtable td { padding: 3px 5px 3px 0px; } 
img { vertical-align:middle; }
div.footer table, 
div.footer tr, 
div.footer td { margin:0px; padding:0px; }
div.hr { margin:15px; height:1px; border-top: solid #f57d9c 2px; }
div.hrlight { margin:15px; height:1px; border-top: solid #FFF875 2px; }
span.lightbig {font-size:200%; color:#DD7889}
textarea, select, input[type="text"], input[type="password"], input[type="file"], input[type="radio"] 
  {border:solid; border-width:1px; border-color:#7F353B #F57D9C #F57D9C #7F353B; background:#FFFDD1;}
select {background:#FFFDD1; border-right:none;} 
textarea, input[type="text"], input[type="password"], input[type="file"] {padding:1px 5px 1px 5px;} 
.big {padding:1em 8%; font-size:120%; text-align:center; }
.huge {margin:1em; font-size:150%;text-align:center;font-weight:bold; }
.dark * {color:#F57D9C;}
.light {color:#F57D9C;}
.thinlinetop {border-top: solid #f57d9c 1px;}

/* header */
div.header {height:7em; min-height:140px; position:relative; z-index:2}
div.header a {background:#ffd9e6;}
div.header a:hover { background: #FFF875; } 
div.header div.title { position:absolute; top:-0.2em; left:10px; z-index:20; font-size:45pt; visibility:hidden;} 
div.header div.description { margin-left:50px; position:absolute; bottom:2.0em; left:0px; z-index:7; width:400px; text-align:center; }
div.header div.description span { font-size:120%;  color:#F57D9C; font-style:italic; }
div.header div.description a {color:#F57D9C;}
div.header div.description a.active {display:none;}
div.header form.headersearch {position:absolute; top:8px; right:10px; z-index:8; padding:5px; }
div.header form.headersearch input[type=text] {background-color:#FFD9E6; width:11em;}

/* header - main menu */ 
div.header div.menutop {position:absolute; z-index:10; bottom:0px; left:0px; margin: 0px 0px 0px 10px; }
div.header div.menutop a, 
div.header div.menutop a:hover, 
div.header div.menutop a:link, 
div.header div.menutop a:visited { margin: 0px 3px 0px 3px; padding: 0px 5px 1px 5px; text-decoration:none; color: #7F353B; background-color: #F596AE; font-size:120%; border: solid 2px #f57d9c; border-bottom:0px;}
div.header div.menutop a.active,
div.header div.menutop a:hover { background: #FFF875; padding-bottom: 8px; border: solid 2px #f57d9c; }
div.header div.menutop a.active { border-bottom:0px; padding-bottom:2px;}

/* header - members menu */ 
div.header div.members { position:absolute; z-index:9; bottom:0px; right:0px; margin: 0px 10px 0px 0px; } 
div.header div.members a, 
div.header div.members a:hover, 
div.header div.members a:link, 
div.header div.members a:visited { margin: 0px 3px 0px 3px; padding: 0px 5px 0px 5px; text-decoration:none; color: #F57D9C; background-color: #FFD9E6; font-size:120%; border: solid 2px #f57d9c; }
div.header div.members a.active, 
div.header div.members a:hover { background:#FFF875; color:#7F353B;  border: solid 2px #f57d9c; }
div.header div.members a.active {padding-bottom:2px; border-bottom:0px;}
div.header div.members a.logout:hover {background:#F596AE;}

/* content and footer */
div.contentborder {padding:5px; background:#FFF875; border: solid #f57d9c 2px; }
div.content { position:relative; z-index:1; min-height:400px; background: #FFFDD1; padding: 5px 5px 1.5em 5px; /* background-image: url('/img/octopus.gif');*/ background-attachment: scroll !important; background-attachment: fixed; background-position: top center; background-repeat: repeat-y; }
div.wrapbox { float:right;  clear:right; }
div.footer { padding: 5px 10px 5px 10px; }
div.footer h3, div.footer a { margin: 0px; color:#f57d9c; }

/* user login box */
form.userloginbox {background-color:#ffd9e6; padding:5px; float:left; border: solid #F596AE 2px;}
form.userloginbox th {text-align:right;}

/* organizers box */
div.header div.orgtools {position:absolute; bottom:2em; right:14px; z-index:7; }
div.header div.orgtools table {background:#FFFDD1; border:solid #F57D9C; border-width:2px; border-collapse:collapse; }
div.header div.orgtools td,
div.header div.orgtools th {padding:0px 5px 2px 5px; border-left:solid #F57D9C 1px;}
div.header div.orgtools a {padding:0px 5px; background:none;}
div.header div.orgtools a:hover {background:#FFF875;}

/* event header */
div.events { margin: -5px -5px 10px 10px; padding: 0px; float:right; width:200px; background-color: #FFD9E6; border: solid #f57d9c; border-width: 0px 0px 2px 2px; position:relative; right:-5px; top:-5px; z-index:3; } 
div.events div { height:40px; position:relative; }
div.events p { margin:0; padding:0; position:absolute; bottom:0px; width:100%; font-size:100%; font-weight:bold; text-align:center; }
div.events a, 
div.events a:hover, 
div.events a:link, 
div.events a:visited { margin: 0px; padding: 0px 5px 0px 5px; font-size:90%; display:block; border: none; border-top:solid #DD7889 1px; text-decoration:none; text-align:center; }
div.events a.active { background: #FFF875; } 
div.events img.tl { position:absolute; top:-2px; left:-40px; }
div.events img.br { position:absolute; bottom:-40px; right:-2px; }

/* event banner */
div.eventbanner { margin:5px; height:120px; position:relative; text-align:center; }
div.eventbanner div { position:absolute; top:0px; left:50%; z-index:1; } 
div.eventbanner div img { position:relative; right:251px; #right:246px;  } /* different in ie */
div.eventbanner h1, 
div.eventbanner a { position:relative; z-index:2; } 
div.eventbanner h1 { padding:0px 0px 5px 0px; font-size:150%;  }
div.eventbanner a, 
div.eventbanner a:hover, 
div.eventbanner a:link, 
div.eventbanner a:visited { margin:0px 2px; padding: 0px 15px; font-size:110%; border: solid #ffd9e6 2px; }
div.eventbanner a.active, 
div.eventbanner a:hover { background:#FFF875; border: solid #f57d9c 2px; text-decoration:none; }
div.eventbanner div.back { position:relative; top:0px; left:0px; padding:12px 0px 0px 0px;}
div.eventbanner div.back a {border:none; color:#f57d9c; font-size:100%; text-decoration:underline;}

/* event sub-banner */
div.eventsubbanner { margin:-15px 5px 5px 5px; height:30px; text-align:center; position:relative; }
div.eventsubbanner span { margin:0px; padding:15px 0px 0px 0px; background:#ffd9e6; border: solid #f57d9c 1px; }
div.eventsubbanner a { position:relative; z-index:2; } 
div.eventsubbanner a, 
div.eventsubbanner a:hover, 
div.eventsubbanner a:link, 
div.eventsubbanner a:visited { padding: 0px 15px 0px 15px; border: solid #ffd9e6 1px; border-bottom:none; text-decoration:none;  }
div.eventsubbanner a.active, 
div.eventsubbanner a:hover { background:#FFF875;  border-color: #f57d9c; border-bottom:none; }
div.eventsubbanner a.prev:hover { border-right-color:#FFF875; }
div.eventsubbanner a.next:hover { border-left-color:#FFF875; }

/* workshops */
h3.wslistdate { text-align:center; margin: 20px 0px 10px 0px; }
h3.wslistdate span.date { font-size:120%; color:#7F353B; }

/* info table */
table.info { margin: 0px 5px 0px 5px; border: solid #f57d9c 2px; border-collapse:collapse; } 
table.info td, 
table.info th { border: solid #f57d9c; border-width: 0px 1px 1px 0px; padding: 1px 5px 1px 5px; font-size:90%; }
table.info th { background:#ffd9e6; font-size:100%; }
table.info td div { overflow:hidden; max-height:1em; }
table.info a {text-decoration:none;}

/* sort table */
table.sort { margin:auto}
table.sort th.sorting,
table.sort th.sorting_asc,
table.sort th.sorting_desc  { background-repeat:no-repeat; background-position: left center; cursor:pointer; height:35px;}
table.sort th.sorting_asc,
table.sort th.sorting_desc { padding-left:25px;}
table.sort th.sorting_asc { background-image:url(../img/arrow/down-pink.png); }
table.sort th.sorting_desc { background-image:url(../img/arrow/up-pink.png); }
table.sort th.sorting:hover,
table.sort th.sorting_asc:hover,
table.sort th.sorting_desc:hover {text-decoration:underline;}
table.sort thead td {background:#ffd9e6;}
table.sort thead div {margin:5px 0px; text-align:center; max-height:none;}
table.sort thead input {width:100%;  max-width:100px;}
table.sort thead tr td.hide {text-align:center; font-style:italic; cursor:pointer;}
table.sort thead tr td.hide:hover {text-decoration:underline;}
#showbuttons { margin:10px auto; padding:5px 15px; border: solid #f57d9c 2px; background:#ffd9e6; text-align:center; width:50%; line-height:2em;}
#showbuttons input {width:auto;}
.dataTables_filter {margin:20px auto; padding:10px; background:#FFD9E6; width:300px; border: solid 1px #f57d9c;}

/* events table */
table.events { margin: 0px 5px 0px 5px; border: solid #f57d9c; border-width: 2px 1px 1px 2px; } 
table.events td, 
table.events th { border: solid #f57d9c; border-width: 0px 1px 1px 0px; padding: 1px 5px 1px 5px; font-size:90%; }
table.events th { background:#ffd9e6; font-size:100%; }
table.events td div { overflow:hidden; max-height:1em; }
table.events em {color:#f57d9c}
table.events a {text-decoration:none;}

/* grid */
table.grid { margin: 0px 5px 25px 5px; border: solid #f57d9c; border-width: 1px 2px 2px 1px; } 
table.grid td, 
table.grid th { border: solid #f57d9c; border-width: 1px 0px 0px 1px; padding: 2px 5px; font-size:90%; background:#FFFDD1 }
table.grid th { background:#ffd9e6; font-size:100%; }
table.grid a {text-decoration:none}
table.grid td.conflict {background-color:#F596AE}
/* more style applied in jQuery! */

/* edit table */
h4.tablelabel {margin-bottom:-5px; #margin-bottom:0px;}
h4.tablelabel span {padding:2px 10px; background:#F596AE; border:solid #F57D9C 1px; font-size:110%; font-weight:normal;}
table.edit {margin-bottom:10px; padding-top:15px; width:100%; background:#FFD9E6; border:solid #F57D9C; border-width:2px 2px 1px 2px;}
table.edit th,
table.edit td {padding:2px 5px 2px 0px; border:solid #F596AE; border-width: 0px 0px 1px 0px;}
table.edit th {width:150px; text-align:right; font-weight:normal;}
table.edit td {padding-right:10px; min-width:400px;}
table.edit select {min-width:200px;}
table.edit input[type="text"] {width:300px;}
/* expanding textareas */
table.edit tr.tacollapsed td, 
table.edit tr.taexpanded  td {border-left:solid #F596AE 1px; background:#FFFDD1;}
table.edit tr td div.rel {position:relative;}
table.edit tr td div.rel a.abs {position:absolute; top:-2px; left:-156px; display:block; width: 145px; display:none; cursor:pointer; color:#F596AE; text-align:right; padding: 5px;}
table.edit textarea {width:100%; height:1.3em; border:none;} 
/* help boxes */
table.edit tr       th span {visibility:hidden;  display:block; float:left; margin:-2px 5px; font-weight:bold; color:#F596AE; font-size:120%; }
table.edit tr:hover th span {visibility:visible;}
table.edit tr:hover th:hover span {visibility:hidden;}
/* more style applied in jQuery! */

/* listings table */
table.edit td.listings {border-left:solid #F57D9C 1px; }
table.edit td.listings div.day {padding:15px 0px 5px 25px; font-weight:bold; color:#F57D9C;}
table.edit td.listings div.listing {margin:0px; padding-left:25px; text-indent:-25px;}
table.edit td.listings div.listing span {white-space:nowrap;}
table.edit td.listings div.listing span.peekaboo {display:none;}
table.edit td.listings div.listing span select {min-width:20px;}
table.edit td.listings div.listing span label {cursor:pointer; padding-right:10px;}
table.edit td.listings div.listing span label:hover {background:#FFF875;}
table.edit td.listings div.checked {padding-top:3px; padding-bottom:3px;}
table.edit td.listings div.checked span.peekaboo {display:inline;}

/* workshop edit links */
span.wsedittitle,
span.wseditview,
span.wseditedit {font-size:120%;}
span.wseditview a,
span.wseditedit a { padding:2px 5px; border:solid #F57D9C 1px; background:#FFD9E6; line-height:1.7em; }
span.wseditview a:hover,
span.wseditedit a:hover { background:#FFF875; }
span.wsedittitle {}
span.wseditview {}
span.wseditedit {}

/* styles to trump other styles */
a.unpublished {background:#7F353B; color:#FFD9E6;}
a.unpublished:hover {color:#FFF875;}