/**
 * This is the base CSS file for all layouts.
 */

/***** KEY *****

.blockName
.blockName-elementName (for a subcomponent of a block)
.blockName_modifierName (for a variation of a block)

Font stacks:

Colors:

*/

/* pt-sans-narrow-regular - latin */
@font-face {
    font-family: 'PT Sans Narrow';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/pt-sans-narrow-v16-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/pt-sans-narrow-v16-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/pt-sans-narrow-v16-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/pt-sans-narrow-v16-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../fonts/pt-sans-narrow-v16-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/pt-sans-narrow-v16-latin-regular.svg#PTSansNarrow') format('svg'); /* Legacy iOS */
}
/* pt-sans-narrow-700 - latin */
@font-face {
    font-family: 'PT Sans Narrow';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/pt-sans-narrow-v16-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/pt-sans-narrow-v16-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/pt-sans-narrow-v16-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/pt-sans-narrow-v16-latin-700.woff') format('woff'), /* Modern Browsers */
        url('../fonts/pt-sans-narrow-v16-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/pt-sans-narrow-v16-latin-700.svg#PTSansNarrow') format('svg'); /* Legacy iOS */
}

/* source-sans-pro-300 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/source-sans-pro-v19-latin-300.eot'); /* IE9 Compat Modes */
    src: url('../fonts/source-sans-pro-v19-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/source-sans-pro-v19-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-300.woff') format('woff'), /* Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/source-sans-pro-v19-latin-300.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
/* source-sans-pro-300italic - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 300;
    src: url('../fonts/source-sans-pro-v19-latin-300italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/source-sans-pro-v19-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/source-sans-pro-v19-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-300italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/source-sans-pro-v19-latin-300italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
/* source-sans-pro-regular - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/source-sans-pro-v19-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/source-sans-pro-v19-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/source-sans-pro-v19-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/source-sans-pro-v19-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
/* source-sans-pro-italic - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/source-sans-pro-v19-latin-italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/source-sans-pro-v19-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/source-sans-pro-v19-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/source-sans-pro-v19-latin-italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
/* source-sans-pro-700 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/source-sans-pro-v19-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/source-sans-pro-v19-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/source-sans-pro-v19-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-700.woff') format('woff'), /* Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/source-sans-pro-v19-latin-700.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
/* source-sans-pro-700italic - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 700;
    src: url('../fonts/source-sans-pro-v19-latin-700italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/source-sans-pro-v19-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/source-sans-pro-v19-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-700italic.woff') format('woff'), /* Modern Browsers */
        url('../fonts/source-sans-pro-v19-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/source-sans-pro-v19-latin-700italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
/* caveat-regular - latin */
@font-face {
    font-family: 'Caveat';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/caveat-v14-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/caveat-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/caveat-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/caveat-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../fonts/caveat-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/caveat-v14-latin-regular.svg#Caveat') format('svg'); /* Legacy iOS */
}


/***** HELPERS *****/
/* For clearfix, use the .group class (from si-grid) */

/* Helper classes for setting bottom margins */
.mb0.mb0 {
    margin-bottom: 0;
}
.mb1 {
    margin-bottom: .5rem;
}
.mb2 {
    margin-bottom: 1rem;
}
.mb3 {
    margin-bottom: 1.5rem;
}
.mb4 {
    margin-bottom: 2rem;
}
.mb5 {
    margin-bottom: 2.5rem;
}
.mb6 {
    margin-bottom: 3rem;
}

.ml1.ml1 {
    margin-left: .5rem;
}
.ml2.ml2 {
    margin-left: 1rem;
}

.mr1.mr1 {
    margin-right: .5rem;
}
.mr2.mr2 {
    margin-right: 1rem;
}

.relative {
    position: relative;
}

.wrap {
    white-space: pre-wrap;

    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;

    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;
}

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
}

.noMargin.noMargin {
    margin: 0;
}

.noPad.noPad {
    padding: 0;
}

.clickable {
    cursor: pointer;
}

.invisible {
    visibility: hidden;
    position: absolute;
    z-index: -99;
}

.animate {
    -webkit-transition: all .3s;
    transition: all .3s;
}


/* Wrap tables and other elements with this to make it possible to enable horizontal scroll when the screen size is too small to contain the element fully */
.scrollWrapper {
    overflow: auto;
    position: relative;
    margin-bottom: 2em;
}
.scrollWrapper > table {
    margin: 0;
}


/***** BLOCKS *****/

html {
    font-size: 100%; /* 16px - We set the font size here so that we can use rems to adjust the text size relative to this root size. Use ems instead when you want to make it easier to resize everything in the block together, i.e. at a responsive breakpoint */
}

