a {
    color: black
}

/* ## Base */
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Content
==================================================
	#Reset & Basics
	#Basic Styles
	#Site Styles
	#Typography
	#Links
	#Lists
	#Images
	#Buttons
	#Forms
	#Misc */


.panel-heading {
    background-color: #F5CA85 !important;
    font-weight: bold;
    font-size: 1.5em;
    color: #542762 !important;
}

.panel-body {
    background-color: #92468E !important;
    color: #F5CA85;

}

.panel-body a {
    color: #F5CA85 !important;
    text-decoration: none;
}


/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
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, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

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

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/* #Basic Styles
================================================== */
body {
    background: #fff;
    font: 14px/21px "Raleway", "HelveticaNeue-Light", Arial, sans-serif;
    color: #444;
    -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
    -webkit-text-size-adjust: 100%;
}


/* #Typography
================================================== */
h1, h2 {
    font-family: 'Mochiy Pop One', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 300;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-weight: inherit;
}

h1 {
    font-size: 46px;
    line-height: 50px;
    margin-bottom: 14px;
}

h2 {
    font-size: 35px;
    line-height: 40px;
    margin-bottom: 10px;
}

h3 {
    font-size: 28px;
    line-height: 34px;
    margin-bottom: 8px;
}

h4 {
    font-size: 21px;
    line-height: 30px;
    margin-bottom: 4px;
}

h5 {
    font-size: 17px;
    line-height: 24px;
}

h6 {
    font-size: 14px;
    line-height: 21px;
}

.subheader {
    color: #777;
}

p {
    margin: 0 0 20px 0;
}

p img {
    margin: 0;
}

p.lead {
    font-size: 21px;
    line-height: 27px;
    color: #777;
}

em {
    font-style: italic;
}

strong {
    font-weight: bold;
}

small {
    font-size: 80%;
}

/*	Blockquotes  */
blockquote, blockquote p {
    font-size: 17px;
    line-height: 24px;
    color: #F0F0F0;
    font-style: italic;
}

blockquote {
    margin: 0 0 20px;
    padding: 9px 20px 0 19px;
    border-left: 1px solid #ddd;
}

blockquote cite {
    display: block;
    font-size: 12px;
    color: #F0F0F0;
}

blockquote cite:before {
    content: "\2014 \0020";
}

blockquote cite a, blockquote cite a:visited, blockquote cite a:visited {
    color: #F0F0F0;
}

hr {
    border: solid #ddd;
    border-width: 1px 0 0;
    clear: both;
    margin: 10px 0 30px;
    height: 0;
}


/* #Links
================================================== */
a, a:visited {
    text-decoration: underline;
    color: #999999;
    outline: 0;
}

a:hover, a:focus {
    color: gray;
}

p a, p a:visited {
    line-height: inherit;
}


/* #Lists
================================================== */
ul, ol {
    margin-bottom: 20px;
}

ul {
    list-style: none outside;
}

ol {
    list-style: decimal;
}

ul, ul.square {
    list-style: square outside;
}

ul ul, ul.circle {
    list-style: circle outside;
}

ul ul ul, ul.disc {
    list-style: disc outside;
}

ul ul li, ul ol li,
ol ol li, ol ul li {
    margin-bottom: 6px;
}

li {
    line-height: 24px;
    margin-bottom: 12px;
}

ul.large li {
    line-height: 21px;
}

li p {
    line-height: 21px;
}

/* #Images
================================================== */

img.scale-with-grid {
    max-width: 100%;
    height: auto;
}


/* #Buttons
================================================== */

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    background: #eee; /* Old browsers */
    background: #eee -moz-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(0, 0, 0, .2) 100%); /* FF3.6+ */
    background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, .2)), color-stop(100%, rgba(0, 0, 0, .2))); /* Chrome,Safari4+ */
    background: #eee -webkit-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(0, 0, 0, .2) 100%); /* Chrome10+,Safari5.1+ */
    background: #eee -o-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(0, 0, 0, .2) 100%); /* Opera11.10+ */
    background: #eee -ms-linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(0, 0, 0, .2) 100%); /* IE10+ */
    background: #eee linear-gradient(top, rgba(255, 255, 255, .2) 0%, rgba(0, 0, 0, .2) 100%); /* W3C */
    border: 1px solid #aaa;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: #444;
    display: inline-block;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 0 1px rgba(255, 255, 255, .75);
    cursor: pointer;
    margin-bottom: 20px;
    line-height: normal;
    padding: 8px 10px;
    font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
    color: #222;
    background: #ddd; /* Old browsers */
    background: #ddd -moz-linear-gradient(top, rgba(255, 255, 255, .3) 0%, rgba(0, 0, 0, .3) 100%); /* FF3.6+ */
    background: #ddd -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, .3)), color-stop(100%, rgba(0, 0, 0, .3))); /* Chrome,Safari4+ */
    background: #ddd -webkit-linear-gradient(top, rgba(255, 255, 255, .3) 0%, rgba(0, 0, 0, .3) 100%); /* Chrome10+,Safari5.1+ */
    background: #ddd -o-linear-gradient(top, rgba(255, 255, 255, .3) 0%, rgba(0, 0, 0, .3) 100%); /* Opera11.10+ */
    background: #ddd -ms-linear-gradient(top, rgba(255, 255, 255, .3) 0%, rgba(0, 0, 0, .3) 100%); /* IE10+ */
    background: #ddd linear-gradient(top, rgba(255, 255, 255, .3) 0%, rgba(0, 0, 0, .3) 100%); /* W3C */
    border: 1px solid #888;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
}

