﻿/* COMMON */
.clear { clear: both; }
.rel { position: relative; }
.abs { position: absolute; }
.floatLeft { float: left; }
.floatRight { float: right; }

img { max-width: 100%; }

a, a span, input[type='submit'],
button, .slick-nav, a img {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

a { color: #000000; text-decoration: underline; }
a:hover, a:focus { color: #999999; text-decoration: underline; }

.standard20 { font-size: 20px; line-height: 26px; }

h1, h2, h3, h4, h5, h6 { margin: 0px; padding: 0px; }

.noPadding { padding: 0px !important; }
.noMargin { margin: 0px !important; }

.webView { display: block; }
.mobileView { display: none; }



/* MAIN LAYOUT ITEMS */
html {
    position: relative;
    width: 100%;
    height: 100%;
}

body {
    background: #ffffff;
    font-family: 'Avenir', arial, sans-serif;
    font-weight: normal;
    font-size: 20px;
    line-height: 28px;
    font-style: oblique;
    color: #000000;
    overflow-x: hidden;
}

.navbar-default {
    padding-top: 50px;
    margin-bottom: 60px;
    background-color: #ffffff;
    border: none;
}

.navbar-brand {
    height: auto;
    padding: 0px;
}

.navbar-nav {
    border-bottom: 5px solid #000000;
    float: right;
}

.navbar-nav > li {
    padding: 30px 35px 15px 0px;
}

.navbar-nav > li:last-child {
    padding-right: 0px;
}

.navbar-default .navbar-nav > li > a {
    color: #000000;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #999999;
}

.navbar-nav > li > a {
    font-size: 18px;
    font-style: normal;
    text-transform: uppercase;
    padding: 0px;
    letter-spacing: 0.15em;
    text-decoration: none;
}

footer {
    background-color: #000000;
    font-size: 20px;
    font-style: normal;
    text-transform: uppercase;
    color: #ffffff;
    padding-top: 20px;
    padding-bottom: 60px;
}

footer a {
    padding: 0px 30px 0px 30px;
    color: #ffffff;
    display: inline-block;
    text-decoration: none;
}

footer a:hover,
footer a:focus {
    color: #ffffff;
}

.footer-newsletter p {
    margin-right: 20px;
    float: left;
}

.footer-newsletter form > div {
    display: table;
}

.footer-newsletter .input-group {
    width: 100%;
    display: inline;
}

.form-newsletter p {
    margin-top: 5px;
    font-size: 14px;
    line-height: 20px;
    padding: 8px 5px 10px 5px;
    text-transform: none;
}

body.home header,
body.home footer {
    display: none;
}

.header-banner {
    position: absolute;
    top: 0px;
    right: 30px;
}




/* HOME ITEMS */
.home-banner {
    background: #868581 url('../images/banner-home.jpg') bottom no-repeat;
    background-size: 100%;
    padding-top: 50px;
    margin-bottom: 50px;
    color: #ffffff;
}

.home-piece {
    margin-bottom: 50px;
}

.home-piece p {
    margin: 0px;
    padding: 0px;
    font-size: 25px;
    line-height: 32px;
    font-style: italic;
}

.home-piece p.home-piece-title {
    font-size: 86px;
    line-height: 90px;
    font-style: italic;
    margin-bottom: 5px;
}

.home-piece a {
    color: #ffffff;
}



/* SUB ITEMS */
img.sub-banner {
    width: 100%;
    max-width: none;
}

.general {
    /*background: #a0a0a0 url('../images/background-generic.jpg') top center no-repeat;
    background-size: 100%;
    */

    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #cccccc 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%,#cccccc 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%,#cccccc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */

    padding-bottom: 80px;
}

.roots {
    background: #ffffff url('../images/background-roots.jpg') top right no-repeat;
    padding-top: 20px;
    float: left;
}

.train {
    background: #8d8d8d url('../images/background-train.jpg') top center no-repeat;
    background-size: 100%;
}

.train-bottom {
    background: #8d8d8d url('../images/banner-train.jpg') bottom center no-repeat;
    background-size: 100%;
    width: 100%;
    padding-top: 150px;
    padding-bottom: 50px;
    font-size: 24px;
    line-height: 32px;
    float: left;
}

.train-bottom p {
    margin-bottom: 25px;
}

.train-bottom-details {
    margin-top: 300px;
}

.train-bottom-details p {
    margin-bottom: 20px;
}

.members {
    margin-top: 50px;
}

.repertoire {
    margin-top: 50px;
}

.gallery-content a.button_link,
.repertoire-gallery a.button {
    display: none;
}

.repertoire-gallery a.button_1 {
    display: inline-block;
}

.gallery-content a.button_1 {
    display: block;
}





/* PANEL ITEMS */
.panel-title {
    position: relative;
    text-align: center;
}

.repertoire .panel-title {
    background-color: #000000;
}

.panel-title a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    display: block;
    z-index: 2;
}

.members .panel-title a,
.repertoire .panel-title a {
    top: 50%;
    margin-top: -30px;
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 0.2em;
    font-weight: normal;
    font-style: normal;
    color: #ffffff;
    padding-left: 10px;
    padding-right: 10px;
    text-decoration: none;
}

.members .panel-title a {
    text-transform: uppercase;
}

.members .panel-title a .fa,
.repertoire .panel-title a .fa {
    position: relative;
    top: -10px;
    font-size: 40%;
    padding-left: 10px;
}

.members .panel-default > .panel-heading + .panel-collapse > .panel-body,
.repertoire .panel-default > .panel-heading + .panel-collapse > .panel-body {
    background-color: #b4b4b4;
    border: none;
}

.members .panel-body,
.repertoire .panel-body {
    padding-top: 30px;
    padding-bottom: 10px;
    font-size: 24px;
    line-height: 32px;
}

.members #accordion,
.repertoire #accordion {
    margin-bottom: 50px;
}

.panel-alternating .panel-body {
    font-size: 20px;
    line-height: 28px;
    padding-bottom: 30px;
}

.panel-alternating .panel-title a {
    position: relative;
    top: auto;
    left: auto;
    margin-top: 0;
    padding: 100px 10px;
    background-color: rgba(0, 0, 0, 0.5);
}

.panel-title a .panel-secondary-title {
    font-size: 30px;
    line-height: 34px;
    margin-top: 5px;
    display: block;
}

.panel-alternating .panel-title.collapsed a {
    background-color: #999999;
}

.panel-alternating .panel:nth-child(even) .panel-title.collapsed a {
    background-color: #797979;
}

.panel-alternating .panel:nth-child(even) .panel-title.collapsed a:hover,
.panel-alternating .panel-title.collapsed a:hover {
    background-color: #000000;
    opacity: 0.5;
}

.members #accordion .panel-title.collapsed span,
.members #accordion .panel-title span,
.repertoire #accordion .panel-title.collapsed span,
.repertoire #accordion .panel-title span,
.gallery-content span,
.gallery-box span {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: 0;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
    z-index: 1;
}

.members #accordion .panel-title span,
.members #accordion .panel-title:hover span,
.members #accordion .panel-title:focus span,
.repertoire #accordion .panel-title span,
.repertoire #accordion .panel-title:hover span,
.repertoire #accordion .panel-title:focus span,
.gallery-content:hover span,
.gallery-content:focus span,
.gallery-box:hover span,
.gallery-box:focus span {
    opacity: 0.5;
    cursor: pointer;
}







.collaborators {
    margin-bottom: 50px;
}

.collaborators h3 {
    display: inline-block;
}

.collaborators p {
    font-weight: 700;
}

.repertoire p {
    margin-bottom: 40px;
}

.gallery-container {
    margin-bottom: 80px;
}

.gallery-box {
    position: relative;
    text-align: center;
}

.gallery-content {
    position: relative;
    width: 47%;
    margin: 0px 15px 30px 15px;
    padding: 0px;
    text-align: center;
    float: left;
}

.gallery-content a,
.gallery-box a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    padding-top: 25%;
    font-size: 30px;
    line-height: 36px;
    letter-spacing: 0.2em;
    font-weight: normal;
    font-style: normal;
    color: #ffffff;
    text-decoration: none;
    display: block;
    z-index: 2;
}

