/*------------------------------------------------------------------------------
CLEAR THE DECKS
------------------------------------------------------------------------------
html,body, div, span, ul, ol, li, form, label, table, h1, h2, h3, h4, h5, h6, p, a, img  {
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
a img,:link img,:visited img { border: 0 }
table{ border-collapse: collapse; border-spacing: 0; width: 100% }
td, th, caption { padding: 2px 4px }
h1, h2, h3, h4, h5, h6, p { font-weight: normal; }
h1, h2, h3, h4, h5, h6 { word-spacing: 0.25px; }
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	/*font-weight: inherit; */
	/*font-style: inherit; */
	font-size: 100%;
	/*font-family: inherit;*/
	vertical-align: baseline;
}
sup {
   vertical-align: super;
   font-size: smaller;
}
sub {
   vertical-align: sub;
   font-size: smaller;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
     margin: 0 0 6px 14px;
     padding: 0;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/*------------------------------------------------------------------------------
HIGHSITE HTML PREFERENCES
------------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
     margin: 1em 0pt .3em 0;
}
p {
   margin: 0 0 .6em 0;
}

h1, h2, h3, h4 {
	letter-spacing: -.02em;
}
h1, h2, h3, h4, h5, h6 { word-spacing: 0.25px; }
p , li, td {
   line-height: 150%;
}

h1 { font-size: 21px; font-family: georgia, serif; color: #bf0022; }

h2 { font-size: 21px; font-family: georgia, serif; color: #00768e; }

h3 { font-size: 16px; font-family: georgia, serif; color: #bf0022; }

h4 { font-size: 16px; font-family: georgia, serif; color: #00768e; }

h5 { font-size: 14px; font-family: georgia, serif; color: #000000; }

h6 { font-size: 14px; font-family: georgia, serif; color: #00768e; }

p, li, td, th { font-size: 14px; font-family: georgia, serif; color: #444444; }

a { font-family: georgia, serif; }

/*------------------------------------------------------------------------------
SITE-WIDE HTML
------------------------------------------------------------------------------*/
body {
	margin: 0;
	background: #000;
}

a { text-decoration: none; }
a:link { color: #3656f8; }
a:visited { color: #999; }
a:hover { color: #7597f7; }
a:active { color: #7597f7; }

/*
green: #739e25
yellow: #fdb714
orange: #ff6611
red: #bf0022
purple: #72357f
turquoise: #00768e
blue: #314189
*/
/*------------------------------------------------------------------------------
HIGHSITE ONLY
------------------------------------------------------------------------------*/
.error_page h1 { margin: 40px 0 10px 40px; }
.error_page p { margin: 10px 40px; }

a.edit_link {
	color: #c00;
	font-size: 9px;
	text-decoration: none;
	padding: 1px 2px;
}
a.edit_link:hover {
	text-decoration: underline;
	color: #c00;
}

.multidiv { /* for separating multiple sections */
	position: relative;
	margin: 0 0 20px 0;
	border-bottom: 2px dotted #999;
	padding-bottom: 20px;
}

/*------------------------------------------------------------------------------
SITE-WIDE DIVS
------------------------------------------------------------------------------*/
.container {
	position: relative;
	margin: 0 auto;
	max-width: 1000px;
  overflow: auto;
}

header, section, nav {
  width: 100%
  min-height: 20px;
}
header {
  height: 100px;
	margin-bottom: 50px;
	width: 100%;
	box-sizing: border-box;
}

header img {
  float: right;
  margin-top: 20px;
	margin-right: 15%;
	max-width: 100%!important;
	height: auto!important;
}
@media (max-width: 690px) {
	header {
		padding: 20px 30px;
	}
	header img {
		margin: 0;
	}
}
@media (max-width: 550px) {
	header {
		height: 75px;
	}
}
@media (max-width: 425px) {
	header {
		height: 50px;
	}
}

footer {
   margin: 10px auto;
   overflow: auto;
   position: relative;
   text-align: center;
   width: 100%;
}
footer p {
   color: #999
}


/*------------------------------------------------------------------------------
DIVS -- HOME
------------------------------------------------------------------------------*/
.nav1, .nav2, .nav3, .nav4, .nav5, .nav6, .nav7, .nav8, .nav9 {
  position: relative;
  width: 100%;
  margin: 0 0 10px 0;
	box-sizing: border-box;
}

.nav1  img {
   width: 220px;
}
.nav2  img {
   width: 180px;
}
.nav4 img {
   width: 300px;
}
.nav5 img {
   width: 130px;
}
.nav6 img {
   width: 320px;
}
.nav7 img {
   width: 280px;
}

.nav1 p, .nav2 p, .nav3 p, .nav4 p, .nav5 p, .nav6 p, .nav7 p, .nav8 p, .nav9 p {
   display: none;
   position: absolute;
   bottom: 0px;
   color: #fff;
   line-height: 120%
}

.home section {
	min-height: 900px;
	width: 100%;
	position: relative;
}
.top_wrapper {
	width: 100%;
	min-height: 400px;
	box-sizing: border-box;
}
.slide_show {
	float: left;
	width: 60%;
	box-sizing: border-box;
	position: relative;
}
#rotator_div {
	width: 100%!important;
    overflow: hidden;
    max-height: 400px;
}
#rotator_div img {
	width: 100%!important;
	height: auto!important;
}
.welcome {
	width: 40%;
	box-sizing: border-box;
	margin: 0pt 0pt 15px;
	position: absolute;
	right: 0;
	padding: 30px 20px;
}
@media (max-width: 910px) {
	.slide_show {
		width: 100%;
		float: none;
	}
	#rotator_div {
		width: 600px!important;
		margin: 0 auto;
		min-height: 400px;
	}
	.welcome {
		width: 100%;
		display: block;
		position: relative;
		padding: 30px 100px;
	}
	.welcome:after {
		content:'';
		clear: both;
		display: block;
	}
}
@media (max-width: 700px) {
    #rotator_div {
        height: auto;
    }
	.welcome {
	padding: 30px 50px;
	}
}
@media (max-width: 450px) {
	.welcome {
	padding: 30px 10px;
	}
}
@media (max-width: 600px) {
	#rotator_div {
		width: 100%!important;
	}
}

