html,
body {
    margin: 0;
    padding: 0
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
cite,
code,
del,
dfn,
em,
img,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dd,
dl,
dt,
li,
ol,
ul,
fieldset,
form,
label,
legend,
button,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: normal;
    font-style: normal;
    font-size: 100%;
    line-height: 1.2;
    font-family: inherit
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
    display: block
}

audio[controls],
canvas,
video {
    display: inline-block;
    *display: inline;
    *zoom: 1
}

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@-webkit-viewport {
    width: device-width
}

@-moz-viewport {
    width: device-width
}

@-ms-viewport {
    width: device-width
}

@-o-viewport {
    width: device-width
}

@viewport {
    width: device-width
}

html {
    width: 100%;
    height: 100%;
    -webkit-overflow-scrolling: touch;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}

body {
    width: 100%;
    height: 100%;
    background: transparent;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 100%;
    line-height: 1.2;
    color: #555555
}

.clearfix {
    *zoom: 1
}

.clearfix:before,
.clearfix:after {
    display: table;
    content: ""
}

.clearfix:after {
    clear: both
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    font-family: "Roboto Condensed", sans-serif;
    font-weight: bold;
    color: #555555;
    line-height: 1.35;
    text-rendering: optimizeLegibility;
    text-shadow: #888888 1px 1px
}

h1,
.h1 {
    margin-bottom: 0.8;
    font-size: 1.75em
}

h2,
.h2 {
    margin-bottom: 0.8;
    font-size: 1.375em
}

h3,
.h3 {
    margin-bottom: 0.68571;
    font-size: 1.25em
}

h4,
.h4 {
    margin-bottom: 0.68571;
    font-size: 1em
}

h5,
.h5 {
    margin-bottom: 0.6;
    font-size: 1em
}

h6,
.h6 {
    margin-bottom: 0.6;
    font-size: 1em;
    font-weight: normal
}

p,
ol,
ul,
dl,
address {
    padding-bottom: 1em;
    line-height: 1.44
}

small {
    font-size: .875em
}

ul,
ol {
    margin-left: 1em;
    padding: 0 0 0 1em
}

li {
    margin-bottom: .375em
}

blockquote {
    margin: 0 1em 1.2 0;
    padding-left: .75em;
    border-left: 0.75em solid #eeeeee;
    font-family: "Roboto Condensed", sans-serif;
    font-style: italic
}

dl,
dd {
    margin-bottom: 1.2
}

dt {
    font-weight: bold
}

b,
strong {
    font-weight: bold
}

b a,
strong a {
    font-weight: bold
}

i,
dfn,
em {
    font-style: italic
}

u {
    text-decoration: underline
}

ins {
    background-color: #e6e6e6;
    color: red;
    text-decoration: none
}

mark {
    background-color: #e6e6e6;
    color: red;
    font-style: italic;
    font-weight: bold
}

pre,
code,
kdb,
samp {
    display: block;
    margin-bottom: 1em;
    padding: 0.25em;
    background-color: #eeeeee;
    font-family: Monaco, Courier New, monospace;
    font-size: .875em;
    color: #555555
}

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word
}

sub,
sup {
    position: relative;
    font-size: .75em;
    line-height: 0;
    vertical-align: 1.2
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

a {
    color: #7c93ca;
    text-decoration: none;
    cursor: pointer
}

a:hover {
    color: #6a84c3;
    text-decoration: underline;
    border: 0;
    outline: 0
}

a:visited {
    color: #5875bb
}

a:focus,
a:active {
    color: #4867b2;
    border: 0;
    outline: 0
}

a img {
    border: 0;
    outline: 0
}

strong a {
    font-weight: bold
}

::-moz-selection {
    background-color: gray;
    color: white;
    text-shadow: none
}

::selection {
    background-color: gray;
    color: white;
    text-shadow: none
}

hr {
    display: block;
    margin: 1em 0;
    padding: 0;
    height: 1px;
    border: 0;
    background-color: #888888
}

img {
    max-width: 100%;
    vertical-align: middle;
    border: 0;
    -ms-interpolation-mode: bicubic
}

figure {
    margin-bottom: 1.2
}

figcaption {
    display: block;
    margin: 0 0 1.2 0;
    padding: 0;
    font-weight: normal
}

label {
    font-size: .875em;
    color: #555555
}

input[type="text"],
input[type="date"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="url"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="file"],
select,
textarea,
.textbox {
    display: block;
    width: 100%;
    max-width: 768px;
    padding: 1em;
    margin-bottom: 1em;
    background-color: #eeeeee;
    border: 1px solid #eeeeee;
    color: #888888;
    font-size: .875em
}

input[type="text"]:active,
input[type="text"]:focus,
input[type="date"]:active,
input[type="date"]:focus,
input[type="time"]:active,
input[type="time"]:focus,
input[type="datetime"]:active,
input[type="datetime"]:focus,
input[type="datetime-local"]:active,
input[type="datetime-local"]:focus,
input[type="url"]:active,
input[type="url"]:focus,
input[type="email"]:active,
input[type="email"]:focus,
input[type="number"]:active,
input[type="number"]:focus,
input[type="search"]:active,
input[type="search"]:focus,
input[type="file"]:active,
input[type="file"]:focus,
select:active,
select:focus,
textarea:active,
textarea:focus,
.textbox:active,
.textbox:focus {
    border-color: #7c93ca
}

input[type="checkbox"],
input[type="radio"] {
    margin: 3px 0;
    padding: 0;
    *width: 13px;
    *height: 13px
}

button,
.button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
    width: auto;
    height: auto;
    padding: .25em .5em;
    background-color: #7c93ca;
    border: 1px solid #5875bb;
    color: white;
    font-size: .875em;
    cursor: pointer
}

