

html:root {
    font-size: 16px;
    text-underline-position: under;
}

body {
    background-image: url(../graphics/general/mainbkg.jpg);
}

#menu {
    width: 100%;
    padding: 0;
    float: left;
    background-color: #FFCCCC;
}

/* ************in your cart button**************** */
/**
     * Reset button styles
     * It takes some work to achieve a “blank slate” look.
     */
button {
    padding: 0;
    border: none;
    font: inherit;
    color: inherit;
    background-color: transparent;
    /* show a hand cursor on hover; some argue that we
      should keep the default arrow cursor for buttons */
    cursor: pointer;
}

/**
     * Button component
     */
.btn {
    /* default for <button>, but needed for <a> */
    display: inline-block;
    text-align: center;
    text-decoration: none;

    /* create a small space when buttons wrap on 2 lines */
    margin: 2px 0;

    /* invisible border (will be colored on hover/focus) */
    border: solid 1px #000;
    border-radius: 1px;

    /* button size comes from text + padding, avoid height */
    padding: 0.5em 1em;

    /* make sure colors have enough contrast! */

    background-color: #cde7f9;
}

/* old-school "down" effect on clic + color tweak */
.btn:active {
    transform: translateY(1px);
    -webkit-transform: translateY(1px);
    filter: saturate(150%);
    -webkit-filter: saturate(150%);
    border-radius: 14px;
}

/* inverse colors on hover */
.btn:hover {
    color: #800000;
    border-color: #000;
    background-color: #a1cfee;
}

/* Firefox: remove the inner border shown on focus */
.btn::-moz-focus-inner {
    border: none;
}

/* make sure we have a visible focus ring */
.btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 105, 180, 0.5),
        0 0 0 1.5px rgba(255, 105, 180, 0.5);
}

/* hide focus style if not from keyboard navigation */
.js-focus-visible .btn:focus:not(.focus-visible) {
    box-shadow: none;
}

.table-hover tbody tr:hover td {
    background: #FFECD0;
}

.td-border td tr {
    border-color: #000;
    border-width: 3px
}

@media screen and (max-width: 500px) {
    .little {
        font-size: .9em;
    }
}

/* ************link elements *******/

a:link {
    text-decoration: underline;
    color: #0612b6;
}

/* visited link */
a:visited {
    text-decoration: underline;
    color: green;
}

/* mouse over link */
a:hover {
    text-decoration: underline;
    color: red;
}

/* selected link */
a:active {
    text-decoration: underline;
    color: #6a1504;
}

/* ---------------- fonts -------------*/
.headline11 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-style: normal;
    line-height: 1.2;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    letter-spacing: normal;
    color: #000000;
    text-align: left;
}

.headline11Bold {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-style: normal;
    line-height: 1.2;
    font-weight: 700;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    letter-spacing: normal;
    color: #000;
    text-align: left;
}

.headline12 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    color: #000000;
}

.headline14 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.875rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #000;
}

.headline14BLU {
    font-family: Arial, Helvetica, sans-serif;
    font-size: .875rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    color: #1e32c7;
}

.headline14BRN {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.875rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #800000;
}

.headline14RED {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.875rem;
    font-style: normal;
    line-height: 18px;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #E80000;
    height: auto;
}

h5 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.1rem;
    font-style: normal;
    line-height: 1.3;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #000;
}

@media screen and (max-width: 480px) {
    h5 {
        font-size: 1.4rem !important;
        line-height: 1.3 !important;
        font-weight: bold;
    }
}

.headline16 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #000;
}

.headline16BLU {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #1e32c7;
}

.headline16DarkBLU {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #0519ab;
}

.headline16BRN {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #800;
}

.headline16RED {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-style: normal;
    line-height: 20px;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #E80000;
    height: auto;
}

.headline18 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.125rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #000000;
    height: auto;
}

.headline18BLU {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.125rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #1e32c7;
}

.headline18RED {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.125rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #E80000;
    height: auto;
}

