@charset "utf-8";
/* 
=======================================================================

	Title: MATC Custom Styles
	Filename: matc.css

=======================================================================
*/


/*
=======================================================================
	
	Base Styles
	
=======================================================================
*/
*{
	margin: 0;
	padding: 0;	
}
html {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size: 14px;
}
body{
	font-family: inherit;
	color: inherit;
	line-height: normal;
}
#site-container{
	overflow: hidden;
	width: 100%;
}
h1,
h2,
h3,
h4,
h5,
h6{
  font-weight: 700;
  color: #1d1d1d;
  line-height: 1.5;
  margin: 0.375rem 0;

}
h1{
	font-size: 2rem;
}
h2{
	font-size: 1.714rem;
}
h3{
	font-size: 1.429rem;
}
h4{
	font-size: 1.143rem;
}
h5{
	font-size: 1rem;
}

p {
	margin-bottom: 0.5rem;
	line-height: 1.5;
}

img {
	border:none;
}
.img-lft{
	float:left;
}

.img-rt{
	float:right;
	padding:0 0 10px 10px;
}
hr{
	height: 1px;
	border:0;
	background: #555;
}
ul,
ol {
	padding:0;
	margin:0 0 0 20px;
}

:focus {
   outline-width: 2px;
   /*outline-style: dotted; */
  	outline-offset: 3px; 
  /* outline-color: darkgrey;*/
   /*background-color: grey;*/
    /*color: orange;*/
}
 
/*
=======================================================================
	
	Custom Heading Classes
	
=======================================================================
*/
/* h1.CS_Label_Current_Item{
	border-bottom: 1px solid #f89728;
} */

h2.side-nav-title{
	font-size: 1.15rem;
}
h3.side-nav-title{
	font-size: 1.15rem;
}

.CS_Textblock_Caption{
	font-weight: 700;
	font-size: 1.429rem;
	color: #1d1d1d;
	margin-bottom: 0.375rem;
}

/*
=======================================================================
	
	Site-wide Container Styles
	
=======================================================================
*/


#page-container-alert {
	background-color:#F00;
	color:#FFF;
	/*min-width:1033px;*/
}

#alert {
	margin:0 auto;
	max-width:1002px;
	font-size:18px;
	padding: 14px 0 10px 0;
	text-align:center;
}

#page-container-1 {
	background: #069 url(/templates/images/body.jpg) repeat-x;
	/*min-width:1033px;*/
	font-size: 0.857rem;
}
.page-container-2 {
	background: #333 url(/templates/images/ql-bkgd.gif);
	/*display:none; */  /*quick link will load in the open postion when display:none is commented out*/
	/*min-width:1033px;*/
}

/* #page-container-3 {
} */

#page-container-4 {
	background: #e1e1e1 url(/templates/images/footer-bkgd.gif);
	/*min-width:1033px;*/
}

.site-alert {
	margin:2px 0;
	border-bottom:3px solid #fc0301;
	background: #CCC url(/_cs_apps/pt_photo_gallery/uploads/alert/original/alert-bg_1.png) repeat-x center top;
}

	.site-alert-text {
		font-size: 15px; 
		margin: 0 auto !important; 
		padding: 32px 10px 15px 10px; 
		text-align: center; 
		width: 100% !important; 
		color:black;
	}

/*
=======================================================================
	HEADER
=======================================================================
*/
#mobileHeader {
    display: none;
    visibility: hidden;
}

#header {
	margin:0 auto;
	max-width:1002px;
    overflow: hidden;
}
#header a:link,
#header a:visited,
#header a:active{
	color:#FFF;
	text-decoration:none;
	border:none;
}
#header a:hover {
	color:#D86C00;
}

#header a img {
	border:none;
}

#blue {
	padding:40px 0 0 20px; /*original 26px 0px 0 20px;*/
	height:115px;  /*original height 75px*/
    float: left;

}

#headerRightCol {
    float: right;
    height: 115px;
    padding-top: 40px;

}