input[type="hidden"] {
    display: none
}

input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
    opacity: 0.5;
    cursor: not-allowed
}

::-webkit-input-placeholder,
:-moz-placeholder,
:-ms-input-placeholder {
    color: #888888;
    font-size: .875em
}

.button-xl {
    padding: .875em 1.75em;
    font-size: 1.25em;
    -webkit-border-top-right-radius: 6px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topright: 6px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box
}

.button-lg {
    padding: .5em 1em;
    font-size: 1em;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box
}

.button-med {
    padding: .375em .75em;
    font-size: .875em;
    line-height: 1em;
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box
}

.button-xs {
    padding: .25em .5em;
    font-size: .75em;
    line-height: .875em;
    -webkit-border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box
}

table {
    height: 100%;
    width: 100%;
    margin-bottom: 0.6;
    background-color: transparent;
    border-spacing: 0
}

th,
td {
    padding: 0 .5em;
    vertical-align: middle;
    line-height: 1.2;
    text-align: left;
    font-size: .875em
}

th {
    font-weight: bold
}

thead th {
    vertical-align: bottom
}

thead:first-child tr:first-child th,
thead:first-child tr-first-child td {
    border-top: 0
}

tbody tr td,
tbody tr th {
    -webkit-transition: background-color 0.25s 0 ease;
    -moz-transition: background-color 0.25s 0 ease;
    -ms-transition: background-color 0.25s 0 ease;
    -o-transition: background-color 0.25s 0 ease;
    transition: background-color 0.25s 0 ease
}

.table-striped tbody tr:nth-child(odd) td,
.table-striped tbody tr:nth-child(odd) th {
    background-color: #eeeeee
}

body {
    background: #fff url(/bundles/app/images/hero_thin.jpg) no-repeat center top;
    background-size: auto 74px
}

body.home {
    background: #fff url(/bundles/app/images/hero.jpg) no-repeat center top;
    background-attachment: fixed;
    background-size: auto 300px
}

@media only screen and (min-width: 30em) {
    body.home {
        background-size: auto 400px
    }
}

@media only screen and (min-width: 48em) {
    body.home {
        background-size: auto 500px
    }
}

@media only screen and (min-width: 64em) {
    body.home {
        background-position: center -150px;
        background-size: auto 700px
    }
}

header.main {
    *zoom: 1;
    text-align: center;
    background-color: white
}

header.main:before,
header.main:after {
    display: table;
    content: ""
}

header.main:after {
    clear: both
}

.title {
    color: #555555;
    position: relative;
    display: inline-block;
    margin: .5em 0;
    padding-left: 50px;
    background: url(/assets/logo-aebc54d4c9362f6b2bae34184166aed9.png) no-repeat left 50%;
    line-height: 32px;
    font-size: .875em;
    font-weight: 300;
    text-transform: uppercase;
    text-shadow: none;
    z-index: 3;
    -webkit-transition: color 0.2s;
    -moz-transition: color 0.2s;
    -ms-transition: color 0.2s;
    -o-transition: color 0.2s;
    transition: color 0.2s
}

.menu-open header.main .title {
    color: white
}

@media only screen and (min-width: 48em) {
    header.main {
        text-align: left;
        padding-left: 1em
    }
}