.headline18BRN {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.125rem;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #800000;
    height: auto;
}

.headline18GRN {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #00842B;
}

.headline20 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #000;
}

.headline20BRN {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #800000;
}

.headline20BLU {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    font-style: normal;
    line-height: 1.2;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #1e32c7;
}

.headline20RED {
    color: #E80000;
    font-size: 20px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
}

.headline24BRN {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: bold;
    color: #660000;
    line-height: normal;
}

.headline24BLU {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-style: normal;
    line-height: 24px;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    text-decoration: none;
    color: #000099;
}

.headline28BLU {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 28px;
    font-style: normal;
    font-weight: bold;
    color: #000099;
    line-height: 1.2;
}

.headline28BRN {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.75rem;
    font-style: normal;
    font-weight: bold;
    color: #660000;
    line-height: 1.2;
}

.hidden {
    display: none;
}

h6 {
    font-size: 11px;
    font-weight: bold;
    line-height: 1.2;
}

h6::first-letter {
    font-size: 150%;
    font-weight: bold;
    color: #101A92;
}
@media screen and (max-width: 600px) {
  .headline16RED {
    font-size:.075rem;
  }
   
  .headline14 {
    font-size:.075rem;
  } 
}
/* ----------------colors --------------*/
.lightTan {
    background-color: #FFF2C1;
}

.lightYellow {
    background-color: #fcfbea;
}

.lightPeach {
    background-color: #FFECD0;
}

.sand {
    background-color: #fcf6dd;
}

.sky {
    background-color: #cde7f9;
}

.red {
    background-color: red;
}

.green {
    background-color: green;
}

.peach {
    background-color: #ffd8b8;
}

.purple {
    background-color: purple;
}



.noPadding {
    padding: 0px;
}

.doublePadding {
    padding: 10px;
}

.table.no-border tr td,
.table.no-border tr th {
    border-width: 0;
}

/* --------------- containers ------------*/
/*.container {
    margin-left: auto;
    margin-right: auto;
    background-size: auto;
    background-repeat: repeat-x, repeat-y;

}*/
.shadow {
    -moz-box-shadow: inset 0 0 5px #0523a4;
    -webkit-box-shadow: inset 0 0 5px #0523a4;
    box-shadow: inset 0 0 5px #0523a4;
}

.container {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.clearfix {
    overflow: auto;
}

#mainBody {
    width: 1500px;

}

#head-Img {

    position: relative;
    left: 0px;
    float: left;
    padding: 0;
}

.noMargin {
    margin: 0 0;
}

.pc15 {
    width: 15%;
}
.pc20 {
    width: 20%;
}
.pc25 {
    width: 25%;
}
.pc30 {
    width: 30%;
}
.pc35 {
    width: 45%;
}
.pc40 {
    width: 35%;
}

.pc45 {
    width: 45%;
}

.pc50 {
    width: 50%;
}
.pc55 {
    width: 55%;
}
.pc60 {
    width: 60%;
}

.pc65 {
    width: 65%;
}

.pc70 {
    width: 70%;
}

.pc80 {
    width: 80%;
}

.pc90 {
    width: 90%;
}

.pc95 {
    width: 95%;
}

/*.table{
    display:table;
    table-layout:fixed;
}
.table_cell{
    display:table-cell;
    width: 250px;
}*/

/* ------------borders --------------*/
.border {
    border-width: 1px;
    border-color: #000;
    border-style: solid;
}

.border-black {
    border-color: #000;
}

.rounded {
    border-top-right-radius: 14px;
    border-bottom-right-radius: 14px;
    border-top-left-radius: 14px;
    border-bottom-left-radius: 14px;
    border: 1px solid #333000;
}

.borderRoundTopRight {
    border-top-right-radius: 14px;
    border-right-color: #330000;
    border-bottom-color: #330000;
    border-style: solid !important;
}

.borderRoundBottomRight {
    border-bottom-right-radius: 14px;
    border-right-color: #330000;
    border-bottom-color: #330000;
    border-style: solid !important;
}