.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
    border: 1px solid #666;
    background: #ccc; /* Old browsers */
    background: #ccc -moz-linear-gradient(top, rgba(255, 255, 255, .35) 0%, rgba(10, 10, 10, .4) 100%); /* FF3.6+ */
    background: #ccc -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, .35)), color-stop(100%, rgba(10, 10, 10, .4))); /* Chrome,Safari4+ */
    background: #ccc -webkit-linear-gradient(top, rgba(255, 255, 255, .35) 0%, rgba(10, 10, 10, .4) 100%); /* Chrome10+,Safari5.1+ */
    background: #ccc -o-linear-gradient(top, rgba(255, 255, 255, .35) 0%, rgba(10, 10, 10, .4) 100%); /* Opera11.10+ */
    background: #ccc -ms-linear-gradient(top, rgba(255, 255, 255, .35) 0%, rgba(10, 10, 10, .4) 100%); /* IE10+ */
    background: #ccc linear-gradient(top, rgba(255, 255, 255, .35) 0%, rgba(10, 10, 10, .4) 100%); /* W3C */
}

.button.full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center;
}

/* Fix for odd Mozilla border & padding issues */
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}


/* #Forms
================================================== */

form {
    margin-bottom: 20px;
}

fieldset {
    margin-bottom: 20px;
}

input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
    border: 1px solid #ccc;
    padding: 6px 4px;
    outline: none;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #777;
    margin: 0;
    width: 210px;
    max-width: 100%;
    display: block;
    margin-bottom: 20px;
    background: #fff;
}

select {
    padding: 0;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus {
    border: 1px solid #aaa;
    color: #444;
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    box-shadow: 0 0 3px rgba(0, 0, 0, .2);
}

textarea {
    min-height: 60px;
}

label,
legend {
    display: block;
    font-weight: bold;
    font-size: 13px;
}

select {
    width: 220px;
}

input[type="checkbox"] {
    display: inline;
}

label span,
legend span {
    font-weight: normal;
    font-size: 13px;
    color: #444;
}

/* #Misc
================================================== */
.remove-bottom {
    margin-bottom: 0 !important;
}

.half-bottom {
    margin-bottom: 10px !important;
}

.add-bottom {
    margin-bottom: 20px !important;
}


/* #Syntax highlighting
================================================== */


.highlight {
    color: #f8f8f2;
    table-layout: fixed;
    white-space: nowrap;
    width: 90%;
}

.highlight pre, .highlight code {
    display: block;
    margin: 0;
    padding: 0;
    background: none;
    overflow: auto;
    word-wrap: normal;
}

.highlight, .gutter {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQIHWPQ1dU1BgABzQC7XXMTYQAAAABJRU5ErkJggg==);
    display: block;
    padding: 10px;
    margin-bottom: 20px;
}

.gutter, .lineno {
    color: #ccc;
}

td.gl {
    width: 40px;
}

.gutter {
    border-right: none;
    padding: 10px;
    text-align: right;
}

span.lineno {
    display: block;
    float: left;
    width: 40px;
    padding-right: 8px;
    text-align: right;
}


.hll {
    background-color: #49483e
}

.c {
    color: #75715e
}

/* Comment */
.err {
    color: #960050;
    background-color: #1e0010
}

/* Error */
.k {
    color: #66d9ef
}

/* Keyword */
.l {
    color: #ae81ff
}

/* Literal */
.n {
    color: #f8f8f2
}

/* Name */
.o {
    color: #f92672
}

/* Operator */
.p {
    color: #f8f8f2
}

/* Punctuation */
.cm {
    color: #75715e
}

/* Comment.Multiline */
.cp {
    color: #75715e
}

/* Comment.Preproc */
.c1 {
    color: #75715e
}

/* Comment.Single */
.cs {
    color: #75715e
}

/* Comment.Special */
.ge {
    font-style: italic
}

/* Generic.Emph */
.gs {
    font-weight: bold
}

/* Generic.Strong */
.kc {
    color: #66d9ef
}

/* Keyword.Constant */
.kd {
    color: #66d9ef
}

/* Keyword.Declaration */
.kn {
    color: #f92672
}

/* Keyword.Namespace */
.kp {
    color: #66d9ef
}

/* Keyword.Pseudo */
.kr {
    color: #66d9ef
}

/* Keyword.Reserved */
.kt {
    color: #66d9ef
}

/* Keyword.Type */
.ld {
    color: #e6db74
}

/* Literal.Date */
.m {
    color: #ae81ff
}

/* Literal.Number */
.s {
    color: #e6db74
}