.welcome p {
		color: #CCCCCC;
		font-size: 14px;
		line-height: 20px;
}
.bottom_wrapper {
	width: 100%;
	height: auto;
	box-sizing: border-box;
}
@media (max-width: 1000px) {
	.bottom_wrapper, .top_wrapper {
		padding: 0 30px;
	}
}

   .left_column {
      float: left;
      width: 250px;
      margin: 15px 0 0 0;
   }

      .nav1 {
           background: none repeat scroll 0% 0% #BF0022;
           height: 100px;
      }

      .nav2 {
           background: none repeat scroll 0% 0% #FDB714;
           height: 120px;
      }

      .nav3 {
           background: none repeat scroll 0% 0% #72357F;
           height: 140px;
      }

   .middle_column {
        float: left;
        margin: 15px 0pt 0pt 15px;
        width: 320px;
   }

      .nav4 {
           background: none repeat scroll 0% 0% #314189;
           height: 140px;
      }

      .nav5 {
           background: none repeat scroll 0% 0% #00768E;
           height: 180px;
      }

      .nav8 {
           background: none repeat scroll 0% 0% #876F1D;
           height: 120px;
           /* Copy of .navbtn styling
            * This is necessary because .navbtn is used to fire fancybox.
            * This element shouldn't have that class because it doesnt need
            * to fire the fancybox js.
            */
           padding: 0 10px;
      }
      /* Copy of .navbtn styling
       * See above.
       */
      .nav8 img {
          max-width: 100%!important;
          height: auto!important;
      }

   .right_column {
        float: left;
        margin: 15px 0pt 0pt 15px;
        width: 360px;
   }

      .nav6 {
           background: none repeat scroll 0% 0% #739E25;
           height: 150px;
      }

      .nav7 {
           background: none repeat scroll 0% 0% #FF6611;
           height: 180px;
      }

      .nav9 {
           background: none repeat scroll 0% 0% #ba165b;
           height: 125px;
      }

	@media (max-width: 1000px){
		.right_column, .left_column, .middle_column {
			box-sizing: border-box;
			margin: 0;
			padding: 0 10px 10px 10px;
			width: 33%;
		}
	}
	@media (max-width: 600px){
		.right_column, .left_column, .middle_column {
			width: 100%;
			padding: 0 10px 0 10px;
		}
	}
	.navbtn {
		padding: 0 10px;
	}
	.navbtn img {
		max-width: 100%!important;
		height: auto!important;
	}
