#container {
	clear: both;
	float: left;
	margin: 0 auto;
	width: 100%;
	height: 38px; 
	border-radius: 1px;
	border-bottom: 1px solid #c1c1c1;
	background-color: #041e41;
	background-image: url(images/bg-nav.png);
	background-repeat: repeat-x;
}

.group {
	width: 970px;
	margin-top:6px;
	margin-bottom:0;
	margin-left:auto;
	margin-right:auto;
   /*  margin-top: 6px; margin-left: 0%;   change to margin 0 auto if want centered */
}
.toggleMenu {
    display:  none;
    background: #8c1515;
    padding: 8px 15px;
    color: #fff;
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	font-size: 96%; 
	text-decoration: none;
}

.toggleMenu a:hover {
	color: #fff;
	text-decoration: none;
	}
.toggleMenu a:visited {
	color: #fff;
	text-decoration: none;
	}

.nav {
    margin-top:3px; /*controls placement of top level nav elements */
	padding: 0;
	list-style: none;
	height: 28px; 
    *zoom: 1;
    background: #041e41; 
	color: #fff;
}

.nav:before,
.nav:after {
 content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}
.nav:after {
    clear: both;
}


.nav ul {
	list-style: none;
	line-height: 1;
	display: inline-block 

}
.nav a {
    padding: 1px 5px;
    color:#fff;
	text-decoration:none;
}
.nav li {
    position: relative;
}
.nav > li {
    float: left;
	padding: 0 1px 0 0;
   /* border-top: 1px solid #104336;*/
}
.nav > li > .parent {
    background-image: url("http://www.santarosa.edu/library/assets/images/downArrow.png");
    background-repeat: no-repeat;
    background-position: right;
	/*Background */
	
}
.nav > li > a { /*controls top nav bar */
    display: block;
	padding: 10px 20px 2px 10px;  /*controls top nav bar spacing */
	/* Typography */
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: normal;
	font-size: 0.8125rem;  /*controls top nav bar font. Was 96% before  */
	text-decoration: none;
	color: #fff; 
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}

.nav > li > a:hover {
	margin-top:0px; 
	background: #8c1515; /*top level red block background hover */
	color: #fff;
}	
	
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;

}
.nav li li.hover ul {
    left: 100%;
    top: 0;
	
}
.nav li li a {    /*controls dropdown menu items and behavior */
    display: block;
    position: relative;
    z-index: 100;
	/*added */
	border: 1px solid #e1e1e1;
	padding: 8px 20px 6px 5px;
	/* Typography previously font size small*/
	font-size: 0.8125rem;
	color: #041e41;
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	text-decoration: none;
	/* Background & effects */
	background: #f8fbff;
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
	-ms-transition: background .3s;
	-o-transition: background .3s;
	transition: background .3s;
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
	-webkit-box-shadow: 0 5px 5px rgba(0,0,0,.4);
	box-shadow: 0 10px 6px rgba(0,0,0,.4);
}

}
/* The hover state of the links */
.nav li li a:hover {
	background: #689ac6;
	color: #fff;
}


.nav li li li a {
	position: absolute;
    z-index: 500;
   /* border-top: 1px solid #1d7a62;*/

}

@media screen and (max-width: 767px) {
	.active {
        display: block;
    }
	.group {
	width: 90%;
    margin: 0px auto;
	}
	.toggleMenu {
    display:  none;
    background: #8c1515;
    padding: 8px 15px;
    color: #fff;
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	font-size: 96%; 
	text-decoration: none;
	}
	.toggleMenu a:hover {
	color: #fff;
	text-decoration: none;
	}
	.toggleMenu a:visited {
	color: #fff;
	text-decoration: none;
	}
	
    .nav > li {
        float: none;

    }
    .nav > li > .parent {
		position: relative;
        z-index:100;
		padding: 	11px 30px;
		border-radius: 1px; border-bottom: 1px solid #c1c1c1; 
		background: #041e41;
		color: #fff;
		z-index:9999;
    }
	
.nav > li > a:hover { /* top level collapsed behaviors */
	background: #8c1515; 
	color: #fff;
}

    .nav li li .parent {
 }
    .nav ul {
        display: block;
		padding-left: 0px; 
    }

   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
		 z-index:100;
    }

.nav li li a {
    display: block;
    position: relative;
    z-index:100;
	/*added */
	border-bottom: 1px solid #e1e1e1;
	padding: 8px 20px 6px 26px;
	margin-left: 0px;
	/* Typography */
	font-size: small;
	color: #041e41; /* collapsed submenu text */
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	text-decoration: none;
	/* Background & effects */
	background: #f8fbff; /* collapsed submenu background */
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
	-ms-transition: background .3s;
	-o-transition: background .3s;
	transition: background .3s;
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
.toplinks { display: none; }

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/*  iPad*/ 
#container {
	clear: both;
	float: left;
	margin: 0 auto;
	width: 100%;
	height: 38px; /*  remove it if you want the width of the container */ 
	border-radius: 1px; border-bottom: 1px solid #c1c1c1; 
	background-color: #041e41;
	background-image: url(images/bg-nav.png);
	background-repeat: repeat-x;
}