@media only screen and (min-width: 64em) {
    header.main {
        padding-left: -moz-calc(50% - 30em);
        padding-left: -webkit-calc(50% - 30em);
        padding-left: calc(50% - 30em);
        padding-right: -moz-calc(50% - 30em);
        padding-right: -webkit-calc(50% - 30em);
        padding-right: calc(50% - 30em)
    }
}

.open-close-menu-switch {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 46px;
    padding: .375em;
    font-size: 2em;
    z-index: 2
}

.open-close-menu-switch:before {
    content: '';
    display: block;
    height: 3px;
    width: 100%;
    border-top: 4px solid #7c93ca;
    border-bottom: 4px solid #7c93ca;
    margin-bottom: 3px;
    -webkit-transition: border-color 0.3s ease;
    -moz-transition: border-color 0.3s ease;
    -ms-transition: border-color 0.3s ease;
    -o-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease
}

.open-close-menu-switch:after {
    content: '';
    display: block;
    height: 0;
    width: 100%;
    border-top: 4px solid #7c93ca;
    -webkit-transition: border-color 0.3s ease;
    -moz-transition: border-color 0.3s ease;
    -ms-transition: border-color 0.3s ease;
    -o-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease
}

.open-close-menu-switch:hover:before,
.open-close-menu-switch:hover:after {
    border-color: #5875bb
}

@media only screen and (max-width: 48em) {
    nav.main {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        background: #7c93ca;
        overflow: hidden;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s
    }

    nav.main a {
        display: block;
        color: white;
        font-weight: bold;
        padding: 1em 0
    }

    nav.main a:first-child {
        margin-top: 2.5em
    }

    .menu-open .open-close-menu-switch:before,
    .menu-open .open-close-menu-switch:after {
        border-color: white
    }
}

@media only screen and (min-width: 48em) {
    .open-close-menu-switch {
        display: none
    }

    nav.main {
        display: block !important;
        float: right;
        height: auto !important;
        margin-top: .5em
    }

    nav.main a {
        display: inline-block;
        padding: .25em .75em;
        text-decoration: none
    }

    nav.main span {
        margin: 0 .1em
    }

    nav.main span:hover,
    nav.main .active {
        border-bottom: 2px solid #00e4b1
    }
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px
}

.alert h4 {
    margin-top: 0;
    color: inherit
}

.alert .alert-link {
    font-weight: bold
}

.alert>p,
.alert>ul {
    margin-bottom: 0
}

.alert>p+p {
    margin-top: 5px
}

.alert-dismissable {
    padding-right: 35px
}

.alert-dismissable .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit
}

.alert-success {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #468847
}

.alert-success hr {
    border-top-color: #c9e2b3
}

.alert-success .alert-link {
    color: #356635
}

.alert-info {
    background-color: #d9edf7;
    border-color: #bce8f1;
    color: #3a87ad
}

.alert-info hr {
    border-top-color: #a6e1ec
}

.alert-info .alert-link {
    color: #2d6987
}

.alert-warning {
    background-color: #fcf8e3;
    border-color: #fbeed5;
    color: #c09853
}

.alert-warning hr {
    border-top-color: #f8e5be
}

.alert-warning .alert-link {
    color: #a47e3c
}

.alert-danger {
    background-color: #f2dede;
    border-color: #eed3d7;
    color: #b94a48
}

.alert-danger hr {
    border-top-color: #e6c1c7
}

.alert-danger .alert-link {
    color: #953b39
}

.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #000000;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.2;
    filter: alpha(opacity=20)
}

button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none
}

.pagetitle {
    font-size: 4em;
    margin-bottom: 1em;
    padding: .25em 0 .125em 0
}

.hero {
    padding: 2em 0;
    color: white;
    text-align: center
}

.hero a {
    color: white
}

.line1 {
    font-weight: bold;
    font-style: italic;
    font-size: 1.5em
}

.line2 {
    font-weight: 300;
    font-size: 1.5em
}

.line3 {
    font-weight: bold;
    font-style: italic;
    font-size: 2.25em
}

.line3 a {
    color: white;
    font-style: italic
}

