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

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;
}
/* HTML5 display-role reset for older browsers */
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;
}
b, strong {
    font-weight: bold;
}
/* =================================================== */
/* CSS CLEARFIX HACK
/* =================================================== */

/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}
/* =================================================== */
/* BASE STYLES
/* =================================================== */
@font-face {
    font-family: 'PalatinoLinotype';
    src: url('../fonts/PalatinoLinotype-Bold.eot?#iefix') format('embedded-opentype'),
    url('../fonts/PalatinoLinotype-Bold.woff') format('woff'),
    url('../fonts/PalatinoLinotype-Bold.ttf')  format('truetype'),
    url('../fonts/PalatinoLinotype-Bold.svg#PalatinoLinotype-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'OpenSans-Regular';
    src: url('../fonts/OpenSans.eot?#iefix') format('embedded-opentype'),
    url('../fonts/OpenSans.woff') format('woff'),
    url('../fonts/OpenSans.ttf')  format('truetype'),
    url('../fonts/OpenSans.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'PalatinoLinotype-Regular';
    src: url('../fonts/PalatinoLinotype-Regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/PalatinoLinotype-Regular.woff') format('woff'),
    url('../fonts/PalatinoLinotype-Regular.ttf')  format('truetype'),
    url('../fonts/PalatinoLinotype-Regular.svg#PalatinoLinotype-Roman') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
    background: rgba(0, 0, 0, 0) url("../images/screens/bg-image.jpg") no-repeat fixed center center / cover ;
    font: normal 14px/120% OpenSans-Regular, Helvetica, Arial, sans-serif;
    color:  #F0D98D;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    line-height: 150%;
    margin: 5px 0 10px 0;
}
h1 {
    font-size: 1.4em;
}
h2 {
    font-size: 1.3em;
}
h3 {
    font-size: 1.1em;
}
body em {
    font-style: italic;
}
body#page2 h2 {
    margin-top: 20px;
}
a {
    text-decoration: none;
    color: #F0D98D;
}
a:hover, a:visited, a:focus, a:active {
    text-decoration: underline;
}
table {
    width: 60%;
    margin: 20px auto;
}
table tr:first-child th {
    background-color: rgba(242, 212, 86, .7);
    color: #000000;
    border: 1px solid #F0D98D;
}

table, tr, td, th {
    border: 1px solid;
}
td, th {
    padding: 10px;
    text-align: center;
}
th {
    font-weight: bold;
}
p {
    margin-bottom: 8px;
    min-height: 10px;
}
.content .justifyright {
    text-align: right;
}
article.content > ul[type="disc"] {
    list-style-type: disc;
    margin-bottom: 10px;
    padding-left: 15px;
}
article.content > ul[type="circle"] {
    list-style-type: circle;
    margin-bottom: 10px;
    padding-left: 15px;
}
article.content > ul[type="square"] {
    list-style-type: square;
    margin-bottom: 10px;
    padding-left: 15px;
}
article.content > ul[type="upper-roman"] {
    list-style-type: upper-roman;
    margin-bottom: 10px;
    padding-left: 15px;
}
article.content > ul[type="lower-alpha"] {
    list-style-type: lower-alpha;
    margin-bottom: 10px;
    padding-left: 15px;
}

/* =================================================== */
/* HEADER STYLES
/* =================================================== */
#logo > figure {
    padding-right: 20px;
    text-align: center;
}
#logo a {
    background-color: rgba(0, 0, 0, 0.8);
    display: block;
    padding: 10px;
    min-height: 231px;
    max-height: 231px;
}
#logo img, #leftHeader img {
    margin: 15px auto;
    width: 70%;
}
.header-mid-container {
    background-color: rgba(0,0,0,.8);
    padding: 28px 30px;
    line-height: 17px;
}
/* --------------------- Navigation Start -------------------------- */
#mainNavigation {
    text-align: left;
}
#mainNavigation ul li a {
    color:  #F0D98D;
    display: inline-block;
    padding: 5px 10px;
    text-decoration: none;
    margin-bottom: 1px;
}
#mainNavigation ul li:last-child a {
    margin-bottom: 0;
}
#mainNavigation ul li.active a, #mainNavigation ul li.current a, #mainNavigation ul li a:hover, #languageBar li.yams_current, #languageBar li:hover {
    background-color:  #F0D98D;
    color: #000000;
}
#mainNavigation.mobile {
    background-color: rgba(0, 0, 0, 0.9);
    bottom: 0;
    display: block;
    float: none;
    left: 0;
    padding: 40px 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 999;
}
.mobile .nav-ul {
    display: block;
}
#mainNavigation.mobile ul li a {
    font-size: 1.1em;
    padding: 8px 10px;
    margin: 5px;
    display: block;
}
#navBtn {
    background-color: transparent;
    border: medium none;
    bottom: 0;
    color: #F0D98D;
    cursor: pointer;
    display: none;
    font-size: 1.2em;
    left: 2.3%;
    padding: 10px;
    position: absolute;
    text-transform: uppercase;
}
.mobile #navBtn {
    bottom: auto;
    left: auto;
    right: 10px;
    top: 0;
}
.mobile #navBtn .fa.fa-times {
    display: inline-block;
}
.mobile #navBtn .fa.fa-bars {
    display: none;
}
#navBtn:hover, #navBtn:hover i.fa {
    color: #D3B330;
}
#navBtn i.fa {
    color: #F0D98D;
    font-size: 1em;
}
#navBtn .fa.fa-times {
    display: none;
}
/* --------------------- Navigation End ------------------------ */
#siteTagline {
    text-align: right;
}
h1#siteTitle {
    font: 2.4em/120% PalatinoLinotype-Regular,Arial,sans-serif;
    text-transform: uppercase;
}
h2#slogan {
    font: 1.2em/120% PalatinoLinotype-Regular,Arial,sans-serif;
    margin-top: 40px !important;
    color: #ffffff;
    text-transform: uppercase;
}
#languageBar {
    float: right;
    margin-top: 41px;
}

