/* Layout Small Screens */
.header { 
  height: 72px; 
}
  .header a.logo { 
	width: 164px; 
	height: 52px; 
	top: 10px; 
	left: 20px; 
	background-position: 0 -73px;
  }

.page, 
.footer, 
.container, 
.promo_container .promo {
  width: auto;
}

.promo_container { 
  padding: 0; 
}
  .promo_container .promo {
	float: none;
	min-height: 94px;
	padding: 18px 0px 0px 0px;
	background-position: 20px 20px;
	border-bottom: 1px solid #eee;
  }
	.promo_container .promo .content { 
	  padding: 0px 20px 5px 150px; 
	}
	
.footerContainer { 
  min-width: 0;
}
  .footerContainer .footer .copyright { 
	  float: none; 
	  margin-bottom: 10px;
	}
	.footerContainer .footer ul { 
	  float: none; 
	  margin: 0 0 0 20px;  
	}
	.footerContainer .footer ul li { 
		float: left; 
		list-style: none;
	    margin: 0 15px 0 0;
	  }	
	
/* Menu */
.product-list {
  margin: 45px 5px 0 0;
}
  .product-list ul li div.products-show {
	width: 100%;
	right: 0;
  }
  .product-list > ul > li > a {
	padding-bottom: 6px;
  }

/* Banner */
.banner .content { 
  background: url("../images/shield-small.png") no-repeat; 
}
.banner .content h3, 
.banner .content p.topCopy,
.banner .content p.longCopy { 
  display: none; 
}
.banner .content p.shortCopy { 
  display: block; 
  padding-top: 22px; 
}
.banner.zero .cta a { 
   background: #fff url("../images/blue-caret-small.png") 90% 50% no-repeat;
}
.banner.three .content p.shortCopy,
.banner.five .content p.shortCopy { 
  padding-top: 10px; 
}
.banner .content p.shortCopy { 
  display: block; 
  padding-top: 22px; 
}
.banner .cta { 
  margin: 10px 0 30px 0;  
}
  .banner .cta a { 
	font-size: 12px; 
	padding: 3px 18px 2px 10px;
	 background: #B71234 url("../images/caret-small.png") 90% 50% no-repeat;
  }
    
.banner .content p.shortCopy { 
  background: none; 
  margin: 0;
  padding-right: 10px;
}

.banner .buttons { 
  background-position: 0 -77px; 
  margin: 0 0 15px 0; 
}
  .banner .buttons a { 
	clear: both; 
	width: 90px; 
	height: 27px; 
	margin: 0 1px 1px 0; 
  }
	.banner .buttons a.appleButton { 
	  background-position: 0 -154px; 
	}
	.banner .buttons a.googleButton { 
	  background-position: 0 -183px; 
	}

/* Banner Slideshow Controls */
ul.slidesjs-pagination {	
  bottom: 10px;
}
  .slidesjs-pagination li a {
	margin: 0 5px;
  }  
  

/* Product Page Styles */ 
.product h3 {	  
  font-size: 20px;
} 
.product .blueContainer,
.product .whiteContainer,
.product .grayContainer,
.product .darkContainer {
  padding: 20px 0;
} 
.product .promo_container,
.product .productContainer,
.product .blueBanner {
  font-size: 12px;
  line-height: 16px;
}
.product .blueBanner h1 {
  font-size: 28px;
  line-height: 30px;	
} 
.product .blueBanner p {
  font-size: 13px;
  line-height: 20px;
  margin-bottom: 20px;  
}  
  .product .blueBanner a.cta {
	  font-size: 12px;
	  margin: 5px;
	}
.product .blueBanner .half,
.product .half.diagram {
  float: none;
  width: 100%;
} 
  .product .half.diagram img {
	float: none;
	width: 100%;
	margin-top: 20px;
  } 
.product .blueBanner .half {
  text-align: center;
}  

.product .promo_container { 
  padding: 0; 
}
  .whiteContainer .half {
	width: 100%;  
  }
  .product .half.compatible {
	width: 100%;  
  }
  .product .promo_container .promo {
	float: none;
	min-height: 80px;
	padding: 0;
	background-position: 0px;
	border-bottom: 0;
  }
  .product .promo_container .promo .content { 
	  padding: 0 0 0 115px; 
	}
.product .oneFourth {
  width: 50%; 
}	
.product .half,
.product .oneThird {
  width: 100%;
  float: none;  
}	
.product .whiteContainer .compatible h4,	  
.product .whiteContainer .compatible p,
.product .whiteContainer .compatible ul {     
  margin-left: 0;
}



/* Berserk Styles */
.product.berserk .blueContainer h1 {
	padding-top: 0;
	font-size: 28px;
}
.product.berserk .blueBanner .half {
	width: 100%;
  	text-align: left;
	float: none;
} 	
.product.berserk .darkblue {
	background: #004280;
	width: 100%;
	float: none;
}
.product.berserk .darkblue h3 {
	padding-top: 20px; 
}
.product.berserk img.diagram {     
	 width: 100%;
	}
.product.berserk img.berserkShield {     
	 float: right;
	 margin-left: 10px;
	 margin-bottom: 10px;
	}
	
#tabs {
	display: block;
	width: 100%;
}
#tabs li {
	display: block;
	margin: 0;
}

/*Brightcove*/
.BrightcoveExperience {
  width: 100%;
}
.product .half h1 {
  margin-top: 10px;
}