body {
    position: relative;
    background: #fff;

    font-family: "Source Sans Pro", "Arial", sans-serif;
    font-weight: 400;
    line-height: 1.25;
    color: #555;

    -webkit-text-size-adjust: 100%; /* responsive */
}
body.adminbar-loaded {
    margin-top: 40px; /* Make sure the adminbar doesn't cover the page */
}
body.adminbar-loaded.layout_modal {
    margin-top: 0;
}

#adminbar {
    font-size: 14px;
}
/* Hide adminbar in modal windows */
.layout_modal #adminbar {
    display: none;
}


/* Use the richText class to wrap content entered in rich text (wysiwyg) editor fields. */
.richTxt {}
.richTxt ol, .richTxt ul {
    margin-bottom: 2em;
    padding-left: 1.5rem;
    line-height: 1.6;
}
.richTxt ul {
    list-style: square;
}
.richTxt ol {
    list-style-type: decimal;
}
.richTxt li {
    margin-bottom: .6em;
}
.richTxt p {
    font-size: 1.2rem;
    line-height: 1.75;
}


/* Increase the spacing between the end of a paragraph and the start of a new heading */
p {
    margin-bottom: 1.2em;
}
p + h2, p + a + h2,
p + h3, p + a + h3,
p + h4, p + a + h4,
p + h5, p + a + h5 {
    margin-top: 1.5em;
}

