/*@charset "utf-8";*/
/*This CSS Document is developed by SchoolSpeak for Holy Name of Mary Catholic School, CA*/
/*=================================================================================*/
/*building blocks*/
Body{margin:0px; padding:0px; background:#FFF; font-family: Verdana, Geneva, sans-serif; color:#000000;}
#headerContainer{position:fixed;width:100%; border-bottom:1px solid #666; box-shadow: 0px 2px 7px #333; z-index:1000;}
.headerspace { width: 100%; height: 140px;}
/* Start Header Style */
#menubg{ background:#000; position: fixed; z-index:8888; width:100%; opacity:0.5; height:50px; }
#navwrpr{background:none; position: fixed; z-index:9999; width:100%;}
.thcontainer{ background: #FFF; color: #242a64;  font-size: 13px; padding: 5px;}
	.linkswrpr{ width: auto; margin:0 auto;text-align:right;}
	/*.logowrpr{float:left; margin:0 auto; display:inline-block;}*/
	.thlogo{float:left;}
	.thimages{float:right;}
	

	nav ul {text-transform: none; font-family: Helvetica, Arial, sans-serif !important; font-size:15px; padding:0px;margin:0px;list-style: none;position: relative;display:inline-block; background: none; color:#242a64 }/* main background color*/
	nav ul:after {content: ""; clear: both; display: block;	}

	nav ul li{float:left; height:50px; background:none;}/*horirzontal main menu single link background color*/
	nav ul li:hover > ul{display: block;}
	nav ul li:hover{background:#000000;}/*horirzontal main menu single link background hover color*/
	nav ul li:hover a{color:#ffffff;}
	nav ul li:hover a:hover{color:#ffffff;}/* font color White */
	nav ul li a {display:block; padding:16px 10px 13px 10px; color:#fff; text-decoration:none !important; text-transform: uppercase !important;}/* font color shade of black */
	/* Submenu */
	nav ul ul {display:none; z-index:100; background:#1d3961; border-radius:0px; padding:0px; position:absolute; top:100%; text-decoration:none !important; text-transform:none; text-align:left; white-space:nowrap; color:#010101;}/* sub menu common background color */
	nav ul ul li {float:none; border-bottom:1px solid #b5b5b5; position:relative; font-weight:normal !important; background:#00529c;}/* background color */
	nav ul ul li a {padding:20px 17px 14px 20px; color:#000000;}/* sub menu font color */	
	nav ul ul li a:hover {background:#3f91cd; color:#FFF;}/* sub menu single link background color and font color */
	.nav-sap{background-image:url(../images/topmenu-saperater.gif); background-repeat:no-repeat;height:44px; width:2px;}
	.nav-sap:hover{background-image:url(../images/topmenu-saperater.gif); background-repeat:no-repeat;height:44px; width:2px; }
	
	.menu_pin{
	width:37px;
	height:31px;
	background:url(../images/menu_pin.png) #FFF;
	position:absolute;
	top:10px;
	right:15px;
	border-radius:5px;
	cursor:pointer;
	display:none;}
	


	
/* End Header Style */
/*=================================================================================*/
/* Start Slideshow Style */
.sscontainer{background:#fff; padding:0px 0px 5px 0px;}
	#iss-container{width: 100%; height: position: relative;}
	#iss-navi, #iss-infoi{width: 100%; height: 100%; position: absolute;  top: 0; left: 0;}
	#iss-infoi{z-index:10;}
	#iss-navi{position:relative;}
	#iss-navi IMG{position:absolute; top:0px; left:0px;	z-index:8;	opacity:0.0; width:100%}
	#iss-navi IMG.active{z-index: 10;	opacity: 1.0;}
	#iss-navi IMG.last-active{z-index: 9;}
/* End slideshow Style */
/*=================================================================================*/
/* Start div01 Style */
.div01container{background:#fff; padding:40px 15px;}
	.div01left{float:left; text-align:center; width:445px; color:#333333; padding:0px; margin-right:20px;}
	.div01right{float:right; text-align:left; width:569px; color:#333333; padding:0px; margin-left:20px;}
/* End div01 Style */
/*=================================================================================*/
/* Start div02 Style */
.div02container{background:#00529c; padding:40px 15px; color:#FFF;}
	.div02content{float:left; text-align:center; width:100%; color:#333333; padding:0px; margin-right:20px;}
/* End div02 Style */
/*=================================================================================*/
/* Start div03 Style */
.div03container{background:#fff; padding:40px 15px;}
	.newscol{width:314px; margin:20px 20px; padding:0px; background:#fafafb; display: inline-block;height: 400px;overflow-y:auto}
	.newcontent{padding:15px;}
/* End div03 Style */
/*=================================================================================*/
/* Start div04 Style */
.div04container{background:#f7f7f8; padding:40px 15px;}
	.calcol{width:295px; border:1px solid #e6e6e6; margin:20px 20px; padding:0px; background:#ffffff; display: inline-block;}
	.caldatebg{background:#f8f7f7; padding:15px 10px 15px 10px; border-bottom:1px solid #eeeeee; font-size:18px; color:#00529c; font-weight:bold;}
	.caldate{font-size:32px; color:#00529c;}
	.calcontent, .calcontent a{padding:10px; color:#00233e; height: 150px; overflow-y: scroll;}
	.calinsidecontent,.calinsidecontent a{padding:10px; border-bottom:1px solid #f6f6f6; line-height:24px; text-align:left;}
/* End div04 Style */
/*=================================================================================*/
/* Start div05 Style */
.div05container{background:#00284c; padding:40px 15px; color:#FFF; vertical-align: top; }
	.div05left{display: inline-block; text-align:left; width:30%; color:#FFF; padding:0px; margin-right:20px;}
	.div05middle{display: inline-block; text-align:left; width:30%; color:#FFF; padding:0px; margin:0px 20px;}
	.div05right{display: inline-block; height: 100%; vertical-align: top; text-align:left; width:30%; color:#FFF; padding:0px; margin-left:20px;}
		.div05heading{font-size:18px; font-family:Arial, Helvetica, sans-serif; border-bottom:1px solid #30506c; padding-bottom:15px; color:#f9a51a;}
		.div05content{ font-size:14px; font-family:Arial, Helvetica, sans-serif; line-height:24px;}
		.div05container a{color:#FFF; text-decoration:none !important;}
		.div05container a:hover{color:#729dc3; text-decoration:none !important;}
		.div05container a:visited{color:#FFF; text-decoration:none !important;}
/* End div05 Style */
/*=================================================================================*/
/* Start footer Style */
.fcontainer{background:#1a3e5e; padding:15px 10px; font-size:12px; font-family: Verdana, Geneva, sans-serif; color:#c6d2dc;}
.ftcoluleft{float:left; text-align:left; width:49%; font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#c6d2dc;}
.ftcoluright{float:right; text-align:right; width:49%; font-family:Verdana, Geneva, sans-serif; font-size:11px; color:#fff;}
.schoolspeak-text-link{font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#c6d2dc; text-decoration:none !important;}
.schoolspeak-text-link:hover{font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#a6b9c9; text-decoration:none !important;}
.schoolspeak-text-link:visited{font-family:Verdana, Geneva, sans-serif; font-size:12px; color:; text-decoration:none !important;}
/* End footer Style */
/* Start Common Style */
.heading01,.Content1-Content-Header{font-size:36px; color:#00529c; font-family:"Century Gothic", Arial, Helvetica, sans-serif; text-align:center; padding-bottom:20px;}/* Main heading used for white bg */
.heading02,.Content6-Content-Header{font-size:36px; color:#ffffff; font-family:"Century Gothic", Arial, Helvetica, sans-serif; text-align:center; padding-bottom:20px;}/* Main heading used for blue bg */
.heading03{font-size:18px; color:#00529c; font-family: Verdana, Geneva, sans-serif; text-align: center; padding-bottom:20px;}/*Used in news section under the image*/
.content01{font-size:14px; color:#333333; font-family: Verdana, Geneva, sans-serif; text-align:left; line-height:24px;}
.content02{font-size:14px; color:#ffffff; font-family:"Microsoft Sans Serif", Arial, Helvetica, sans-serif; text-align:left; line-height:24px;}
.button1{
    padding: 12px 20px;
    color: white;
    text-decoration: none;
	text-transform:uppercase;
    font-size: 12px;
	font-weight:bold;
    font-family: Arial, Helvetica, sans-serif;
    background: #f9a51a;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
	border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
}
.button2{
    padding: 12px 20px;
    color: #242a64;
    text-decoration: none;
	text-transform:uppercase;
    font-size: 12px;
	font-weight:bold;
    font-family: Arial, Helvetica, sans-serif;
    background: #ffffff;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
	border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
}
.hnm-news{background:#4395d1; border-bottom:3px solid #f9a51a; font-size:18px; font-family:Verdana, Geneva, sans-serif; color:#000; padding:15px 3px;}
/* End Common Style */
/* Inner page content style */
#div1{height: inherit; background:#ffffff; padding:0px 0px; display:inline-block; overflow:hidden; width:100%; text-align:center;}
#div1 .div1heading {font-family: "Century Gothic"; font-size: 40px; color:#242a64; text-align: left;}
/* InnerPage leftMemu style */
#innerleftmenu{display:none;}


.Content1-Item,.Content6-Item{float:left;}
.Content1-UL, .Content1-Item,.Content6-UL, .Content6-Item  {
    display: inline-block;
    list-style: outside none none;
    margin: 0;
    padding: 0;

}
/*=================================================================================*/
/* Smartphones (portrait) ----------- */

@media only screen and (max-width : 360px) {
/* Styles */
.headerspace{width:100%;height:136px}
.Content1-Item,.Content6-Item{margin-left: 0px;}
}
@media only screen and (max-width : 320px) {
/* Styles */
.headerspace{width:100%;height:125px}
.Content1-Item,.Content6-Item{margin-left: 0px;}
}
@media only screen and (max-width : 568px) {
/* Styles */
.headerspace{width:100%;height:129px}
.Content1-Item,.Content6-Item{margin-left: 0px;}
}
/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}
@media only screen and (max-width : 667px) {
/* Styles */
.headerspace{width:100%;height:129px}
.Content1-Item,.Content6-Item{margin-left: 0px;}
}
/*=================================================================================*/

@media screen and (max-width: 768px) {
/*=================================================================================*/
/* Start Header Style */
#headerContainer{position: absolute ;width:100%; border-bottom:1px solid #666; box-shadow: 0px 2px 7px #333; z-index:1000;}
#menubg{ display:none;}
.thcontainer{padding:0px;}
.thcontainer{}
/*	.logowrpr{text-align:center;}
	.logowrpr > img{width:100%;}*/
	.thlogo img{width:100% !important;}
	.thimages{display: none;}
/*	#navwrpr{height:49px; background:#800020; }*/
	nav ul li{float:none;height:auto !important; font-size:12px;}
	nav ul li a:hover{background:#126bbc; border-bottom:1px solid #00529c; border-top:1px solid #22235b;}/* Submenu main heading */
	nav ul li a{color:#ffffff; border-bottom:1px solid #0d0e50;}
	.nav-sap{display:none;}
	nav ul ul{position:relative;top:0px;}
	nav ul ul li {float:none; border-bottom:0px solid #b5b5b5 !important; background:#4c9cd6;}
	nav ul ul li a {border-bottom:1px solid #00529c; }
	nav ul li:hover a { color:#000000; padding:20px 10px 14px 10px;}
	#navwrpr .linkswrpr{width:100%; margin-top:0px}
	nav ul{	width:100%;	text-align:left; background:#00529c;}
	#hdrbg .logowrpr{width:100%;}
	.logowrpr > img{width:100%;}
	.menu_pin{display:block; margin-top:70px;}
	#navwrpr{background-color:#09554b; display:none; position:absolute;	width:100%; z-index:999; left:0px;}
	/*#hdrnavbg .linkswrprr{width:100%;}*/
/* End Header Style */
/*=================================================================================*/
/* Start Slideshow Style */
.sscontainer{}
	#iss-container{height:auto;}
	#iss-navi > img{width:100%;}
	#iss-navi > IMG	{width:100%;height:auto;}
/* End slideshow Style */
/*=================================================================================*/
/* Start div01 Style */
.div01container{padding:10px; padding-bottom:20px;}
	.div01left{width:100%; box-sizing:border-box; text-align:left; padding:10px; margin-bottom:5px; }
	.div01right{width:100%; box-sizing:border-box; text-align:left; padding:10px; margin-top:5px;}
		 .div01left > img{width:100%;}
		 .div01right > img{width:100%;}
.div01container div > img{width:90%;}
/* End div01 Style */
/*=================================================================================*/
/* Start div02 Style */
.div02container{padding:10px; padding-bottom:20px;}
	.div02content > img{width:100%;}
	.div02content p > img{width:100%;}
/* End div02 Style */
/*=================================================================================*/
/* Start div03 Style */
.div03container{padding:10px; padding-bottom:20px;}
	.newscol{margin-top:10px; margin-bottom:0px; margin-left:0px; margin-right:0px; padding:0px; background:#fafafb; display: inline-block;}
	.newscol .newimage img{width:100%;}
/* End div03 Style */
/*=================================================================================*/
/* Start div04 Style */
.div04container{padding:10px; padding-bottom:20px;}
	.calcol{width:100%; border:1px solid #e6e6e6; margin-top:10px; margin-bottom:0px; margin-left:0px; margin-right:0px; padding:0px; background:#ffffff; display: inline-block;}
	.calcontent{padding:5px; height:100%; }
/* End div04 Style */
/*=================================================================================*/
/* Start div05 Style */
.div05container{padding:10px 0px;}
	.div05left{width:100%; box-sizing:border-box; text-align:left; padding:10px; background:#01192e; margin-bottom:5px;margin-right:0px}
	.div05middle{width:100%; box-sizing:border-box; text-align:left; padding:10px; background:#01192e; margin:0px;}
	.div05right{width:100%; box-sizing:border-box; text-align:left; padding:10px; background:#01192e; margin-top:5px; margin-left:0px;}
		.div05heading{font-size:16px; font-family:Arial, Helvetica, sans-serif; border-bottom:1px solid #898ca9; padding-bottom:15px;}
		.div05content{ font-size:12px; font-family:Arial, Helvetica, sans-serif; line-height:24px;}
/* End div05 Style */
/*=================================================================================*/
/* Start footer Style */
.fcontainer{padding:10px;}
.ftcoluleft{width:100%;box-sizing:border-box;margin:0px;padding:2px;text-align:center !important;}
.ftcoluright{width:100%;box-sizing:border-box;margin:0px;padding:2px;text-align:center !important;}
/* End footer Style */
/*=================================================================================*/

/* Start Common Style */
.Content1-Item,.Content6-Item{margin-left: 0px; float: none;}
.heading01,.Content1-Content-Header{font-size:24px; padding-bottom:20px; padding-top:20px;}/* Main heading used for white bg */
.heading02,.Content6-Content-Header{font-size:24px; padding-bottom:20px; padding-top:20px;}/* Main heading used for blue bg */
.heading03{font-size:17px;}/*Used in news section under the image*/
.button1{}
.button2{}
/* End Common Style */
/* Start Inner page content style */
#div1{}
#div1 .div1heading{font-size:24px; text-align:left;}
/* End Inner page content style */
.Content1-Item{
    width: 100%;
 }
.Content1-body-0{
    width: 100%;
 }
#innerleftmenu{display: block; background:#00529c; width:100%;}
	#innerleftmenu .headingbg{ font-family: "Times New Roman", Times, serif; font-size:24px; color:#ffffff; text-align:left; padding:8px 15px; border-bottom:1px solid #0d0e50;}
	#innerleftmenu .innercontent{ font-family: Verdana, Geneva, sans-serif; font-size:12px; color:#3e4e77; text-align:left; padding:0px 15px; line-height:20px; background:#126bbc;  }
#nav1 ul{ display:block; margin:0px; padding:0px; background:#126bbc; }
	#nav1 li{list-style:url(../images/arrow-grey.png) outside;padding:15px 0px; color:#ffffff!important; font-size:13px; font-family: Arial, Helvetica, sans-serif; margin-left:14px; background:#126bbc; border-bottom:1px solid #00529c; }
	#nav1 li:hover{list-style-image:url(../images/arrow.png); background-color:#d4d4e0;}
	#nav1 li a{color:#ffffff; text-decoration:none !important; font-weight:bold;}
	#nav1 li a:hover{color:#282a65; text-decoration:none !important; font-weight:bold;}
	

	nav ul li:hover > ul{display: none;}
}