/*
=======================================================================
	Search
=======================================================================
*/
#search {
	float:right;
    margin-right: 15px;
}
#searchform div {
    /* This div will have the left image as a background */
    background: url(/templates/images/search1.jpg) no-repeat right top;
    padding: 0 10px;
    margin: 0;
    line-height: 1;
	width:150px;
}
#searchform #search {
    /* Im going to apply a top and bottom border to this input so that it fits with my images and give it the gradient background */
	color:#666;
	font-size:11px;
    border-top:1px solid #81aac6;
    border-bottom:1px solid #045b9f;
    border-left:0;
    border-right:0;
    background-color: #fff;
    padding: 8px 0 2px 0;
    height: 15px;
	width:120px;
	position:relative; /* IE8 and below */

}
#searchform input {
    /* Some reset styles to make my form elements play nice */
    vertical-align: top;
    margin: 0 !important;
    line-height: 1;
    /*outline:0 !important;*/
}
/*
=======================================================================
	QUICKLINKS
=======================================================================
*/
#quicklinks {
	margin:0 auto;
	max-width:1002px;
	color:#FFF;
	/*height:95px;*/
	font-size: 0.857em;
}

#quicklinks ul {
	list-style:none;
	margin:0;
	padding:10px;
}
#quicklinks ul > li{
	padding: 1px 0;	
	
	
}

/*.ql-col {
	width:230px;
	float:left;
	padding:0 0 0 20px;
}*/

#quicklinks a:link,#quicklinks a:visited,#quicklinks a:active {
		color:#CCC;
		text-decoration:none;
}

#quicklinks a:hover {
		color:#FFF;
		text-decoration:none;
}

/*-----------------------------------------------------*/
/*quicklinks btn*/

.quicklinksBtn {
	width:160px;
	height:36px;
	cursor:pointer;
	/*margin-top:-36px;*/
	display: inline-block;
    margin-right: 15px;
    margin-top: 13px;
	float: right;
}

/*
=======================================================================
	myMATC btn
=======================================================================
*/
.myMATCbtn {
	width:120px;
	height:36px;
	/*margin:-34px 0 0 721px; */
    /*margin:-36px 0 0 721px;*/
    display: inline-block;
    margin-top: 13px;
	float: right;
}

/*
=======================================================================
	Top Navigation
=======================================================================
*/

.topNav {
	position:relative;
	color:#fff;
    float: right;
}

/*
---------------------
	CAMPUS Navigation
---------------------
*/

.campusNav {
	position:relative;
	color:#fff;
	font-weight:bold;
	text-align:center;
	
}



/*
=======================================================================

	Main navigation
	
=======================================================================
*/

.mainNav{
	color:#333;
	padding:10px 0 0 0;
	margin:0;
	text-align: center;
	font-size: 115%;
	
}

.mainNav ul{
	margin-left: 0;
	position:relative;
	list-style: none;
	border-radius: 4px;
	float:left;
background-image:url(/templates/images/nav_bkg.jpg);
	background: #eee;
	width: 100%;
    border: 1px solid #D8D8D8;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ededed+0,e0e0e0+100 */
background: #ededed; /* Old browsers */
background: -moz-linear-gradient(top, #ededed 0%, #e0e0e0 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ededed 0%,#e0e0e0 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ededed 0%,#e0e0e0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#e0e0e0',GradientType=0 ); /* IE6-9 */
display: table;
}

.mainNav ul li{
	/*float:left;*/
	display: table-cell;
}

/*    .mainNav ul li:first-of-type {
		background: url(/templates/images/nav_lft.jpg) no-repeat top left; 
	}

    .mainNav ul li:last-of-type {
		background: url(/templates/images/nav_rt.jpg) no-repeat top right; 
	}*/

.mainNav ul li a{
	float:left;
	color:#333;
	text-decoration:none;
	padding:18px 0 0 0;
	height: 35px;
	width: 100%;
	margin:0;
	border:0;
    text-align: center;
}

/*.mainNav ul li a.wd{
	width:210px;
}*/

.mainNav ul li a:hover {
	text-decoration:none;
	font-weight:bold;
}

/*
=======================================================================
	Content
=======================================================================
*/
#main-area {
	margin:0 auto;
	max-width:1002px;
}

