/*
Theme Name: Storefront Child
Description: Strefront Child Theme
Author: C'est Moi
Author URI: lesnaive@gmail.com
Template: storefront
Version: 1.0.0
*/




.site-header-cart, .storefront-handheld-footer-bar ul .cart  {
	display:none;
}

body {

	font-family:"Open Sans", sans-serif;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
}



.site-header {

	padding-top:0;

/*
	width:100%;
*/

	min-width:100%;
	max-width:100%;

	height:auto;
	background-size:100%;

	background-position:top;
	background-repeat: no-repeat;
}


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

	.main-navigation, .site-header-cart  {	
		margin-top:14%;
	}
}


@media screen and (min-width: 780px) {

	.main-navigation, .site-header-cart  {	
		margin-top:17%;
	}
}

@media screen and (min-width: 1250px) {

	.main-navigation, .site-header-cart  {	
		margin-top:20%;
	}
}


@media screen and (min-width: 1400px) {
	.main-navigation, .site-header-cart {	
		margin-top:25%;
	}
}

@media screen and (min-width: 1650px) {
	.main-navigation, .site-header-cart {	
		margin-top:27%;
	}

}

@media screen and (min-width: 1800px) {
	.main-navigation, .site-header-cart {	
		margin-top:33%;
	}
}

@media screen and (min-width: 2000px) {
	.main-navigation, .site-header-cart {	
		margin-top:38%;
	}
}

@media screen and (min-width: 2150px) {
	.main-navigation, .site-header-cart {	
		margin-top:45%;
	}
}

@media screen and (min-width: 2600px) {
	.main-navigation, .site-header-cart {	
		margin-top:50%;
	}
}


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

	.main-navigation {	
		margin-top:30%;
	}

	.site-header-cart {
		margin-top:0%;
	}

}


.main-navigation ul.menu>li>a, .main-navigation ul.nav-menu>li>a, .site-header-cart .cart-contents  {
	padding:6px;
}


.menu ul .page_item, .menu-item {
	background-color:white;
	border: 1px solid transparent;
	border-radius:6px;
	-moz-border-radius:6px;
}

.menu ul .page_item, .menu-item, .cart-contents {

	font-size:large;
}

.menu ul .page_item:hover, .menu-item:hover {
/*	background-color:#D7EFF9;*/
	background-color:#ffefff;
	border: 1px solid #97A7AE;
}



/* composer table for mobile - centering the images and text */
/* use the exact post id number for this */

.post-213 .ml-table a:nth-child(1), .post-213 .ml-table a img  { 

	display:block;
	text-align:center;
	margin:auto;
}


/* product page */

.pay-methods {
	background-color:#00BCF2;
	border-radius:8px;
	-moz-border-radius:8px;
	padding: 5px 0px 4px 20px;
	margin-bottom:5px;
	color:white;
	font-weight:700;
}

.pay-methods a {
	color:white;
}

.paymethod td {
	padding:0 0 0 0px;
}


.comptable, .singertable {

	max-width:100%;

}

.comptable td, .singertable td {
	padding:0 0 0 20px;
}



.zoomplayer {	
	border:4px solid #C6CED4;
	border-radius:10px;
	-moz-border-radius:10px;
	padding:13px;
}


.masterclass {

	min-width:100%;
	max-width:100%;
	height:auto;

	background-image: url("../../../front/images/masterclass1a.jpg");
	background-size:100%;

	background-position:top;
	background-repeat: no-repeat;

}


.masterclass .masterspan {
	whitespace:nowrap;
	font-size:3vw;
	color:white;
}

.masterclass table tbody td {
	background-color:transparent;
	padding:0 20px 0 0;
	line-height: 110%;
}


.ml-responsive-table dt:first-child {
	padding-top:0px;
}


@media screen and (min-width: 1350px) {

	.masterclass .masterspan {
		font-size:2.5vw;
		color:white;
	}
}



