﻿button, .button, input[type="submit"], input[type="button"] {background-color: #00477f !important;}
.button:focus, .button:hover {
    background-color: #fff!important;
    border: 2px solid #00467f !important;
    color: #00467f !important;
}

#CCEUtility {position: relative; display: block; top: 40px;}
#CCEUtility a, #CCEUtility a:visited, #CCEUtility a:hover {color: #00477f !important; font-weight: bold; text-decoration: none !important;}

#CCEUtilMenu {width: 90% !important; display: inline-block; float: left; position: relative;}
#CCEMenuTog {width: 10% !important; display: inline-block; float: right; position: relative; text-align: right;}

#CCECatalog {top: 50px; position: relative; display: block; }

.whitebody input  {
    color: #FFF !important;
    cursor: pointer !important;
    font-weight: bold !important;
    text-align: center !important;
    -webkit-appearance: none !important;
    display: inline-block !important;
    padding: 7px 10px;
    border-radius: 3px !important;
    text-transform: capitalize !important;
    letter-spacing: .5px !important;
    transition: background-color 300ms ease-out !important;
}

.whitebody input:hover {background-color: #333 !important;}


#catalogVert {
	width: 100%;
	max-width: 1200px;
	position: relative;
	margin: 0 auto;
	box-sizing: border-box ;
}

#categoryParent, #selectedCategory {
	width: 100%;
  	float: left;
  	box-sizing: border-box;
}

#categoryParent {
	border: none !important;
	padding: 10px;
	margin-right: 2%;
	margin-bottom: 4%;
}

#subCategories, #subCourses {
	border: none !important;
	padding: 10px;
}

#catDescrip {
	width: 96%;
	padding: 2%;
	background: #A6C6E8;
	margin-bottom: 2%;
}
#catDescrip img {
	width: 100%;
	margin-bottom: 2%;
}

ul li.selected a {
    font-weight: bold;
}

ul li.selected {
	margin-bottom: 2%;
}

#categoryParent ul li.selected, #subCategories ul li.selected {
	background: #A6C6E8;
	padding: 10px;
}

@media only screen and (min-width: 200px) {
  #catalogVert {
    width: 85%;
    padding: 0; }
}

@media only screen and (min-width: 600px) {
  #catalogVert {
    width: 80%; }
  #categoryParent, #selectedCategory {
  	width: 48%;
  }
}

@media only screen and (min-width: 200px) {
  #catalogHoriz {
    width: 85%;
    padding: 0; }
  .categoryColumn {
  	margin-bottom: 4%;
  }
}

@media only screen and (min-width: 600px) {
  #catalogVert {
    width: 80%; }
  .categoryColumn {
  	width: 48%;
  }
}

@media only screen and (min-width: 960px) {
  #catalogVert { width: 80%; }
}