/*Everywhere*/
.clearfix {clear:both;}

body{
	background:initial;
	margin:0;
	padding:0;
	font-family: 'Source Sans Pro';
	font-size:0.875em;
	font-weight:400;
	color:#444449;
	line-height:1.6;
}

.nav-width, .storefront-wrapper, .page{
	max-width:1220px;
	margin:0 auto;
}

/*header*/
.logo-container{padding:10px 20px;}
.nav-width{display:flex; justify-content:space-between;align-items:center;}
.ua-logo{}.ua-logo img{max-width:100%}

#nav-dropdown{
	display:none;
	float:right;
	position:relative;
	color:#666;
	margin:17px 10px;
	width:30px;
	height:20px;
	cursor:pointer;
	box-sizing:border-box;
}

#nav-dropdown:before{
	content: ' ';
    position: absolute;
    width: 100%;
    top: 0;
    bottom: 0;
    border: 2px solid #666;
    border-width: 2px 0;
}

#nav-dropdown:after {
	    content: ' ';
    position: absolute;
    width: 100%;
    top: 50%;
    margin-top: -1px;
    border-top: 2px solid #666;
}

#ua-nav{display:flex;position:relative;}
#ua-nav a{color:#dd3333;padding:10px;font-size:1.1em;text-decoration:none;}
#ua-nav a:hover{color:#878787;}
.submenu-wrapper{position:absolute;display:none;flex-direction:column;background: #ffffffe6;border: 1px solid #eee;margin: 5px 0 0;padding: 10px;z-index:1;}
.submenu-wrapper:before { visibility:hidden; content:' '; opacity:0; margin:0; position:absolute; top:0; left:20px; margin:-11px 0 0; border-bottom:10px solid #ddd; border-left:10px solid transparent; border-right:10px solid transparent; z-index:9999; }
.submenu-wrapper:after { visibility:hidden; content:' '; opacity:0; margin:0; position:absolute; top:0; left:20px; margin:-10px 0 0; border-bottom:10px solid #fff; border-left:10px solid transparent; border-right:10px solid transparent; z-index:9999; }
.main-nav-item:hover .submenu-wrapper{display:flex;}
.main-nav-item:hover:hover > .submenu-wrapper:before,.main-nav-item:hover:hover > .submenu-wrapper:after { visibility:visible; opacity:1; }
@media (max-width: 700px){
	#nav-dropdown{display:block;}
	#ua-nav{
		display:none;
		float:initial;
		clear:both;
	}
	#ua-nav ul{
		width:100%;
		border-top:1px solid #000;
	}
	
}
@media (min-width: 700px){
	#ua-nav{display:flex !important;}/*Quick and dirty way to make sure the nav displays correctly should a user click on #nav-dropdown in mobile view and then somehow increase their screen width past 700px*/
}
/*storefront*/
.store_catbuttons {text-align: center; padding-top: .5em;}
/*p, .store_contact {padding:.5em;}
.store_contact div {margin-bottom: 2px;}*/
ul.frq-radios {list-style: none; padding: 0; margin: 0 0 8px 0;}
ul.frq-radios li {display: inline; margin-right: 8px;}

.ui-widget{
	font-family:inherit;
	font-size:inherit;
}

.section{
	margin:0 2px 5px;
	box-shadow: 5px 1px 10px #ddddde;
}

.storefront-title{
	text-align:center;
	font-size:34px;
	font-weight:400;
}

/* Component containers*/
.ui-widget-header {background-color: #dd3333; background-image: none; }

/*buttons*/
.storefront-buttons{
	padding:36px 90px;
	font-size:2em;
	}

.ui-corner-all{border-radius:initial;}	
	
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default 
{background: #dd3333; border: solid 1px #595959; color:#FFFFFF; }

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus 
{background:#878787; color:#FFFFFF;}

.store_catbuttons{
	margin-bottom:20px;
}

/* icon defaults - arrow on acct menu and symbol on search button */
.ui-icon 
{background-image: url(/_static/scripts/jquery-ui/themes/pumpflo/images/ui-icons_ffffff_256x240.png) !important;}

/* icon override for hover/selected when we need to have two color-states */
/*
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon
{background-image: url(/_static/scripts/jquery-ui/themes/pumpflo/images/ui-icons_ffffff_256x240.png) !important;}
*/

/*storefront banner*/
.storefront-banner{
	margin:0;
	padding:100px 0;
	text-align:center;
	background-size:cover;
	background:rgba(0,0,0,0.4);
	border-top:1px solid #ddd;
	position:relative;
	overflow:hidden;
	color:#eee;
	background:url(/storefronts/unitedpumpsau/images/ProductRange.jpg) no-repeat center;
	background-size:cover;
}

.storefront-banner-text{
	font-size:35px;
	font-weight:400;
	line-height:42px;
	text-transform:uppercase;
	color:#fff;
	margin:0;
}

/*Products section*/
.ua-products{
	margin:none;
	padding:none;
	overflow:hidden;
}

.ua-products::after{
	content:"";
	display:inline-table;
	}

.series{
	width:33%;
	margin:0;
	padding:0;
	overflow:hidden;
	float:left;	
}

.series-container{
	position:relative;
	text-align:center;
	color:white;
}

.series-container img{
	max-width:100%;
	padding:10px;
}

.centered-text{
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	font-size:24px;
	font-weight:400;
}

.series p{
	padding:10px;
	word-wrap:break-word;
	min-height:260px;
	font-size:1.2em;
}

@media (max-width:1160px){
	.series{width:50%;}
	.series p{min-height:100px;}
}

@media (max-width:620px){
	.series{width:initial;}
	.series p{min-height:initial;}
}
/*End Products*/
/*About Us*/
.About{
	width:48%;
	margin:0 auto;
	padding:5px;
}

.About-Left{
	float:left;
}

.About-Right{
	float:right;
}

.About-Title{
	text-align:Center;
	font-size:30px;
	font-weight:400;
}

.About p{
	word-wrap:break-word;
	font-size:1.2em;
	padding:0 5px;
	max-width:580px;
}
@media (max-width:620px){
	.About-Left, .About-Right{float:initial;}
	.About{width:initial;}
}
/*Links*/
.section a, #ti_nav_links a{
	color: #dd3333;
	text-decoration: none;
}

.section a:hover, #ti_nav_links a:hover{
	text-decoration: underline;
}

.ui-state-active a,.ui-state-active a:link,.ui-state-active a:visited{color: #3333dd;} /*The "Orange" active links*/

.fg-menu a:link,.fg-menu a:visited,.fg-menu a:hover,.fg-menu a:active{color:#dd3333;} /*Printed reports and similar links*/

/*Contacts div*/
.ESI-contacts {
	margin: auto;
	height:100%;
	overflow:hidden;
	text-align: center;
}

.ESI-contacts::after {
	content:"";
	display: inline-table;
}

.ESI-contacts-region {
	max-width: 50%;
	display: inline-block;
	padding: 10px;	
	text-align: left;
}
/*End Contacts*/
/*Criteria Mobile*/
	@media (max-width: 750px) {
	.criteria_columns{
		width:100%;
		float:initial;
	}
}
/*End Criteria*/
/*Pump display overrides*/
#graph_image_container{width:initial !important;}
#graph_image_container img{max-width:100%;}