@media screen and (min-width: 2000px) {

	.masterclass .masterspan {
		font-size:1.5vw;
	}
}



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

	.masterclass {
		background-color:#0092C3;
	}

	.masterclass table tbody td {
		text-shadow: 1px 1px #222222;
	}
}

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

	.masterclass {
		background-image:none;
		background-color:#016A8D;
	}

	.masterclass .masterspan {
		font-size:0;
		color:transparent;
	}

	.masterclass .masterspan::after {
			content: url(../../../front/images/masterclass-650-nu.jpg);
			display:block;
	}

}


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

	.masterclass {
		background-image:none;
		background-color:#016A8D;
	}

	.masterclass .ml-table {
		text-shadow: 1px 1px #222222;
		min-height:0px;

	}

	.masterclass .ml-empty {
		padding:0;
		margin-bottom:0px;
	}

	.masterclass .masterspan {
		font-size:3.5vw;
		color:white;
	}

	.masterclass .masterspan::after {
			content: url(../../../front/images/masterclass-500.jpg);
			display:block;
	}

}


@media screen and (max-width: 600px) {
	.masterclass .masterspan::after {
			content: url(../../../front/images/masterclass-430.jpg);
			display:block;
	}

}

@media screen and (max-width: 500px) {
	.masterclass .masterspan::after {
			content: url(../../../front/images/masterclass-270.jpg);
			display:block;
	}

}

.addtocart {
	margin:0;

	background-color:transparent;
	color:white;
	font-size:xx-large;
	padding-bottom:25px;
}

.addtocart .add_to_cart_button {
	margin-top:8px;
	margin-left:8px;
	border:3px solid white;
	border-radius:12px;
	color:black;
	background-color:#C6CED4;
	font-size:large;
}

.addtocart .added_to_cart {
	border:3px solid red;
	border-radius:12px;
	color:black;
	background-color:#24C866;
}




table th {
	background-color: transparent;
}

table tbody td {
	background-color: transparent;
}

table tbody tr:nth-child(2n) td {
	background-color: transparent;
}


/*  navigation  */





.home.blog .site-header, .home.page:not(.page-template-template-homepage) .site-header, .home.post-type-archive-product .site-header, .no-wc-breadcrumb .site-header, .site-header {

	margin:0px;
	margin-bottom:10px;

}




/*@media screen and (max-width: 768px){*/

@media screen {

  .menu ul .page_item, .menu ul li{
  	display: none;
  }

  .menu ul .page-item-213,  .menu ul .page-item-100, .menu ul .page-item-1438, .menu ul .page-item-1436, .menu ul .page-item-1585, .menu ul .page-item-2 {
  	display: list-item;
  }

}



.primary-navigation {
/*	margin-top:165px;*/


}

.storefront-primary-navigation {

	background:none;
	border-bottom:1px solid blue;
}


.main-navigation, .site-header-cart {	
	margin-top:22%;
}






button.menu-toggle, button.menu-toggle:hover {
	background-color: transparent;
}


button.menu-toggle, button.menu-toggle:hover {
	border-color: #00294E;
	color: #00294E;
}


button.menu-toggle {
	border-radius:5px;
	-moz-border-radius:5px;
}

button.menu-toggle:focus {
	outline:0;
}








.main-navigation ul li a:before {
	display:none;
}



/* --- FRONT PAGE --- */ 


.fp-icondiv {
	display:inline-block;
/*	
	text-align: center; 
*/
	height:80px;
	vertical-align: middle;
	padding-right:10px;
}

.fp-icondiv img {
	max-width:71px;
}

.fp-text {
	vertical-align: top;
	display:inline-block;
	width:80%;
	font-weight:bold;
}



/* individual composer page */

.ml-responsive-table dl:nth-of-type(odd) {
  background: rgba(0, 0, 0, 0);
}

.composer-container {
	border-radius:8px;
	-moz-border-radius:8px;
	border:3px solid white;

	box-shadow: 3px 4px 10px 3px #aaa;	
	-webkit-box-shadow: 3px 4px 10px 3px #aaa;
	-moz-box-shadow: 3px 4px 10px 3px #aaa;
	display:inline-block;
	position: relative;
}
.composer-img {
	border-radius:8px;
	-moz-border-radius:8px;
	vertical-align:middle;

	display: block;
	max-width: 100%;
	height: auto;

}

.comptable tbody tr td li a, .comptable tbody tr td li {
	font-weight:500;
}

