@charset "UTF-8";

/*----------------------------------
 *  Reset everything
 ----------------------------------*/
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,
a,abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strong,sub,sup,tt,var,
b,u,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
    margin:0;
    padding:0;
}
article,aside,details,figcaption,figure,footer,
header,hgroup,menu,nav,section{
    display:block;
}
table{
    border-collapse:collapse;
    border-spacing:0;
}
strong,b,mark{
    font-weight:bold;
    font-style:inherit;
}
em,i,cite,q,address,dfn,var{
    font-style: italic;
 }
abbr[title],dfn[title]{
    cursor:help;
    border-bottom:1px dotted;
}
ins{
    border-bottom:1px solid;
}
a,u,ins{
    text-decoration:none;
}
del,s{
    text-decoration:line-through;
}
pre,code,samp,kbd{
    font-family:monospace;
}
small{
    font-size:0.75em;
}
img{
    border:none;
    font-style:italic;
}
input,
select,option,optgroup,
textarea{
    font:inherit;
}

/*----------------------------------
 * Defining new layout 
 ----------------------------------*/

@font-face {
    font-family: 'myriadpro-l';
    src: url('fonts/myriadpro-l-webfont.eot');
    src: url('fonts/myriadpro-l-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/myriadpro-l-webfont.woff') format('woff'),
         url('fonts/myriadpro-l.otf') format('opentype'),
         url('fonts/myriadpro-l-webfont.ttf') format('truetype'),
         url('fonts/myriadpro-l-webfont.svg#myriadpro-l') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face{
	@font-face {
    font-family: 'myriadpro';
    src: url('fonts/MyriadPro-Regular.eot');
    src: url('fonts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/MyriadPro-Regular.woff') format('woff'),
         url('fonts/MyriadPro-Regular.otf') format('opentype'),
         url('fonts/MyriadPro-Regular.ttf') format('truetype'),
         url('fonts/MyriadPro-Regular.svg#myriadpro') format('svg');
    font-weight: normal;
    font-style: normal;
}
}

@font-face {
    font-family: 'georgia-r';
    src: url('fonts/georgia-webfont.eot');
    src: url('fonts/georgia-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/georgia-webfont.woff') format('woff'),
         url('fonts/georgia-webfont.ttf') format('truetype'),
         url('fonts/georgia-webfont.svg#georgia-r') format('svg');
    font-weight: normal;
    font-style: normal;

}



html{
	background: url("images/body-background.png") repeat-x top;
}

#page-content-background{
	margin-top: 0;	
	width: 100%;	
	float: left;
	background: url("images/bottom-background.png") repeat-x bottom;
	
}

#page-content{
	margin-top: 0;
	margin-left: auto;
	margin-right: auto;
	width: 1020px;	
	height: 600px;	
	background: url("images/picture-frame.png") no-repeat;	
	font-family:  Georgia, Serif;
	font-size: 16px;	
}


h1{
	margin-top: 16px;	
	font-family: myriadpro-l, Verdana, sans-serif;
	font-size: 30px;
	font-weight: 600;
	color: #820000;
}

h2{
	margin: 16px 0px 16px 2px;
	font-family:  Georgia, Serif;
	font-weight: 500;
	font-size: 24px;
	color: #111111;	
}

h3{
	margin: 16px 0px 16px 2px;	
	font-family:  Georgia, Serif;
	font-size: 18px;
	color: #222222;
	line-height: 24px;
}

h3 p{
	margin: 16px 0px 16px px;	
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;
	line-height: 20px;
}

p{
	margin: 16px 24px 16px 2px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;
}

a{
	/*color: #aa2222;*/
	color: #820000;
}

/*
 * For extending div using more...
 */
more{
	margin: 16px 24px 16px 2px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #670000;
}

i, em{
	font-style: italic;
	font-family:  Georgia, Serif;
}

b, strong{
	font-family:  Georgia, Serif;
	font-style: bold;
}



blockquote{
	margin-left: 32px;
	font-family:  Georgia, Serif;
	font-style: italic;
}

ul{
	margin-left: 32px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;
}


ol{
	margin-left: 32px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;
}


hr{
	margin-top: 16px;
	margin-bottom: 16px;
	color: #b4b4b4
	height: 1px;
}

table{
	margin-left: 32px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;
}