.container #oddends, .container #biography, .container #math, .container #art, .container #writings, .container #family, .container #god, .container #heal  {
   display: none;
   position: relative;
}
@media (min-width: 700px) {
	#oddends, #biography, #math, #art, #writings, #family, #god, #heal  {
	   width: 600px;
	}
}
#oddends, #biography, #math, #art, #writings, #family, #god, #heal  {
  padding: 30px;
	box-sizing: border-box;
}
#oddend a, #biography a, #math a, #art a, #writings a, #family a, #god a, #heal a,
#oddend a:visited, #biography a:visited, #math a:visited, #art a:visited,
#writings a:visited, #family a:visited, #god a:visited, #heal a:visited {
   color: #fff;
}
#oddend a:hover, #biography a:hover, #math a:hover, #art a:hover,
#writings a:hover, #family a:hover, #god a:hover, #heal a:hover {
   text-decoration: underline;
}

#oddends p, #biography p, #math p, #art p, #writings p, #family p, #god p, #heal p {
   color: #fff;
}

#oddends img, #biography img, #math img, #art img, #writings img, #family img, #god img, #heal img {
  max-width: 100%!important;
	height: auto!important;
}

#oddends {
   background-color: #bf0022
}

#biography {
   background-color: #72357f
}

#math {
   background-color: #314189
}

#art {
   background-color: #00768e
}

#writings {
   background-color: #739e25
}

#family {
   background-color: #fdb714
}

#god {
   background-color: #ff6611
}

#heal {
   background-color: #ba165b;
}

/*------------------------------------------------------------------------------
DIVS -- SUB--TWO COL
------------------------------------------------------------------------------*/
.subpage header {
  float: left;
  min-height: 150px;
  width: 100%;
	position: relative;
}
   .logotype {
      float: right;
      margin: 15px 100px 0 0;
      width: 382px;
      height: 58px;
      cursor: pointer;
   }
	@media (max-width: 1000px) {
		.logotype {
			margin-right: 10%;
		}
	}
	@media (max-width: 440px) {
		.logotype {
			width: 300px;
			margin-right: 20px;
		}
	}
   .topic_header {
        float: left;
        height: 70px;
				position: absolute;
				bottom: 0;
				margin-left: 30px;
   }
   .topic_header img {
       padding: 0;
       margin: 0
   }
.onecol section, .twocol section {
   float: left;
   width: 100%;
   min-height: 600px;
   background: #fff;
}
.twocol aside {
     float: left;
     margin: 20px 0pt 0pt 30px;
     width: 182px;
}
.onecol aside {
    float: left;
    padding: 20px 0 0 30px;
    width: 34%;
		box-sizing: border-box;
}
.gall aside {
     float: left;
     margin: 20px 0pt 0pt 30px;
     width: 115px;
}
.twocol article {
     float: left;
     margin: 20px 0pt 0pt 15px;
     width: 743px;
}
.onecol article {
	float: left;
	padding: 20px 20px 0 20px;
	width: 65%;
	box-sizing: border-box;
}
@media (max-width: 700px) {
	.onecol aside {
		width: 100%;
		display: block;
		padding: 30px 50px 0 50px;
	}
	.onecol article {
		width: 100%;
		display: block;
		padding: 30px 50px 0 50px;
	}
}
@media (max-width: 350px) {
	.onecol aside {
		width: 100%;
		display: block;
		padding: 30px 25px 0 25px;
	}
	.onecol article {
		width: 100%;
		display: block;
		padding: 30px 25px 0 25px;
	}
}
.onecol aside img, .onecol article img {
	max-width: 100%!important;
	height: auto!important;
}
@media (max-width: 750px) {
	.onecol aside img, .onecol article img {
		display: block;
		float: none!important;
		margin: 0 0 10px 0!important;
	}
}
.gall article {
     float: left;
     margin: 20px 0pt 0pt 20px;
     width: 827px;
}
.twocol .left_column, .twocol .right_column {
     float: left;
     margin-top: 20px;
     width: 364px;
}
.twocol .right_column {
     margin-left: 15px;
}


/*------------------------------------------------------------------------------
GALLERY
------------------------------------------------------------------------------*/