#content{
	clear:both;
	padding-top: 10px;
	padding-bottom: 10px;
}

#content img {
    max-width: 100%;
    height: auto;
}

#content td{
	vertical-align:top;
}

#content td.lftBorder{
	border-left:1px solid #e1e1e1;
	padding-left:20px;
}

#content .dateHome {
	margin: 5px 20px;
	/*width:630px;*/
}

#content .date {
	margin:  5px 0  0 20px;
}

#content .date p{
	margin:0;
}

#content .contentBlock {
	margin: 10px 20px;
}

#content ul,
#content ol {
	padding:0;
	margin:0 0 .5rem 1.429rem;
}

#content li {
	line-height: 1.5;
}

#content .row {
	margin-bottom: 15px;
}
/*
=======================================================================
	Tile Gallery
=======================================================================
*/

div#photo_cycle_container {
    height: 260px;
    margin:0!important;
}

/*
div#cycle_nav {
	display:none;
}
*/

/*#content .number_slideshow ul {
	margin:0 !important;
}
#content .number_slideshow ul li {
	padding:0 !important;
	max-width: 100% !important;
}*/

#content a:link,
#content a:visited,
#content a:active {	
	color:#333;
	text-decoration:underline;
	transition: all ease .2s;
}

#content a:hover {
	color:#000;
	text-decoration:underline;
}

#content h4 a:link,
#content h4 a:visited,
#content h4 a:active{
	color: #0c4b69;
	text-decoration:none;
	transition: all ease .2s;
}

#content h4 a:hover {
	color: #e2903d;
	text-decoration: underline;
}
/*
=======================================================================
	
	News Title
	
=======================================================================
*/
#content h4.news-title{
	border-bottom: 1px solid #cdcdcd;
}
#content h4.news-title:nth-child(1){
	border-top: 1px solid #cdcdcd;
}

#content h4.news-title a:link {
	transition: all ease .2s;
	color: #333; 
	
}
#content h4.news-title a:hover{
	color: #000; 
	text-decoration: underline; 
}
#content h4.news-title a > p{
	margin-top: 5px;
}




#content img.action {
	padding:0 10px 0 0;
}

#content td.orange {
	background: #ffffff url(/templates/images/caption-slideshow-v3.png) no-repeat;
}

#content table tr.landingSideBanner {
	/*display:table;*/
	/*border:1px solid #CCC; */
	background-color:#fafafa;
}


#content td.orange p{
	font-size:14px;
	margin: 15px 20px;
}

table.business h4{
	margin:0;
}
/*
=======================================================================

	Subnavbar
	
=======================================================================
*/
#content .subnavbar {
	 background-color:#FAFAFA;
	 padding: 10px;
	 /*margin:0 20px 0 0;*/
	 border-right:1px solid #E1E1E1;
}

#content .subnavbar h3 a.mobileSecondaryMenuButtons {
	display: none;
	margin-right: 5px;
	padding: 5px;
	border: 1px solid #555;
	border-radius: 3px;
}

	#content .subnavbar h3 a.mobileSecondaryMenuButtons .hideSecondaryMenu {
		display: none;
	}

#content .subnavbar h3 a.mobileSecondaryMenuButtons img {
	height: 1em;
	margin-bottom: -3px;
}

#content .subnavbar ul {
	list-style:none;
	margin-left:0;
	max-height: 1000px;
	transition: max-height .5s;
}

@media (max-width:767px) {
	#content .subnavbar {
		background-color: #dedede;
		margin-bottom: 1em;
	}


	#content .subnavbar h3 a.mobileSecondaryMenuButtons {
		display: inline-block;

	}

	#content .subnavbar ul {
		max-height: 0;
		overflow: hidden;
	}

	#content .subnavbar ul.open {
		max-height: 1000px;
	}

		#content .subnavbar ul li a {
			padding: 5px 0;
			display: block;
		}
}

