/*! responsive-nav.js v1.0.20 by @viljamis */

#nav ul {
  margin: 0;
  padding: 0;
  width: 80%;
  display: block;
  list-style: none;
}

#nav li {
  width: 80%;
  display: block;
}

.js #nav {
  clip: rect(0 0 0 0);
  max-height: 0;
  position: absolute;
  display: block;
  overflow: hidden;
  zoom: 1;
}

#nav.opened {
  max-height: 9999px;
  z-index:12000;
  margin-bottom: 40px; /*added by joc*/
}
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }

#nav,
#nav * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#nav,
#nav ul {
  list-style: none;
  width: 100%;
  float: left;
}

#nav li {
  float: left;
  width: 100%;
}

#nav a {
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  width: 100%;
  background: #f4421a;
  padding: 0.7em 1em;
  float: left;
  font-weight: bold;
  background-image: url("../images/overlay-light.png"); background-repeat: repeat-x;
  background-position: bottom left;
}

#nav ul ul a {
  background: #ca3716;
  padding-left: 2em;
  font-weight: normal;
  text-transform: none;
}

#nav-toggle {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 50px;
  height: 50px;
  float: right;
  text-indent: -9999px;
  overflow: hidden;
  background: url("../images/responsive-menu.png") no-repeat 50% 50%;
}

@media screen and (-webkit-min-device-pixel-ratio: 1.3), screen and (min--moz-device-pixel-ratio: 1.3), screen and (-o-min-device-pixel-ratio: 2 / 1), screen and (min-device-pixel-ratio: 1.3), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
  #nav-toggle {
    background-image: url(../images/responsive-menu-retina.png);
    -webkit-background-size: 100px 100px;
    -moz-background-size: 100px 100px;
    -o-background-size: 100px 100px;
    background-size: 100px 100px;
  }
}
/*Global Responsive CSS*/
img {max-width: 100% !important;} 
form{margin:0px !important;}
#mobile_search form .search label{display: none !important;}

/* # - Medium Devices
================================================== */

/* Note: Design for a width of 768px */
    
@media only screen and (min-width: 768px) and (max-width: 1020px) {


/* Default Settings */	
.wrapper960 {width:95% !important;}
.block_holder {padding:10px 0px !important;}


/* Hide Containers/divs */
#container_header {display:none !important;}
#hornav{display:none !important;}


/*------ Mobile Containers Styling------ */
/* Show mobile logo */
#container_logo_menu_mobile {display: block;}
#logo_mobile{float: left;}
#logo_mobile.block_holder a img{max-width:220px !important;}

/* Show mobile social icons and search */
#container_social_mobile {
    display: block;
    height: 50px;
    padding-bottom: 10px;
}

#social_mobile{height:auto;}
#social{
    margin:2px;
	z-index:11;
	float:right;
	position:relative;
	top: 0 !important;
	}

/* Search */
#mobile_search {
    margin:5px;
    margin-top: 11px;
	z-index:10;
	float:left;
}

#mobile_search form .search label{
	display: none !important;
}

#mobile_search .inputbox {
    border:medium;
	background-color: #ffffff;
	border-radius: 5px;
	color: #5B5B5B;
	font: 14px Arial,Helvetica,sans-serif;
	height: 25px;

	padding:2px !important;
	text-align:center;
}


}

/* # - Small Devices
================================================== */

/* Note: Design for a width of 480px */

@media only screen and (max-width: 767px) {

/* Default Settings */	
.wrapper960 {width:95% !important;}

.top-1, .top-2, .contenttop, .contentbottom, .bottom-1, .bottom-2, .base-1, .base-2, #sidecol_a, #sidecol_b {width:100% !important;}
#sidecol_a, #sidecol_b{width:97.5% !important;}
#content_remainder {width:97% !important;}
#container_main{padding-top: 20px;}
#container_header {display:none !important;}
#hornav{display:none !important;}
#breadcrumb.block_holder {display: none;}

/* Joomla Specific Stuff */
#jform_contact_message, #jform_contact_emailmsg{max-width:360px !important;}

/*------ Mobile Containers Styling------ */
/* Show mobile logo */
#container_logo_menu_mobile {display: block;}
#logo_mobile{float: left;}
#logo_mobile.block_holder a img{max-width:220px !important;}

/* Show mobile social icons and search */
#container_social_mobile {
    display: block;
    height: 50px;
    padding: 0px;
}

#social_mobile{height:auto;}
#social{
    margin:2px;
	z-index:11;
	float:right;
	position:relative;
	top: 0 !important;
	}

/* Search */
#mobile_search {
    margin:5px;
    margin-top: 11px;
	z-index:10;
	float:left;
}

#mobile_search form .search label{
	display: none !important;
}

#mobile_search .inputbox {
    border:medium;
	background-color: #ffffff;
	border-radius: 5px;
	color: #5B5B5B;
	font: 14px Arial,Helvetica,sans-serif;
	height: 25px;

	padding:2px !important;
	text-align:center;
}

/* max width for #nav important*/
div#nav.block_holder{max-width:440px !important;}

}


/*  # - Extra Small Devices
================================================== */

/* Note: Design for a width of 320px */

@media only screen and (max-width: 440px) {

/* Default Settings */	
.wrapper960 {width:95% !important;}
p img {max-width: 94% !important;}

.top-1, .top-2, .contenttop, .contentbottom, .bottom-1, .bottom-2, .base-1, .base-2, #sidecol_a, #sidecol_b {width:100% !important;}
#sidecol_a, #sidecol_b{width:97.5% !important;}
#content_remainder {width:97% !important;}
#container_header {display:none !important;}
#hornav{display:none !important;}
#breadcrumb.block_holder {display: none;}

/* Joomla Stuff */
#jform_contact_message, #jform_contact_emailmsg{max-width:220px !important;}


/*------ Mobile Containers Styling------ */
/* Show mobile logo */
#container_logo_menu_mobile {display: block;}
#logo_mobile{float: left;}
#logo_mobile.block_holder a img{}

/* Show mobile social icons and search */
#container_social_mobile{
    display: block;
    height: 40px;
    padding: 10px 0;
}

#social_mobile{height:auto;}

#social{
    margin:2px;
	z-index:11;
	float:right;
	position: relative;
	}

/* Search */
#mobile_search {
    margin:5px;
	z-index:10;
	float:left;
}

#mobile_search form .search label{
	display: none !important;
}

#mobile_search .inputbox {
    border:medium;
	background-color: #ffffff;
	border-radius: 5px;
	color: #5B5B5B;
	font: 14px Arial,Helvetica,sans-serif;
	height: 25px;
	width: 100px !important;
	padding:2px !important;
	margin-top: 5px;
	text-align:center;
}

/* max width for #nav Important*/
div#nav.block_holder{max-width:300px !important;}
}