/* =============================================================================

  CoreBasic CSS framework by John Pirrie
  Updated 13 May 2015

============================================================================= */

/*========================== NORMALIZE =============================*/
/*Removed - put back as needed */

/*========================== /NORMALIZE =============================*/

@import url(//fonts.googleapis.com/css?family=Titillium+Web:400,600);



/*=============================== CORE ===============================*/
* { margin: 0; padding: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } /* Note - box sizing does not work with min or max width/height */
html { overflow: auto; }
div { width:100%; overflow:hidden; position:relative; }
.auto {width: auto !important;} /* undo 100% width */
table {	border-collapse: collapse; border-spacing: 0; }
.panel { margin: 0 auto; width:1000px; } /* 1000 is default width */

._1, ._2, ._3, ._4, ._5, ._6, ._7, ._8, ._10, ._16, ._20, ._30, ._33, ._40, ._60, ._66, .custom > div { float:left; overflow:hidden; margin:0; display:inline-block;}
._1 { width:12.5%;} ._2 { width:25%;} ._3 { width:37.5%;} ._4 { width:50%;} ._5 { width:62.5%;} ._6 { width:75%;} ._7 { width:87.5%;} ._8 { width:100%;} .auto { width:auto;}
._10 {width:10%;} ._16 {width:16.6667%;} ._20 {width:20%;} ._30 { width:30%;} ._33 { width:33.3334%;} ._40 { width:40%;} ._60 { width:60%;} ._66 { width:66.6667%;}
.floatL { float:left; } .floatR { float:right; } .floatC{ clear:both; margin:0 auto;} .textL { text-align: left; } .textR { text-align: right; } .textC { text-align: center; } /* Text align only works on block containers. add float to image tags instead */
.vertT, .vertB, .vertC, .vertM {position:relative;} .vertT { top:0;} .vertB { bottom:0; } .vertC, .vertM { top:50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);}
.absT, .absB, .absL, .absR {display:block; position:absolute;} .absT {top:0;} .absB {bottom:0;} .absL {left:0;} .absR {right:0;}
.hide, .hidden { display:none; } .show{ display:inline; }
/* .hide {display:none;} .show {display:inline-block;} .fGap{ width:100% !important; margin-left:0 !important; } */
@media only screen and (max-width: 1000px) {
.fFloatL { float:left !important; } .fFloatR { float:right !important; } .fFloatC{ clear:both; } .fTextL { text-align: left !important; } .fTextR { text-align: right !important; } .fTextC { text-align: center !important; }
.f1 { width:12.5% !important;} .f2 { width:25% !important;} .f3 { width:37.5% !important;} .f4 { width:50% !important;} .f5 { width:62.5% !important;} .f6 { width:75% !important;} .f7 { width:87.5% !important;} .f8, .f, .panel { width:100% !important;}
.f16 {width:16.6667% !important;} .f20 {width:20% !important;}  .f33 { width:33.3334% !important; } .f66 { width:66.6667% !important; }
.fAll > div { width:100% !important;} .fHide {display:none;} .fHideI {display:none !important;} .fShow {display:inline-block;} .fGap{ width:100% !important; margin-left:0 !important; }
div .fPad0 { padding: 0px !important; } div .fPadT0 { padding-top: 0px !important; } div .fPadB0 { padding-bottom: 0px !important; } div .fPadL0 { padding-left: 0px !important; } div .fPadR0 { padding-right: 0px !important; } div .fPadV0 { padding-top: 0px !important; padding-bottom: 0px !important; } div .fPadH0 { padding-left: 0px !important; padding-right: 0px !important; }
div .fMar0 { margin: 0px !important; } div .fMarT0 { margin-top: 0px !important; } div .fMarB0 { margin-bottom: 0px !important; } div .fMarL0 { margin-left: 0px !important; } div .fMarR0 { margin-right: 0px !important; } div .fMarV0 { margin-top: 0px !important; margin-bottom: 0px !important; } div .fMarH0 { margin-left: 0px !important; margin-right: 0px !important; }
}
@media only screen and (max-width: 820px) {
.tFloatL { float:left !important; } .tFloatR { float:right !important; } .tFloatC{ clear:both; } .tTextL { text-align: left !important; } .tTextR { text-align: right !important; } .tTextC { text-align: center !important; }
.t1 { width:12.5% !important;} .t2 { width:25% !important;} .t3 { width:37.5% !important;} .t4 { width:50% !important;} .t5 { width:62.5% !important;} .t6 { width:75% !important;} .t7 { width:87.5% !important;} .t8, .t, .panel { width:100% !important;}
.t16 {width:16.6667% !important;} .t20 {width:20% !important;} .t33 { width:33.3334% !important; } .t66 { width:66.6667% !important; }
.tAll > div { width:100% !important;} .tHide {display:none;} .tHideI {display:none !important;} .tShow {display:inline-block;} .tGap{ width:100% !important; margin-left:0 !important; }
div .tPad0 { padding: 0px !important; } div .tPadT0 { padding-top: 0px !important; } div .tPadB0 { padding-bottom: 0px !important; } div .tPadL0 { padding-left: 0px !important; } div .tPadR0 { padding-right: 0px !important; } div .tPadV0 { padding-top: 0px !important; padding-bottom: 0px !important; } div .tPadH0 { padding-left: 0px !important; padding-right: 0px !important; }
div .tMar0 { margin: 0px !important; } div .tMarT0 { margin-top: 0px !important; } div .tMarB0 { margin-bottom: 0px !important; } div .tMarL0 { margin-left: 0px !important; } div .tMarR0 { margin-right: 0px !important; } div .tMarV0 { margin-top: 0px !important; margin-bottom: 0px !important; } div .tMarH0 { margin-left: 0px !important; margin-right: 0px !important; }

}
@media only screen and (max-width: 599px) {
.mFloatL { float:left !important; } .mFloatR { float:right !important; } .mFloatC{ clear:both; } .mTextL { text-align: left !important; } .mTextR { text-align: right !important; } .mTextC { text-align: center !important; }
.m1 { width:12.5% !important;} .m2 { width:25% !important;} .m3 { width:37.5% !important;} .m4 { width:50% !important;} .m5 { width:62.5% !important;} .m6 { width:75% !important;} .m7 { width:87.5% !important;} .m8, .m { width:100% !important;}
.m16 {width:16.6667% !important;} .m20 {width:20% !important;} .m33 { width:33.3334% !important; } .m66 { width:66.6667% !important; }
.mAll > div { width:100% !important;} .mHide {display:none;} .mHideI {display:none !important;} .mShow {display:inline-block;} .mGap{ width:100% !important; margin-left:0 !important; }
div .mPad0 { padding: 0px !important; } div .mPad10 { padding: 10px !important; } div .mPadT0 { padding-top: 0px !important; } div .mPadB0 { padding-bottom: 0px !important; } div .mPadL0 { padding-left: 0px !important; } div .mPadR0 { padding-right: 0px !important; } div .mPadV0 { padding-top: 0px !important; padding-bottom: 0px !important; } div .mPadH0 { padding-left: 0px !important; padding-right: 0px !important; }
div .mMar0 { margin: 0px !important; } div .mMarT0 { margin-top: 0px !important; } div .mMarB0 { margin-bottom: 0px !important; } div .mMarL0 { margin-left: 0px !important; } div .mMarR0 { margin-right: 0px !important; } div .mMarV0 { margin-top: 0px !important; margin-bottom: 0px !important; } div .mMarH0 { margin-left: 0px !important; margin-right: 0px !important; }

}
/* Default gap spacing options - use only on parent of numbered divs */
.gap0-5 { width:101% !important; margin-left:-0.5% !important; } .gap1 > div { padding-left: 0.5% !important; padding-right: 0.5% !important; } /* 5/10px on 1000px panel */
.gap1 { width:102% !important; margin-left:-1% !important; } .gap1 > div { padding-left: 1% !important; padding-right: 1% !important; } /* 10/20px on 1000px panel */
.gap1-5, .gap { width:103% !important; margin-left:-1.5% !important; } .gap1-5 > div, .gap > div { padding-left: 1.5% !important; padding-right: 1.5% !important; } /* 15px/30px on 1000px panel DEFAULT */
.gap2 { width:104% !important; margin-left:-2% !important; } .gap2 > div { padding-left: 2% !important; padding-right: 2% !important; } /* 20/40px on 1000px panel */
.gap3 { width:106% !important; margin-left:-3% !important; } .gap3 > div { padding-left: 3% !important; padding-right: 3% !important; } /* 30/60px on 1000px panel */
.gap4 { width:108% !important; margin-left:-4% !important; } .gap4 > div { padding-left: 4% !important; padding-right: 4% !important; } /* 40/80px on 1000px panel - Do you really need more??? */