#rtCol {
	width:200px;
		margin:10px -40px 10px 10px;}
		
/*
=======================================================================
	
	CALENDAR
	
=======================================================================
*/
#content #calendar{
	height: 50px;
	margin: 2px 0;
	padding: 2px 0;
	clear:both;
}
#content #calendar a:link,
#content #calendar a:visited,
#content #calendar a:active{
	color: #333;
	text-decoration:none;
}

#content #calendar a:hover {
	color:#e2903d!important;
}

#content #calendar .eventTitle{
	font-size: 14px;
	font-weight: 700;
	color: #333;
	margin:0 0 16px 0;
}
#content #calendar #cTxt p{
	line-height: 1.2rem;
	font-size: 90%;
}

#cIcon {
  float: left;
  padding: 3px 10px;
  background: #184056;
  margin-right: 10px;
  border-radius: 2px;
  margin-bottom: 5px;

}
#cTxt, 
#cIcon p{
	margin-bottom: 0;
}
#cIcon p {
	color: #FFF;
	font-size: 1rem;
	font-weight: bold;
	text-align: center;	
}
/*#cTxt {
	padding: 3px 0 0 3px;
}
*/

/*
=======================================================================
	Featured Items wrapped start with card-
=======================================================================
*/
.card-wrapper h4:first-of-type {
    margin-top: -4px;
}

/*
=======================================================================
	Landing Boxes
=======================================================================
*/
#content table.landingBox{
	table-layout:fixed;
	border:1px solid #CCC;
	width:938px;
}
#content table.landingBox td{
	padding: 10px 20px;
	width:33%;
}

/*
=======================================================================
	
	At a Glance 
	
=======================================================================
*/
.currBox {

	border:1px solid #CCC;
	padding:10px 20px;
	margin-top:10px;
}

.ataGlance_AD {
	margin:0 0 0 20px;
}

.ataGlance_AD h1{
	margin:6px 0 3px 0;
}

.ataGlance_AD h3{
	color:#00afff;
	font-size:14px;
	margin:0;
}

.ataGlance_AD img{
	padding:0 0 10px 10px;
}


.ataGlance_TD {
	margin:0 0 0 20px;
}

.ataGlance_TD h1{
	margin:6px 0 3px 0;
}

.ataGlance_TD h3{
	color:#ff8000;
	font-size:14px;
	margin:0;
}

.ataGlance_TD img{
	padding:0 0 10px 10px;
}


.ataGlance_C {
	margin:0 0 0 20px;
}

.ataGlance_C h1{
	margin:6px 0 3px 0;
}

.ataGlance_C h3{
	color:#3a3a3e;
	font-size:14px;
	margin:0;
}

.ataGlance_C img{
padding:0 0 10px 10px;
}


.ataGlance_AP {
	margin:0 0 0 20px;
}

.ataGlance_AP h1{
	margin:6px 0 3px 0;
}

.ataGlance_AP h3{
	color:#ee1b24;
	font-size:14px;
	margin:0;
}

.ataGlance_AP img{
padding:0 0 10px 10px;
}
/*
=======================================================================
	
	Global Buttons
	
=======================================================================
*/
#content .basic-btn,
#content a.basic-btn{
	display: inline-block;
	text-decoration: none;
	color: #fff;
	border: 1px solid #055ebc;
	background: #0046ad;
	border-radius: 4px;
	font-weight: 700;
}



#content .basic-btn-xs,
#content a.basic-btn-xs {
    padding: 5px 10px;
	font-size: 0.625rem;
}

#content .basic-btn-sm,
#content a.basic-btn-sm{
	padding: 8px 13px;
	font-size: 0.75rem;
}