.composerdate {

	z-index: 100;
	position: absolute;
	color: white;
	font-size: 1.6vw;
	font-weight:650;

	text-shadow: 1px 1px #222222;

	width:100%;
/* 
	margin-left:0;
	margin-right:0;
	text-align:center;
	margin-bottom:-20px;
*/

	top: 80%;
	left:0px;

}

.work-title {
	background-color:#00294E;
	border-radius:8px;
	-moz-border-radius:8px;
	padding: 5px 0px 4px 20px;
	color:white;
	font-weight:700;
}



/* woocommerce */ 

/* store front */

form.cart {
	width:50%;

}


.woocommerce-breadcrumb {
	display:none;
}



.site-search {
	display:none;
}

.storefront-handheld-footer-bar ul .search {
	display:none;
}


.storefront-handheld-footer-bar ul {
	margin-left:65px;
}



.product_description, .product_description tr, .product_description th, .product_description td {
	padding:0;

}



.addtocart .woocommerce-Price-amount::before  {
/*	display:none;*/
	content: "Price - ";
	font-weight:bold;
	padding-right:5px;
}

.addtocart .woocommerce-Price-amount {
	font-weight:bold;
	padding-right:5px;
}



.woocommerce-MyAccount-navigation ul   .woocommerce-MyAccount-navigation-link--wc-smart-coupons{

	display:none;

}






/* composers */



#composers a, #composers  a:visited, #composers  a:hover,#composers  a:active,#composers a:link  {
	text-decoration:none;
}


#composers {

	width:75%;

	font-family: 'Open Sans', sans-serif;

/*font-size:50%;*/

	font-size:1.2vw;

	font-weight:normal;

	border:0px;
	background:white;
/*	padding-left:120px;*/

}


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

	#composers {
		width:90%;
		font-size:1.4vw;

	}
}

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

	#composers {
		width:100%;
		font-size:1.7vw;

	}
}

#composers td {
	border:3px solid rgba(0,0,0,0);
	border-radius:8px;
	-moz-border-radius:8px;

	/*width:100px;*/

	max-width:120px;

/*	min-width:86px;*/

	text-align:center;

	padding:5px;
}

#composers td, #composers td a {

}

#composers td a {

	text-transform: uppercase;
	cursor:pointer;
	display:block;
 	padding: 5px;
	margin: -5px;
}


#composers td img {
	display: block;
	margin: 0 auto; 
}


#composers td span::before { 
/*
	content: "Titles Available:";
	display:block;
	display:none;
	text-decoration:underline;
	font-size:14px;
	font-weight:bold;
	padding-bottom:10px;
*/
}

#composers td span  {
/*
	display:none;


	color:darkblue;

	padding:7px;

	height:115px;
	border:2px solid darkblue;
	border-radius:9px;
	-moz-border-radius:9px;

	position:fixed; 
	left:15px;
	top:50%;

	font-size:12px;

	width:145px;
	max-width:145px;
*/

}

#composers td img {
	padding-bottom:10px;

	-webkit-filter: grayscale(70%) opacity(80%); /* Safari */
	filter: grayscale(70%) opacity(80%);

}

#composers td:hover {
	border:3px solid #7F49CB;
}

#composers td:hover span {
/*	display:block;*/

	display:none;
}


#composers td:hover img {


	-webkit-filter: grayscale(0%) opacity(100%); /* Safari */
	filter: grayscale(0%) opacity(100%);
}






/*  the player  */ 


.ap-controls-right::before {

/*
content: url(http://chordperfect.com/front/images/player/cp.png);
	display:block;
	left:-300px;
	font-weight:bold;
	color:blue;
	text-shadow:1px 1px #bbb;
*/
}

.ap-controls-right .controls-volume {
	left:-30px;
}

.is-single-player, .zoomlist, .zoomfx {
	border:3px solid white;
	border-radius:10px;
	-moz-border-radius:10px;
	padding:15px;
	box-shadow: 0px 0px 8px 4px #090c6c;
}

.is-single-player {
	max-width:75%;
}

.ap_addons {
	z-index:1000;
	float:left;
	margin-bottom:5px;
}

.ap_addons a {
	display: inline-block;
	padding-right:3px;
}