#top-banner{
	width: 1020px;
	height: 99px;
	float: left;
	
}

#jmc{
	float: left;
	margin-left: 58px;
	margin-top: 40px;
	width: 560px;
	height: 56px;
	font-family:  myriadpro-l, Verdana, sans-serif;
	font-size: 30px;
	font-weight: 600;
	color: #820000;
}

#fatherAI{
	
	width: 320px;
	float: right;
	margin-right: 60px;
	margin-top: 40px;
	text-align: right;	
	height: 56px;
	
	font-family:  myriadpro-l, Verdana, sans-serif;
	font-size: 30px;
	font-weight: 500;
	
	color: #B2B2B2;
}

#slider-space{
	
	float: left;
	height: 260px;
	width: 1020px;
	
	/*
	-webkit-box-shadow: inset 0 0 10px #000000;
	-moz-box-shadow: inset 0 0 10px #000000;
	-o-box-shadow: inset 0 0 10px #000000;
	box-shadow: inset 0 0 10px #000000;
	*/
}

#photodiv{
	
	position:relative;
	height:240px;
	width:940px;
	margin-left: 39px;
	margin-top: 9px;
}



#ribbon{
	float: left;
	width: 1020px;
	height: 49px;
}

#ribbon-menu{
	width: 980px;
	margin-left: 30px;
	float: left;
	height: 48px;
}
.dot{
	width: 3px;
	height: 49px;
	float: left;
}
.ribbon-m{
	
	float: left;	
	display: block;
}



#ribbon-menu a img.primary {
	z-index: 1;
}

#ribbon-menu a img.rollover{
	z-index: -1;
}

#ribbon-menu a img.active{
	z-index: 2;
}


#main-container{
	width: 1020px;	
	margin-top: 10px;
	float: left;
}

#main-content{
	width: 660px;
	margin-left: 60px;
	float: left;	
	
}

#side-bar{
	width: 230px;	
	margin-right: 41px;
	float: right;
}

#sidebar-top{
	float: left;
	width: 230px;
	height: 60px;
	background: url("images/sidebar-top.png");
}

#sidebar-middle{
	float: left;
	width: 230px;
	background: url("images/sidebar-middle.png") repeat-y;
	padding-bottom: 64px;
}

#searchbox{
	display: none;
}

#quote{
	
	margin-left: 20px;	
	margin-right: 24px;
	font-family:  Georgia, Serif;
	font-size: 14px;
}

#quote-name{
	text-align: right;
}

#reading-list{
	margin-top: 8px;
	margin-left: 20px;
	width: 200px;
	float: left;
}



#reading-list p{
	font-family:  Georgia, Serif;
	font-size: 14px;
	margin: 10px 0px 8px 0px;
	float: left;
}


.sidebar-separator{
	margin: 0px;
	float: left;
}



#sidebar-bottom{
	float: left;
	width: 240px;
	height: 230px;
	/* background: url("images/sidebar-bottom.png"); */
	
}

#bottom-container{
	float: left;
	height: 240px;	
	width: 1020px;
	color: #b45455;
	font-family: myriadpro, Verdana, sans-serif;
	font-size: 12px;
}

#bottom-left{
	margin-top: 60px;
	margin-left: 60px;
	float: left;

}

#bottom-right{
	margin-top: 60px;
	margin-right: 40px;
	float: right;
}

#bottom-container a{
	color: #b45455;
	text-decoration: underline;
}

/*
 * Styles specific to the articles page.
 */

.paper{
	position: relative;
	
}

.paper h3{
	margin: 4px 0 4px 0;
}



.description{

	font-size: 8px;
	width: 600px;	

}



.paper h3{
	margin-top: 16px;
}
.description p{
	margin-top: 4px;
	margin-bottom: 4px;
	font-size: 14px;
}

#show{
	display: none;
}

/*
 * End of styles specific to the articles page.
 */


/*
 *  Styles specific to the quotes page
 *  Used in prophets.html as well.
 */

.quote-content{
	margin: 16px 24px 16px 2px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	font-style: italic;
	color: #222222;
}

.quote-content .quote-name{
	font-style: normal;
	text-align: right;
}

/*
 * End of styles specific to the  quotes page.
 */

/*
 *  Styles specific to the progress/index.html
 * For answers in the QA section
 */

 .question{
 	margin: 24px 24px 8px 2px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	font-weight: bold;
	color: #222222;
 }