#content .basic-btn-md,
#content a.basic-btn-md{
	padding: 10px 15px;
    color: #fff;
}
#content .basic-btn-lg,
#content a.basic-btn-lg{
	padding: 15px 25px;
	font-size: 1.25rem;
}

#content .basic-btn-xl,
#content a.basic-btn-xl{
	padding: 20px 30px;
	font-size: 1.5rem;
}
#content .basic-ghost-btn,
#content a.basic-ghost-btn{
	display: inline-block;
	text-decoration: none;
	color: #333;
	border: 2px solid #F89728;
	border-radius: 4px;
	font-weight: 700;
}

#content .basic-btn:hover,
#content a.basic-btn:hover{
  background: #055ebc;
}
#content .basic-ghost-btn:hover,
#content a.basic-ghost-btn:hover{
	background: #F89728;
}
#content .basic-btn:active,
#content a.basic-btn:active,
#content .basic-ghost-btn:active,
#content a.basic-ghost-btn:active{
  transform: translateY(2px);
}
/*
=======================================================================
	
	Footer
	
=======================================================================
*/
#footer-container{
	clear:both;
}

#footer {
	margin:0 auto;
	max-width:1002px;
	font-size:0.8em;
	color:#616161;
	padding: 20px 0 20px 0;
	clear:both;
	background-color:#e1e1e1;
}

#footer a:link,#footer a:visited,#footer a:active {
		color:#616161;
		text-decoration:none;
}

#footer a:hover {
		color:#616161;
		text-decoration:underline;
}

#matcLogo {
	float:left;
	/*width:85px;*/
	/*padding:20px 10px;*/
}

#matcLogo img{
	padding:6px 0 0 0;
}

#footerTxt {
	float:left;
	/*width:555px;*/
	/*padding:20px 10px 0 10px;*/
}

#social {
	float:left;
	/*padding:20px 0 0 0;*/
	/*width:320px;*/
}

#sSite{
	min-height:50px;
	clear:both;
}

#sIcon {
	float:left;
	padding:3px 6px 12px 0;
}


#sTxt {
	padding:1px 0 0 0;
}

/*
 *  Customized to make the landing box a div.
 */
#content div.landingBox{
	table-layout:fixed;
	border:1px solid #CCC;
	/*width:938px;*/ /* 20160504 ssmith Commented out due to responsive table issue */
	margin-bottom: 12px;
	padding: 20px;
}

/*
=======================================================================
	
	Communique Styling
	
=======================================================================
*/

	.mainStoryBox {


		margin:0 20px;
		padding:5px 20px;
	}
	.leftStoryBox {
		margin:10px 10px 20px 40px;
		padding:5px 20px;
		border:1px solid #E1E1E1;
	}
	.leftStoryBox ul{
		overflow:hidden;
		padding-left:20px;
	}
	.leftImgBoxComm{
		float:left;
		text-align:center;
		margin:0;
		padding:5px 10px 0 0;
	}
	.rightStoryBox {
		margin:10px 40px 20px 10px ;
		padding:5px 20px;
		border:1px solid #E1E1E1;
	}
	.rightImgBoxComm{
		text-align:center;
		padding: 5px 0;
	}
	.commSmallText {
		font-size:10px;
	}

/*
=======================================================================
	
	Centennial Gallery Archive
	
=======================================================================
*/

.galList{
	width:220px;
	height:170px;
	float:left;
	text-align:center;
	background-color:#EdEdEd;
	margin:5px;
	padding-top:10px;
}

.galList a,.galList a:link,.galList a:visited{
	font-size:13px;
	font-family:"Arial",Verdana,Helvetica,sans-serif;
	color:#003399;
	text-decoration:none;
}

.galList a:active,.galList a:hover{
	font-size:13px;
	font-family:"Arial",Verdana,Helvetica,sans-serif;
	color:#51809a;
	text-decoration:none;
}