#languageBar li, #languageBar a {
    color: #F0D98D;
    display: inline-block;
    font-size: 0.9em;
    padding: 5px;
    text-decoration: none;
}
#languageBar li {
    margin-right: 2px;
}
#languageBar li a {
    padding: 0;
}
#languageBar li:hover a {
    background-color: #F0D98D;
    color: #000000;
}
.yams_choose_lang_statement {
    display: none;
}
#leftHeader figure {
    background-color: rgba(0, 0, 0, 0.8);
    margin-left: 20px;
    text-align: center;
    padding: 15px 0;
    min-height: 221px;
    max-height: 221px;
}

#leftHeader figure img {
    width: 63%;
}
/* =================================================== */
/* MAIN CONTENT STYLES
/* =================================================== */
#mainContent {
    padding: 20px 0;
}

.container {
    background-color: rgba(0, 0, 0, 0.8);
    margin: 0 auto;
    padding: 0;
    width: 66.7%;
}
#topSection {
    background-color: #f0d98d;
    color: #000000;
}
.featured-image {
    position: relative;
}
h2#hotNews {
    background-color: rgba(0,0,0, .6);
    margin: 0 !important;
    text-align: center;
    padding: 20px;
    /* background-color: #FDFAF1; */
}
h2#hotNews a {
    color: #C4643E;
}

#topSection img {
    width: 100%;
}
.top-text-container {
    padding: 40px 80px;
    text-align: justify;
}
.top-text-container > h2 {
    font-size: 2.2em;
    text-align: center;
    text-transform: uppercase;
    font-style: italic;
}
.top-text-container > p {
    font-size: 1.2em;
    line-height: 1.6em;
}
.top-text-container strong {
    font-weight: bold;
}
article.content {
    padding: 30px;
}
.content p {
    text-align: justify;
    line-height: 140%;
    margin-bottom: 15px;
}
/* =================================================== */
/* SAC RULES PAGE STYLES
/* =================================================== */

.page-title {
    margin-bottom: 40px;
    text-align: center;
}
#sacRules {
    list-style: inside upper-roman;
    text-align: left;
}
#sacRules .section-item {
    font-size: 1.2em;
    margin: 15px 0;
}
#sacRules .section-item a {
    padding: 5px 0;
}
#sacRulesNav {
    text-align: center;
}
.prev, .next, .index {
    display: inline-block;
    padding: 10px;
}
.sac-rules h3, #page5 .content > h2  {
    margin: 20px 0;
}
#page15 .sac-rules > p:last-child {
    margin-top: 40px;
}
.bg-alphabet-list {
    padding-left: 25px;
}
/* =================================================== */
/* ARBITRATORS LIST STYLES
/* =================================================== */