.group {
	width: 90%;
    margin: 0px auto;
}
.toggleMenu {
    display:  none;
    background: #8c1515;
    padding: 8px 15px;
    color: #fff;
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	font-size: 90%; 
	text-decoration: none;
}
.toggleMenu a:hover {
	color: #fff;
	text-decoration: none;
	}
	.toggleMenu a:visited {
	color: #fff;
	text-decoration: none;
	}

.nav {
    margin-top: 7px;
	padding: 0;
	list-style: none;
	height: 30px; 
    *zoom: 1;
    background: #041e41; 
	color: #fff;
}
.nav:before,
.nav:after {
    content: " "; 
    display: table; 
}
.nav:after {
    clear: both;
}
.nav ul {
	list-style: none;
	line-height: 1;
	display: inline-block 

}
.nav a {
    padding: 1px 5px;
    color:#fff;
	text-decoration:none;
}
.nav li {
    position: relative;
}
.nav > li {
    float: left;
	padding: 0 1px 0 0;
   /* border-top: 1px solid #104336;*/
}
.nav > li > .parent {
    background-image: url("http://www.santarosa.edu/library/assets/images/downArrow.png");
    background-repeat: no-repeat;
    background-position: right;
	/*Background */
	
}
.nav > li > a {
    display: block;
	padding: 2px 20px 2px 10px;  /*controls top nav bar spacing */
	/* Typography */
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	font-size: 10px;
	text-decoration: none;
	color: #fff; 
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */


}

.nav > li > a:hover {
	background: 8c1515; 
	color: #fff;
}	
	
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;

}
.nav li li.hover ul {
    left: 100%;
    top: 0;
	
}
.nav li li a {
    display: block;
    position: relative;
    z-index:100;
	/*added */
	border-bottom: 1px solid #e1e1e1;
	padding: 8px 20px 6px 5px;
	/* Typography */
	font-size: small;
	color: #041e41;
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	text-decoration: none;
	/* Background & effects */
	background: #f8fbff;
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
	-ms-transition: background .3s;
	-o-transition: background .3s;
	transition: background .3s;
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
	-webkit-box-shadow: 0 5px 5px rgba(0,0,0,.4);
	box-shadow: 0 10px 6px rgba(0,0,0,.4);
}
/* The hover state of the links */
.nav li li a:hover {
	background: #689ac6;
	color: #fff;
}


.nav li li li a {
    z-index:200;
   /* border-top: 1px solid #1d7a62;*/

}
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

#container {
	clear: both;
	float: left;
	margin: 0 auto;
	width: 100%;
	height: 38px; /*  remove it if you want the width of the container */ 
	border-radius: 1px; border-bottom: 1px solid #c1c1c1; 
	/* Background and effects */
	background-color: #041e41;
	background-image: url(images/bg-nav.png);
	background-repeat: repeat-x;
}

.group {
	width: 90%;
    margin: 0px auto;
}
.toggleMenu {
    display:  none;
    background: #8c1515;
    padding: 8px 15px;
    color: #fff;
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	font-size: 90%; 
	text-decoration: none;
}
.toggleMenu a:hover {
	color: #fff;
	text-decoration: none;
	}
.toggleMenu a:visited {
	color: #fff;
	text-decoration: none;
	}

.nav {
    margin-top: 7px;
	padding: 0;
	list-style: none;
	height: 30px; 
    *zoom: 1;
    background: #041e41; 
	color: #fff;
}
.nav:before,
.nav:after {
    content: " "; 
    display: table; 
}
.nav:after {
    clear: both;
}
.nav ul {
	list-style: none;
	line-height: 1;
	display: inline-block 

}
.nav a {
    padding: 1px 5px;
    color:#fff;
	text-decoration:none;
}
.nav li {
    position: relative;
}
.nav > li {
    float: left;
	padding: 0 1px 0 0;
   /* border-top: 1px solid #104336;*/
}
.nav > li > .parent {
    background-image: none;
	
}
.nav > li > a {
    display: block;
	padding: 2px 5px 2px 5px;  /*controls top nav bar spacing */
	/* Typography */
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	font-size: 10px;
	text-decoration: none;
	color: #fff; 
	font-weight: bold;
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */


}

.nav > li > a:hover {
	background: #fff; 
	background: rgba(255, 255, 255, .6); 
	color: #171717;
}	
	
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;

}
.nav li li.hover ul {
    left: 100%;
    top: 0;
	
}
.nav li li a {
    display: block;
    position: relative;
    z-index:100;
	/*added */
	border-bottom: 1px solid #e1e1e1;
	padding: 8px 20px 6px 5px;
	/* Typography */
	font-size: small;
	color: #041e41;
	font-family: "Lato", "Myriad W01 Regular", "Verdana", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
	text-decoration: none;
	/* Background & effects */
	background: #f8fbff;
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
	-ms-transition: background .3s;
	-o-transition: background .3s;
	transition: background .3s;
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
	-webkit-box-shadow: 0 5px 5px rgba(0,0,0,.4);
	box-shadow: 0 10px 6px rgba(0,0,0,.4);
}
/* The hover state of the links */
.nav li li a:hover {
	background: #f8fbff;
	color: #fff;
}


.nav li li li a {
    z-index:200;
   /* border-top: 1px solid #1d7a62;*/

}

}