@media (min-width: 768px) {
    .g-recaptcha {
        display: inline-block;
        width: 30%;
    }
}
@media (max-width: 767px) {
    .g-recaptcha {
        display: inline-block;
        width: 70%;
    }
}

h1 {color:#333}
h2 {padding:4px 0; margin: .25em 0; color:#535c68}

a {color:#555 !important}
a:hover {color:#999 !important}

/*h3 {color:#FFF; background-color:#0097e6; padding:4px 1em; height:40px; width:100%; min-width:240px}*/
h3 {color:#0097e6; background-color:#FFFFFF; padding:4px; height:40px; width:100%; min-width:240px; border-bottom: solid 2px #0097e6}
h3.full {color:#FFF; background-color:#0097e6; padding:4px; height:40px; width:100%; min-width:240px}
h4 {text-decoration:underline; color:#535c68}

.options-nav-button a {margin:1rem; padding:.25rem; line-height:40px; text-align:center; font-size:18px; color:#fff; background-color:#555; border-radius:2px; }
.options-nav-button a:link {margin:1rem .5rem; padding:.25rem; line-height:40px; text-align:center; font-size:18px; color:#fff; background-color:#555; border-radius:2px; }
.options-nav-button a:hover {color: #B8860B;}
.options-nav-button-selected a {margin:1rem; padding:.25rem; line-height:40px; text-align:center; font-size:18px; color:#B8860B; border:solid 1px #B8860B; border-radius:2px; }
.options-nav-button-selected a:link {margin:1rem .5rem; padding:.25rem; line-height:40px; text-align:center; font-size:18px; color:#B8860B; border:solid 1px #B8860B; border-radius:2px; }
.options-nav-button-selected a:hover{border:solid 1px #B8860B; border-radius:2px}

/* color input controls to more easily identify entries needed */
input:enabled[type='text'],input[type='tel'],input[type='password'], input[type='radio'], input[class='*recaptcha-*'], select:enabled, textarea {background-color: #FEF9E7 !important}
input[type='radio'] + label {background-color: #FEF9E7 !important; padding:2px 8px}

/* Checkboxlist checkbox label style */
.cb,.cb-lg {display:block; margin:1.25em 0 2em 0}
.cb-warning {border:solid 2px #900000; padding:4px 8px}
.cb-lg-mtb-sm {margin:.5em 0 1em 0 !important}

.cb label {
  display: inline;
  padding-left: 5px;
  text-indent: -15px;
}
.cb input {
  width: 16px;
  height: 16px;
  padding: 0;
  margin:0;
  vertical-align: bottom;
  position: relative;
  top: -1px;
  *overflow: hidden;
}
.cb-lg label {
  display: inline;
  padding-left: 10px;
  text-indent: -15px;
  margin-right:1.5em;
}

.cb-lg input {
  width: 20px;
  height: 20px;
  padding: 0;
  margin:0;
  vertical-align: bottom;
  position: relative;
  top: -1px;
  *overflow: hidden;
}

/* group detail */
.conf-flt-rt-200 {
    float: right;
    width: 15%;
    min-width: 200px;
    text-align: center;
    margin: .5em 2em;
}

.gCaptch-parent {
    width:300px;
    margin: 0 auto;
    text-align:left; /* AS of 2025, this is needed to center align the recaptcha */
    display:block;
}


/* Change default anchor colors */
a {
  color: #335;
  text-decoration: underline;
}
a:hover,a:focus {
  color: #669;
  text-decoration: none;
}

a.close {text-decoration:none !important}

/* home page group box styles */
.event-parent {display:flex; height:220px; overflow-y:visible; float:none;text-align:center; margin-bottom:1em; padding:.5em .25em; border:solid 1px #333; border-radius:6px; margin-right:-4px;}

.event-parent {background:#0097e6} /* Old browsers */
.event-parent {background:-moz-linear-gradient(top, #0097e6 0%, #dddddd 100%);} /* FF3.6-15 */
.event-parent {background:-webkit-linear-gradient(top, #0097e6 0%, #dddddd 100%);} /* Chrome10-25,Safari5.1-6 */
.event-parent {background:linear-gradient(to bottom, #0097e6 0%, #dddddd 100%);} /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
.event-parent {background:filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0097e6', endColorstr='#dddddd',GradientType=0 );} /* IE6-9 */
.event-parent:hover { text-decoration:none} /* Old browsers */

.action-parent {display:block; position:relative; overflow-y:visible; float:none;text-align:center; margin:.5em auto; padding:.5em .25em; border:solid 1px #333; border-radius:6px}

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


.event-title {font-size:1.4em; margin:0}
.event-location {font-size:.9em}
.event-date {font-size:1.2em; margin:0; padding:0}
.event-link {color:#FFF; display: block; height: 100%;width: 100%; text-decoration: none; transition: background-color .5s linear;}
.event-link:hover {background-color: transparent;}
.event-late {}
.action-status {color:#900000}
.action-button {}

@media (max-width: 992px) {
.event-title {font-size:1.4em; margin:0}
.event-location {font-size:.9em}
.event-date {font-size:1em; margin:0; padding:0}
.event-link {color:#FFF; display: block; height: 100%;width: 100%; text-decoration: none}
.event-link:hover {}
.event-late {}
}

/* Labels & Text */
.paymentLabel {display:block; margin-top:1em}
.label-left {float:left; line-height:1.4em; font-size:1.4em; width:240px}
.label-right {float:left; line-height: 1.4em}
.label-descriptive-box {display:block; border:solid 1px #999; margin:1em 0 .5em 0; padding:.5em 6px; border-radius: 4px; background-color:#dfe6e9; }
.question-description {font-size:.875em; color:#369; font-style:italic; margin:0 2em 0 1em}
.question-disabled {font-size:.875em; color:#B7841D; font-style:italic; margin:0 2em 0 1em}
.larger-description {font-size:1em}
.label-price {font-weight:bold; font-size:1.125em; color:#369; margin:0; padding:.25em .5em}
.label-section-description {font-size:.95em; color:#369; font-style:italic; margin:0 2em 1em 1em}
.pt9em {font-size:.9em; font-style:italic}
.color777777 {color:#777777}
.color-900000 {color:#900000}

/* Dividers */
hr.dashed {
    border-top: 1px dashed #CCCCCC
}
hr.double {
    border-top: 6px double #CCCCCC
}

/* Buttons */
.button-reg {display:table-cell; font-size:1.2em; text-align:center; width:160px; vertical-align:middle;padding:1em; border:solid 1px #f0932b; color:#333; background-color:#fff; border-radius:2px}
.button-reg:hover {color:#333; background-color:#f0932b}
.button-reg2 {display:inline-block; font-size:1.2em; text-align:center; width:160px; vertical-align:middle;padding:1em; border:solid 1px #f0932b; color:#333; background-color:#fff; border-radius:2px}
.button-reg2:hover {color:#333; background-color:#f0932b}

/* set a max-width for carousel and make it centered */
/* This will do for now; if I want this fixed for multiple screen sizes
   I'll need to get into the .less files :)? */
div.c-wrapper{
    width: 100%; /* for example */
    margin: auto;
}

/* Bootstrap rows */
.row {
    margin: .5em 0;
}

/* Table formats - Generated at https://divtable.com/table-styler/ */
.table-pale-blue-rows {font-family: Arial, Helvetica, sans-serif; border: 1px solid #1C6EA4; background-color: #EEEEEE; width: 100%; text-align: center; border-collapse: collapse; margin: .25em 15px}
.table-pale-blue-rows th {border: 1px solid #AAAAAA; text-align:center; padding: 1px 2px; background: #0097e6; color:#ffffff}
.table-pale-blue-rows td {border: 1px solid #AAAAAA; padding: 1px 2px}
.table-pale-blue-rows tbody td {font-size: 13px}
.table-pale-blue-rows tr:nth-child(even) {background: #D0E4F5}
.table-pale-blue-rows thead {background: #1C6EA4; border-bottom: 2px solid #444444}
.table-pale-blue-rows thead th {font-size: 14px; font-weight: bold; color: #FFFFFF; text-align: center; border-left: 2px solid #D0E4F5}
.table-pale-blue-rows thead th:first-child {border-left: none}
.table-pale-blue-rows tfoot td {font-size: 14px}
.table-pale-blue-rows tfoot .links {text-align: right}
.table-pale-blue-rows tfoot .links a{display: inline-block; background: #1C6EA4; color: #FFFFFF; padding: 2px 8px; border-radius: 5px}

/* Reservations table mods */
.table-reservations {margin:.5em .125em}
.table-reservations th {font-size:1em; padding: 1px 4px; background-color:#666; color:#FFF}
.table-reservations td {font-size:1em; padding: 1px 4px}

/* Colors */
.label-maroon {color:#900000}

/* Panel styles */
.panel1,.panel2,.panel3 legend {font-size:1.5em; margin: 1em}
.panel1 {margin:2em 0; padding:1em; border:solid 1px #83aae0}
.panel3 {border: solid 4px #0080c0; color:#333; padding: .75em 1em; border-radius:4px}

/* Standard Forms by JN */
.tb1 {margin:0 1em}

/* Control-Label spacing */
input[type="radio"] {width:20px; height:20px; margin-right: 1em; vertical-align:middle}


/* Borders and Backgrounds*/
.border-h2 {margin-top:2em}
.bkg-blue1-border2{border: solid 2px #0080c0; color:#333; padding: 10px 20px; border-radius:4px}
.bkg-green-border2{border:solid 2px #6B3; color:#333; padding: 10px 20px; border-radius:4px}
.bkg-gold-border2{border:solid 2px #FB2; color:#333; padding: 10px 20px; border-radius:4px}
.bkg-orange-border2{border:solid 2px #F60; color:#333; padding: 10px 20px; border-radius:4px}
.bkg-red-border2{border:solid 2px #F00; color:#333; padding: 10px 20px; border-radius:4px}

.validator{color:#900000; text-align:center; padding:.25em 1em; font-style:italic; font-size:.9em}
.validator-border{background-color:#EED905; color:#900000; text-align:center; padding:.25em 1em; font-style:italic; font-size:.9em; border:solid 1px #900000}

.scroll-top {
    width: 40px;
    height: 40px;
    line-height: 40px;
    position: fixed;
    bottom: 20px;
    right: 20px;
    text-align: center;
    font-size: 20px;
    background: #323232;
    background: #555;
    color: #fff;
    z-index: 99;
    display: none;
    transition: none;
    -o-transition: none;
    -moz-transition: none;
    -webkit-transition: none;
}

    .scroll-top:hover {
        background: #e6ae49;
        text-decoration: none;
        color: #fff;
    }

@media (max-width: 768px) {
    .scroll-top {
        opacity: 0;
        visibility: hidden;
    }
}

/* Add margin between bootstrap cols */
.bs-inner-col {
    background-color: transparent;
    background-image: linear-gradient(to bottom, rgba(30, 87, 153, 0.2) 0%, rgba(125, 185, 232, 0) 100%);
    background-repeat: repeat;
    border-radius:4px;
    padding: 5px;
    vertical-align:top;
    min-height:20px;
}

.disabled { 
    color: #CCC;
    background-color: #FFF;
    border-color: transparent;
}

@media (min-width: 601px) {
    .modal-dialog {
        height: calc(80%) !important;
        min-height: calc(400px) !important;
        margin:5px auto;
        width: calc(70%) !important;
        min-width: calc(600px) !important;
        /*overflow-x:hidden;*/
    }
    .modal-content {
        /* 80% of window height */
        height: calc(100%) !important;
        width: calc(100%) !important;
        /*overflow-x:hidden;*/
    }

    .modal-body {
        /* 100% = dialog height, 120px = header + footer */
        min-height: calc(90%) !important;
        min-width: calc(90%) !important;
        /*overflow-y: hidden;
        overflow-x: hidden;*/
    }

    .modal-iframe {
        position:relative; width:calc(100%); height:calc(90%); border:0; overflow-x:hidden; overflow-y:scroll;
    }

}
@media (max-width: 600px) {
    .modal-dialog {
        height: calc(100% - 60px) !important;
        margin:10px auto;
        max-height: calc(100% - 60px) !important;
        width: calc(100% - 20px) !important;
        max-width: calc(100% - 20px) !important;
    }
    .modal-content {
        /* 80% of window height */
        height: 100% !important;
        width: 100% !important;
    }

    .modal-body {
        /* 100% = dialog height, 120px = header + footer */
        max-height: calc(100% - 60px) !important;
        max-width: calc(100% - 20px) !important;
        overflow-y: scroll !important;
    }
    .modal-iframe {
        width:98% !important; height:98% !important; border:0
    }

.fa-1-5x {font-size:1.5em;}