.gallery-box a {
    padding-top: 45%;
}

.gallery-content a .fa,
.gallery-box a .fa {
    position: relative;
    top: -3px;
    font-size: 40%;
    padding-left: 10px;
}

.gallery-container p {
    padding-left: 15px;
    padding-right: 15px;
}

.page-id-13 .gallery-container-1 .gallery-content {
    display: none;
}

.page-id-13 .gallery-container-1 .gallery-content:nth-child(4) {
    width: 100%;
    margin-bottom: 80px;
    display: block;
}



/* MODAL ITEMS */
.modal-dialog a.glyphicon,
.modal-dialog a.glyphicon:hover,
.modal-dialog a.glyphicon:focus {
    text-decoration: none;
}

.modal-body {
    padding: 0px;
}




/* FONT ITEMS */
h1 {
    font-size: 60px;
    line-height: 60px;
    font-weight: 700;
    font-style: oblique;
    letter-spacing: 0.2em;
    margin-bottom: 40px;
}

h1 span {
    font-size: 22px;
    line-height: 28px;
    letter-spacing: 0em;
    font-weight: normal;
    font-style: oblique;
    margin-top: 5px;
    display: block;
}

h2 {
    font-size: 46px;
    line-height: 46px;
    font-weight: 700;
    margin-bottom: 40px;
}

