/************************
********* Reset *********
************************/

/*  Adapted from:
 *  http://meyerweb.com/eric/tools/css/reset/
 *  v2.0 | 20110126 | License: none (public domain)
 */

/*  Disabled elements below are no longer supported in HTML5: */
html, body, div, span, /*applet,*/ object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, /*acronym,*/ address, /*big,*/ cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, /*strike,*/ strong, sub, sup, /*tt,*/ var,
b, /*u,*/ i, /*center,*/
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, datalist, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
    -moz-box-sizing:    border-box;
    -webkit-box-sizing: border-box;
  box-sizing:           border-box;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}

/*** Reset > Typography ***/

body {
  line-height: 1;
}
pre, code {
  font-family: monospace;
}

/*** Reset > Controls ***/

input, textarea, button{
  margin: 0;
    -moz-box-sizing:    border-box;
    -webkit-box-sizing: border-box;
  box-sizing:           border-box;
  font: inherit;
}

/*** Reset > Tables ***/

table {
  border-collapse: collapse;
  border-spacing: 0;
}
caption, th, td {
  font-weight: normal;
  text-align: left;
}

/*** Reset > Quotes ***/

blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: ''; /* Removes quotes in browsers where `content: none` fails */
  content: none;
}
cite {
  font-style: normal;
}


/*************************
********* Colors *********
**************************
*
* Black:        #000      Header, Footer
* White:        #FFF      Light Text
* Grey:         #e6e6e6   Background, Image borders
* Dark Grey:    #d3d2d7   Alt Background
* Green:        #3cb878
* Purple:       #756bb1
* Pink:         #ec2772
* Dark Purple:  #302E36   Accents
*
*************************/


/**************************
******* Font Embeds *******
**************************/

/*** Font Embeds > Icons ***/

@font-face {
  font-family: 'icons';
  src: url('/assets/fonts/lwc-icons.eot');
  src: url('/assets/fonts/lwc-icons.eot?#iefix')      format('embedded-opentype'),
       url('/assets/fonts/lwc-icons.svg#lwc-icons')   format('svg'),
       url('/assets/fonts/lwc-icons.woff')            format('woff'),
       url('/assets/fonts/lwc-icons.ttf')             format('truetype');
  font-weight: normal;
  font-style: normal;
}
.icon {
  font-family: icons;
  content: attr(data-icon);
  speak: none;
    -webkit-font-smoothing: antialias;
  font-smoothing:           antialias;
}

/*** Font Embeds > Proxima Nova ***/

