/*Custom css for Rod Barbee Photo Workshops site*/

	
	
	/*Dynamic Mastead======================================================*/
	html #masthead .mantle {
	padding: 0;
	}
	
	html #masthead .mantle h1  {
	background-image: url(/phplugins/images/Barbee_masthead_workshops-1x.png);
	height: 285px;
	background-position: center top;
	}
	
	@media 
screen and (-moz-min-device-pixel-ratio: 2), 
screen and (-o-min-device-pixel-ratio: 2/1), 
screen and (-webkit-min-device-pixel-ratio: 2), 
screen and (min-device-pixel-ratio: 2) 
{
	html #masthead .mantle h1  {
		background-image: url(/phplugins/images/Barbee_masthead_workshops-2x.png);
		background-size: contain;
		}
	}
	
	@media 
screen and (max-width: 768px) 
{
	 html #masthead .mantle {
		padding: 0;  
		}

	html #masthead .mantle h1  {
		background-image: url(/phplugins/images/Barbee_masthead_workshops-tablet-1x.png);
		height: 192px; /* height of standard-res image for tablets */
		background-position: center top;
		background-size: contain;
		}
	}

@media 
screen and (max-width: 1023px) and (-moz-min-device-pixel-ratio: 2), 
screen and (max-width: 1023px) and (-o-min-device-pixel-ratio: 2/1), 
screen and (max-width: 1023px) and (-webkit-min-device-pixel-ratio: 2), 
screen and (max-width: 1023px) and (min-device-pixel-ratio: 2) 
{
	html #masthead .mantle h1  {
		background-image: url(/phplugins/images/Barbee_masthead_workshops-tablet-2x.png);
		background-position: center top;
		background-size: contain;
		
		}
	}
	
	@media 
screen and (max-width: 480px) 
{
	html #masthead .mantle {
		padding: 0;  /* optionally adjust padding around masthead */
		}

	html #masthead .mantle h1  {
		background-image: url(/phplugins/images/Barbee_masthead_workshops-mobile-1x.png);
		background-position: center top; /* center align the masthead on Phones */
		height: 80px; /* height of standard-res image for phones */
		
		}
	}

@media 
screen and (max-width: 480px) and (-moz-min-device-pixel-ratio: 2), 
screen and (max-width: 480px) and (-o-min-device-pixel-ratio: 2/1), 
screen and (max-width: 480px) and (-webkit-min-device-pixel-ratio: 2), 
screen and (max-width: 480px) and (min-device-pixel-ratio: 2) 
{
	html #masthead .mantle h1  {
		background-image: url(/phplugins/images/Barbee_masthead_workshops-mobile-2x.png);
		background-size: contain;
		}
	}
	
	
/*Mobile menu styling
=================================================*/
@media only screen and (max-width: 784px) {
#nav span a, 
#nav span a:hover, 
#nav > span:first-child > a, 
#nav li a, 
#nav li a:hover, 
#nav li span, 
#nav li li a, 
#nav li li span,  
#nav > li:first-child > a 	{
text-align: left;
}

.js #r2d2-menu ul#nav li {
		width: 100%;
		}
.js #r2d2-menu #nav li.has-submenu > a.expand-submenu {
	padding-left: 8px;
	width: 35%;
	width: calc(35% - 3px);
		}
}

/*restore borders to captioned images
=======================================================*/
.wp-caption img.border {
	border:1px solid black;
}

/*Circular image
======================================================*/
.circle-100 {
	border-radius: 100%;
}



/* :target styling for jumps to pricing
======================================================*/
:target {
	background: white;
	padding: 0 10px;
	margin-bottom: 10px;
	border: 1px solid black;
	box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 1);
	}
	
	
/*Font size control for FAQ
=====================================================*/
	
	h3.qa-faq-title {
		font-size: 16px;
		line-height: 0;
	}
/*FAQ list marker
=======================================================*/
	
	.qa-faq h3::before {
		content: "\00BB";
		margin-right: 6px;
	}
	
/*Sidebar styling
==========================================================*/
	
	#secondary-content {
		background-color: #FFF;
		padding: 12px;
	}
	
/*Button styling
=============================================================*/
	
	.button-glare:hover {
		background-color: #286212;
		color:#EA8143;
	}
	
/*Trip Insurance text widget styling
=============================================================*/
	
	#text-4.widget {
		padding: 8px;
		border: 1px solid black;
		background-color: #e2e2e2;
	}
	
/*Hide Delivery Method in Cart
===============================================================*/
	
	.delivery-method {
		display: none;
	}
	
/*Hide checkout warning
=============================================================*/
	
	.checkout-warning {
		display: none;
	}


/*Cart input field height fixed
==========================================================*/
	
	select, input[type="file"] {
    height: 32px;
}

/*remove padding from product select box*/
	select {
	padding: 0;
}
	
/*Questionnare contact form 7 styling
==========================================================*/

/*Contact Form7 label styling	*/
	.wpcf7-form label {
	margin-bottom: 0;
	font-size: .875em;
	font-weight:normal;
	line-height: 1em;
	}
	
	/*Submit button styling*/
	
	#wpcf7-f1055-p1056-o1 .wpcf7-form	 input[type="submit"] {		
	padding: 18px 60px;
	font-size: 1.5em
	}
	
	#wpcf7-f1055-p1056-o1 .wpcf7-form input[type="submit"]:hover {
	background-color: #777;
	color: #F4A166;
	box-shadow: inset 0px  0px 10px #000;
}

	.wpcf7-form input[type="checkbox"], input[type="radio"] {
		margin-top:0px;
	}


/*Google Maps styling
============================================================*/
.wpgmp_map_container {
	border: 1px solid black;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
}
	
	
	
/*Bell ring animations
===========================================================
	
@-webkit-keyframes bellringleft {
	from {
		-webkit-transform: rotate(20deg);		
		}
	to	{
		-webkit-transform: rotate(-20deg);		
		}
	}	

@keyframes bellringleft {
	from {
		transform: rotate(20deg);		
		}
	to	{
		transform: rotate(-20deg);		
		}
	}

	
@-webkit-keyframes bellringright {
	from {
		-webkit-transform: rotate(-30deg);		
		}
	to	{
		-webkit-transform: rotate(30deg);		
		}
		}
	
@keyframes bellringright {
	from {
		transform: rotate(-30deg);		
		}
	to	{
		transform: rotate(30deg);		
		}
		}
				
			
.bellLeft {
		color: red;
		display:inline-block;		
		-webkit-animation: bellringleft 2.5s linear infinite alternate;	
		animation: bellringleft 2.5s linear infinite alternate;		
		
		}
		
.bellRight {	
		color: green;
		display: inline-block;		
		-webkit-animation: bellringright 2s linear infinite alternate;
		animation: bellringright 2s linear infinite alternate;		
		}		
========================================================================*/
		
	
	