/* Literal.String */
.na {
    color: #a6e22e
}

/* Name.Attribute */
.nb {
    color: #f8f8f2
}

/* Name.Builtin */
.nc {
    color: #a6e22e
}

/* Name.Class */
.no {
    color: #66d9ef
}

/* Name.Constant */
.nd {
    color: #a6e22e
}

/* Name.Decorator */
.ni {
    color: #f8f8f2
}

/* Name.Entity */
.ne {
    color: #a6e22e
}

/* Name.Exception */
.nf {
    color: #a6e22e
}

/* Name.Function */
.nl {
    color: #f8f8f2
}

/* Name.Label */
.nn {
    color: #f8f8f2
}

/* Name.Namespace */
.nx {
    color: #a6e22e
}

/* Name.Other */
.py {
    color: #f8f8f2
}

/* Name.Property */
.nt {
    color: #f92672
}

/* Name.Tag */
.nv {
    color: #f8f8f2
}

/* Name.Variable */
.ow {
    color: #f92672
}

/* Operator.Word */
.w {
    color: #f8f8f2
}

/* Text.Whitespace */
.mf {
    color: #ae81ff
}

/* Literal.Number.Float */
.mh {
    color: #ae81ff
}

/* Literal.Number.Hex */
.mi {
    color: #ae81ff
}

/* Literal.Number.Integer */
.mo {
    color: #ae81ff
}

/* Literal.Number.Oct */
.sb {
    color: #e6db74
}

/* Literal.String.Backtick */
.sc {
    color: #e6db74
}

/* Literal.String.Char */
.sd {
    color: #e6db74
}

/* Literal.String.Doc */
.s2 {
    color: #e6db74
}

/* Literal.String.Double */
.se {
    color: #ae81ff
}

/* Literal.String.Escape */
.sh {
    color: #e6db74
}

/* Literal.String.Heredoc */
.si {
    color: #e6db74
}

/* Literal.String.Interpol */
.sx {
    color: #e6db74
}

/* Literal.String.Other */
.sr {
    color: #e6db74
}

/* Literal.String.Regex */
.s1 {
    color: #e6db74
}

/* Literal.String.Single */
.ss {
    color: #e6db74
}

/* Literal.String.Symbol */
.bp {
    color: #f8f8f2
}

/* Name.Builtin.Pseudo */
.vc {
    color: #f8f8f2
}

/* Name.Variable.Class */
.vg {
    color: #f8f8f2
}

/* Name.Variable.Global */
.vi {
    color: #f8f8f2
}

/* Name.Variable.Instance */
.il {
    color: #ae81ff
}

/* Literal.Number.Integer.Long */

.gh {
}

/* Generic Heading & Diff Header */
.gu {
    color: #75715e;
}

/* Generic.Subheading & Diff Unified/Comment? */
.gd {
    color: #f92672;
}

/* Generic.Deleted & Diff Deleted */
.gi {
    color: #a6e22e;
}

/* Generic.Inserted & Diff Inserted */


/* ## Skeleton */

/* -----------------------------------*/
/* ----- 960px wide fancy grid! ----- */
/* -----------------------------------*/

/* by tim o'brien, t413.com
 * based on getskeleton.com
 */


/* ----- base grid----- */

.container {
    position: relative;
    width: 960px;
    margin: 0 auto;
    padding: 0;
}

.container .column {
    float: left;
    display: inline;
    margin-left: 10px;
    margin-right: 10px;
}

.row {
    margin-bottom: 20px;
}

.container .small.column {
    width: 300px;
}

.container .half.column {
    width: 460px;
}

.container .big.column {
    width: 620px;
}

.container .full.column {
    width: 940px;
}


/* ----- Tablet (Portrait) -- 768px ----- */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .container {
        width: 768px;
    }

    .container .small.column {
        width: 236px;
    }

    .container .half.column {
        width: 364px;
    }

    .container .big.column {
        width: 488px;
    }

    .container .full.column {
        width: 748px;
    }
}


/* ----- Mobile (Portrait) ----- */
@media only screen and (max-width: 767px) {
    .container {
        width: 96%;
    }

    .container .column {
        margin: 1%;
    }

    .container .small.column {
        width: 48%;
    }

    .container .half.column {
        width: 48%;
    }

    .container .big.column {
        width: 98%;
    }

    .container .full.column {
        width: 98%;
    }
}


/* ----- Mobile (Landscape) -- 480px ----- */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container {
        width: 92%;
    }

    .container .column {
        margin: 2%;
    }

    .container .small.column {
        width: 46%;
    }

    .container .half.column {
        width: 46%;
    }

    .container .big.column {
        width: 96%;
    }

    .container .full.column {
        width: 96%;
    }
}


/* ----- Clearing ----- */