.line3 .button {
    background-color: #7c93ca;
    background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#74ddc3), to(#7c93ca));
    background-image: -webkit-linear-gradient(left, #74ddc3, #7c93ca);
    background-image: -moz-linear-gradient(left, #74ddc3, #7c93ca);
    background-image: -ms-linear-gradient(left, #74ddc3, #7c93ca);
    background-image: -o-linear-gradient(left, #74ddc3, #7c93ca);
    background-image: linear-gradient(left, #74ddc3, #7c93ca);
    background-repeat: repeat-x;
    font-size: .5em;
    text-decoration: none
}

.main-content {
    background: white;
    padding: 2em 1em 0 1em;
    text-align: center
}

.interior-content {
    background: white;
    padding: 0 1em 0 1em;
    text-align: center;
    margin-top: 4em
}

.email-signup {
    background: white;
    padding: 0 1em;
    padding-bottom: 1em;
    text-align: center
}

.email-signup button {
    font-size: 1.5em
}

.email-signup .field {
    text-align: left
}

.cutout {
    text-shadow: 0;
    font-weight: 300;
    text-transform: uppercase;
    text-align: center;
    background: -webkit-linear-gradient(left, #68dcc0 30%, #8c93de 57%, #f9a57f 79%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
    line-height: 1em
}

h2.cutout {
    padding: .25em 0 .125em 0;
    font-size: 4em
}

h4.cutout {
    letter-spacing: .05em;
    margin-bottom: 1em
}

.updates {
    background: #eeeeee;
    padding: 1em
}

.tweet {
    margin-bottom: 1em
}

.tweet img {
    border-radius: 10%;
    float: left;
    width: 45px;
    margin: 0 5px 5px 0
}

.tweet>a {
    display: block;
    text-transform: uppercase
}

.tweet>a:first-of-type {
    color: #74ddc3;
    margin-bottom: .25em;
    padding-top: .125em
}

.tweet>a:nth-of-type(2) {
    font-size: .75em;
    color: #555555
}

.tweet-content {
    clear: both;
    word-break: break-word
}

.tweet-content a {
    color: #74ddc3
}

.twitter-follow-button {
    float: right;
    margin: 1em 0 1em 1em
}

.sponsor-index ul {
    list-style: none;
    margin: 0;
    padding: 0
}

.sponsor-index li {
    margin-bottom: 2em
}

.sponsor-index img {
    max-width: 10em
}

@media only screen and (min-width: 30em) {
    .hero {
        padding: 3em 0
    }

    .line1 {
        font-size: 2.5em
    }

    .line2 {
        font-size: 2.5em
    }

    .line3 {
        font-size: 4.25em
    }

    .line3 .button {
        font-size: .4em
    }

    .main-content {
        padding-top: 4em
    }

    h4.cutout {
        margin-bottom: 2em
    }

    .email-signup {
        *zoom: 1
    }

    .email-signup:before,
    .email-signup:after {
        display: table;
        content: ""
    }

    .email-signup:after {
        clear: both
    }

    .email-signup .field {
        float: left;
        width: -moz-calc(50% - .5em);
        width: -webkit-calc(50% - .5em);
        width: calc(50% - .5em);
        margin-right: 1em
    }

    .email-signup .field:nth-child(2n+2) {
        margin-right: 0
    }

    .updates {
        *zoom: 1
    }

    .updates:before,
    .updates:after {
        display: table;
        content: ""
    }

    .updates:after {
        clear: both
    }

    .tweet {
        float: left;
        width: -moz-calc(50% - .5em);
        width: -webkit-calc(50% - .5em);
        width: calc(50% - .5em);
        margin-right: 1em
    }

    .tweet:nth-child(2) {
        margin-right: 0
    }

    h4.cutout {
        letter-spacing: .2em
    }

    .sponsor-index img {
        max-width: 20em
    }
}

@media only screen and (min-width: 48em) {
    .hero {
        padding: 5em 0
    }

    .line1 {
        font-size: 4.5em
    }

    .line2 {
        font-size: 4.5em
    }

    .line3 {
        font-size: 6.25em
    }

    .line3 .button {
        font-size: .3em
    }

    .main-content p,
    .interior-content p {
        font-size: 1.25em
    }

    .email-signup .field {
        width: -moz-calc(50% - (10em / 2));
        width: -webkit-calc(50% - (10em / 2));
        width: calc(50% - (10em / 2));
        margin-right: 2em
    }

    .email-signup .field:nth-child(2) {
        margin-right: 2em
    }

    .email-signup .field:last-of-type {
        width: 5.8125em;
        margin-right: 0;
        padding-top: 1.375em
    }

    .sponsor-index img {
        max-width: 25em
    }
}

@media only screen and (min-width: 64em) {

    .main-content,
    .email-signup {
        padding-left: -moz-calc(50% - 22.5em);
        padding-left: -webkit-calc(50% - 22.5em);
        padding-left: calc(50% - 22.5em);
        padding-right: -moz-calc(50% - 22.5em);
        padding-right: -webkit-calc(50% - 22.5em);
        padding-right: calc(50% - 22.5em)
    }

    .interior-content {
        padding-left: -moz-calc(50% - 30em);
        padding-left: -webkit-calc(50% - 30em);
        padding-left: calc(50% - 30em);
        padding-right: -moz-calc(50% - 30em);
        padding-right: -webkit-calc(50% - 30em);
        padding-right: calc(50% - 30em)
    }

    .updates {
        padding-left: -moz-calc(50% - 27em);
        padding-left: -webkit-calc(50% - 27em);
        padding-left: calc(50% - 27em);
        padding-right: -moz-calc(50% - 27em);
        padding-right: -webkit-calc(50% - 27em);
        padding-right: calc(50% - 27em)
    }

    .sponsor-index img {
        max-width: 30em
    }
}

.schedule-index td {
    padding: 1em .5em
}

.schedule-index th {
    -webkit-font-smoothing: antialiased;
    border-bottom: 1px solid #555555;
    color: #555555;
    font-size: 1.375em
}

.schedule-index h2 {
    -webkit-font-smoothing: antialiased;
    text-shadow: none
}

.time-col {
    min-width: 2em;
    width: 8em
}

.room-heading {
    min-width: 100px
}

[class^="session-"] .attribution,
[class^="session-"] .links,
[class*=" session-"] .attribution,
[class*=" session-"] .links {
    font-size: .9em;
    padding-bottom: .1em
}

.session-index ul {
    margin-left: 0;
    padding-left: 0
}

.session-index ul li {
    display: block;
    padding-left: 0;
    text-align: left
}

.session h3 {
    text-shadow: none
}

.session-show {
    text-align: left
}

.embed {
    display: none
}

.embed>div {
    display: none
}

@media only screen and (min-width: 48em) {
    .session-index ul {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        text-align: left;
        flex-wrap: wrap;
        -webkit-flex-flow: wrap;
        justify-content: space-between;
        -webkit-justify-content: space-between
    }

    @supports not (flex-wrap: wrap) {
        .session-index ul {
            display: block
        }
    }

    .session-index li {
        width: 48%
    }

    @supports not (flex-wrap: wrap) {
        .session-index li {
            display: inline-block;
            float: left
        }
    }

    .embed {
        display: block;
        float: right;
        margin: 0 0 1em 1em
    }

    .embed>iframe {
        width: 32em;
        height: -moz-calc(32em * .89);
        height: -webkit-calc(32em * .89);
        height: calc(32em * .89)
    }
}

.speaker-index ul {
    margin-left: 0;
    padding-left: 0
}

.speaker-index ul li {
    display: block;
    margin-bottom: 2em;
    text-align: left
}

.img-circle {
    border-radius: 50%
}

.speaker img {
    margin-right: 2em
}

.speaker-show {
    text-align: left
}

.speaker-show .details {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.bio h6 {
    font-size: .9em;
    text-shadow: none
}

@media only screen and (min-width: 30em) {
    .speaker-index ul {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        text-align: left;
        flex-wrap: wrap;
        -webkit-flex-flow: wrap;
        justify-content: space-between;
        -webkit-justify-content: space-between
    }

    @supports not (flex-wrap: wrap) {
        .speaker-index ul {
            display: block
        }
    }

    .speaker-index li {
        width: 40%
    }

    @supports not (flex-wrap: wrap) {
        .speaker-index li {
            display: inline-block;
            float: left
        }
    }
}

@media only screen and (min-width: 48em) {

    .speaker-show .gravitar,
    .speaker-show .social,
    .speaker-show .bio {
        width: 48%
    }
}

.inline-errors {
    background: pink;
    padding: 1em
}

.speaker-submission input[type="text"],
.speaker-submission input[type="email"],
.speaker-submission textarea {
    max-width: 100%;
    clear: left
}

.speaker-submission ol {
    margin-left: 0;
    padding-left: 0;
    list-style: none
}

.speaker-submission label,
.speaker-submission button {
    float: left
}

.speaker-submission .speaker_submission {
    margin: 2em 0
}

footer.main {
    padding: 1em;
    background: white
}

footer.main .g-plus-link {
    float: right;
    padding: 1em 0
}

@media only screen and (min-width: 64em) {
    footer.main {
        padding-left: -moz-calc(50% - 30em);
        padding-left: -webkit-calc(50% - 30em);
        padding-left: calc(50% - 30em);
        padding-right: -moz-calc(50% - 30em);
        padding-right: -webkit-calc(50% - 30em);
        padding-right: calc(50% - 30em)
    }
}