/*
=======================================================================
	
	Sidebar styles carried over from old site
	
=======================================================================
*/
.sidebar {
	width: 220px;
	font-family: verdana, arial, helvetica, geneva, sans-serif; /* put specific families in quotes */
	font-size: 12px; 					/* font height designated in pixels */
	color: #333333; 					/* use valid web-safe hex codes */
	font-style: normal;					/* normal|italic */
	font-weight: normal;				/* lighter|normal|bold|bolder */
	font-variant: normal;				/* normal|small-caps (IE only) */
	text-transform: none;				/* capitalize|uppercase|lowercase|none */
	padding: 10px;
	margin-left: 10px;
	margin-bottom: 6px;
	background-color: #fc9;
	border: 1px solid #FF7300;
}
.sidebarheader {
	font-family: verdana, arial, helvetica, geneva, sans-serif; /* put specific families in quotes */
	font-size: 13px; 					/* font height designated in pixels */
	color: #000; 					/* use valid web-safe hex codes */
	font-weight: bold;				/* lighter|normal|bold|bolder */
	font-variant: normal;				/* normal|small-caps (IE only) */
	text-transform: none;				/* capitalize|uppercase|lowercase|none */
	margin-bottom: 6px;
}
.sidebarul {
	margin-top: 6px;
}
.sidebarli {
	margin-left: -22px;
	margin-top: 6px;
}
A.sidelink:link {
	font-family: verdana, arial, helvetica, geneva, sans-serif; /* put specific families in quotes */
	font-size: 12px; 					/* font height designated in pixels */
	color: #990000;
	font-weight: normal;				/* lighter|normal|bold|bolder */
	font-variant: normal;				/* normal|small-caps (IE only) */
	text-transform: none;				/* capitalize|uppercase|lowercase|none */
	text-decoration: none;
}
A.sidelink:hover {
	font-family: verdana, arial, helvetica, geneva, sans-serif; /* put specific families in quotes */
	font-size: 12px; 					/* font height designated in pixels */
	color: #990000;
	font-weight: normal;				/* lighter|normal|bold|bolder */
	font-variant: normal;				/* normal|small-caps (IE only) */
	text-transform: none;				/* capitalize|uppercase|lowercase|none */
	text-decoration: underline;
}
A.sidelink:active {
	font-family: verdana, arial, helvetica, geneva, sans-serif; /* put specific families in quotes */
	font-size: 12px; 					/* font height designated in pixels */
	color: #990000;
	font-weight: normal;				/* lighter|normal|bold|bolder */
	font-variant: normal;				/* normal|small-caps (IE only) */
	text-transform: none;				/* capitalize|uppercase|lowercase|none */
	text-decoration: none;
}
A.sidelink:visited {
	font-family: verdana, arial, helvetica, geneva, sans-serif; /* put specific families in quotes */
	font-size: 11px; 					/* font height designated in pixels */
	color: #990000;
	font-weight: normal;				/* lighter|normal|bold|bolder */
	font-variant: normal;				/* normal|small-caps (IE only) */
	text-transform: none;				/* capitalize|uppercase|lowercase|none */
	text-decoration: none;
}


/*
===========================================================================================================
	
	Large homepage buttons
	
===========================================================================================================
*/
#content a.largeButton {
    /*color: white; */
    display: block;
    overflow: hidden;
    border-radius: 4px;
    text-decoration: none;
    padding: 20px;
    margin: 1em 0;
	background: #0c4b69 ;
	/*border: 1px solid #0a3f58; */	
	border: 2px solid #fff;
	transition: background ease .5s;
}
  #content a.largeButton h4 {
	  color: white;
	  font-size: 1.8em;
	  
  }

#content a.largeButton > p,
#content a.largeButton .largeButtonLearnMore {
    color: #fff
}

  #content a.largeButton .largeButtonLearnMore {
	  display: inline-block;
	  float: right;
  }
   #content a.largeButton:hover{
	  background: #0a3f58;
  }

/*
===========================================================================================================
	
	Website Buttons
	
===========================================================================================================
*/
.btn-basic {
	display: inline-block;
	border: 1px solid #333333;
	box-shadow: 1px 1px 5px #333333;
	color: #ffffff;
	font-weight: 700;
	text-decoration: none;
	transition: all .2s ease-in;
	text-align: center;
}