h3 {
    font-size: 36px;
    line-height: 36px;
    font-weight: 700;
    font-style: oblique;
    letter-spacing: 0.2em;
    border-bottom: 5px solid #000000;
    padding-bottom: 5px;
    margin-bottom: 40px;
}

h4 {
    font-size: 30px;
    line-height: 38px;
    font-weight: normal;
    font-style: oblique;
    margin-bottom: 40px;   
}

.home-intro h1 {
    font-size: 80px;
    line-height: 72px;
    margin-bottom: 20px;
}

.home-intro h2 {
    font-size: 25px;
    font-style: oblique;
    line-height: 30px;
    margin-bottom: 60px;
    text-transform: uppercase;
}

.home-banner h3 {
    font-size: 86px;
    line-height: 90px;
    letter-spacing: 0em;
    border-bottom: none;
    padding-bottom: 0px;
    margin-bottom: 50px;
}

.repertoire h3,
.panel-alternating h3 {
    line-height: 42px;
    font-weight: normal;
    letter-spacing: 0em;
    border-bottom: none;
    margin-bottom: 40px;
}

.gallery h1 {
    font-size: 50px;
    line-height: 58px;
    font-weight: normal;
    font-style: normal;
    letter-spacing: 0em;
    margin-bottom: 10px;
}

.gallery h1 span {
    font-size: 50px;
    line-height: 58px;
    font-style: oblique;
    margin: 0px;
    display: inline-block;
}

.button,
.frm_style_formidable-style.with_frm_style .frm_submit button {
    position: relative;
    background-color: #000000;
    padding: 10px 60px 10px 20px;
    font-size: 36px;
    line-height: 36px;
    color: #ffffff;
    text-transform: uppercase;
    text-decoration: none;
    display: inline-block;
    margin: 20px 0px 50px 0px;
    text-align: center;
}

.button:hover,
.button:focus,
.frm_style_formidable-style.with_frm_style .frm_submit button:hover,
.frm_style_formidable-style.with_frm_style .frm_submit button:focus {
    background-color: #999999;
    color: #ffffff;
    text-decoration: none;
}

.button .fa,
.frm_style_formidable-style.with_frm_style .frm_submit button .fa {
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -12px;
    font-size: 25px;
    padding-left: 15px;
}

.repertoire .button,
.panel-alternating .button {
    font-size: 24px;
    line-height: 24px;
    padding-right: 50px;
    margin-bottom: 30px;
}

.repertoire .button .fa,
.panel-alternating .button .fa {
    margin-top: -9px;
    font-size: 18px;
}

.btnContinue {
    position: absolute;
    bottom: 0px;
    right: 50px;
    z-index: 100000;
}





/* Note: Design for all BUT Mobile */
@media (min-width: 768px) {

    .dropdown:hover .dropdown-menu { display: block; } /* hover dropdown */

}


/* Note: Design for a width of 768px #Tablet (Landscape) */
@media only screen and (min-width: 992px) and (max-width: 1200px) {

    footer a { padding: 0px 20px 0px 20px; }

    .header-banner { width: 650px; }

    /* SUB ITEMS */
    .roots { background-position: 275px 0px; }

    .train-bottom { padding-top: 50px; }
    .train-bottom-details { margin-top: 50px; }

    .gallery-content { width: 46.9%; }

    /* PANEL ITEMS */
    .members .panel-title a,
    .repertoire .panel-title a { margin-top: -25px; font-size: 50px; line-height: 50px; }

    .panel-title a .panel-secondary-title { font-size: 24px; line-height: 30px; }

}


