/* style.css */
/* version 1.0 */


/* handy notes */
/*    padding: a b c d;    */
/*                       top right bottom left     */
/*    padding: a b;    */
/*                       a = top + bottom     */
/*                       b = right + left     */


/* Custom Font Stuff */
/* http://code.adonline.id.au/safely-add-any-font-to-your-website/ */

@font-face {
 font-family: customfont1;
 src: url("fonts/font1.eot")
}
@font-face {
 font-family: customfont1;
 src: url("fonts/font1.TTF")
}



/* General TEXT BOX stuff */

.blur{
 background-color: #ccc; /*shadow color*/
 color: inherit;
}

.shadow,
.content{
 position: relative;
 bottom: 2px;
 right: 2px;
}

.shadow{
 background-color: #666; /*shadow color*/
 color: inherit;
}

.content{
 background-color: #B5CED9; /*bg color of content*/
 color: #000; /*text content*/
 border: 1px solid #000;
 padding: .5em 2ex;
 text-align:left;
}

.blocky { padding: 0 1.5em 0 1.5em; }
.blockynotop {
  padding: 0 0 0 1.5em;
  margin-top: -1em;
}
.blockytop { padding: 0 0 0 1.5em; }
.blockybottom {
 padding: 0 1.5em 0 1.5em;
 margin-bottom: 1em;
}
.blockygap { padding: 0 1.5em 0.1em 1.5em; }


/* MainPage stuff */


#lefthand {
 margin : 0 auto;
 float : left;
 width : 49%;
 text-align:center;
}

#righthand {
 margin : 0 auto;
 float : right;
 width : 50%;
 text-align:center;
}

#bottomsection {
 margin : 0 auto;
 margin-top : 1em;
 width : 100%;
 text-align:center;
 color: #000008;
 font-size: 12px;
 font-family: Arial;
}

#quotesleft {
 text-align: left;
 margin-top: 4em;
 margin-bottom: 2em;
 padding-left: 26px;
}

#quotesright {
 text-align: left;
 margin-top: 0em;
 margin-bottom: 2em;
 padding-left: 10px;
}


/* extra stylings for the above three containers */

.mainpage {
 padding : 1em 0;
 margin : 1em 2em;
}

#lefthand .mainpage { margin : 1em 1em 1em 2em; }
#righthand .mainpage { margin : 1em 2em 1em 1em; }

/* HEADER stuff */


#headermenucontainer {
 margin: auto;
 width:75%;
 margin-top: 1.1em;
 margin-bottom: 1em;
}

#header{
 background:url(images/header.jpg) no-repeat center;
 margin: -1em auto;
 margin-bottom: 0em;
}

#header .main {
 color:#000000;
 width:50%;
 margin: 0 auto;
 font-size: 24pt;
 font-family: customfont1, Arial;
}
#header .submain {
 color: #958989;
 width: 65%;
 margin: 0 auto;
 font-size: 12pt;
 font-family: Arial;
}

#menu {
 margin:0 auto;
 margin-top: 3px;
 float: left;
 position: relative;
 width:70%;
 color: #000076;
 background-color: #000076;
 opacity:0.9;
 border:2px solid;
 border-radius:15px;
 -moz-border-radius:15px;  /* Firefox 3.6 and earlier */
}

#toplinks { margin:5px auto; }
#toplinks ul { margin: -1px 0; padding: 0px 8px; }
#toplinks ul li { list-style:none; float:left; padding:0px 36px 8px 0px; }
#toplinks .unanswered { padding:0px 36px 8px 0px; }
#toplinks .astralplane { padding:0px 36px 8px 0px; }
#toplinks ul li a { text-decoration: none; }

#toplinks ul li a:hover, a:active{
 color: #C51B1B;
 padding:0px 5px 1px 5px;
 margin: 0px;
 border-color: red;
 border:1px solid;
 border-radius:25px;
 -moz-border-radius:25px;
}

