/**
 * Custom CSS
 *
 * Table of Contents
 * - Basics
 * - Layout
 * - Navbar
 *   - Navbar Brand Image
 * - Header / Intro
 * - Footer
 * - Section
 * - Button
 *   - Button Circle
 * - Form
 *   - Sternchen bei Label von Pflichtfelder (<label class="required">
 *   - Borderradius bei select anpassen und das «pfili» wieder rein tun
 *   - CHROME AUTOFILL – GELBER HINTERGRUND ÜBERSCHREIBEN
 *   - Abstände
 *   - Adressblock
 *   - Table
 *   - Google Maps
 * - MISC
 *
 */

/* ==========================================================================
   Basics
   ========================================================================== */


body {
    font-family:'Montserrat', 'Helvetica Neue LT W01_57 Cond';
}

a {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    transition:         all .3s ease-in-out;
}

.box-shadow {
    -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
    box-shadow:         0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
}

/* ==========================================================================
   Layout
   Mit Flexbox den Footer immer am unteren Seitenrand positionieren
   ========================================================================== */
html,
body {
    height: 100%;
}

body {
    min-height:             100%;
    display:                -webkit-flex;
    display:                -ms-flexbox;
    display:                -ms-flex;
    display:                flex;
    -webkit-flex-direction: column;
    -ms-flex-direction:     column;
    flex-direction:         column;
    flex-wrap:              nowrap;
}

main {
    -webkit-flex:           1 0 auto;
    -ms-flex:               1 0 auto;
    flex:                   1 0 auto;

    display:                -webkit-flex;
    display:                -ms-flexbox;
    display:                -ms-flex;
    display:                flex;
    -webkit-flex-direction: column;
    -ms-flex-direction:     column;
    flex-direction:         column;
}

.flex-center-center {
    -webkit-flex:    1 0 auto;
    -ms-flex:        1 0 auto;
    flex:            1 0 auto;

    display:         flex;
    align-items:     center;
    justify-content: center;
}


/* ==========================================================================
   Section
   ========================================================================== */
section:not(#maps):not(.parallax-2):not(#intro) {
    background-color: #fff !important;
}

section:not(#maps):not(.parallax-2) {
    padding: 75px 0
}

section#intro.index {
    padding-top: 100px;
}

@media (min-width: 768px) {
    section:not(#maps) {
        padding: 100px 0
    }
}

.bg-dark {
    background-color: #f7f7f7 !important;
}

/* ==========================================================================
   Event Info
   ========================================================================== */
.event-info .panel-heading {
    padding: 15px 15px;
}

.event-info li {
    padding: 10px;
}

.event-info li i {
    width:          40px;
    display:        table-cell;
    vertical-align: middle;
    text-align:     center;
}

.event-info li i.top {
    vertical-align: top;
}

.event-info li span {
    padding:        0 15px;
    display:        table-cell;
    vertical-align: middle;
}

/* ==========================================================================
   Button
   ========================================================================== */
.btn {
    box-shadow:         0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
    -webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    transition:         all .3s ease-in-out;
}

.btn-xl {
    font-size:   18px;
    font-family:'Montserrat', 'Helvetica Neue LT W01_77 Bd Cn';
    padding:     20px 40px
}

.btn-icon {
    width:   2.5em;
    height:  2.5em;
    margin:  0 3px 10px;
    padding: .4em .25em;
}

.btn-icon .fa-2x {
    font-size: 1.5em;
}

span.btn-icon {
    cursor: auto;
}

.btn-transparent-light {
    border-color:     rgba(255, 255, 255, .7);
    background-color: rgba(255, 255, 255, .1);
    color:            rgba(255, 255, 255, .7);
}

.btn-transparent-light:hover,
.btn-transparent-light:focus,
.btn-transparent-light.focus {
    border-color:      rgba(255, 255, 255, .8);
    background-color:  rgba(255, 255, 255, .3);
    color:             rgba(255, 255, 255, .8);
    -webkit-transform: scale(1.1);
    -ms-transform:     scale(1.1);
    transform:         scale(1.1);
}

.btn-transparent-dark {
    border-color:     rgba(0, 0, 0, .7);
    background-color: rgba(0, 0, 0, .1);
    color:            rgba(0, 0, 0, .7);
}

.btn-transparent-dark:hover,
.btn-transparent-dark:focus,
.btn-transparent-dark.focus {
    border-color:      rgba(0, 0, 0, .8);
    background-color:  rgba(0, 0, 0, .3);
    color:             rgba(0, 0, 0, .8);
    -webkit-transform: scale(1.1);
    -ms-transform:     scale(1.1);
    transform:         scale(1.1);
}