@font-face {
  font-family: 'ProximaNova';
  src: url('/assets/fonts/proximanova-bold-webfont.eot');
  src: url('/assets/fonts/proximanova-bold-webfont.eot?#iefix')              format('embedded-opentype'),
       url('/assets/fonts/proximanova-bold-webfont.woff')                    format('woff'),
       url('/assets/fonts/proximanova-bold-webfont.ttf')                     format('truetype'),
       url('/assets/fonts/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'ProximaNova';
  src: url('/assets/fonts/proximanova-regular-webfont.eot');
  src: url('/assets/fonts/proximanova-regular-webfont.eot?#iefix')                 format('embedded-opentype'),
       url('/assets/fonts/proximanova-regular-webfont.woff')                       format('woff'),
       url('/assets/fonts/proximanova-regular-webfont.ttf')                        format('truetype'),
       url('/assets/fonts/proximanova-regular-webfont.svg#proxima_nova_rgregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

/*** Font Embeds > Poly ***/

@font-face {
  font-family: 'Poly';
  src: url('/assets/fonts/poly-regular-webfont.eot');
  src: url('/assets/fonts/poly-regular-webfont.eot?#iefix')         format('embedded-opentype'),
       url('/assets/fonts/poly-regular-webfont.woff')               format('woff'),
       url('/assets/fonts/poly-regular-webfont.ttf')                format('truetype'),
       url('/assets/fonts/poly-regular-webfont.svg#PolyRegular')    format('svg');
  font-weight: normal;
  font-style: normal;
}

/*************************
********* Global *********
*************************/

body {
  background: #EBEAEE;
}
body, select, input, textarea {
  font: normal 15px/1.4 'ProximaNova', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: #222;
}

/*** Typography ***/

h1 {
  margin-bottom: 30px;
  font-weight: bold;
  line-height: 1;
}
h2 {
  margin-bottom: 20px;
  font-size: 26px;
  font-weight: bold;
}
h2.alt {
  font-family: Poly, Georgia, serif;
  font-weight: normal;
}
h3 {
  margin-bottom: 15px;
  font-size: 22px;
  font-weight: bold;
  line-height: 1.5;
}
h3.alt {
  font-family: 'ProximaNova', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: normal;
}
h4 {
  font-size: 16px;
  font-style: italic;
}
p {
  font-family: Poly, Georgia, serif;
  line-height: 1.5;
}
p.alt {
  margin-bottom: 1em;
  font-family: 'ProximaNova', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 18px;
}
strong {
  font-weight: bold;
}
em {
  font-style: italic;
}
.shout {
  text-transform: uppercase;
}


/*** Links ***/

a {
  color: #3cb878;
  text-decoration: none;
}
a:hover,
a:focus {
  text-decoration: underline;
}

/*** Links > Button ***/

a.button {
  display: block;
  margin: 10px 0;
  padding: 10px;
  border: 3px solid #388F64;
  background: #3cb878;
  color: #EEE;
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}
a.button:hover,
a.button:focus {
  background: #50c689;
  color: #FFF;
}


/*************************
********* Layout *********
*************************/

div.wrapper {
  max-width: 980px;
  padding: 0 20px;
  margin: 0 auto;
}
div.wrapper > h3 {
  margin-bottom: 25px;
  color: rgba(0,0,0,0.5);
}

/*** Layout > Header ***/

body > header {
  position: fixed;
  width: 100%;
  background: #000;
  z-index: 100;
}
body > header a.logo {
  position: relative;
  float: left;
  display: block;
  z-index: 2;
  background: url(/assets/images/lwc-logo.png) no-repeat; /* bkg-position defined in media queries */
  text-indent: -9999em;
}

/*** Layout > Header > Nav ***/

body > header nav ul {
  display: block;
  overflow: hidden;
}
body > header nav ul li {
  float: left;
}
body > header nav ul li a {
  display: block;
  width: 100%;
  color: #FFF;
  border-bottom: 5px solid #3cb878;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}
body > header nav ul li a.purple {
  border-color: #756bb1;
}
body > header nav ul li a.pink {
  border-color: #ec2772;
}
body > header nav ul li a:hover,
body > header nav ul li a:focus {
  border-width: 10px;
  color: #3cb878;
  text-decoration: none;
}
body > header nav ul li a.purple:hover,
body > header nav ul li a.purple:focus {
  color: #756bb1;
}
body > header nav ul li a.pink:hover,
body > header nav ul li a.pink:focus {
  color: #ec2772;
}
body > header nav ul li.social a {
  color: #3cb878;
  font-size: 20px;
  text-transform: none;
}

/*** Layout > Footer ***/

body > footer {
  clear: both;
  float: none;
  overflow: hidden;
  padding: 40px 0 50px;
  background: #000;
  color: #FFF;
}
body > footer div.mint a.mint-logo {
  display: block;
  width: 163px;
  height: 19px;
  margin: 5px 0 0;
  background: url(/assets/images/mint-logo.png) 0 0 no-repeat;
  text-indent: -9999em;
}

/*** Layout > Section ***/

section {
  clear: both;
  float: none;
  padding: 50px 0;
}
section.faux-ribbon {
  border-top:    5px solid; /* border-color determined by section's color class */
  border-bottom: 5px solid;
    -moz-box-shadow:    inset 0 2px 0 rgba(0,0,0,0.1), inset 0 -2px 0 rgba(0,0,0,0.1);
    -webkit-box-shadow: inset 0 2px 0 rgba(0,0,0,0.1), inset 0 -2px 0 rgba(0,0,0,0.1);
  box-shadow:           inset 0 2px 0 rgba(0,0,0,0.1), inset 0 -2px 0 rgba(0,0,0,0.1);
}
section.purple {
  position: relative;
  z-index: 2;
  background: #756bb1;
  border-color: #756bb1;
  color: #FFF;
}
section.purple h2 {
  text-align: center;
}
section.purple h2 a {
  color: #FFF;
  font-weight: bold;
}
section.green {
  background: #3cb878;
  border-color: #3cb878;
  color: #FFF;
}
section.pink {
  background: #ec2772;
  border-color: #ec2772;
  color: #FFF;
}
section.darker-grey {
   background: #d3d2d7;
   border-color: #d3d2d7;
}
section.intro {
  margin-bottom: -10px;
  overflow: hidden;
}
section.farewell .message {
  margin: 20px auto 50px;
}
section.farewell img {
  display: block;
  margin-bottom: 15px;
}

/*** Layout > Columns ***/

.col {
  display: block;
  margin-bottom: 30px;
}
.row {
  overflow: hidden;
}
.push-top {
  margin-top: 50px;
}

/*** Layout > Images ***/

img {
  max-width: 100%;
}

/*** Layout > Article ***/

article {
  width: 100%;
  padding: 20px;
  margin-bottom: 30px;
  background: #FFF;
    -moz-box-shadow:    2px 2px 0 rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 0 rgba(0,0,0,0.1);
  box-shadow:           2px 2px 0 rgba(0,0,0,0.1);
}
article p {
  margin-bottom: 15px;
}
article iframe {
  width: 100%;
  min-height: 375px;
  height: auto;
  margin: 10px 0;
}

/**************************
********* Objects *********
**************************/

/*** Objects > Ribbon ***/

div.ribbon {
  display: block;
  position: relative;
  margin: 10px 0 -70px;
  z-index: 10;
  text-align: center;
}
div.ribbon h2 {
  padding: 15px 20px;
  background: #3cb878;
}

/*** Objects > Tag ***/

span.tag {
  position: relative;
  float: right;
  display: block;
  padding: 5px 10px 6px;
  margin: 0 -24px 10px 35px;
  background: #000;
  color: #FFF;
}
span.tag:before {
  position: absolute;
  top: 0;
  left: -25px;
  content: "";
  display: block;
  border: 16px solid #000;
  border-left-color: transparent;
}

/*** Objects > Event ***/

div.vevent {
  padding: 25px;
  overflow: hidden;
  background: #302E36;
  border: 2px solid #302E36;
    -moz-box-shadow:    inset 0 0 0 6px #EBEAEE;
    -webkit-box-shadow: inset 0 0 0 6px #EBEAEE;
  box-shadow:           inset 0 0 0 6px #EBEAEE;
  color: #D4D0DE;
  font-size: 16px;
}
div.vevent dl {
  overflow: hidden;
}
div.vevent dl dt,
div.vevent dl dd {
  float: left;
  display: block;
  padding: 15px 0;
  border-top: 1px solid #605894;
}
div.vevent dl dt:first-of-type,
div.vevent dl dd:first-of-type {
  padding-top: 0;
  border-top: none;
}
div.vevent dl dt {
  width: 36%;
  padding-right: 2%;
  color: #9891A8;
  font-weight: bold;
  line-height: 1.7;
  text-transform: uppercase;
}
div.vevent dl dd {
  width: 62%;
}
div.vevent dl dd b {
  display: block;
}
div.vevent span.summary {
  display: none;
}

/*** Objects > Three-Col List ***/

ul.three-col {
  overflow: hidden;
}
ul.three-col li {
  margin-bottom: 30px;
}
ul.three-col li hgroup {
  position: relative;
  margin-top: -50px;
  padding: 10px 15px;
  z-index: 2;
  background: #242229;
  border: 4px solid #242229;
    -moz-box-shadow:    inset 0 0 0 2px #3E374F;
    -webkit-box-shadow: inset 0 0 0 2px #3E374F;
  box-shadow:           inset 0 0 0 2px #3E374F;
}
ul.three-col li img {
  display: block;
  max-width: 100%;
  margin: 0 auto 10px;
}
ul.three-col.speaker-list li img {
  border: 6px solid #E6E6E6;
  border-radius: 400px;
}
ul.three-col li iframe {
  width: 100%;
  min-height: 400px;
}
ul.three-col li p {
  padding: 20px;
  background: #3E374F;
}
ul.three-col li.tba {
  opacity: 0.6;
}

/*** Objects > Six-Col List ***/

ul.six-col {
  overflow: hidden;
}
ul.six-col li {
  margin-bottom: 30px;
}
ul.six-col li img {
  display: block;
  width: 100%;
}

/*** Objects > Google Map ***/

div.google-map {
  border: 8px solid #3cb878;
}
div.google-map iframe {
  display: block;
  width: 100%;
  height: 400px;
  overflow: hidden;
}

/*** Objects > Zebra List ***/

dl.zebra {
  overflow: hidden;
  background: rgba(255,255,255,0.2);
}
dl.zebra dt,
dl.zebra dd {
  float: left;
  padding: 6px 10px;
  font-size: 17px;
}
dl.zebra dt {
  color: rgba(0,0,0,0.5);
}
dl.zebra dd b {
  font-weight: bold;
}
dl.zebra dt:nth-of-type(2n+1),
dl.zebra dd:nth-of-type(2n+1) {
  background: rgba(255,255,255,0.3);
}
dl.zebra em {
  color: rgba(0,0,0,0.5);
  font-style: italic;
}


/********************************
********* Media Queries *********
********************************/

/*** Media Queries > Large Screen ***/

@media screen     and (min-width: 769px),
       projection and (min-width: 769px) {

  /*** Typography ***/

  h1 {
    font-size: 60px;
  }

  /*** Layout > Header ***/

  body > header {
    padding: 20px 0 0;
    height: 85px;
  }
  body > header a.logo {
    width: 220px;
    height: 99px;
    background-position: 0 0;
  }

  /**** Layout > Header > Nav ***/

  body > header nav {
    max-width: 64%;
    float: right;
  }
  body > header nav ul {
    margin-top: 22px;
  }
  body > header nav ul li a {
    padding: 12px;
    font-size: 14px;
  }
  body > header nav ul li a:hover,
  body > header nav ul li a:focus {
    padding-bottom: 7px;
  }
  body > header nav ul li.social a {
    padding-top: 8px;
    padding-bottom: 8px;
    height: 43px;
  }
  body > header nav ul li.social a:hover,
  body > header nav ul li.social a:focus {
    padding-bottom: 3px;
  }

  /*** Layout > Footer ***/

  body > footer div.mint {
    float: left;
    width: 32%;
    margin-right: 2%
  }
  body > footer p.mint-info {
    float: left;
    width: 64%;
    margin: 0;
  }

  /*** Layout > Section ***/

  section.top {
    padding: 140px 0 0;
  }
  section#schedule {
    overflow: hidden;
  }
  section.farewell .message {
    width: 80%;
  }

  /*** Layout > Columns ***/

  .col {
    float: left;
  }
  .col.main {
    width: 70%;
    margin-right: 5%;
  }
  .col.sidebar {
    width: 25%;
  }
  .two-col {
    float: left;
    width: 48%;
    margin-right: 4%;
  }
  .two-col:nth-of-type(2n) {
    margin-right: 0;
  }

  /*** Objects > Ribbon ***/

  div.ribbon:before,
  div.ribbon:after {
    position: absolute;
    top: 0;
    content: "";
    display: block;
    border: 31px solid #3cb878;
  }
  div.ribbon:before {
    left: 0;
    border-left-color: transparent;
  }
  div.ribbon:after {
    right: 0;
    border-right-color: transparent;
  }
  div.ribbon h2 {
    min-height: 62px;
    margin: 0 62px;
  }

  /*** Objects > Feature ***/

  hgroup.feature {
    float: left;
    width: 64%;
    margin-top: 25px;
    margin-right: 2%;
  }

  /*** Objects > Event ***/

  div.vevent {
    float: left;
    width: 32%;
  }

  /*** Objects > Three-Col List ***/

  ul.three-col li {
    float: left;
    width: 32%;
    margin-right: 2%;
  }
  ul.three-col li:nth-of-type(3n) {
    margin-right: 0;
  }

  /*** Objects > Six-Col List ***/

  ul.six-col li {
    float: left;
    width: 15%;
    margin-right: 2%;
  }
  ul.six-col li:nth-of-type(6n) {
    margin-right: 0;
  }

  /*** Objects > Zebra List ***/

  dl.zebra {
    width: 100%;
  }
  dl.zebra dt {
    width: 12%;
  }
  dl.zebra dd {
    width: 88%;
  }
}

/*** Media Queries > Small Screen ***/

@media screen     and (max-width: 768px),
       projection and (max-width: 768px) {

  /*** Typography ***/

  h1 {
    font-size: 40px;
  }

  /*** Layout > Header ***/

  body > header {
    height: 55px;
  }
  body > header div.wrapper {
    padding: 0;
  }
  body > header a.logo {
    width: 55px;
    height: 55px;
    background-position: 0 -144px;
  }

  /**** Layout > Header > Nav ***/

  body > header nav {
    margin-left: 55px;
  }
  body > header nav ul {
    float: right;
  }
  body > header nav ul li a {
    padding: 27px 8px 14px;
    font-size: 9px;
  }
  body > header nav ul li a:hover,
  body > header nav ul li a:focus {
    padding-bottom: 9px;
  }
  body > header nav ul li.social a {
    padding: 19px 8px 9px;
    height: 55px;
  }
  body > header nav ul li.social a:hover,
  body > header nav ul li.social a:focus {
    padding-bottom: 4px;
  }

  /*** Layout > Footer ***/

  body > footer p.mint-info {
    margin: 20px 0 0;
  }

  /*** Layout > Section ***/

  section.top {
    padding: 80px 0 0;
  }

  /*** Layout > Columns ***/

  .col {
    width: 100%;
  }
  .two-col {
    width: 100%;
  }
  .two-col:nth-of-type(2n) {
    margin-top: 50px;
  }

  /*** Objects > Event ***/

  div.vevent {
    margin-top: 25px;
  }

  /*** Objects > Six-Col List ***/

  ul.six-col li {
    float: left;
    width: 46%;
    margin-right: 8%;
  }
  ul.six-col li:nth-of-type(2n) {
    margin-right: 0;
  }

  /*** Objects > Zebra List ***/

  dl.zebra dt {
    width: 30%;
  }
  dl.zebra dd {
    width: 70%;
  }
}