/* Self Clearing Goodness */
.container:after {
    content: "\0020";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.row:after,
.clearfix:after {
    clear: both;
}

.row,
.clearfix {
    zoom: 1;
}

/* You can also use a <br class="clear" /> to clear columns */
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

/* ## Main */
html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

/* ---------------------------*/
/* ----- Special Styles ----- */
/* ---------------------------*/

/* ----- colors (autogenerated from _config.yml)----- */


.border-black {
    border-color: #111111 !important;
}

.text-black {
    color: #111111;
}

.text-black a {
    color: #111111;
}

.bg-black {
    background-color: #111111 !important;
}

.border-red {
    border-color: #EB2824 !important;
}

.text-red {
    color: #EB2824;
}

.text-red a {
    color: #EB2824;
}

.bg-red {
    background-color: #EB2824 !important;
}

.border-pink {
    border-color: #DA6365 !important;
}

.text-pink {
    color: #DA6365;
}

.text-pink a {
    color: #DA6365;
}

.bg-pink {
    background-color: #DA6365 !important;
}

.border-light_pink {
    border-color: #ECB3BA !important;
}

.text-light_pink {
    color: #ECB3BA;
}

.text-light_pink a {
    color: #ECB3BA;
}

.bg-light_pink {
    background-color: #ECB3BA !important;
}

.border-white {
    border-color: #DBBB7C !important;
}

.text-white {
    color: #000000;
}

.text-white a {
    color: #DBBB7C;
}

.bg-white {
    background-color: #DBBB7C !important;
}

.border-blue {
    border-color: #49a7e9 !important;
}

.text-blue {
    color: #49a7e9;
}

.text-blue a {
    color: #49a7e9;
}

.bg-blue {
    background-color: #49a7e9 !important;
}

.border-green {
    border-color: #9bcf2f !important;
}

.text-green {
    color: #9bcf2f;
}

.text-green a {
    color: #9bcf2f;
}

.bg-green {
    background-color: #9bcf2f !important;
}

.border-purple {
    border-color: #4d235e !important;
}

.text-purple {
    color: #4d235e;
}

.text-purple a {
    color: #4d235e;
}

.bg-purple {
    background-color: #4d235e !important;
}

.border-orange {
    border-color: #fab125 !important;
}

.text-orange {
    color: #fab125;
}

.text-orange a {
    color: #fab125;
}

.bg-orange {
    background-color: #fab125 !important;
}

.border-turquoise {
    border-color: #0fbfcf !important;
}

.text-turquoise {
    color: #0fbfcf;
}

.text-turquoise a {
    color: #0fbfcf;
}

.bg-turquoise {
    background-color: #0fbfcf !important;
}

.border-logo_green {
    border-color: #7F9686 !important;
}

.text-logo_green {
    color: #7F9686;
}

.text-logo_green a {
    color: #7F9686;
}

.bg-logo_green {
    background-color: #7F9686 !important;
}

.border-logo_orange {
    border-color: #ED906E !important;
}

.text-logo_orange {
    color: #ED906E;
}

.text-logo_orange a {
    color: #ED906E;
}

.bg-logo_orange {
    background-color: #ED906E !important;
}

.border-logo_yellow {
    border-color: #F5CA85 !important;
}

.text-logo_yellow {
    color: #F5CA85;
}

.text-logo_yellow a {
    color: #F5CA85;
}

.bg-logo_yellow {
    background-color: #F5CA85 !important;
}

.border-logo_purple {
    border-color: #92468E !important;
}

.text-logo_purple {
    color: #92468E;
}

.text-logo_purple a {
    color: #92468E;
}

.bg-logo_purple {
    background-color: #92468E !important;
}

.border-logo_purple2 {
    border-color: #542762 !important;
}

.text-logo_purple2 {
    color: #542762;
}

.text-logo_purple2 a {
    color: #542762;
}

.bg-logo_purple2 {
    background-color: #542762 !important;
}


/* ----- per-post colors! ----- */


nav .p-archive {
    border-color: #11132E;
}

#archive {
    background-color: #EB2824 !important;
    color: #DBBB7C;
}

#archive a {
    color: #DBBB7C;
}

#archive .sectiondivider {
    color: #EB2824;
}


nav .p-more-info {
    border-color: ;
}

#more-info {
    background-color: !important;
    color: #111111;
}

#more-info a {
    color: #111111;
}

#more-info .sectiondivider {
    color: ;
}


nav .p-introduction {
    border-color: #E7E9EF;
}

#introduction {
    background-color: #E7E9EF !important;
    color: #000000;
}

#introduction a {
    color: #DBBB7C;
}

#introduction .sectiondivider {
    color: #DA6365;
}

nav .p-certification {
    border-color:#DBBB7C ;
}

#certification {
    background-color:  !important;
    color: #000000;
}

#certification a {
    color: #DBBB7C;
}

#certification .sectiondivider {
    color: #DA6365;
}

nav .p-contact {
    border-color: #E7E9EF;
}

#contact {
    background-color: #E7E9EF !important;
    color: #000000;
}

#contact a {
    color: #DBBB7C;
}

#contact .sectiondivider {
    color: #DA6365;
}

nav .p-program {
    border-color: #E7E9EF;
}

#program {
    background-color: #E7E9EF !important;
    color: #111111;
}

#program a {
    color: #111111;
}

#program .sectiondivider {
    color: #ECB3BA;
}