.borderRoundBottomLeft {
    border-bottom-left-radius: 14px;
    border-left-color: #330000;
    border-bottom-color: #330000;
    border-style: solid !important;
}

.borderRoundTopLeft {
    border-top-left-radius: 14px;
    border-right-color: #330000;
    border-bottom-color: #330000;
    border-style: solid !important;
}

.borderLeft {
    border-left: 1px solid;
    border-top: 0px;
    border-right: none;
    border-bottom: 0px;
}
.borderRight {
    border-left: 0px none;
    border-top: 0px none;
    border-right:1px solid;
    border-bottom: 0px none;
}
.borderLeftBottom {
    border-left: 1px solid;
    border-top: 0px;
    border-right: none;
    border-bottom: 1px solid;
}
.borderRightBottom {
    border-left: 0px none;
    border-top: 0px none;
    border-right:  1px solid;
    border-bottom: 1px solid;
}

.border_lt_rt {
    border-top: 0px none;
    border-right: 1px solid;
    border-bottom: 0px none;
    border-left: 1px solid;
}

.noBorder {
    border: 0px none;
}

.noborder_Lt {
    border-top: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-left: 0px none;
}

.noborder_Lt_top {
    border-top: 0px none;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-left: 0px none;
}

.noborder_lt_bot {
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: none;
    border-left-style: none;
    border-top-color: #300;
    border-right-color: #300;
}

.noborder_Rt {
    border-top: 1px solid;
    border-right: 0px none;
    border-bottom: 1px solid;
    border-left: 1px solid;
}

.noborder_Bot {
    border-bottom: 0px none
}

.noborder_top {
    border-top: 0px none;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-left: 1px solid;
}

.border-bottom {
    border-bottom: 1px solid #1E1E1E;
}

.border-lightTan {
    border-color: #FFF2C1;
}

/* -----------------images ---------------*/
#topImg {
    background-image: url(../graphics/general/bkg558m.jpg);
    margin: 0 0;
}

#anImage {
    background-image: url('graphics/general/bkg558m.jpg');
    width: 100%;
    height: 192px;
}

.imgCenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.imgInline {
    display: inline-block;
    float: right;
    margin-left: 2px;
    margin-right: 10px;
}

/* ---------------------------LINE HEIGHTS ------------------------*/
.tallLineUltra {
    line-height: 350%;
}

.tallLine {
    line-height: 250%;
}

.tallerLine {
    line-height: 140%;
}

.mediumLine {
    line-height: 160%;
}

.smallLine {
    line-height: 50%;
}

.normalLine {
    line-height: 100%;
}

/* ------------------------  POSITIONING -------------- */

.cntr {
    text-align: center;
}

.rightSide {
    text-align: right;
}

.leftSide {
    text-align: left;
}

.leftSideIndent {
    text-align: left;
    padding-left: 10px;
}
.atMiddle {
    vertical-align:middle;
}
.toMiddle {
    vertical-align:middle;
}

.toLeft {
    margin-left: 0px;
    margin-right: auto;
}
.toRight {
    margin-left:auto;
    margin-right:0px;
}
.cntrObj {
    margin: 0px auto;
    display: block;
}

.toTop {
    vertical-align: top;
}

.centered {
    margin: auto;
}

.margin-5 {
    margin: 0 10px;
}

/* ---------------------padding / spacing ---------------------------*/

.normalPadding {
    padding: 5px;
}

.leftPadding {
    padding: 1px 4px 1px 20px;

}



.noMargin {
    margin-left: 0px;
    margin-right: 0px;
}

.leftMargin {
    font-weight: bold;
    margin-left: 12px;
    margin-right: 4px;
}

/* -----------------------misc ------------------------------- */

#filler {
    background-image: url(../graphics/general/filler.png);
    width: 100px;
    height: 150px;
}

hr {
    border: none;
    Height: 1px;
    background-color: #77595d;
}

.hr {
    width: 100%;
    height: 2px;
    background-color: #605d5d;
}

