@charset "UTF-8";
/* CSS Document */

img, object, embed, video { max-width: 100%; }
/* IE 6 does not support max-width so default to width 100% */
.ie6 img { width:100%; }
body { font-family: Helvetica, Arial, sans-serif; background-color: #342e37; }
body, h1, h2, h3, h4, h5 { margin:0; padding:0; }
img { width:100%; }
audio { width:100%; }

.txt10 { font-size: 10px; }
.txt12 { font-size: 12px; }
.txt14 { font-size: 14px; }
.txt16 { font-size: 16px; }

.txtLeft, .textLeft { text-align:left; }
.txtRight { text-align:right; }
.txtCenter, .centerText { text-align:center; } 
.padTB10 { padding: 10px 0; } 
.padTB20 { padding: 20px 0; }
.clearB { clear:both; }
.caps { text-transform:capitalize; }
.item { margin-bottom: 15px; }

.wht, .whtBG { color: #FFFFFF; }
.whtBG { background-color: #FFFFFF; }
.Gold { color: #FF9600; }

a.noDeco, a.noDeco:visited, .noDecoButton, .noDecoButton:visited { text-decoration:none; color:#FF9600; }
a.noDecoBLK, a.noDecoBLK:visited { text-decoration:none; color:#000; }
a.noDecoBlue, a.noDecoBlue:visited { text-decoration:none; color:#09F; }
a.noDeco:hover, a.noDecoBlue:hover, .noDecoButton:hover { color:#0f0; }
a.noDecoBLK:hover, a.noDecoBLK:hover { color:#999; }

a.newsMAIL, a.newsMAIL:visited { text-decoration: none; color: #ccc; }
a.newsMAIL:hover { text-decoration: none; color: #999; }

.rounded_corners {
	-moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

.rounded_corners10 {
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
}

.rounded_corners5 {
	-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
}

#thePage  { width: 100%; margin: 0; padding: 0; }
#thePage a, #thePage a:visited { text-decoration:none; color:#555577; }
#thePage a:hover { color:#000; }
#thePage i { font-size: 1.5em; vertical-align: middle; }

img.turn2grayIMG {
  filter: none;
  cursor: grab;
  cursor: -webkit-grab;
  -webkit-filter: grayscale(0%);
}
img.turn2grayIMG:hover, img.makeIMGgray {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'https://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
} 
    
header { min-height: 50px; }

#headDisplay { width: 90%; margin: 0 0 0 5%; }
#headDisplay .home { display: none; }
#headDisplay .menu { float: none; font-size: 16px; width: 98%; margin: 12px 0 0 0; text-align: center; }
#headDisplay a, #headDisplay a:visited,
#footerDisplay a, #footerDisplay a:visited { color: #FF9600; text-decoration: none; }
#headDisplay a:hover, #headDisplay .home a:hover, #footerDisplay a:hover { color: #00FF00; }
    
/* MAIN */
main { min-height: 300px; background-color: #FFFFFF; }
#mainDisplay { width: 98%; margin: 20px 0 20px 1%; background-color: #FFF; }
#mainDisplay .newsMAIL { width: 98%; min-height: 500px; margin-left: 1%; background-color: #fff; }

#float1stIMG { width: 100%; margin: 0; padding: 0; display: inline-block; }
#float1stIMG h1 { text-align: left; font-size: 1.5em; }
#float1stIMG h3 { text-align: left; font-size: 1.25em; }
#float1stIMG .the1stIMG { float: none; width: 50%; margin: 0 0 10px 25%; vertical-align: top; display: inline-block; }
#float1stIMG .the1stTXT { float: none; width: 90%; margin: 0 0 0 5%; vertical-align: top; display: inline-block; }

#podcastBOX { background-color: #FF9600; padding: 10px 0; }
#podcastBOX h1 { margin: 0; padding: 0; }
#podcastBOX .img { margin: 10px 0; }

/* Show / No Show Div etc. #1 (>0<) iPhone #2 (0) iPad #3 (0) Computer */
.show001, .showWebOnly { display:none; }
.show100 { display:block; }
.show101 { display:block; }
.show010 { display:none; }
.show011 { display:none; }
.show110 { display:block; }
    
#footerDisplay { color: #FFFFFF; width: 90%; margin: 0 0 0 5%; }

/* Start Footer */
#footerDisplay .left, #footerDisplay .right {
    float: none;
    margin: 20px 0 0 5%;
    width: 90%;
    display: block;
}
#footerDisplay .left { text-align:center; } 
#footerDisplay .right { text-align: center; }

/* Float Boxs web 3 pad 2 Phone 1 */
.box211, .box221, .box311, .box321, .box221podT10, .box421, .box531, .box631, .box731 {
    width:98%;
    margin:0 0 15px 0.5%;;
    vertical-align: text-top;
    display:inline-block;
}
.box632 {
    width:47%;
    margin:0 0 15px 0.5%;;
    vertical-align: text-top;
    display:inline-block;
}
#videoONpage .onLeft, #videoONpage .onRight,
#imageONpage .onLeft, #imageONpage .onRight {
	clear:both;
	float:none;
	margin:0 0 15px 1%;
	width:98%;
	display:block;
}
/* Share Buttons */
#shareButtonBox1 img, #shareButtonBox2 img, #shareButtonBox3 img { width:32px; height:32px; margin:3px 0; }
#shareButtonBox1 .addMoreShare, #shareButtonBox2 .addMoreShare, #shareButtonBox3 .addMoreShare { background-color:#8f00a0; }
#shareButtonBox2 .addMoreShare:hover, #shareButtonBox3 .addMoreShare:hover { background-color:#333; }
#shareButtonBox2 { position: fixed; margin:0 6% 25px 6%; padding:7px 0; text-align:center; background-color:#DDD; bottom: 0; width: 88%; z-index:8; -moz-border-radius: 20px 20px 20px 20px; -webkit-border-radius: 20px 20px 20px 20px; -khtml-border-radius: 20px 20px 20px 20px; border-radius: 20px 20px 20px 20px; display:block; }
#shareButtonBox1, #shareButtonBox3 { display:none; }

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) {/* Show / No Show Div etc. #1 (0) iPhone #2 (>0<) iPad #3 (0) Computer */
    
    /* MAIN */
    main { min-height: 500px; background-color: #FFFFFF; }
    #float1stIMG h1 { text-align: left; font-size: 1.8em; }
    #float1stIMG .the1stIMG { float: none; width: 80%; margin: 25px 0 10px 10%; vertical-align: top; display: inline-block; }
    
    .show001, .showWebOnly { display:none; }
    .show100 { display:none; }
    .show101 { display:none; }
    .show010 { display:block; }
    .show011 { display:block; }
    .show110 { display:block; }

    /* Float Boxs web 3 pad 2 Phone 1 */
    .box221, .box321, .box421 { width:47.5%; }
    .box211, .box221podT10, .box311 {
        width:98.5%;
        margin:0 0 15px 0.5%;
        vertical-align: text-top;
        display:inline-block;
    }
    .box531, .box631, .box632, .box731 { width:32%; }
    
    /* Share Buttons */
    #shareButtonBox1 { display:block; margin-bottom:10px; }
    #shareButtonBox2, #shareButtonBox3 { display:none; }
    
}


/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */ 
@media only screen and (min-width: 769px) {

        #headDisplay { width: 90%; margin: 0 0 0 5%; }
        #headDisplay .home { float: left; width: 48%; margin: 0 1% 0 0; text-align: left; display: inline-block; }
        #headDisplay .menu { float: right; width: 48%; margin: 12px 0 0 0; text-align: right; }
        #headDisplay .home a, #headDisplay .home a:visited { font-size:48px; margin: 1px; }
        #headDisplay a, #headDisplay a:visited,
        #headDisplay .home a, #headDisplay .home a:visited,
        #footerDisplay a, #footerDisplay a:visited { color: #FF9600; text-decoration: none; }
        #headDisplay a:hover, #headDisplay .home a:hover, #footerDisplay a:hover { color: #00FF00; }
    
        /* MAIN */
        main { min-height: 700px; background-color: #FFFFFF; }
        #mainDisplay { width: 90%; margin: 20px 0 20px 5%; background-color: #FFF; }
        #mainDisplay .newsMAIL { width: 60%; min-height: 600px; margin: 0 0 0 20%; background-color: #FFF; }
    
        #float1stIMG h1 { text-align: left; font-size: 2em; }
        #float1stIMG { text-align: left; font-size: 1.25em; }
        #float1stIMG h3 { text-align: left; font-size: 1.5em; }
        #float1stIMG .the1stIMG { width: 20%; margin: 0 10px 15px 0; float: left; vertical-align: top; display: inline-block; }
        #float1stIMG .the1stTXT { float: left; width: 78%; margin: 0 0 0 1%; vertical-align: top; display: inline-block; }


        /* Show / No Show Div etc. #1 (0) iPhone #2 (0) iPad #3 (>0<) Computer */
        .show001, .showWebOnly { display:block; }
        .show100 { display:none; }
        .show101 { display:block; }
        .show010 { display:none; }
        .show011 { display:block; }
        .show110 { display:none; }
    
        /* Start Footer */
        #footerDisplay .left, #footerDisplay .right {
	        float: left;
	        margin: 20px 4%;
	        width: 42%;
	        display: block;
        }
        #footerDisplay .left { text-align:left; } 
        #footerDisplay .right { text-align: right; }

        /* Float Boxs web 3 pad 2 Phone 1 */
        .box211, .box221, .box221podT10 { width:48.5%; }
        .box311, .box321 { width:32%; }
        .box421 { width:24%; }
        .box531 { width:19%; }
        .box631, .box632 { width:15%; }
        .box731 { width:13%; }
    
        

        #videoONpage .onLeft,
        #imageONpage .onLeft {
            clear:none;
            float:left;
            margin:0;
            width:49%;
            display:block;
        }

        #videoONpage .onRight,
        #imageONpage .onRight {
            clear:none;
            float:right;
            margin:0;
            width:49%;
            display:block;
        }
    
        /* Share Buttons */
        #shareButtonBox1, #shareButtonBox2 { display:none; }
        #shareButtonBox3 { position: fixed; margin:25px 10px; padding:7px 0; text-align:center; background-color:transparent; top:335px; left: 10px; width: 40px; z-index:300; display:block; }

}