nav .p-accomodation {
    border-color: #932188;
}

#accomodation {
    background-color: #932188 !important;
    color: #111111;
}

#accomodation a {
    color: #111111;
}

#accomodation .sectiondivider {
    color: #932188;
}


nav .p-registration {
    border-color:#DBBB7C ;
}

#registration {
    background-color: !important;
    color: #111111;
}

#registration a {
    color: #111111;
}

#registration .sectiondivider {
    color: ;
}

nav .p-fee {
    border-color:#932188 ;
}

#fee {
    background-color:#932188 !important;
    color: #111111;
}

#fee a {
    color: #111111;
}

#fee .sectiondivider {
    color: ;
}


nav .p-important-dates {
    border-color: #203162;
}

#important-dates {
    background-color: #DA6365 !important;
    color: #DBBB7C;
}

#important-dates a {
    color: #DBBB7C;
}

#important-dates .sectiondivider {
    color: #DA6365;
}


nav .p-intro {
    border-color: #932188;
}

#intro {
    background-color: #932188 !important;
    color: #DBBB7C;
}

#intro a {
    color: #DBBB7C;
}

#intro .sectiondivider {
    color: #EB2824;
}


/* ----- code, syntax highlighting, etc ----- */

code, pre {
    font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
}

/* spesifically inline code */
code {
    background: rgba(255, 255, 255, 0.2);
    display: inline;
    word-wrap: break-word;
}

/* block code */
pre code {
    background: none;
    display: block;
}

pre {
    display: block;
    margin: 20px 5%;
    padding: 4px 8px;
    background: rgba(255, 255, 255, 0.1);
    word-wrap: break-word;
}

.highlight {
    margin: 20px 5%;
}

.centerTable {
    margin: 0px auto;
}


/* ----- base elements ----- */

img {
    max-width: 100% !important;
    height: auto;
    vertical-align: middle;
}

hr {
    margin: 60px auto;
    width: 50%;
    border-color: #111111;
}

.container {
    word-wrap: break-word;
}

.center {
    text-align: center;
}

.left, .container .left {
    text-align: left;
}

.container h1, .container h2, .container h3, .container h4 {
    margin-bottom: 20px;
    text-align: center;
    padding: 0 4%;
}

.container p, .container ol, .container ul {
    font-size: 20px;
    padding: 0 5%;
}

.container ol, .container ul {
    padding: 0 8%;
}

.container p:first-of-type {
    margin-top: 40px;
}

/* keep embedded videos fluid! */
.icontain {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%; /* keep 16x9 Aspect Ratio */
}

.i4x3 {
    padding-bottom: 75.00%;
}

/* keep 4x3 Aspect Ratio */
.icontain iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.inlineblock {
    display: -moz-inline-stack;
    display: inline-block;
    zoom: 1;
    *display: inline;
}

/* ---------------------------*/
/* ----- Main Structure ----- */
/* ---------------------------*/

/* ----- top menu ----- */


nav {
    font-size: 15px;
    width: 100%;
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    background: #E7E9EF;
}

nav ul {
    list-style: none;
    text-align: center;
    padding: 0;
    margin: 0;
    letter-spacing: -4px;
}

nav ul li {
    display: inline-block;
    border-top: 3px solid;
    padding: 3px;
    *display: inline;
    zoom: 1;
    line-height: normal;
    letter-spacing: normal;
    text-transform: uppercase;
    min-width: 110px;
    line-height: 30px;
    margin: 0;
}

nav ul li a, nav ul li a:visited {
    display: block;
    color: #000000;
    text-decoration: none;
    font-weight: 600;
    opacity: .75;
}

nav ul li a:hover {
    opacity: 1
}

nav ul li:hover, nav ul li.active {
    border-top-width: 6px;
    padding-top: 0;
}


/* ----- sections/articles ----- */

.section {
    position: relative;
    display: block;
    width: 100%;
    min-height: 400px;
    padding: 150px 0;
    /* background:url(img/bgnoise.png); */
    /* generated noise from noisetexturegenerator.com */
}


.section:first-of-type {
    padding-top: 140px;
}


#footer {
    padding: 8px 0;
    min-height: 0;
    text-align: center;
    background-color: #932188;
    background-image: none;
}

#footer .container p {
    font-size: 13px;
    margin: 0;
}

.subtlecircle {
    text-align: center;
    z-index: 3;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.05);
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAF0lEQVQIHWP8//+/MQMaYELjg7kUCgIASm8DOqGzfp8AAAAASUVORK5CYII=);
}

.sectiondivider {
    width: 270px;
    height: 270px;
    padding: 15px;
    position: absolute;
    top: -135px;
    left: 50%;
    margin-left: -135px;
}

.sectiondivider img {
    width: 200px;
    height: 240px;
    position: static;
    margin-top: -20px;
}

.sectiondivider .fa-stack {
    font-size: 130px;
    position: static;
    margin-top: -8px;
}

.sectiondivider .fa-circle {
    color: #fff;
}

.sectiondivider h5 {
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    position: absolute;
    bottom: 50px;
    left: auto;
    text-align: center;
    display: block;
    z-index: 6;
    width: 240px;
}