.btn-transparent-primary {
    border-color:     rgba(0, 111, 185, 1);
    background-color: rgba(0, 111, 185, .2);
    color:            rgba(0, 111, 185, 1);
}

.btn-transparent-primary:hover,
.btn-transparent-primary:focus,
.btn-transparent-primary.focus {
    border-color:      rgba(0, 111, 185, 1);
    background-color:  rgba(0, 111, 185, .3);
    color:             rgba(0, 111, 185, 1);
    -webkit-transform: scale(1.1);
    -ms-transform:     scale(1.1);
    transform:         scale(1.1);
}

/* Button Circle
   ========================================================================== */
.btn-circle {
    width:           50px;
    height:          50px;
    margin-top:      30px;
    border-radius:   50%;
    display:         inline-flex;
    flex-direction:  column;
    justify-content: center;
    align-items:     center;
    font-size:       1em;
}

.btn-circle.btn-sm {
    width:     30px;
    height:    30px;
    font-size: 0.6666666667em;
}

.btn-circle.btn-lg {
    width:     70px;
    height:    70px;
    font-size: 2em;
}

.btn-circle.btn-xl {
    width:        100px;
    height:       100px;
    border-width: 2px;
    font-size:    3.333333333333em;
}

.btn-circle-box {
   position: relative;
   top: 120px;
}


@media (min-width: 768px) {
    .btn-circle-box {
        top: 180px;
    }
}

@media (min-width: 1440px) {
    .btn-circle-box {
        top: 330px;
    }
}

/* ==========================================================================
   Form
   ========================================================================== */

/* fieldset
   ========================================================================== */
fieldset {
    position:         relative;
    margin-bottom:    15px;
    padding:          66px 15px 15px 15px;
    background-color: #fff;
    border:           0;
    border-radius:    2px;
    color:            #000;
}

@media (min-width: 768px) {
    fieldset {
        margin-bottom: 30px;
    }
}

fieldset legend {
    position:         absolute;
    width:            100%;
    top:              0;
    left:             0;
    background-color: rgba(0, 111, 185, 1);
    margin-top:       0;
    margin-bottom:    15px;
    padding:          10px 15px;
    color:            #fff;
    font-size:        1.1666666667em;
}

form .help-block {
    display: none;
}

/* Sternchen bei Label von Pflichtfelder (<label class="required">
   ========================================================================== */
.required:after {
    content: " *";
}

.radio .required:after,
.checkbox .required:after {
    content: "";
}

/* Borderradius bei select anpassen und das «pfili» wieder rein tun
   ========================================================================== */
select:not([multiple]) {
    -webkit-appearance:  none;
    -moz-appearance:     none;
    background-position: right 50%;
    background-repeat:   no-repeat;
    background-image:    url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
    padding:             6px 12px;
    border-radius:       2px;
}

select::-ms-expand {
    display: none;
}

html[data-useragent*='MSIE 9.0'] select {
    background-image: none;
}

/* CHROME AUTOFILL – GELBER HINTERGRUND ÜBERSCHREIBEN
   ========================================================================== */
input:-webkit-autofill,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:focus {
    -webkit-box-shadow:      0 0 0px 1000px #fff inset;
    -webkit-text-fill-color: #555 !important;
}

/* Abstände
   ========================================================================== */
form h3 {
    margin-top: 0;
}

form .container-participation,
form .container-attendance,
form .container-address-form {
    /*margin-bottom: 30px;*/
}

form .container-attendance {
    padding: 66px 30px 10px 30px;
}

/* Adressblock
   ========================================================================== */
.container-address-text {
    /*margin-bottom: 15px;*/
}

@media (min-width: 768px) {
    .container-address-text {
        float: right;
    }
}

/* ==========================================================================
   Program
   ========================================================================== */

/* Tab
   ========================================================================== */
.nav-tabs {
    border: none;
}

.nav-tabs.nav-justified {
    width:       calc(100% + 2px);
    margin-left: -1px;
}

@media (min-width: 768px) {
    .nav-tabs.nav-justified > li > a {
        /*border-bottom: 1px solid #009688;*/
        border-radius: 2px 2px 0 0;
    }
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background-color:    #006fb9;
    border:              1px solid #006fb9;
    border-bottom-color: transparent;
    cursor:              default;
    color:               #fff;
    font-size:           1.1666666667em;
}

.nav-tabs > li.active > a.btn-presentation,
.nav-tabs > li.active > a.btn-presentation:hover,
.nav-tabs > li.active > a.btn-presentation:focus {
    background-color:    #006fb9;
    border:              transparent !important;
    cursor:              default;
    color:               #fff;
    font-size:           1.1666666667em;
}

.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
    /*border: 1px solid #009688;*/
}