/* Note: Design for a width of 768px #Tablet (Portrait) */
@media only screen and (min-width: 768px) and (max-width: 992px) {

    .navbar-brand > img { width: 200px; }
    .navbar-nav { float: none; display: inline-block; margin: 0 auto; }
    .navbar-nav > li { padding-right: 26px; }
    .navbar-nav > li > a { font-size: 15px; }

    .navbar-nav li.dropdown:last-child .dropdown-menu { left: auto; right: 0; }

    footer a { padding: 0px 20px 0px 20px; margin-bottom: 20px; }

    .header-banner { width: 475px; }

    /* HOME ITEMS */
    .home-piece p { font-size: 22px; line-height: 28px; }
    .home-piece p.home-piece-title { font-size: 60px; line-height: 66px; }

    /* SUB ITEMS */
    .roots { background-position: 150px 0px; }

    .train-bottom { font-size: 20px; line-height: 28px; padding-top: 50px; }
    .train-bottom-details { margin-top: 50px; }

    .gallery-content { width: 46%; }

    /* PANEL ITEMS */
    .members .panel-title a,
    .repertoire .panel-title a { margin-top: -20px; font-size: 40px; line-height: 40px; }
    .members .panel-title a .fa,
    .repertoire .panel-title a .fa { top: -6px; }
    .members .panel-title img { max-width: 120%; margin-left: -15%; }
    .members .panel-body,
    .repertoire .panel-body { font-size: 20px; line-height: 28px; }

    .panel-title a .panel-secondary-title { font-size: 20px; line-height: 22px; }

    .panel-alternating .panel-title a { padding: 70px 10px; }

    /* FONT ITEMS */
    h1 { font-size: 50px; line-height: 50px; }
    h2 { font-size: 38px; line-height: 38px; }
    h3 { font-size: 30px; line-height: 30px; }
    h4 { font-size: 24px; line-height: 30px; margin-bottom: 30px; }

    .home-intro h1 { font-size: 60px; line-height: 52px; }
    .home-banner h3 { font-size: 60px; line-height: 66px; margin-bottom: 50px; }

    .repertoire h3,
    .panel-alternating h3 { line-height: 36px;  margin-bottom: 30px; }

    .gallery h1 { font-size: 40px; line-height: 48px; }
    .gallery h1 span { font-size: 40px; line-height: 48px; }

    .button { font-size: 30px; line-height: 30px; }
    .button .fa { font-size: 20px; margin-top: -10px; }

}


/* Note: Design for Mobile */
@media screen and (max-width: 767px) {

    body { margin-top: 150px; font-size: 16px; line-height: 24px; }
    .navbar-default { position: fixed; z-index: 1030; right: 0; left: 0; border-radius: 0; top: 0; border-width: 0 0 1px; padding-top: 20px; }
    .navbar-brand { padding: 0px 0px 15px 20px; }
    .navbar-brand > img { width: 140px; }
    .navbar-nav { border-bottom: none; margin: 0px 0px 10px 0px; float: left; }
    .navbar-nav > li { padding: 0px; }
    .navbar-default .navbar-nav > li > a { padding: 15px 10px 15px 10px; }

    footer a { padding: 0px 20px 0px 20px; margin-bottom: 20px; }

    .header-banner { display: none; }

    /* HOME ITEMS */
    .home-piece p { font-size: 20px; line-height: 26px; }
    .home-piece p.home-piece-title { font-size: 50px; line-height: 50px; }

    /* SUB ITEMS */
    .roots { background-position: 225px 0px; }

    .train-bottom { background: #8d8d8d; font-size: 20px; line-height: 28px; padding-top: 50px; }
    .train-bottom-details { margin-top: 50px; }

    .members,
    .repertoire { margin-top: 20px; }

    .gallery-content a,
    .gallery-box a { font-size: 24px; line-height: 26px; }

    /* PANEL ITEMS */
    .members .panel-title a .fa,
    .repertoire .panel-title a .fa { top: -4px; }

    .members .panel-body,
    .repertoire .panel-body { font-size: 20px; line-height: 28px; }

    .panel-alternating .panel-title a { padding: 50px 10px; }

    /* FONT ITEMS */
    h1 { font-size: 34px; line-height: 34px; }
    h2 { font-size: 26px; line-height: 26px; }
    h3 { font-size: 22px; line-height: 22px; }
    h4 { font-size: 22px; line-height: 28px; margin-bottom: 25px; }

    .home-intro h1 { font-size: 40px; line-height: 40px; }
    .home-intro h2 { font-size: 22px; line-height: 26px; margin-bottom: 30px; }
    .home-banner h3 { font-size: 50px; line-height: 56px; margin-bottom: 50px; }

    .repertoire h3,
    .panel-alternating h3 { font-size: 24px; line-height: 30px;  margin-bottom: 25px; }

    .gallery h1 { font-size: 30px; line-height: 38px; }
    .gallery h1 span { font-size: 30px; line-height: 38px; }

    .button { font-size: 26px; line-height: 30px; }
    .button .fa { font-size: 16px; margin-top: -8px; }

}


/* Note: Design for a width of 480px #Mobile (Landscape) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

    .navbar-default .navbar-collapse { max-height: 150px; overflow-y: auto; }

    /* SUB ITEMS */
    .gallery-content { width: 45.6%; margin: 0px 10px 20px 10px; }

    /* PANEL ITEMS */
    .members .panel-title a,
    .repertoire .panel-title a { margin-top: -15px; font-size: 30px; line-height: 30px; }
    .members .panel-title img { max-width: 150%; margin-left: -25%; }

    .panel-title a .panel-secondary-title { font-size: 20px; line-height: 22px; }

}