.pad0 { padding: 0px !important; } .padT0 { padding-top: 0px !important; } .padB0 { padding-bottom: 0px !important; } .padL0 { padding-left: 0px !important; } .padR0 { padding-right: 0px !important; } .padV0 { padding-top: 0px !important; padding-bottom: 0px !important; } .padH0 { padding-left: 0px !important; padding-right: 0px !important; }
.pad10 { padding: 10px !important; } .padT10 { padding-top: 10px !important; } .padB10 { padding-bottom: 10px !important; } .padL10 { padding-left: 10px !important; } .padR10 { padding-right: 10px !important; } .padV10 { padding-top: 10px; padding-bottom: 10px !important; } .padH10 { padding-left: 10px; padding-right: 10px !important; }
.pad20 { padding: 20px !important; } .padT20 { padding-top: 20px !important; } .padB20 { padding-bottom: 20px !important; } .padL20 { padding-left: 20px !important; } .padR20 { padding-right: 20px !important; } .padV20 { padding-top: 20px; padding-bottom: 20px !important; } .padH20 { padding-left: 20px; padding-right: 20px !important; }
.pad30 { padding: 30px !important; } .padT30 { padding-top: 30px !important; } .padB30 { padding-bottom: 30px !important; } .padL30 { padding-left: 30px !important; } .padR30 { padding-right: 30px !important; } .padV30 { padding-top: 30px; padding-bottom: 30px !important; } .padH30 { padding-left: 30px; padding-right: 30px !important; }
.pad40 { padding: 40px !important; } .padT40 { padding-top: 40px !important; } .padB40 { padding-bottom: 40px !important; } .padL40 { padding-left: 40px !important; } .padR40 { padding-right: 40px !important; } .padV40 { padding-top: 40px; padding-bottom: 40px !important; } .padH40 { padding-left: 40px; padding-right: 40px !important; }
.pad0-5 { padding: 0.5% !important; } .padT0-5 { padding-top: 0.5% !important; } .padB0-5 { padding-bottom: 0.5% !important; } .padL0-5 { padding-left: 0.5% !important; } .padR0-5 { padding-right: 0.5% !important; } .padV0-5 { padding-top: 0.5%; padding-bottom: 0.5% !important; } .padH0-5 { padding-left: 0.5%; padding-right: 0.5% !important; }
.pad1 { padding: 1% !important; } .padT1 { padding-top: 1% !important; } .padB1 { padding-bottom: 1% !important; } .padL1 { padding-left: 1% !important; } .padR1 { padding-right: 1% !important; } .padV1 { padding-top: 1%; padding-bottom: 1% !important; } .padH1 { padding-left: 1%; padding-right: 1% !important; }
.pad1-5, .pad { padding: 1.5% !important; } .padT1-5, .padT { padding-top: 1.5% !important; } .padB1-5, .padB { padding-bottom: 1.5% !important; } .padL1-5, .padL { padding-left: 1.5% !important; } .padR1-5, .padR { padding-right: 1.5% !important; } .padV1-5, .padV { padding-top: 1.5%; padding-bottom: 1.5% !important; } .padH1-5, .padH { padding-left: 1.5%; padding-right: 1.5% !important; }
.pad2 { padding: 2% !important; } .padT2 { padding-top: 2% !important; } .padB2 { padding-bottom: 2% !important; } .padL2 { padding-left: 2% !important; } .padR2 { padding-right: 2% !important; } .padV2 { padding-top: 2%; padding-bottom: 2% !important; } .padH2 { padding-left: 2%; padding-right: 2% !important; }
.pad4 { padding: 4% !important; } .padT4 { padding-top: 4% !important; } .padB4 { padding-bottom: 4% !important; } .padL4 { padding-left: 4% !important; } .padR4 { padding-right: 4% !important; } .padV4 { padding-top: 4%; padding-bottom: 4% !important; } .padH4 { padding-left: 4%; padding-right: 4% !important; }
.pad8 { padding: 8% !important; } .padT8 { padding-top: 8% !important; } .padB8 { padding-bottom: 8% !important; } .padL8 { padding-left: 8% !important; } .padR8 { padding-right: 8% !important; } .padV8 { padding-top: 8%; padding-bottom: 8% !important; } .padH8 { padding-left: 8%; padding-right: 8% !important; }
.mar0 { margin: 0px !important; } .marT0 { margin-top: 0px !important; } .marB0 { margin-bottom: 0px !important; } .marL0 { margin-left: 0px !important; } .marR0 { margin-right: 0px !important; } .marV0 { margin-top: 0px !important; margin-bottom: 0px !important; } .marH0 { margin-left: 0px !important; margin-right: 0px !important; }
.mar10 { margin: 10px !important; } .marT10 { margin-top: 10px !important; } .marB10 { margin-bottom: 10px !important; } .marL10 { margin-left: 10px !important; } .marR10 { margin-right: 10px !important; } .marV10 { margin-top: 10px; margin-bottom: 10px !important; } .marH10 { margin-left: 10px; margin-right: 10px !important; }
.mar20 { margin: 20px !important; } .marT20 { margin-top: 20px !important; } .marB20 { margin-bottom: 20px !important; } .marL20 { margin-left: 20px !important; } .marR20 { margin-right: 20px !important; } .marV20 { margin-top: 20px; margin-bottom: 20px !important; } .marH20 { margin-left: 20px; margin-right: 20px !important; }
.mar30 { margin: 30px !important; } .marT30 { margin-top: 30px !important; } .marB30 { margin-bottom: 30px !important; } .marL30 { margin-left: 30px !important; } .marR30 { margin-right: 30px !important; } .marV30 { margin-top: 30px; margin-bottom: 30px !important; } .marH30 { margin-left: 30px; margin-right: 30px !important; }
.mar40 { margin: 40px !important; } .marT40 { margin-top: 40px !important; } .marB40 { margin-bottom: 40px !important; } .marL40 { margin-left: 40px !important; } .marR40 { margin-right: 40px !important; } .marV40 { margin-top: 40px; margin-bottom: 40px !important; } .marH40 { margin-left: 40px; margin-right: 40px !important; }
.mar0-5 { margin: 0.5% !important; } .marT0-5 { margin-top: 0.5% !important; } .marB0-5 { margin-bottom: 0.5% !important; } .marL0-5 { margin-left: 0.5% !important; } .marR0-5 { margin-right: 0.5% !important; } .marV0-5 { margin-top: 0.5%; margin-bottom: 0.5% !important; } .marH0-5 { margin-left: 0.5%; margin-right: 0.5% !important; }
.mar1 { margin: 1% !important; } .marT1 { margin-top: 1% !important; } .marB1 { margin-bottom: 1% !important; } .marL1 { margin-left: 1% !important; } .marR1 { margin-right: 1% !important; } .marV1 { margin-top: 1%; margin-bottom: 1% !important; } .marH1 { margin-left: 1%; margin-right: 1% !important; }
.mar1-5, .mar { margin: 1.5% !important; } .marT1-5, .marT { margin-top: 1.5% !important; } .marB1-5, .marB { margin-bottom: 1.5% !important; } .marL1-5, .marL { margin-left: 1.5% !important; } .marR1-5, .marR { margin-right: 1.5% !important; } .marV1-5, .marV { margin-top: 1.5%; margin-bottom: 1.5% !important; } .marH1-5, .marH { margin-left: 1.5%; margin-right: 1.5% !important; }
.mar2 { margin: 2% !important; } .marT2 { margin-top: 2% !important; } .marB2 { margin-bottom: 2% !important; } .marL2 { margin-left: 2% !important; } .marR2 { margin-right: 2% !important; } .marV2 { margin-top: 2%; margin-bottom: 2% !important; } .marH2 { margin-left: 2%; margin-right: 2% !important; }
.mar4 { margin: 4% !important; } .marT4 { margin-top: 4% !important; } .marB4 { margin-bottom: 4% !important; } .marL4 { margin-left: 4% !important; } .marR4 { margin-right: 4% !important; } .marV4 { margin-top: 4%; margin-bottom: 4% !important; } .marH4 { margin-left: 4%; margin-right: 4% !important; }
.mar8 { margin: 8% !important; } .marT8 { margin-top: 8% !important; } .marB8 { margin-bottom: 8% !important; } .marL8 { margin-left: 8% !important; } .marR8 { margin-right: 8% !important; } .marV8 { margin-top: 8%; margin-bottom: 8% !important; } .marH8 { margin-left: 8%; margin-right: 8% !important; }
.zero { padding: 0px !important; margin: 0px !important; }