.sectiondivider.imaged {
    text-shadow: 1px 1px 3px #333;
}


.columned {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;

    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;

    -webkit-column-rule: 1px outset rgba(255, 255, 255, 0.5);
    -moz-column-rule: 1px outset rgba(255, 255, 255, 0.5);
    column-rule: 1px outset rgba(255, 255, 255, 0.5);
}

.longlist {
    font-size: 14px !important;
}

.longlist li {
    margin-bottom: 3px;
}


/* ----- fork on github banner ----- */
#forkongithub a {
    color: #fff;
    text-decoration: none;
    font-family: arial, sans-serif;
    text-align: center;
    font-weight: 700;
    font-size: 1rem;
    line-height: 2rem;
    position: relative;
    transition: .5s;
    padding: 5px 40px;
}

#forkongithub a::before, #forkongithub a::after {
    content: "";
    width: 100%;
    display: block;
    position: absolute;
    top: 1px;
    left: 0;
    height: 1px;
    background: #fff;
}

#forkongithub a::after {
    bottom: 1px;
    top: auto;
}

@media screen and (min-width: 800px) {
    #forkongithub {
        position: fixed;
        display: block;
        top: 0;
        right: 0;
        width: 200px;
        overflow: hidden;
        height: 200px;
        z-index: 9999;
    }

    #forkongithub a {
        width: 200px;
        position: absolute;
        top: 60px;
        right: -60px;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.8);
        box-sizing: content-box;
    }
}


/* mid size (tablets, landscapes) */
@media only screen and (max-width: 679px) {
    nav {
        font-size: 11px;
    }

    nav ul li {
        min-width: 60px;
        line-height: 40px;
    }
}

/* tiny size (phones) */
@media only screen and (max-width: 380px) {
    nav ul li {
        min-width: 90px;
        line-height: 20px;
    }
}