.btn-basic--main {
	background: #184056;
	border-bottom: 4px solid #0f2936;
}

.btn-basic--xs {
	padding: 8px 10px;
	border-radius: 2px;
	font-size: 12px;
}
.btn-basic--sm {
	padding: 10px 15px;
	border-radius: 4px;
	font-size: 14px;
}
.btn-basic--md {
	padding: 15px 20px;
	border-radius: 4px;
	font-size: 18px;
}
.btn-basic--lg {
	padding: 20px 25px;
	border-radius: 4px;
	font-size: 24px;
}
/*==========================
 Transform yourself blue
===========================*/

/* .mainNav ul li:last-child a {
	background: #184056;
	color: #ffffff;
	transition: all ease .2s;
	border-radius: 4px;
}

.mainNav ul li:last-child a:hover {
	background: #102a38;
	font-weight: 700;
	transition: all ease .2s;
} */

/*
===========================================================================================================
	
	Mobile Menu
	
===========================================================================================================
*/
#mobileMenu {
	display: block;
	overflow: hidden;
	position: relative;
	max-height: 0;
	width: 100%;
	transition: max-height .4s;
	background-color: #333;
	color: white;
	visibility: hidden;
}

#mobileMenu ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	overflow: hidden;
	position: relative;
	font-size: 1.4em;
}

	#mobileMenu ul li {
		display: block;
		margin: 0;
		padding: 0;
		border-bottom: 1px solid #444;
		overflow: hidden;
	}

	#mobileMenu ul li a {
		display: block;
		padding: 8px 10px;
		color: #efefef;
		text-decoration: none;
	}

	#mobileMenu ul li a:hover {
		background-color: #444;
	}

	#mobileMenu ul li a.isParent:after {
		content: '\203A';
		float: right;
		margin-right: 8px;
		font-size: 1.5em;
		line-height: .7em;
		transform: rotate(0deg);
		transition: .3s;
	}

	#mobileMenu ul li.open a.isParent:after {
		transform: rotate(90deg);
	}

	#mobileMenu ul li ul {
		max-height: 0;
		font-size: 1em;
		background-color: #444;
		transition: max-height .3s;
	}

		#mobileMenu ul li ul li {
			border-top: 1px solid #333;
			border-bottom: none;
			transition: max-height .5s;

		}

			#mobileMenu ul li ul li a {
				padding-left: 30px;
			}

	#mobileMenu .showSubmenuPreview ul {
		max-height: 1000px;
	}

	#mobileMenu .showSubmenuPreview a.isParent:after {
		transform: rotate(90deg);
	}

		#mobileMenu .showSubmenuPreview ul li {
			max-height: 0;
		}

		#mobileMenu .showSubmenuPreview ul li:nth-child(-n+5) {
			max-height: 50px;
		}

	#mobileMenu ul li.open ul {
		max-height: 1000px;
	}

		#mobileMenu ul li.open ul li {
			max-height: 50px;
		}

	#mobileMenu .showSubmenuPreview a.submenuViewAll {
		text-align: center;
	}

#mobileSearch {
	max-height: 0;
	overflow: hidden;
	visibility: hidden;
}

#mobileSearch form {
			display: block;
			overflow: hidden;
			width: 100%;
			margin: 10px;
			text-align: center;
			color: #fff;
		}