.vl {
    border-left: 2px solid #605d5d;
    height: 115px;
}

/* ---------------------- elements with ID tags ------------------------------- */
#left-column {
    height: 1200px;
    width: 160px;
    background-color: #ffcccc;
    float: left;
}

#main-column {
    padding: 0;
    max-width: 100%;
}

#right-column {
    height: 1200px;
    max-width: 30px;
    vertical-align: top;
    margin-left: 0;
    margin-right: 0;
    float: right;
    padding: 0;
}

#ditchit {
    border-top-right-radius: 14px;
    border-bottom-right-radius: 14px;
    border-top-left-radius: 14px;
    border-bottom-left-radius: 14px;
    border: 2px solid #333000;
    text-align: center;
    background-color: #FFF2C1;
    margin: 0px auto;
    display: block;
    padding: 5px;
}

#ditchit .col-md-5 {
    max-width: 40%;
}

#parent div {
    background: #fff;
    display: flex;
    /*flex-grow: 20;*/
    border: 1px solid #000;
    width: 200%;
}

#parent2 div {
    background: #fff;
    display: flex;
    /*flex-grow: 20;*/
    border: 1px solid #000;
    width: 200px;
}

#main {
    width: 80%;
    margin: 0 auto;

}

#apDiv1 {
    /** left div **/
    position: absolute;
    /*margin-top:-75px;
    margin-left:40px;margin-right:auto;
    margin-bottom:auto;
    float:left;*/
    left: 50px;
    top: -70px;
    color: brown;
    font-size: 16px;
    font-weight: bold;
    background-color: #fcf6dd;
    min-width: 160px;
    text-align: center;
    border: 1px solid #000;
    border-radius: 14px;
    padding: 3px;
}

#apDiv2Left {
    /**  right div  **/
    position: relative;
    margin-top: -68px;
    margin-bottom: auto;
    float: right;
    color: brown;
    font-size: 14px;
    background-color: #b6e6fa;
    width: 180px;

    border-radius: 14px;
    text-align: left;
    height: 66px
}

#apDiv2Right {
    /**  right div  **/
    position: relative;
    margin-top: -65px;
    margin-bottom: auto;
    margin-right: 10px;
    margin-left: auto;
    color: brown;
    font-size: 14px;
    background-color: #b6e6fa;
    width: 155px;

    border-radius: 14px;
    text-align: left;
    height: 62px
}

#apDivRight {
    /**  right div  **/
    position: relative;
    margin-top: -65px;
    margin-bottom: auto;
    margin-right: 10px;
    margin-left: auto;
    color: brown;
    font-size: 14px;
    background-color: #b6e6fa;
    width: 155px;

    border-radius: 14px;
    text-align: left;
    height: 62px
}

#apDiv_Right {
    /**  right div  **/
    position: relative;
    margin-top: -65px;
    margin-bottom: auto;
    margin-right: 10px;
    margin-left: auto;
    color: brown;
    font-size: .7vw;
    background-color: #b6e6fa;
    width: 155px;

    border-radius: 14px;
    text-align: left;
    height: 62px
}

.topDiv {
    color: #333333;
}

@media screen and (max-width:760px) {
    #apDiv2 {
        color: brown;
        font-size: 12px;
        min-width: 200px;
    }
}

.apDivLeft {
    display: inline;
    float: left;
    background: #fcf6dd;
    height: 50px;
    text-align: center;
}
/*  **********  scroll to top  *********** */
#scroll {
    position:fixed;
    right:20px;
    bottom:40px;
    cursor:pointer;
    width:50px;
    height:50px;
    background-color:#3498db;
    text-indent:-9999px;
    display:none;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}
#scroll span {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-8px;
    margin-top:-12px;
    height:0;
    width:0;
    border:8px solid transparent;
    border-bottom-color:#ffffff
}
#scroll:hover {
    background-color:#e74c3c;
    opacity:1;
    filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}
   /*  ********************* */     