/* Default styling */
small, .small, big, .big { line-height: 140%; text-decoration: none; }
h1, .h1 { font-size: 62px; line-height: 120%; margin: 76px 0 16px 0; } /* ratio set as: header font-size + 14px = above margin, standard paragraph font-size = below margin */
h2, .h2 { font-size: 50px; line-height: 120%; margin: 64px 0 16px 0; }
h3, .h3 { font-size: 42px; line-height: 120%; margin: 56px 0 16px 0; }
h4, .h4 { font-size: 30px; line-height: 120%; margin: 44px 0 16px 0; }
h5, .h5 { font-size: 24px; line-height: 120%; margin: 38px 0 16px 0; }
h6, .h6 { font-size: 16px; line-height: 120%; margin: 30px 0 16px 0; }
p, .p { margin-bottom:14px;}
small, .small { font-size: 10px; } big, .big { font-size: 24px; }
b, strong, .b, .strong { font-weight:600 !important; } .unStrong, .weak { font-weight: normal; } .ul, .underLine {text-decoration:underline;} .i { font-style:italic; } hr { height: 1px; color: #959595; margin: 2em 0; }
.noTextDec { text-decoration: none !important; } .upperCase { text-transform: uppercase; }
.table { display: table; } .cell { display: table-cell; text-align: center; vertical-align: middle; } /* vertically & horiz center something. needs 'table' as parent */

ul {list-style-type: none;} .list li {list-style-type: disc; margin-left:17px;}
li {clear:both;}
input, textarea, select, .radioGroup {box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; float:right; margin:10px 0; padding:0px 5px 0; width:60%; height:35px; border: 1px solid #CCCCCC; font-family: inherit; font-size: inherit;}
input:focus, select:focus, textarea:focus, button:focus { outline-width:0px !important; border:1px solid #000000; }
.radioGroup {border: 0; margin:0 0 10px 0; padding:0; text-align:right;}
.radio {margin:0; padding:5px;}
input[type=radio] { float:right; height:20px; width:20px; margin:0 10px; border: 0px !important;}
input[type=submit] { padding-top:5px; padding-bottom:5px; border: 1px solid #000000; font-size: 11.5px; font-size: 1.15em; width:90%;}
label {float:left; margin:12px 0;}
.listNotes, .button  { float:left; text-align:right; clear:none; width:50%;}
.listNotes { margin-top:18px; padding-right:5px;} 

/*=============================== /CORE ==============================*/

/*========================== THEME: DROID =============================*/


/*html { font-family: 'Titillium Web', sans-serif; font-size: 16px; line-height:140%; color:#252525; background-color:#F9F9F9; }
*/
/* INSTRUCTIONS
 <div class="panel"> optional "grandparent of numbered divs", use to center and limit width of parent div (center panel for example) default width is 1000
  <div class="gap2 tAll custom"> Always 100%, is parent container. Place 'gap' (spacing between) and 'mAll|tAll' (force all to pop on tablet or mobile break points) declarations here. 'custom' lets children be custom set % based width.
    <div class="_4 _t"> all add upto 8, 'f|t|m|t1|m1' rules to kick in at breakpoints. *can make own widths instead of numbers - must have 'custom' in parent div.
    (closing tags omitted)


NOTE - with gap, you need to put another div inside the "_8" div and style that. As it uses padding, not margin, the "_8" grows outside of parent.
*/










.debug1 { background-color: #F5F5F5; } .debug2 { background-color: #959595; } .debug3 { background-color: #757575; } .debug4 { background-color: #555555; } .debug5 { background-color: #353535; }