/* anything not desktop */
@media only screen and (max-width: 767px) {
    .container h1 {
        font-size: 30px;
    }

    .container h2 {
        font-size: 24px;
    }

    .container h3 {
        font-size: 20px;
    }

    .container h4 {
        font-size: 18px;
    }


    .section {
        padding: 130px 0;
    }

    .sectiondivider {
        width: 200px;
        height: 200px;
        padding: 15px;
        top: -100px;
        margin-left: -100px;
    }

    .sectiondivider img {
        width: 150px;
        height: 180px;
    }

    .sectiondivider .fa-stack {
        font-size: 100px;
        margin-top: -14px;
    }

    .sectiondivider h5 {
        font-size: 15px;
        bottom: 30px;
        width: 170px
    }

    .columned {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

/* Extra stuff to make tables look reasonable. */
.program table, .program th, .program td {
    border: 1px solid black;
}

.program td, .program th {
    padding: 10px;
    font-size: 135%;
}


.hotel-map {

    width: clamp(200px, calc(60vw), 800px);
    height: 400px;
    box-sizing: border-box;
}

.hotel-img {
    width: clamp(200px, calc(80vw), 1000px);
    margin: 10px;
    border: 5px solid #F5CA85;
    border-radius: 14px;

}


.register {
    background-color: pink;
    font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    border: solid;
    border-width: thin;
    color: black;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 22px;
    border-radius: 14px;
}

.register:hover {
    background-color: darkgray;
    font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    filter: drop-shadow(0 0 1.0rem white);
    border: solid;
    border-width: thin;
    color: black;
    padding: 15px 32px;
    text-align: center;
    display: inline-block;
    font-size: 22px;
    border-radius: 14px;

}

.warning {
    width: 80%;
    margin: 20px;
    text-shadow: 1px 1px #AAAAAA;
    font-size: 32px;
    font-weight: 900;
    text-align: center;
}

/* ## Schedule */

/* Grid based Schedule
https://css-tricks.com/building-a-conference-schedule-with-css-grid/
https://codepen.io/mrwweb/pen/rgPOOd
*/

/*************************
 * GRID SCHEDULE LAYOUT
 *************************/


@media screen and (min-width: 700px) {
    .schedule_workshops {
        display: grid;
        grid-gap: 1em;
        grid-template-rows:
		[tracks] auto
		[time-1000] auto
		[time-1200] auto
		[time-1400] auto
		/*[time-1400] 1fr*/
		[time-1700] auto;
        /* Note 1:
        Use 24hr time for gridline names for simplicity
        Note 2: Use "auto" instead of "1fr" for a more compact schedule where height of a slot is not proportional to the session length. Implementing a "compact" shortcode attribute might make sense for this!
        Try 0.5fr for more compact equal rows. I don't quite understand how that works :)
        */

        grid-template-columns:
			[times] 4em
			[track-1-start] 1fr
			[track-1-end track-2-start] 1fr
			[track-2-end track-3-start] 1fr
			[track-3-end track-4-start] 1fr
			[track-4-end];
    }
}


@media screen and (min-width: 700px) {
    .schedule {
        display: grid;
        grid-gap: 1em;
        grid-template-rows:
		[tracks] auto

	[time-0900] auto
	[time-0910] auto
	[time-0930] auto
	[time-0935] auto
	[time-0940] auto
	[time-0945] auto
	[time-0950] auto
	[time-0955] auto
	[time-1000] auto
	[time-1005] auto
	[time-1010] auto
	[time-1015] auto
	[time-1020] auto
	[time-1025] auto
	[time-1030] auto
	[time-1035] auto
	[time-1040] auto
	[time-1045] auto
	[time-1050] auto
	[time-1055] auto
	[time-1100] auto
	[time-1105] auto
	[time-1110] auto
	[time-1115] auto
	[time-1120] auto
	[time-1125] auto
	[time-1130] auto
	[time-1135] auto
	[time-1140] auto
	[time-1145] auto
	[time-1150] auto
	[time-1155] auto
	[time-1200] auto
	[time-1205] auto
	[time-1210] auto
	[time-1215] auto
	[time-1220] auto
	[time-1225] auto
	[time-1230] auto
	[time-1235] auto
	[time-1240] auto
	[time-1245] auto
	[time-1250] auto
	[time-1255] auto
	[time-1300] auto
	[time-1305] auto
	[time-1310] auto
	[time-1315] auto
	[time-1320] auto
	[time-1325] auto
	[time-1330] auto
	[time-1335] auto
	[time-1340] auto
	[time-1345] auto
	[time-1350] auto
	[time-1355] auto
	[time-1400] auto
	[time-1405] auto
	[time-1410] auto
	[time-1415] auto
	[time-1420] auto
	[time-1425] auto
	[time-1430] auto
	[time-1435] auto
	[time-1440] auto
	[time-1445] auto
	[time-1450] auto
	[time-1455] auto
	[time-1500] auto
	[time-1505] auto
	[time-1510] auto
	[time-1515] auto
	[time-1520] auto
	[time-1525] auto
	[time-1530] auto
	[time-1535] auto
	[time-1540] auto
	[time-1545] auto
	[time-1550] auto
	[time-1555] auto
	[time-1600] auto
	[time-1605] auto
	[time-1610] auto
	[time-1615] auto
	[time-1620] auto
	[time-1625] auto
	[time-1630] auto
	[time-1635] auto
	[time-1640] auto
	[time-1645] auto
	[time-1650] auto
	[time-1655] auto
	[time-1700] auto
	[time-1705] auto
	[time-1710] auto
	[time-1715] auto
	[time-1720] auto
	[time-1725] auto
	[time-1730] auto
	[time-1735] auto
	[time-1740] auto
	[time-1745] auto
	[time-1750] auto
	[time-1755] auto
	[time-1800] auto
	[time-1805] auto
	[time-1810] auto
	[time-1815] auto
	[time-1820] auto
	[time-1825] auto;
        /* Note 1:
        Use 24hr time for gridline names for simplicity

        Note 2: Use "auto" instead of "1fr" for a more compact schedule where height of a slot is not proportional to the session length. Implementing a "compact" shortcode attribute might make sense for this!
        Try 0.5fr for more compact equal rows. I don't quite understand how that works :)
        */

        grid-template-columns:
			[times] 4em
			[track-1-start] 1fr
			[track-1-end track-2-start] 1fr
			[track-2-end];
    }
}

@media screen and (min-width: 700px) {
    .schedule_day_2 {
        display: grid;
        grid-gap: 1em;
        grid-template-rows:
		[tracks] auto
			 [time-0900] auto
	[time-0930] auto
	[time-0935] auto
	[time-0940] auto
	[time-0945] auto
	[time-0950] auto
	[time-0955] auto
	[time-1000] auto
	[time-1005] auto
	[time-1010] auto
	[time-1015] auto
	[time-1020] auto
	[time-1025] auto
	[time-1030] auto
	[time-1035] auto
	[time-1040] auto
	[time-1045] auto
	[time-1050] auto
	[time-1055] auto
	[time-1100] auto
	[time-1105] auto
	[time-1110] auto
	[time-1115] auto
	[time-1120] auto
	[time-1125] auto
	[time-1130] auto
	[time-1135] auto
	[time-1140] auto
	[time-1145] auto
	[time-1150] auto
	[time-1155] auto
	[time-1200] auto
	[time-1205] auto
	[time-1210] auto
	[time-1215] auto
	[time-1220] auto
	[time-1225] auto
	[time-1230] auto
	[time-1235] auto
	[time-1240] auto
	[time-1245] auto
	[time-1250] auto
	[time-1255] auto
	[time-1300] auto
	[time-1305] auto
	[time-1310] auto
	[time-1315] auto
	[time-1320] auto
	[time-1325] auto
	[time-1330] auto
	[time-1335] auto
	[time-1340] auto
	[time-1345] auto
	[time-1350] auto
	[time-1355] auto
	[time-1400] auto
	[time-1405] auto
	[time-1410] auto
	[time-1415] auto
	[time-1420] auto
	[time-1425] auto
	[time-1430] auto
	[time-1435] auto
	[time-1440] auto
	[time-1445] auto
	[time-1450] auto
	[time-1455] auto
	[time-1500] auto
	[time-1505] auto
	[time-1510] auto
	[time-1515] auto
	[time-1520] auto
	[time-1525] auto
	[time-1530] auto
	[time-1535] auto
	[time-1540] auto
	[time-1545] auto
	[time-1550] auto
	[time-1555] auto
	[time-1600] auto
	[time-1605] auto
	[time-1610] auto
	[time-1615] auto
	[time-1620] auto
	[time-1625] auto
	[time-1630] auto
	[time-1635] auto
	[time-1640] auto
	[time-1645] auto
	[time-1650] auto
	[time-1655] auto
	[time-1700] auto
	[time-1705] auto
	[time-1710] auto
	[time-1715] auto
	[time-1720] auto
	[time-1725] auto
	[time-1730] auto
	[time-1735] auto
	[time-1740] auto
	[time-1745] auto
	[time-1750] auto
	[time-1755] auto
	[time-1800] auto;
        /* Note 1:
        Use 24hr time for gridline names for simplicity

        Note 2: Use "auto" instead of "1fr" for a more compact schedule where height of a slot is not proportional to the session length. Implementing a "compact" shortcode attribute might make sense for this!
        Try 0.5fr for more compact equal rows. I don't quite understand how that works :)
        */

        grid-template-columns:
			[times] 4em
			[track-1-start] 1fr
			[track-1-end track-2-start] 1fr
			[track-2-end];
    }
}

.time-slot {
    grid-column: times;
    text-decoration: none;
}

.track-slot {
    display: none; /* hidden on small screens and browsers without grid support */
}

@supports ( display:grid ) {
    @media screen and (min-width: 700px) {
        .track-slot {
            display: block;
            padding: 10px 5px 5px;
            position: sticky;
            top: 69px; /* Matches height of top navigation TODO(tfoote) support wrapping etc*/
            z-index: 1000;
            background-color: rgba(255, 255, 255, .9);
        }
    }
}

/* Small-screen & fallback styles */
.session {

    margin-bottom: 1em;
}

@supports ( display:grid ) {
    @media screen and (min-width: 700px) {
        .session {
            margin: 0;
        }
    }
}

/*************************
 * VISUAL STYLES
 * Design-y stuff ot particularly important to the demo
 *************************/
body {
    padding: 50px;
    max-width: 1100px;
    margin: 0 auto;
    line-height: 1.5;
}

.session {
    padding: .5em;
    border-radius: 2px;
    font-size: 14px;
    box-shadow: rgba(255, 255, 255, .6) 1px 1px 0,
    rgba(0, 0, 0, .3) 4px 4px 0;

}


.session-title,
.session-time,
.session-track,
.session-presenter,
.session-website,
.session-video,
.session-slides,
.session-description {
    display: block;
    text-decoration: none;
}

.session-title,
.time-slot {
    margin: 0;
    font-weight: bold;
    font-size: 1.4em;
}

.session-presenter {
    margin: 1em;
    font-weight: bold;
    font-size: 1em;
    text-align: center;
}

.session-time {
    float: right;
}

.session-video {
    float: right;
    padding-right: 5%;
    padding-right: 20%;
    margin-bottom: 1rem;
}

.session-slides {
    padding-left: 20%;
    padding-bottom: 1rem;
}


.btn-black {
    background-color: white;
    font-weight: 900;
    margin-bottom: 0.5rem;
}

.btn-white {
    background-color: white;
    font-weight: 900;
    color: black;
}

.session-description {
    font-size: 1em;
}


.session-link {
    color: #FFFFFF;
    margin: 0;
    font-size: 1em;
}


.video-link {
    margin: 0;
    font-size: 1em;
    color: white;
    text-decoration: none;
}

.big {
    margin: 0;
    font-size: 1em;
    text-decoration: none;
}

/* .session-title a { */
/* 	color: #fff; */
/* 	text-decoration-style: dotted; */

/* 	&:hover { */
/* 		font-style: italic; */
/* 	} */

/* 	&:focus { */
/* 		outline: 2px dotted rgba(255,255,255,.8); */
/* 	} */
/* } */

.track-slot,
.time-slot {
    font-weight: bold;
    font-size: .75em;
}

.track-1 {
    background-color: #1259B2;
    color: #fff;
}

.track-2 {
    background-color: #687f00;
    color: #fff;
}

.track-3 {
    background-color: #544D69;
    color: #fff;
}

.track-4 {
    background-color: #c35500;
    color: #fff;
}

.track-all {
    justify-content: center;
    align-items: center;
    background: #ccc;
    color: #000;
    box-shadow: none;
}

.text {
    max-width: 750px;
    font-size: 18px;
    margin: 0 auto 50px;
}

.meta {
    color: #555;
    font-style: italic;
}

/* .meta a { */
/* 	color: #555; */
/* } */

hr {
    margin: 40px 0;
}


.user-action {
    text-align: center;
}


.stretch {
    width: 100%;
    display: inline-block;
    font-size: 0;
    line-height: 0
}