.answer{
	margin: 8px 24px 16px 2px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;
} 
/*
 * End of styles specific to the  progress/index.html page.
 */

 /*
 *  Styles specific to the articles page
 * 
 */

 #filtermenu{
 	margin: 16px 24px 16px 2px;
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;
	/*float: left;*/
	width: 660px;
 }

 #filterkeyword{
 	
 	display: inline;
 	margin: 0;
 	padding: 0;
 }

pre{
	font-size: 14px;
}

a b{
	font-weight: normal;	
}

/*
 * End of styles specific to the articles page
 */


 /*
 *  Styles specific to the contributions page
 * 
 */

#award2x2{
	margin-left: 100px;
}

.award{
	float: left;

	margin-top: 10px;
	margin-right: 10px;
	
	padding: 4px 4px 4px 4px;
	width: 210px;
	
}

.award-photo{
	/*width: 300px;*/
	
	float: top;
	width: 201px;
	
}

.award-photo img{

	float: top;
}

.award-photo-caption{
	
	float: top;

	font-family:  Georgia, Serif;
	font-size: 14px;
	/*font-weight: bold;*/
	color: #222222;
	text-align: center;
	width: 201px;

}

.twoColumns{
	margin-left: 10px;
	float: left;
}

.firstColumn{
	width: 280px;
	float: left;

}

.secondColumn{
	float: left;
	width: 280px;
	margin-left: 20px;
}

.indent{
	margin-left: 10px;
}




 /*
 * End of styles specific to the contributions page
 */

 /*
 * Styles specific to the pictures page.
 */

 .columns{
 	width: 200px;
 	margin: 0px 10px 0px 10px;
 	float: left;
 }

.picture{
	float: top;

	margin-top: 10px;
	
	padding: 4px 4px 4px 4px;
	width: 200px
	border: 1px solid #b4b4b4;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;	
	
	-webkit-box-shadow:0px 0px 8px #aaaaaa;
	-moz-box-shadow:0px 0px 8px #aaaaaa;
	-o-box-shadow: 0px 0px 8px #aaaaaa;	
	box-shadow: 0px 0px 8px #aaaaaa;
	
}

.photo{
	width: 200px;
	float: top;
}

.photo img{
	width: 192px;
	float: top;
}

.photo-caption{
	width: 192px;
	float: top;

	font-family:  Georgia, Serif;
	font-size: 12px;
	font-weight: bold;
	color: #222222;

}

.photo-description{
	width: 192px;
	float:top;
	font-family:  Georgia, Serif;
	font-size: 12px;
	color: #222222;
}

.jmcphoto{

	margin-top: 10px;
	
	padding: 4px 4px 4px 4px;
	width: 200px
	border: 1px solid #b4b4b4;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;	
	
	-webkit-box-shadow:0px 0px 8px #aaaaaa;
	-moz-box-shadow:0px 0px 8px #aaaaaa;
	-o-box-shadow: 0px 0px 8px #aaaaaa;	
	box-shadow: 0px 0px 8px #aaaaaa;
	

}


/*
 * End of styles specific to the pictures page.
 */

 /*
 * Start of styles specific to the sendtributes page.
 */

.labels{
	width: 200px;
	float: left;
	text-align: right;
	font-family:  Georgia, Serif;
	font-size: 16px;

}

#fields{
	font-family:  Georgia, Serif;
	font-size: 16px;
	color: #222222;

	width: 660px;

}

/*
 * End of styles specific to the sendtribute page.
 */

 /*
 * Start of styles specific to the videos page.
 */
.videos{
	width: 312px;
	
	margin-bottom: 20px;
	float: left;
	margin-left: 4px;

	padding: 4px 4px 4px 4px;
	border: 1px solid #b4b4b4;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;	
	
	-webkit-box-shadow:0px 0px 8px #aaaaaa;
	-moz-box-shadow:0px 0px 8px #aaaaaa;
	-o-box-shadow: 0px 0px 8px #aaaaaa;	
	box-shadow: 0px 0px 8px #aaaaaa;
}


.videos .video-description{
	width: 312px;

	float:top;
	font-family:  Georgia, Serif;
	font-size: 12px;
	color: #222222;

}

/*
 * End of styles specific to the videos page.
 */