/* Note: Design for a width of 320px #Mobile (Portrait) */
@media only screen and (max-width: 479px) {

    footer a { padding: 0px 10px 0px 10px; }
    .footer-newsletter p { float: none; }

    /* HOME ITEMS */
    .home-piece.text-right { text-align: left; }

    /* SUB ITEMS */
    .repertoire .panel-body .col-xs-6 { width: 100%; }
    .repertoire .panel-body .col-xs-6.text-right { text-align: left; }
    .repertoire .button,
    .panel-alternating .button { margin-top: 0px; }

    .gallery-content { width: 95%; margin: 0px 10px 10px 10px; }

    /* PANEL ITEMS */
    .members .panel-title a,
    .repertoire .panel-title a { margin-top: -10px; font-size: 20px; line-height: 20px; }
    .members .panel-title img { max-width: 175%; margin-left: -30%; }

    .panel-title a .panel-secondary-title { font-size: 16px; line-height: 20px; }

}



/* FORMIDABLE FORM ITEMS */
.frm_style_formidable-style.with_frm_style fieldset {
    font-family: inherit;
}

.with_frm_style .frm_radio input[type=radio],
.with_frm_style .frm_checkbox input[type=checkbox] {
    position: absolute;
    top: 2px;
    left: 0;    
}

.frm_full select {
    max-width: 30% !important;
}

.frm_style_formidable-style.with_frm_style .frm_radio label,
.frm_style_formidable-style.with_frm_style .frm_checkbox label {
    position: relative;
    font-size: 15px;
    font-style: normal;
    padding-left: 25px;
    display: inline-block;
}

.frm_style_formidable-style.with_frm_style .frm_form_field.frm_html_container {
    font-size: 15px;
    font-style: normal;
}

.frm_style_formidable-style.with_frm_style .frm_error_style p {
    margin: 0;
    padding: 0;
}

.frm_style_formidable-style.with_frm_style .frm_submit button {
    font-family: inherit;
    border: none;
}

.frm_style_formidable-style.with_frm_style input[type=text], .frm_style_formidable-style.with_frm_style input[type=password], .frm_style_formidable-style.with_frm_style input[type=email], .frm_style_formidable-style.with_frm_style input[type=number], .frm_style_formidable-style.with_frm_style input[type=url], .frm_style_formidable-style.with_frm_style input[type=tel], .frm_style_formidable-style.with_frm_style input[type=file], .frm_style_formidable-style.with_frm_style input[type=search], .frm_style_formidable-style.with_frm_style select {
    font-style: normal;
}

.frm_style_formidable-style.with_frm_style .frm_message {
    margin-bottom: 150px;
}

.with_frm_style .frm_message p {
    font-size: 20px;
    margin-bottom: 0px;
}

.frm_style_formidable-style.with_frm_style label.frm_primary_label,
.frm_style_formidable-style.with_frm_style.frm_login_form label,
.frm_style_formidable-style.with_frm_style .frm_form_field.frm_html_container,
.frm_style_formidable-style.with_frm_style .frm_radio label,
.frm_style_formidable-style.with_frm_style .frm_checkbox label,
.frm_style_formidable-style.with_frm_style input[type=text], .frm_style_formidable-style.with_frm_style input[type=password], .frm_style_formidable-style.with_frm_style input[type=email], .frm_style_formidable-style.with_frm_style input[type=number], .frm_style_formidable-style.with_frm_style input[type=url], .frm_style_formidable-style.with_frm_style input[type=tel], .frm_style_formidable-style.with_frm_style input[type=file], .frm_style_formidable-style.with_frm_style input[type=search], .frm_style_formidable-style.with_frm_style select {
    font-family: inherit;
}

/* Note: Design for Mobile */
@media screen and (max-width: 767px) {
    .frm_full select {
        max-width: 100% !important;
    }
}