@media (min-width: 768px) {

    .nav-tabs.nav-justified > .active > a,
    .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs.nav-justified > .active > a:focus {
        border-bottom-color: transparent;
    }
}

.tab-content {
    margin-bottom:          25px;
    /*border:                 1px solid #006fb9;*/
    border-top-left-radius: 0;
}

.tab-content.tab-single {
    border-top-right-radius: 0;
}

/* Panel
   ========================================================================== */
.panel-group {
    margin-bottom: 0;
}

.panel-group.collapse-panel .panel + .panel {
    margin-top: 0;
}

.collapse-panel {
    position: relative;
}

.collapse-panel .line-h {
    height:           100%;
    position:         absolute;
    background-color: #006fb9;
    left:            20px;
    border-left:      1px dashed #f6f6f6;
    opacity:          1;
    z-index:          1;
}

.collapse-panel .panel {
    margin-top:          0;
    border-radius:       0;
    border:              none;
    border-bottom-color: #d7d8dc;
    box-shadow:          0 0px 0px 0 transparent;
    -moz-box-shadow:     0 0px 0px 0 transparent;
    -webkit-box-shadow:  0 0px 0px 0 transparent;
    -o-box-shadow:       0 0px 0px 0 transparent;
}

.collapse-panel .panel .panel-heading {
    background:    #fff;
    padding:       0px !important;
    border-bottom: 0px solid #dddee2;
}

.collapse-panel .panel .panel-heading .panel-title .collapse-panel-toggle {
    display:       block;
    padding:       15px 0;
    font-size:     .8em;
    font-family:'Montserrat', 'Helvetica Neue LT W01_57 Cond';
    position:      relative;
    border-bottom: 1px solid rgba(0, 111, 185, .2);
}

.panel-default:first-child {
    border-top: 1px solid rgba(0, 111, 185, .2);
}

.collapse-panel .panel .panel-heading.active .panel-title .collapse-panel-toggle {
    border-bottom-color: transparent;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-bottom:    1px solid rgba(0, 111, 185, .2);
    border-top-color: transparent;
}

.collapse-panel-toggle .detail {
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .collapse-panel-toggle .detail {
        margin-bottom: 0px;
    }
}

.collapse-panel .radio {
    margin-top: 0;
}

.collapse-panel .radio label::before {
    top: -2px;
}

.collapse-panel .radio label::after {
    top: 1px;
}

.collapse-panel-toggle .detail span {
    float:   none;
    display: block;
}

.collapse-panel-toggle .detail .headline {
    margin-bottom: 10px;
    margin-left: 8px;
    color:         #006fb9;
}

.collapse-panel-toggle .detail .headline label {
    font-family:'Montserrat', 'Helvetica Neue LT W01_57 Cond';
}

@media (min-width: 768px) {
    .collapse-panel-toggle .detail .headline {
        margin-bottom: 0;
    }
}

.collapse-panel-toggle .detail .name,
.collapse-panel-toggle .detail .company {
    padding-left: 32px;
}

.collapse-panel-toggle .detail .name {
    margin-top:  5px;
    font-family:'Montserrat', 'Helvetica Neue LT W01_77 Bd Cn';
}

.collapse-panel-toggle .detail .name:before {
    position:     relative;
    top:          -1px;
    margin-right: 12px;
    margin-left:  -25px;
    content:      "\f007";
    font-size:    16px;
    font-family:  FontAwesome;
    opacity:      0.6;
}

.collapse-panel-toggle .detail .name.hotel:before {
    position:     relative;
    top:          -1px;
    margin-right: 12px;
    margin-left:  -25px;
    content:      "\f041";
    font-size:    16px;
    font-family:  FontAwesome;
    opacity:      0.6;
}

.collapse-panel-toggle .detail .company {
    font-size: .9em;
}

.collapse-panel-toggle .time {
    position:     relative;
    color:        #006fb9;
    padding-left: 32px;
}
@media (max-width: 768px) {
    .collapse-panel-toggle .time {
        padding-left: 10px;
    }
}
@media (min-width: 768px) {
    .collapse-panel-toggle .time-show {
        padding-left: 0;
        /*text-align:   right;*/
    }
}

.collapse-panel-toggle .time-show .time {
    /*padding-right: 35px;*/
    display:       inline-table;
}

.collapse-panel-toggle .detail .icon {
    position:           absolute;
    top:                -5px;
    right:              20px;
    margin:             0;

    padding:            3px 6px;
    /*background-color:   #006fb9;*/

    color:              #006fb9;
    line-height:        1;
    z-index:            2;

    -webkit-transition: all 0.4s ease-out;
    -moz-transition:    all 0.4s ease-out;
    -o-transition:      all 0.4s ease-out;
    -ms-transition:     all 0.4s ease-out;
    transition:         all 0.4s ease-out;
}