#submenu {
 margin:0 auto;
 margin-top: 3px;
 margin-bottom: 3px;
 float: left;
 position: relative;
 width:340px;
 color: #000076;
 background-color: #000076;
 opacity:0.9;
 border:2px solid;
 border-radius:15px;
 -moz-border-radius:15px;  /* Firefox 3.6 and earlier */
 clear: both;
}

#submenu_toplinks { margin:5px auto; }
#submenu_toplinks ul { margin: -1px 0; padding: 0px 8px; }
#submenu_toplinks ul li { list-style:none; float:left; padding:0px 36px 8px 0px; }
#submenu_toplinks ul li a { text-decoration: none; }

#submenu_toplinks ul li a:hover, a:active{
 color: #C51B1B;
 padding:0px 5px 1px 5px;
 margin: 0px;
 border-color: red;
 border:1px solid;
 border-radius:25px;
 -moz-border-radius:25px;
}

#submenu_toplinks ul li {
 margin:0 auto;
 display:inline;
 width: 175px;
 margin-right: -1.5em;
}

#submenu ul li.submenu_truenature { display:inline; }
#submenu ul li.submenu_synch {
 display:inline;
 padding:0px 6px 8px 0px;
}

#submenu ul li.submenu_bees { display:none; }

a.menulink:link { color: #D3F1EF; }
a.menulink:visited { color: #D3F1EF; }


/* RESPONSIVE MENU */
/* 1920px == 24" screen, 1366px == 15" screen, 1280px == my standard desktop, 1024px == a desktop or ipad - landscape */
/* 980px == a tablet, 800px == my tablet in portrait view  */
/* 768px == ipad - portrait, 600px == samsung galaxy tab, or a phone  */


@media (width: 1920px) {
 #menu { width: 41%; }
 #toplinks .astralplane { padding:0px 0px 8px 0px; }
}
@media (width: 1366px) {
 #menu { width: 60%; }
 #toplinks .astralplane { padding:0px 0px 8px 0px; }
}
@media (width: 1280px) {
 #menu { width: 64%; }
 #toplinks .astralplane { padding:0px 0px 8px 0px; }
 #submenu { width:360px; }
}


@media (width: 1024px) {
 #menu { width: 79%; }
 #toplinks .astralplane { padding:0px 0px 8px 0px; }
}
@media (max-width: 1024px) {
 #menu { width: 79%; }
 #submenu { width:360px; }
}
@media (max-width: 980px) {
 #menu { width:95%; margin-bottom: 10px; }
}

@media (width: 800px) {
 #menu { width:85%; margin-bottom: 10px; }
 #toplinks .unanswered { padding:0px 0px 8px 0px; }
}

@media (width: 768px) {
 #menu { width: 78%; }
 #toplinks .unanswered { padding:0px 0px 8px 0px; }
 #butterflyquote { padding: 0px 25px; }
 hr.c3 { width: 20%; }
}


@media (max-width: 600px) {
 #toplinks ul li { width: 100%; padding:5px 30px 9px 0px; }
 #menu { width:182px; margin-bottom: 10px; }
 #header .main { margin-left: 5px; }
 #lefthand { margin : 0 auto; float : none; width : 100%; text-align:center; }
 #righthand { margin : 0 auto; margin-top: 2em; float : none; width : 100%; text-align:center; }
 #butterflyquote { padding: 0px 25px; }
 /* additional fixes to make it display better */
 blockquote { margin: 0; }
 blockquote.padleftonly { margin: 0; margin-top: -0.8em; margin-bottom: -0.25em; }
 blockquote.padleftonly1 { margin: 0; margin-top: -0.8em; margin-bottom: 0.5em; }
 blockquote.padleftonly2 { margin: 0; margin-top: -0.2em; margin-bottom: 0.75em; }
 ul { margin: 0; padding: 0; }
 ul li { margin: 0; padding: 0; }
 .blockychrist { padding: 0 0.25em 0 0.25em; }
 div.c1 { text-align: left; padding: 0; margin: 0 -1em; }
 .onlybreakifbigscreen { display: none; }
 ul.christbelieve { padding: 0; margin-left: 1.25em; }
 ul.christbelieve li { padding: 0; margin-left: 1.25em; }
 #hugh { width: 100%; }
 hr.c3 { width: 20%; }
}

@media (max-width: 480px) {
 #submenu { width:185px; }
 #submenu ul li { padding:5x 0px 13px 0px; }
 #submenu_toplinks ul li { padding-bottom: 15px; }
 #header .main { font-size: 22pt; width:70%; }
 /* additional fixes to make it display better */
 blockquote { margin: 0; }
 blockquote.padleftonly { margin: 0; margin-top: -0.8em; margin-bottom: -0.25em; }
 blockquote.padleftonly1 { margin: 0; display: inline; margin-top: -0.8em; margin-bottom: 0.5em; }
 blockquote.padleftonly2 { margin: 0; display: inline; margin-top: -0.2em; margin-bottom: 0.75em; }
 ul { margin: 0; padding: 0; }
 ul li { margin: 0; padding: 0; }
 .blockychrist { padding: 0 0.25em 0 0.25em; }
 div.c1 { text-align: left; padding: 0; margin: 0 -1em; }
 .onlybreakifbigscreen { display: none; }
 #hugh { width: 100%; }
 hr.c3 { width: 20%; }
}

/* REST */

body { background-image:url('images/newbackground.gif'); }

#footer{
 font-size:0.79em;
 text-align:center;
 margin:10px;
 margin-top: 2em;
 height:25px;
 line-height:25px;
}
#footer a { color:#000000; text-decoration: none; }

#contents {
 margin:50px 0;
 width:100%;
 padding-top: 1em;
 font-size: 10pt;
 font-family: Arial;
 clear: both;
}