aside.left-col .pure-container {
    margin-right: 10px;
}
.arbitrators-ul {
    padding: 20px 0;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    text-align: center;
}
#arbitratorsNamesUl a {
    display: inline-block;
    margin: 5px 0;
    padding: 5px 10px;
    font-size: 1.2em;
}
#arbitratorsNamesUl .activeLink, #arbitratorsNamesUl a:hover, #arbitratorsNamesUl .activeLink:hover {
    background-color: #F0D98D;
    color: #000000;
    text-decoration: none;
}
.pure-g.arbitrator-content-box {
    background-color: #f0d98d;
    color: #000000;
}
#arbitratorWrapper {
    background: rgba(0, 0, 0, 0) url("../images/arbitrators/arbitrators-BG.jpg") repeat scroll 0 0;
}
#arbitratorsNav {
    padding: 20px 30px;
    text-align: center;
}
article.arbitrator.content {
    color: #000000;
    padding: 0;
}
.arbitrator .left-col .pure-container {
    padding: 30px 0 0 30px;
}

.arbitrator-name {
    font-size: 1.4em;
    text-transform: uppercase;
}
span.arbitrator-role {
    display: block;
    font-size: 0.9em;
    text-transform: none;
}
.arbitrator-moto {
    font: italic 100 1em/2em Arial,sans-serif;
    margin: 20px 0 20px 0;
    width: 28%;
    text-align: right;
}
.arbitrator-info > p {
    font-size: 1.1em;
    text-align: left;
}
.arbitrator-info b {
    font-weight: bold;
}
.arbitrator-info p:last-child {
    margin-top: 20px;
    font-size: 1.2em;
}
/* =================================================== */
/* CONTACT PAGE STYLES
/* =================================================== */
.column {
    display: inline-block;
    vertical-align: top;
    width: 49.8%;
}
.address.column {
    text-align: left;
}
.map.column {
    text-align: right;
}
.map {
    padding: 0 0 10px 0;
}
.second.map {
    padding: 10px 0 0 0;
}
/* =================================================== */
/* BLOG PAGE STYLES
/* =================================================== */
li.news-item {
    margin: 5px 0;
}
.news-item > a {
    text-transform: uppercase;
}
.single-news.container {
    background-color: #f0d98d;
    color: #000000;
}
.news-navigation {
    padding: 30px;
    text-align: center;
}
.news-navigation a {
    color: #000000;
}
.news-header {
    padding: 0 30px;
}
.news.content {
    padding: 15px 30px;
}
span.author-name {
    font-weight: bold;
    font-size: .9em;
    display: inline-block;
    margin-bottom: 10px;
}
.news-author {
    padding: 15px 30px;
    text-align: right;
}
.news-title {
    font-size: 2em;
    font-weight: normal;
    text-transform: uppercase;
}
.single-news .content hr {
    color: #000;
    border-top: 1px solid #000;
    border-bottom: none;
}
/* =================================================== */
/* FOOTER STYLES
/* =================================================== */


#mainFooter p {
    line-height: 3.1em;
    font-size: .8em;
    margin: 0;
    padding: 0 30px;
}
a#returnToTop {
    background-color: transparent;
    border: 1px solid #f0d98d;
    border-radius: 50%;
    bottom: 50px;
    color: #f0d98d;
    display: none;
    font-size: 1.4em;
    height: 45px;
    opacity: 0.7;
    position: fixed;
    right: 30px;
    text-align: center;
    width: 45px;
    z-index: 99;
}
a#returnToTop i.fa {
    padding: 11px 0;
}