/* 2016-03-16 ssmith Added important to the display because commonspot.css was interfering and can't mess with it. */
@media (max-width: 800px) {
    #header, .page-container-2, .mainNav {
        display: none !important;
    }

    #mobileHeader {
        display: block;
        overflow: hidden;
        height: 60px;
        position: relative;
        visibility: visible;
    }

    .menuButton, .searchButton {
        display: block;
        padding: 5px 10px;
        color: white;
        font-size: 1.7em;
        text-decoration: none;
		border: 1px solid #2f669d;
    }

    .menuButton {
        float: left;
		margin: 10px 0 0 10px;
    }

    .searchButton {
        float: right;
		margin: 10px 10px 0 0;
    }

	.menuButton:hover, .searchButton:hover {
		background-color: #2f669d;
	}

    .mobileLogo {
        position: absolute;
        left: 0;
        right: 0;
        width: 87px;
        margin: 0 auto;
        top: 5px;
    }

	#mobileSearch {
		display: block;
		overflow: hidden;
		width: 100%;
		margin: 0;
		max-height: 0;
		transition: max-height .5s;
		background-color: #333;
		visibility: visible;
	}

		#mobileSearch form {
			display: block;
			overflow: hidden;
			width: 100%;
			margin: 10px;
			text-align: center;
			color: #fff;
		}

			#mobileSearch input[type=text] {
				/*width: 300px;*/
				width: 60%;
			}

	#mobileSearch.open {
		max-height: 50px;
	}

	#mobileMenu {
		visibility: visible;
	}

	#mobileMenu.open {
		max-height: 1000px;
	}


}

@media (max-width: 400px) {
	/* .menuButton, .searchButton {
		font-size: 1.2em;
		margin-top: 15px
	} */

	.menuButton span, .searchButton span {
		display: none;
	}
}

/* ssmith 20150407 Added necessary CSS for table.js which produces responsive scrolling tables */
.scrollable.has-scroll {
	position: relative;
	overflow: hidden;
/* Clips the shadow created with the pseudo-element in the next rule. Not necessary for the actual scrolling. */
}
.scrollable.has-scroll:after {
	position: absolute;
	top: 0;
	left: 100%;
	width: 50px;
	height: 100%;
	border-radius: 10px 0 0 10px / 50% 0 0 50%;
	box-shadow: -5px 0 10px rgba(0, 0, 0, 0.25);
	content: '';
}
/* This is the element whose content will be scrolled if necessary */
.scrollable.has-scroll > div {
	overflow-x: auto;
}
/* Add scrollbar on webkit browsers */
.scrollable > div::-webkit-scrollbar {
	height: 12px;
}
.scrollable > div::-webkit-scrollbar-track {
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.15) inset;
	background: #f0f0f0;
}
.scrollable > div::-webkit-scrollbar-thumb {
	border-radius: 6px;
	background: #ccc;
}

/* ssmith 20160408 Updated styles for the photo carousels */
#content #photo_cycle_container .looper-nav {
	bottom: 0;
	position: relative;
	right: 0;
}
	    
/*
===========================================================================================================
	
 Accordion - added 02012019 GLopez
	
===========================================================================================================
*/

.accordion, .accordion * { -webkit-box-sizing:border-box;  -moz-box-sizing:border-box;  box-sizing:border-box; }
 
.accordion { overflow:hidden; }
 
	/*----- Section Titles -----*/
	.accordion-section-title { width:100%; padding:7px 15px; font-weight:600; display:inline-block; margin-bottom:10px; background:#efefef; transition:all linear 0.15s; color:#007FA3; text-decoration:none !important; }
	 
	.accordion-section-title.active, .accordion-section-title:hover { text-decoration:none; }
	 
	.accordion-section:last-child .accordion-section-title { border-bottom:none; }
	 
	/*----- Section Content -----*/
	.accordion-section-content { padding:15px; display:none; background:#FFFCE1; }
	
	/* -------- ARROWS ----------- */
	
	.sideClosed { background:url(/images/sidemenu-arrow-closed.png) no-repeat center right; width:7px; height:12px; display:inline-block; margin-left:4px; }
	.sideOpen, .sideClosed.sideOpen { background:url(/images/sidemenu-arrow-open.png) no-repeat center right; width:12px; height:12px; display:inline-block; margin-left:4px; }
	
	#sideNav .sideClosed, #sideNav .sideOpen, #sideNav .sideClosed.sideOpen { background:none; }