h1 {
 font-size: 16pt;
 text-align: center;
 padding-bottom: 1em;
}

h2 {
 font-size: 1em;
 font-weight:bold;
}

h2.subphrase {
 padding-top: 0.5em;
 margin-bottom: -0.8em;
}

h3 {
 padding: 0em;
 font-size: 1.2em;
 font-weight: bold;
 font-family: Arial;
 color: #6c2448;
 letter-spacing: 5px;
}

h4 {
 font-size: 1em;
 font-weight:normal;
 display: inline;
}

hr.c2 {
 width: 80%;
 align: left;
 border-color: #547990;
}
hr.c3 {
 width: 80%;
 align: center;
 border-color: #547990;
}
hr.c4 {
 margin: 0.5em auto;
 margin-top: 1em;
 margin-bottom: 1em;
 size: 1px;
 width: 98%;
 align: center;
}
hr.c5 {
 margin-top: 2em;
 margin-bottom: 0.5em;
 size: 1px;
 width: 98%;
 align: left;
}
hr.c6 {
 margin-top: -1em;
 margin-bottom: -1em;
 size: 1px;
 align: center;
}
div.c1 { text-align: center; }
div.r1 { text-align: right; }
p.extraspace { margin-bottom: 2em; }
p.bold { font-weight: bold; }
p.halfbr { margin-top: -5px; }
div.up1 {
 margin-top: -0.4em;
}

#butterflyquote {
 padding: 0px 75px;
 margin-top: -0.5em;
 margin-bottom: 0.5em;
 text-align: center;
}
#butterflyquote1 {
 margin-bottom: 0.5em;
 text-align: right;
}

/* class to make images fit to size of the div */
.resize_fit_center {
 max-width:100%;
 max-height:100%;
 vertical-align: middle;
}
div.imgcontainer {
 margin: auto;
 width: 90%;
 padding: 5px 0px;
 align: center;
}



/* blockquote paddings */

blockquote.pad {
 margin-top: -0.5em;
 margin-bottom: 1em;
}

blockquote.padbooks {
 margin-top: -0.5em;
 margin-bottom: 0.5em;
}


/* my honeypot */
#birdsbees { display:none; }


/* hosting provider - stuff that goes in the footer */
#hostingprovider {
 margin: auto;
padding: 1em 0em;
}