/* =================================================== */
/* MEDIA QUERIES
/* =================================================== */
@media only screen and (max-width: 2000px) {
    #logo img {
        width: 92%;
    }
    #leftHeader figure img {
        width: 82%;
    }
    .arbitrator-moto {
        width: 35%;
    }
}
@media only screen and (max-width: 1783px) {
    #logo img {
        width: 100%;
    }
    #leftHeader figure img {
        width: 94%;
    }
    #logo img, #leftHeader img {
        margin: 20px auto;
    }
    .arbitrator-moto {
        width: 45%;
    }

}
@media only screen and (max-width: 1690px) {
    .top-text-container {
        padding: 30px;
    }
    .top-text-container > h2 {
        margin-top: 0;
        font-size: 1.6em;
    }
    .top-text-container > p {
        line-height: 1.4em;
    }

}
@media only screen and (max-width: 1660px) {
    .column {
        width: 49%;
    }
}
@media only screen and (max-width: 1500px) {
    #logo img {
        width: 100%;
    }
    h1#siteTitle {
        font-size: 2.2em;
    }
    #logo img, #leftHeader img {
        margin: 30px auto;
    }
}
@media only screen and (max-width: 1450px) {
    .top-text-container {
        padding: 20px;
    }
    .top-text-container > h2 {
        font-size: 1.5em;
    }
    .top-text-container > p {
        line-height: 1.3em;
        font-size: 1.1em;
    }
    .arbitrator-moto {
        line-height: 120%;
        width: 55%;
    }
}
@media only screen and (max-width: 1385px) {
    #languageBar {
        margin-top: 63px;
    }
}
@media only screen and (max-width: 1366px) {
    #logo a {
        min-height: 209px;
        max-height: 209px;
    }
    #logo img {
        margin: 35px auto;
    }
    .header-mid-container {
        padding: 17px 30px;
    }
    #leftHeader figure {
        min-height: 199px;
        max-height: 199px;
    }
    #leftHeader figure img {
        margin: 25px auto;
        width: 95%;
    }
    .arbitrator-moto {
        margin: 10px 0;
    }
    .content p {
        line-height: 130%;
        margin-bottom: 10px;
    }

}
@media only screen and (max-width: 1348px) {
    #mainNavigation ul li a {
        font-size: 0.9em;
    }
    #languageBar {
        margin-top: 49px;
    }
    .top-text-container {
        padding: 20px;
    }
    .top-text-container > h2 {
        font-size: 1.4em;
    }
    .top-text-container > p {
        line-height: 1.2em;
        font-size: 1em;
    }
    h1#siteTitle {
        font-size: 2em;
    }
    #hotNews {
        font-size: 1.1em;
        line-height: 100%;
    }

}
@media only screen and (max-width: 1280px ) {

    #logo img {
        margin: 45px auto;
    }
    #leftHeader figure img {
        margin: 35px auto;
        width: 95%;
    }
    .arbitrators-content p {
        font-size: 1em;
        margin-bottom: 5px;
    }
}
@media only screen and (max-width: 1225px ) {
    h1#siteTitle {
        font-size: 1.8em;
    }
}
@media only screen and (max-width: 1170px) {
    #leftHeader {
        display: none;
    }
    .nav-ul {
        display: none;
    }

    #mainHeader {
        background-color: rgba(0, 0, 0, 0.7);
        position: relative;
    }
    #logo {
        display: block;
        float: none;
        left: 2.4%;
        margin: 0;
        position: absolute;
        top: 10px;
    }
    #logo > figure {
        background-color: transparent;
        padding: 0;
    }
    #logo a {
        min-height: 0;
        background-color: transparent;
        padding: 0;
    }
    #logo img {
        margin: 0;
        width: 70%;
    }
    .header-mid-container {
        background-color: transparent;
    }
    #navBtn {
        display: block;
    }
    #midHeader {
        width: 100%;
    }
    #mainContent .container, #mainFooter .container {
        width: 90%;
    }
    .column {
        width: 100%;
    }
    .top-text-container > h2 {
        font-size: 1.6em;
    }
    .top-text-container > p {
        line-height: 1.4em;
        font-size: 1.2em;
    }

    .arbitrator-info > p {
        font-size: 1.1em;
        margin-bottom: 15px;
    }
    a#returnToTop {
        height: 40px;
        right: 5px;
        width: 40px;
    }
}
@media only screen and (max-width: 1023px) {
    .arbitrator-moto {
        width: 80%;
    }
}
@media only screen and (max-width: 990px) {
    #logo img {
        width: 80%;
    }
    h2#slogan {
        margin-top: 20px !important;
    }
    .header-mid-container {
        padding: 30px 20px;
    }
}
@media only screen and (max-width: 900px) {
    #logo {
        left: 2%;
    }
    #logo img {
        width: 95%;
    }
    h1#siteTitle {
        font-size: 1.4em;
    }
    h2#slogan {
        font-size: 1em;
    }
    #navBtn {
        left: 1%;
    }
    table {
        width: 100%;
    }
}
@media only screen and (max-width: 850px) {
    .top-text-container > h2 {
        font-size: 1.4em;
    }
    .top-text-container > p {
        line-height: 1.3em;
        font-size: 1.1em;
        margin-bottom: 3px;
    }
    .arbitrator-moto {
        width: 100%;
    }
    .arbitrator-info > p {
        font-size: 1em;
        margin-bottom: 5px;
    }
}
@media only screen and (max-width: 767px) {
    #logo {
        width: 20%;
        left: 1%;
    }
    .header-mid-container {
        padding: 20px;
    }
    #siteTagline {
        margin-bottom: 20px;
        margin-top: -10px;
    }
    h2#slogan {
        font-size: 1em;
    }
    #navBtn {
        left: 4%;
    }
    .top-text-container {
        padding: 10px;
    }
    #arbitratorsNamesUl a {
        font-size: 1em;
    }
}
@media only screen and (max-width: 710px) {
    .top-text-container > h2 {
        font-size: 1.4em;
        margin-bottom: 0;
    }
    .top-text-container > p {
        line-height: 1.2em;
        font-size: 1em;
    }
}
@media only screen and (max-width: 650px) {
    #logo {
        left: 2%;
    }
    #mainContent {
        width: 100%;
    }
    #mainContent .container, #mainFooter .container {
        width: auto;
    }
}
@media only screen and (max-width: 620px) {
    .left-image, .right-image {
        display: none;
    }
    .top-text-container {
        padding: 20px;
    }
    #topText {
        width: 100%;
    }
    .arbitrators-content .arbitrator-moto {
        margin: 10px 0 !important;
        width: 100%;
    }

}
@media only screen and (max-width: 600px) {
    .arbitrator-name {
        font-size: 1.2em;
        margin: 0;
    }

    .arbitrators-content p {
        line-height: 1.4em;
        margin-bottom: 2px;
    }
    .arbitrator-info p:last-child {
        font-size: 1em;
        margin-top: 20px;
    }
}
@media only screen and (max-width: 567px) {
    #logo {
        left: 0;
        width: 25%;
    }
    h1#siteTitle {
        font-size: 1.3em;
    }
    h2#slogan {
        font-size: 0.9em;
    }
    #navBtn {
        left: 3%;
    }
    #sacRules {
        text-align: center;
    }

    aside.left-col .pure-container {
        margin-bottom: 10px;
        margin-right: 0;
    }
    .arbitrator .left-col .pure-container {
        margin: 0 10px 0 0;
    }
    .arbitrators-ul {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
    .arbitrator .left-col .pure-container {
        padding: 10px 0 0 10px;
    }
    .arbitrator-info > p {
        margin-bottom: 8px;
    }
    .arbitrators-images {
        padding: 20px;
    }
    .arbitrator-info > p:last-child br {
        display: none;
    }
}