@media (min-width: 768px) {
    .collapse-panel-toggle .detail .icon.afterEvent {
        right: 0;
        left:  120px;
    }
}

span.collapse-panel-toggle .detail .icon {
    width:  14px;
    height: 14px;
    top:    0;
    right:  18px;
}

.collapse-panel .panel .panel-heading .panel-title a.link-panel .fa {
    -webkit-transition: all 0.4s ease-out;
    -moz-transition:    all 0.4s ease-out;
    -o-transition:      all 0.4s ease-out;
    -ms-transition:     all 0.4s ease-out;
    transition:         all 0.4s ease-out;
}

.collapse-panel .panel .panel-heading.active .panel-title {
    background-color: #f6f6f6 !important;
}

.collapse-panel .panel .panel-heading.active .panel-title a.link-panel .fa {
    transform:         rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform:    rotate(180deg);
    -o-transform:      rotate(180deg);
}

.collapse-panel .panel-collapse {
    background-color: #f6f6f6;
}

.collapse-panel .panel-collapse .panel-body {
    /*padding-left:  42px;*/
    /*padding-right: 42px;*/
    padding-top:   0px;
    font-size:     .8em;
}

.collapse-panel .panel-collapse .panel-body h4 {
    margin-top: 0;
    font-size:  1.2em;
}

.collapse-panel .panel-collapse .panel-body img + .caption {
    margin-top:    10px;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .collapse-panel .panel-collapse .panel-body img {
        margin-bottom: 0;
    }
}

/* ==========================================================================
   Table
   ========================================================================== */
table {
    width:         100%;
    max-width:     100%;
    margin-bottom: 20px;
    font-size:     inherit;
}

table > thead > tr > th,
table > tbody > tr > th,
table > tfoot > tr > th,
table > thead > tr > td,
table > tbody > tr > td,
table > tfoot > tr > td {
    padding:        8px;
    line-height:    1.42857143;
    vertical-align: top;
    border-top:     1px solid #ddd;
}

table > thead > tr > th {
    vertical-align: bottom;
    border-bottom:  2px solid #ddd;
}

table > caption + thead > tr:first-child > th,
table > colgroup + thead > tr:first-child > th,
table > thead:first-child > tr:first-child > th,
table > caption + thead > tr:first-child > td,
table > colgroup + thead > tr:first-child > td,
table > thead:first-child > tr:first-child > td {
    border-top: 0;
}

table > tbody + tbody {
    border-top: 2px solid #ddd;
}

/* ==========================================================================
   Google Maps
   ========================================================================== */
.map-container {
    width:  100%;
    height: 300px;
}

@media (min-width: 768px) {
    .map-container {
        height: 500px;
    }
}

/* ==========================================================================
   Animation Classes
   ========================================================================== */
.animate-arrow-down {
    position:          absolute;
    -webkit-animation: animateArrow 4s infinite;
    animation:         animateArrow 4s infinite;
}

.animate-arrow-down.bottom {
    position: absolute;
    bottom:   20px;
    left:     0;
    right:    0;;
}

@-webkit-keyframes animateArrow {
    80% {
        -webkit-transform: translateY(0px);
        transform:         translateY(0px);
    }
    90% {
        -webkit-transform: translateY(10px);
        transform:         translateY(10px);
    }
    100% {
        -webkit-transform: translateY(0px);
        transform:         translateY(0px);
    }
}

@keyframes animateArrow {
    80% {
        -webkit-transform: translateY(0px);
        transform:         translateY(0px);
    }
    90% {
        -webkit-transform: translateY(10px);
        transform:         translateY(10px);
    }
    100% {
        -webkit-transform: translateY(0px);
        transform:         translateY(0px);
    }
}

/* ==========================================================================
   MISC
   ========================================================================== */
.page-scroll.has-video {
    position: static !important;
}


h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family:'Montserrat', 'Helvetica Neue LT W01_77 Bd Cn';
}


.attendance-first {
    margin-bottom: 15px;
}

#formattendance_attendanceGender label{
    margin-right: 27px;
}

#formattendance_attendanceGender {
    margin-top: 0;
    width: 90px;
}

.spacing {
    margin-top: 20px;
}

.no-border {
    border: none;
    box-shadow: none;
}

.no-border:focus {
    border: none;
    box-shadow: none;
}


.attendance-checkbox-menu {
    padding-left: 35px;

}

#formattendance_attendanceAllergiesRemark {
    margin-top: 20px;
}


.presentation {
   z-index: 1;
   margin: 15px 0 5px 0;
}

.display-none {
    display: none;
}