/* These classes are mainly for use in CKEditor. CKEditor can only apply one class at a time, so all subclasses must include the base class's styles */
.align, .align_left, .align_right, .align_center {
    max-width: 100%;
    margin-bottom: 1.5em;
}
.align_left, .align_right {
    max-width: 50%;
}
.align_left {
    float: left;
    margin-right: 2em;
    margin-left: 0;
}
.align_right {
    float: right;
    margin-left: 2em;
    margin-right: 0;
}
.align_right figcaption {
    text-align: right;
}
.align_center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
@media (max-width:800px) {
    .align_left > figcaption,
    .align_right > figcaption,
    .align_center > figcaption {
        font-size: .75em;
    }
}
@media (max-width: 600px) {
    .align_left, .align_right, .align_center {
        float: none;
        max-width: 100%;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
    .align_left > figcaption,
    .align_right > figcaption {
        text-align: center;
    }
}

.link {
    color: #82a9ff;
    border-bottom: 1px dotted #82a9ff;
    transition: all .3s;
}
.link:hover {
    border-bottom: 1px solid #196ad4;
    color: #196ad4;
    transition: all .3s;
}

.MarkupPagerNav {
}
.MarkupPagerNav li {
    display: inline-block;
    margin: 0 1px;
}
.MarkupPagerNav li a {
    color: #fff;
    cursor: pointer;
    background-color: #555;
    padding: .5rem .75rem;
    font-size: .8rem;
    border-radius: 4px;
}
.MarkupPagerNav li.MarkupPagerNavSeparator {
    font-size: .75rem;
    padding: 6px 4px;
}
.MarkupPagerNav li.MarkupPagerNavOn a,
.MarkupPagerNav li a:focus,
.MarkupPagerNav li a:hover {
    background: #333;
}



.breadcrumb {
    margin: 0 0 .2em;
    padding: 0;
    font-size: 0.75rem;
}
.breadcrumb-item {
    display: inline;
    margin: 0;
    padding: 0;
}
.breadcrumb-item:after {
    content: " / ";
}


/*** Forms ***/

/* Placeholder text */
.placeholder {
    color: #999;
}
::-webkit-input-placeholder {
    color: #999;
}
:-moz-placeholder {
    color: #999;
}
::-moz-placeholder {
    color: #999;
}
::-ms-input-placeholder {
    color: #999;
}

.notice {
    color: #fff;
    background: #7893e1;
    padding: 1rem .75rem;
    font-size: .9em;
    font-weight: bold;
}
.notice a,
.notice a:hover, .notice a:focus {
    border-bottom-color: #fff;
    color: #fff;
}
.notice_error {
    background: #ff4f4f;
}
.notice_success {
    background: #84D05E;
}

.field {}
.field-required.field-required {
    color: #FF9292;
    font-weight: 600;
}
.field-notes.field-notes {
    font-size: .85em;
    font-style: italic;
    color: #5A5A5A;
    margin-top: .2rem;
}
.field-error.field-error {
    display: block;
    font-size: .75em;
    font-weight: bold;
    width: 100%;
    color: #f18a8a;
    margin-top: .2rem;
}
.field-noValue.field-noValue {
    color: #ccc;
    margin-bottom: .5rem;
    font-size: 1rem;
}
.field-readOnly {
    margin-bottom: .5rem;
}

.fieldset {
    border: 1px solid #ccc;
    background: #f7f9fa;
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.txtBox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    border: 1px solid #ccc;
    background: #fff;
    padding: .4rem;
    max-width: 100%;
}

.txtBox_select {
    /*-webkit-appearance: button;*/
    background-image: url(../images/arrow-down.png);
    background-repeat: no-repeat;
    background-position: right;
    padding-right: 32px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi) {
    .txtBox_select {
        background-image: url(../images/arrow-down@2x.png);
        background-size: 20px 7px;
    }
}

.txtBox_error.txtBox_error{
    border-color: red !important;
    outline: none;
}

/* for use on textareas */
.txtBox_multi {
    vertical-align: top;
    height: initial;
}

/* hide the textbox border util focus */
.txtBox_noBorder:not(:hover) {
    /* border-color: transparent;*/
}

/* hide the textbox border util focus */
.txtBox_readOnly:hover {
    border-color: transparent !important;
}

input[type="radio"] {margin-right: .25em;}

.btn {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    display: inline-block;
    vertical-align: middle;
    position: relative;
    margin: 2px;
    padding: 8px 40px;
    background: #555;
    color: #fff;
    text-align: center;
    border: none;
    font-size: .8rem;
    font-weight: bold;

    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.btn i {
    margin-left: -1em;
}
.btn:hover, .btn:focus {
    background: #342B21;
}
.btn.span12 {
    padding-left: 1rem;
    padding-right: 1rem;
}

.btn_sm {
    font-size: .75rem;
    padding: 4px 10px;
    margin: 1px;

    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.btn_sm i {
    margin-left: 0;
}

.dataTable {
    width: 100%;
    margin-bottom: 1rem;
    font-size: .9em;
}
.dataTable tr:first-child td {
    border-top: 1px solid #eaeaea;
}
.dataTable td {
    border-bottom: 1px solid #eaeaea;
    padding: .5em;
    vertical-align: middle;
    position:relative;
}
.dataTable th {
    background: #555;
    padding: .5em;
    color: #fff;
    font-size: .8em;
    font-weight: bold;
    border: 1px solid #555;
}
.dataTable tr:nth-child(odd) {
    background: #f5f5f5;
}
.dataTable-label {
    font-size: .9em;
    text-transform: uppercase;
    font-weight: bold;
}

.dataTable2 {}
.dataTable2 td, .dataTable2 th {
    border: 1px solid #777;
    padding: .25em;
}
.dataTable2-divider {
    border-top: 2px solid #777;
}
.dataTable2_striped tr:nth-child(even) {
    background-color: #ddd;
}
.dataTable2 .dataTable2-transparent {
    background-color: #ffffff;
    border: 0;
}

.statusBar {
    padding: .25rem 0;
}
.statusBar_on {
    background: #0c8681;
}
.statusBar_off {
    background: #747786;
}

.tooltipster-base {
    font-family: 'proxima-nova', Arial, sans-serif;
    font-size: .75rem;
}

.spinner {
    margin: auto;
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    font-size: 2rem;
    width: 2rem;
    height: 2rem;
    display: none;
}

.littleSpinner {
    position: absolute;
    top: 8px; right: 10px;
    font-size: 1rem;
    width: 1rem;
    height: 1rem;
    display: none;
}
.littleSpinner .fa-check-circle, .littleSpinner .fa-check {
    color: #00b100;
}

.hide {
    display:none;
}

.small {
    font-size: .85em;
    vertical-align: super;
}


.awfullyBlue { backgroup-color:blue;}

.ply-layer {
    max-width: 600px;
    font-family: inherit;
    color: #6f6f6f;
}
.ply-input {
    font-family: inherit;
}
.ply-footer .ply-ctrl {
    width: auto;
    margin: 5px;
    font-size: 17px;
}
.ply-content {
    padding: 10px 0;
    line-height: 1.5;
}

.modal {}
.modal_small {
    max-width: 600px;
}

.mobileOverflowFix {
    overflow-x: hidden;
}

.dropDownBtn {
    position: relative;
}
.dropDownBtn-options {
    display: none;
    position: absolute;
    top: calc(100% - 6px);
    left: 0;
    right: 0;
    background-color: #4BAB91;
    color: #fff;
    margin: 0 2px;
    width: 100%;
    border-radius: 0 0 4px 4px;
    font-size: .9rem;
    padding: .5rem 0;
    box-shadow: 0 2px 4px rgba(0,0,0,.20);
    z-index: 100;
}
.dropDownBtn-options button {
    padding: .25rem 1rem;
    text-align: left;
    display: block;
    width: 100%;
}
.dropDownBtn-options button:hover,
.dropDownBtn-options button:focus {
    background-color: #35c19b;
}
.dropDownBtn:hover .dropDownBtn-options,
.dropDownBtn:focus .dropDownBtn-options,
.dropDownBtn:focus-within .dropDownBtn-options {
    display: block;
}

.writeIn {
    display: flex;
    width: 100%;
    margin-bottom: .4em;
}
.writeIn p {
    margin-bottom: 0 !important;
}
.writeIn-label {
    font-weight: bold;
    margin-right: .25em;
}
.writeIn-line {
    border-bottom: 1px solid #000;
    flex-grow: 1;
}