@media only screen and (max-width: 480px) {
    #logo {
        left: auto;
        position: relative;
        width: 100%;
    }
    #logo img {
        margin: 0 auto;
        max-width: 150px;
        width: 100%;
    }
    section#midHeader {
        margin-top: 15px;
    }
    .header-mid-container {
        padding: 0;
    }
    #siteTagline {
        margin: 0 !important;
        text-align: center;
    }
    h1#siteTitle {
        font-size: 1.4em;
        margin-bottom: 0 !important;
    }
    h2#slogan {
        margin-bottom: 60px;
        margin-top: 10px !important;
    }
    #languageBar {
        margin-top: 30px;
    }
    #navBtn {
        left: 50%;
        margin: 10px 0 10px -46px !important;
    }
    article.content {
        padding: 15px;
    }
    #mainFooter .container {
        padding: 10px 0;
    }
    #mainFooter p {
        line-height: 1.2em;
    }
    h1 {
        font-size: 1.2em;
    }
    h2 {
        font-size: 1.1em;
    }
    h3, h4, h5, h6 {
        font-size: 1em;
    }
    h2#hotNews {
        font-size: 1em;
        line-height: 1.2em;
    }
}
@media only screen and  (max-width: 450px) {
    #arbitratorWrapper {
        background-color: #f0d98d;
        background-image: none;
    }
    .arbitrator aside.left-col .pure-container {
        margin-bottom: 10px;
        margin-right: 0;
    }
    .arbitrator .left-col, .arbitrator .right-col {
        display: block;
        width: 100%;
    }
    .arbitrator .left-col .pure-container {
        padding: 10px;
    }
    .arbitrator-img img {
        max-width: 60%;
        margin: 0 auto;
    }

}
@media only screen and (max-width: 380px) {
    .arbitrators-ul {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
}