/* --------------------- *** ---------------------
  Color Palette
  Yellow  #ffd51B;
--------------------- *** --------------------- */


/* --------------------- *** ---------------------
   Body Styles
--------------------- *** --------------------- */
body { color: #fff; font-family: 'Dosis', sans-serif; font-weight: 400; letter-spacing: 0.05em;  margin: 0 auto; }

p { margin: 0 auto; font-size: 35px; line-height: 1.75em; text-align:left; }

h1, h2, h3, h4, h5 { font-family: 'Dosis', sans-serif; text-align: center; font-weight: 400; letter-spacing: 0.05em; color: #ffd51B; margin: 0 auto; line-height: 1.125; }

h1 { font-size: 77px; background-color: #000; padding: 45px 40px 50px; }
h2 { font-size: 85px; }
	h2 p { font-size: 85px; background-color: #000; padding: 8px 42px 12px; display: inline-block; margin-bottom: 70px; text-align: center; line-height: 1; }
	h2 p.press { margin-bottom: 25px; }
  h2 p a { text-decoration: none !important; }
h3 { font-size: 44px; background-color: #000; padding: 5px 16px 10px; display: inline-block; text-align: center; margin: 18px auto 50px !important; }
h4 { font-size: 63px; color: #fff; }
	h4 p { font-size: 63px; background-color: #000; padding: 8px 42px 12px; display: inline-block; margin-bottom: 0; text-align: center; line-height: 1; }
h5 p { font-size: 44px; background-color: #000; padding: 0 18px 10px !important; display: inline-block; text-align: center; margin: 0 auto 35px !important; }

@media only screen and (max-width: 640px) { 
h1, h2, h3 { padding: 20px; margin: 0 auto; line-height: 1; }
h1 { font-size: 60px; line-height: 1; }
h2 { font-size: 45px; }
  h2 p { font-size: 45px; margin-bottom: 10px; padding: 8px 25px 12px; }
h3, h5 p { font-size: 30px; }
h4 { font-size: 35px; }
  h4 p { font-size: 35px; padding: 8px 25px 12px; }
}

a { color: #ffd51B; text-decoration: underline; }
a:hover { text-decoration: none; }

::selection { background: #ffd51B; color: #fff; /* Safari Highlight Change */	}
::-moz-selection { background: #ffd51B; color: #fff; /* Firefox Highlight Change */ }

img { border: 0; }

ul { margin-left: 0; }
ol li, ul li { list-style-position: outside; margin-left: 15px; margin-top:0.5em; line-height: 1.5em; text-align: left; }

hr { border: 0; margin: 35px auto;
    height: 1px;
	background-color: #ffd51B;
	clear: both;	 
}

.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
.cf { zoom: 1; }

.center { text-align:center; margin-right: auto; margin-left: auto; }
.push-sm { margin-top: 15px; }
.push { margin-top: 30px; }
.push-more { margin-top: 55px; }
.boxed { background-color: #000; padding: 20px 40px 25px; margin-top: 40px; display: inline-block; margin-left: auto; margin-right: auto; left: 0; right: 0; }


/* --------------------- *** ---------------------
  Nav Pop-Up Styles
--------------------- *** --------------------- */
ul.social-header { text-align: center; list-style: none; margin: 0; padding: 0; margin-top: 30px !important; }
ul.social-header li { display: inline-block !important; }
ul.social-header li img { height: 52px; width: auto; padding: 0 5px; }

@media screen and (max-width: 640px) {
  ul.social-header { margin-top: 25px !important; }
  ul.social-header li img { height: 45px; }
}


/* --------------------- *** ---------------------
  Main Video Styles
--------------------- *** --------------------- */
#main-video .logo-overlay { width: 100%; height: 100%; background-repeat: repeat; background-position: 50% 50%; background-size: 220% auto; position: absolute; 
	-webkit-box-shadow:inset 0 0 200px 150px rgba(0,0,0,.75);
	box-shadow:inset 0 0 300px 100px rgba(0,0,0,.75);
}

@media screen and (max-width: 768px) {
	#main-video .logo-overlay {
		-webkit-box-shadow: none;
		box-shadow: none;
		background-size: 300% auto;
	}

}


/* --------------------- *** ---------------------
  Bio Text Styles
--------------------- *** --------------------- */
#bio-news { background: url('../img/2_repeatable_pattern_2x.png'); background-repeat: repeat-x; background-size: contain; padding-top: 120px; padding-bottom: 120px; }

#bio-text { background: url('../img/2_repeatable_pattern_2x.png'); background-repeat: repeat-x; background-size: contain; /*no-repeat center center; background-size: cover; */padding-top: 120px; padding-bottom: 80px; }
#bio-text h1 { font-size: 50px; }

p.bio { font-family: 'Dosis', sans-serif; text-align: center; font-weight: 400; letter-spacing: 0.05em; color: #ffd51B; margin: 0 auto; line-height: 1.125; background-color: #000; padding: 45px 40px 50px; }
  p.bio.x-large { font-size: 55px; }
  p.bio.large { font-size: 50px; }
  p.bio.medium { font-size: 45px; }
  p.bio.small { font-size: 40px; }
  p.bio.x-small { font-size: 35px; }

@media screen and (max-width: 640px) {
/*#bio-text { padding-top: 100px; padding-bottom: 120px; } */

p.bio { padding: 20px; margin: 0 auto; line-height: 1; }
  p.bio.x-large { font-size: 34px; }
  p.bio.large { font-size: 30px; }
  p.bio.medium { font-size: 21px; }
  p.bio.small { font-size: 18px; }
  p.bio.x-small { font-size: 15px; }
}


/* --------------------- *** ---------------------
  Blog Feed Styles
--------------------- *** --------------------- */
#blog-feed { background: url('../img/bkg_pattern_shop.gif') no-repeat top center; background-size: cover; padding-top: 30px; padding-bottom: 100px; }
#blog-feed h5 { margin-top: 35px; }

.mmg-rss-feed-block { width: 33.333%; float: left; vertical-align: text-top; padding: 0; padding-bottom: 20px; margin: 0; }

.mmg-rss-feed-block p { font-size: 20px; line-height: 1.25em; text-align: center; max-width: 90%; margin-top: 6px; }
.mmg-rss-feed-block a { text-decoration: none; text-align: center; font-size: 24px; }
.mmg-rss-feed-block p.rss-title { margin-top: 17px; }
.feed-thumb { max-width: 100%; width: 100%; height: auto; }
.feed-thumb:hover { opacity: 0.7; }

@media screen and (max-width: 640px) {
  .mmg-rss-feed-block  { width: 100%; float: none; padding-bottom: 30px; }
}


/* --------------------- *** ---------------------
  Music Styles
--------------------- *** --------------------- */
#music-list { background: url('../img/music-madame-gandhi.jpg') no-repeat center right; background-size: cover; padding-top: 125px; padding-bottom: 125px; }

@media screen and (max-width: 640px) {
  #music-list { padding-top: 62px; padding-bottom: 106px; }
}


#music-bttns { text-align: left; padding-left: 50px; }
#music-bttns img.play { width: 275px !important; height: auto; padding-bottom: 4px; display: block; padding-bottom: 4px; }

#spotify iframe { width: 356px !important; height: 420px !important; }

@media screen and (max-width: 710px) {
  #music-bttns { text-align: center !important; padding-left: 0; }
  #music-bttns a img.play { width: 247px !important; height: auto; text-align: center margin-bottom: 4px; margin-left: auto; margin-right: auto; }
  #spotify iframe { text-align: center !important; width: 300px !important; height: 320px !important; }
}


/* --------------------- *** ---------------------
  Video Playlist Styles
--------------------- *** --------------------- */
#playlist { background: url('../img/bkg_pattern_video.gif') no-repeat top center; background-size: cover; padding-top: 100px; padding-bottom: 225px; }
.playlist-video { border: 6px solid #ffd51B; width: 100%; text-align: center; vertical-align: middle; }
.playlist-video img { width: 100%; }

#mg_playlist { max-width: 1000px; padding: 0; border: 10px solid #ffd51B; }

@media screen and (max-width: 640px) {
	#playlist { padding-top: 50px; padding-bottom: 112px; }
  .playlist-video { border: 3px solid #ffd51B; }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
	#mg_playlist { max-width: 750px; }
}


/* --------------------- *** ---------------------
  Main Image Styles
--------------------- *** --------------------- */
#main-image { z-index: 1; }
#main-image img { width: 100%; height: auto; }


/* --------------------- *** ---------------------
  Store Styles
--------------------- *** --------------------- */
#shop { background: url('../img/bkg_pattern_shop.gif') no-repeat top center; background-size: cover; padding-top: 102px; padding-bottom: 175px; }
#shop img{ width: 100%; height: auto; text-align: center; vertical-align: middle; background-color: #000; }

@media screen and (max-width: 640px) {
  #shop { padding-top: 35px; padding-bottom: 60px; }
}


/* --------------------- *** ---------------------
  Tour Dates Styles
--------------------- *** --------------------- */
#tour-dates { background: url('../img/bkg_pattern_tour.gif') no-repeat center center; background-size: cover; padding-top: 142px; padding-bottom: 135px; }
.tour-box { background-color: rgba(0,0,0,0.8); padding: 50px 70px 40px; }
.tour-box p { line-height: 1; padding: 6px; }
.show-all-link { margin-top: 20px; }

@media screen and (max-width: 640px) {
  #tour-dates h2 { margin-top: 0; }
  .tour-box { padding: 25px 15px 30px; }
	.tour-box p { font-size: 23px; }
}
@media screen and (max-width: 768px) {
	#tour-dates {
		background-repeat: repeat;
		background-size: auto;
	}
}
@media screen and (max-width: 1024px) {
  #tour-dates { padding-top: 70px; padding-bottom: 66px; }
  .tour-box section { margin-bottom: 40px; }
}

#tour-dates table { width: 100%; }
#tour-dates tbody { background-color:transparent; border: 0; font-size: 35px; line-height: 1; }
#tour-dates tr { background-color:transparent; }
#tour-dates td { }

.tour-hidden { display: none; }

.reveal.full { background: rgba(10,10,10,1); padding: 50px; width: 100%!important; }
/*.reveal.full .close-button { font-size: 50px; top: 10px; }
.reveal.full .close-button:hover { color: #fff; }*/


/* --------------------- *** ---------------------
  Parallax Styles
--------------------- *** --------------------- */
[class*="bg__"] {
  height: 50vh;

  /* fix background */
  background-attachment: fixed;

  /* center it */
  background-position: center center;

  /* Scale it nicely to the element */
  background-size: cover;

  /* just make it look a bit better ;) */
  &:nth-child(2n) {
    box-shadow: inset 0 0 1em #111;
  }
}

.bg__mgp1 {
  background-image: url(
    '/wp-content/themes/jpdstudio_1016/img/madame_gandhi_parallax_part_1.jpg'
  );
}

.bg__mgp2 {
  background-image: url(
    '/wp-content/themes/jpdstudio_1016/img/madame_gandhi_parallax_part_2.jpg'
  );
}

@media screen and (max-width: 767px) {
    .mt-wrapper {
        background: url('/wp-content/themes/jpdstudio_1016/img/madame_gandhi_mob_bg2.jpg') repeat-y; 
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .mt-wrapper {
        background: url('/wp-content/themes/jpdstudio_1016/img/madame_gandhi_parallax_part_2.jpg') repeat-y;
    }
}

@media screen and (min-width: 1025px) {
    .parallax {
        display: block!important;
    }
    .mob-tab-parallax {
        display: none!important;
    }
}

@media screen and (max-width: 1024px) {
    .parallax {
        display: none!important;
    }
    .mob-tab-parallax {
        display: block!important;
    }
}



/* --------------------- *** ---------------------
  Words of Empowerment Styles
--------------------- *** --------------------- */
#words-of-empowerment { text-align:center; }
#words-of-empowerment .lettering-graphic { padding: 20px auto 0 auto; }


/* --------------------- *** ---------------------
  The Future is Female Styles
--------------------- *** --------------------- */
#future-is-female { background-size: 50%; }

.quote-wrapper { width: 80%; max-width: 1090px; margin: 0 auto; text-align: center; padding: 295px 0; }
.gold { color: #ffd51B; }

.quote { font-size: 70px; line-height: 1.1; margin-bottom: 50px; }
  .quote.x-large { font-size: 80px; }
  .quote.large { font-size: 70px; }
  .quote.medium { font-size: 60px; }
  .quote.small { font-size: 50px; }
  .quote.x-small { font-size: 40px; }
.quote-name { font-size: 85px; line-height: 1; }
  .quote-name.x-large { font-size: 100px; }
  .quote-name.large { font-size: 85px; }
  .quote-name.medium { font-size: 70px; }
  .quote-name.small { font-size: 55px; }
  .quote-name.x-small { font-size: 40px; }


@media screen and (min-width: 769px) and (max-width: 1024px) {
	.quote-wrapper { padding: 200px 0; }

	.quote { font-size: 55px; margin-bottom: 40px; }
    .quote.x-large { font-size: 65px; }
    .quote.large { font-size: 55px; }
    .quote.medium { font-size: 45px; }
    .quote.small { font-size: 35px; }
    .quote.x-small { font-size: 25px; }
  .quote-name { font-size: 60px; }
    .quote-name.x-large { font-size: 70px; }
    .quote-name.large { font-size: 60px; }
    .quote-name.medium { font-size: 50px; }
    .quote-name.small { font-size: 40px; }
    .quote-name.x-small { font-size: 30px; }
}

@media screen and (max-width: 768px) {
	.quote-wrapper { padding: 100px 0; }

	.quote { font-size: 30px; margin-bottom: 20px; }
    .quote.x-large { font-size: 35px; }
    .quote.large { font-size: 30px; }
    .quote.medium { font-size: 25px; }
    .quote.small { font-size: 20px; }
    .quote.x-small { font-size: 15px; }
  .quote-name { font-size: 40px; }
    .quote-name.x-large { font-size: 45px; }
    .quote-name.large { font-size: 40px; }
    .quote-name.medium { font-size: 35px; }
    .quote-name.small { font-size: 25px; }
    .quote-name.x-small { font-size: 20px; }		
}


/* --------------------- *** ---------------------
  Press Styles
--------------------- *** --------------------- */
#press { background: url('../img/bkg_pattern_press.jpg'); background-repeat:repeat; padding-top: 32px; padding-bottom: 112px; }
#press img { width: 100%; height: auto; }
#press a:hover p { text-decoration: underline; }

h4.press-title { margin-bottom: 55px; }
.press-box .column { margin-bottom: 75px; }
.press-box a {  text-decoration: none; }
.press-box div.logo { background-color: #fff; text-align: center; height: 374px; width: 420px; max-width: 100%; display: table-cell; vertical-align: middle; }
.press-box div.logo img { padding: 30px; max-height: 314px; width: auto; }
.press-box div.text { background-color: #ffd51B; }
.press-box div.text p { color: #000; font-size: 24px; padding: 35px 25px; line-height: 1.25; }

.more-press { background-color: rgba(0,0,0,0.8); padding: 50px 70px 65px; }
.more-press p { line-height: 1.25; padding: 6px; margin-bottom: 5px; }

@media screen and (max-width: 640px) {
	.more-press { padding: 25px 35px 35px; }
	.more-press p { font-size: 28px; padding: 9px; }
	.press-box div.logo { width: 100%; height: auto; min-width: 100%; }
}

@media screen and (min-width: 641px) and (max-width: 769px) {
	.press-box div.logo { height: 250px; }
}

@media screen and (min-width: 770px) and (max-width: 1100px) {
	.press-box div.logo { height: 300px; }
}


/* --------------------- *** ---------------------
  More Styles
--------------------- *** --------------------- */
#more-links { background-color: #ffd51B; padding: 48px 30px 30px; }
.more-stack { z-index: 500; position: absolute; left: 0; right: 0; }
.blog-pad { margin-top: 0; }
.contact-pad { margin-top: 11em; }

@media screen and (max-width: 1023px) {
	.blog-pad { margin-top: 15em; }
  	.contact-pad { margin-top: 0; }
}

@media screen and (max-width: 640px) {
	.blog-pad { margin-top: 8em; }
	.contact-pad { margin-top: 0; }
	.reveal.full { padding: 20px 20px 50px; }
	#Modal_Contact p { line-height: 1.2; }
	#Modal_Contact input, #Modal_Contact textarea { margin-top: 10px; }
	p.email { font-size: 20px; }
}


/* --------------------- *** ---------------------
  Footer Styles
--------------------- *** --------------------- */
footer { clear: both; text-align: center; margin: 0 auto; padding: 20px 20px 85px; text-align: center; color: #000; }

footer p.social-media { text-align: center; }
footer p.social-media img { width: 110px; height: auto; margin: 30px; }

@media screen and (max-width: 640px) {
	footer p.social-media img { width: 60px; height: auto; margin: 20px 8px; }
}

footer p.copyrite { font-size: 16px; color: #000; text-align: center; font-weight: 500; line-height: 1; margin-top: 30px; }
footer p.copyrite span { color: #ffd51B; font-size: 18px; }
footer p.copyrite a { color: #000; }
footer p.copyrite a:hover { color: #888888; }

.fb-follow,
	.twitter-follow-button { vertical-align: middle; }
.twitter-follow-button { margin-top: 6px; }
table.sm-buttons tbody { border: 0; }


/* --------------------- *** ---------------------
  Transitions & Opacity
--------------------- *** --------------------- */
a,
a img,
h3 {
    -webkit-transition: all 0.4s ease 0s; /* Safari and Chrome */
	   -moz-transition: all 0.4s ease 0s; /* Firefox 4 */
	     -o-transition: all 0.4s ease 0s; /* Opera */
		    transition: all 0.4s ease 0s; }

a:hover img,
h3:hover { opacity: 0.4; }

a:hover img.lite-hover { opacity: 0.9; }

.no-hover:hover,
a.no-hover img:hover,
a img.no-hover:hover,
.no-hover a img { opacity: 1; }


/* --------------------- *** ---------------------
  Modal Styles
--------------------- *** --------------------- */
.modal p { line-height: 1.25; margin-bottom: 10px; }
.modal p a { text-decoration: none; }
.modal p span { color: #ffd51B; padding-top: 80px; }

.reveal.modal-content.modal { background-color: transparent; border: 0; width: 65%; max-width: 900px; overflow-y: auto; }
.reveal.modal-content.modal p { line-height: 1; margin-bottom: 0; padding: 6px; }
.reveal.modal-content.modal.tours { width: 88%; max-height: 75%; overflow-y: auto; }

.reveal-overlay { background-color: rgba(0, 0, 0, 0.85); }
.close-button { font-weight: 600; color: #ffd51B; font-size: 50px; font-family: Arial, Helvetica, sans-serif; display: block; }
.close-button:hover { color: #fff; }

@media screen and (max-width: 1024px) {
  .reveal.modal-content.modal { width: 60%; max-height: 80%; }
  .reveal.modal-content.modal.tours { width: 60%; }
  .tour-reveal { width: 60%; margin-left: auto; margin-right: auto; }
}


/* --------------------- *** ---------------------
  Input Styles
--------------------- *** --------------------- */
input,
.input,
.input-search,
textarea { font-size: 35px; padding: 10px 20px; color: #000 !important; height: 70px; }
textarea { max-height: 270px; }
.input-search { background: url('../img/search.png'); background-repeat: no-repeat; width: 100%; padding-left: 45px; }

p.label { color: #ffd51B; font-size: 35px; line-height: 1.75em; text-align:left; margin-top: 40px; margin-bottom: 0; background-color: transparent; display: block; padding: 0; }

.bttn-send { background: url('../img/10_button_send_white_2x.png') no-repeat center center; background-size: 211px 93px; width: 211px; height: 93px; border: 0; font-size: 0; margin: 30px 0 60px; }
.bttn-send:hover { opacity: 0.4; }

@media only screen and (max-width: 640px) { 
	input,
	.input,
	.input-search,
	textarea { font-size: 25px; padding: 22px 20px; }
	textarea { max-height: 155px; }
	p.label { font-size: 20px; line-height: 1.25em; text-align:left; margin-top: 20px; }
	.bttn-send { background: url('../img/10_button_send_white_2x.png') no-repeat center center; background-size: 158px 70px; width: 158px; height: 70px; border: 0; font-size: 0; margin: 10px 0 20px; }
}

::-webkit-input-placeholder { color: #757575; opacity: 1; }
:-moz-placeholder { /* Firefox 18- */ color: #757575; opacity: 1; }
::-moz-placeholder {  /* Firefox 19+ */ color: #757575; opacity: 1; }
:-ms-input-placeholder { color: #757575; opacity: 1; } 


#mc_embed_signup { margin-top: 40px; }
#mce-EMAIL { background-color: #000; color: #fff !important; font-size: 20px; padding: 0 33px; height: 90px; margin-top: 12px; margin-right: 10px; min-width: 250px; max-width: 406px; display: inline-block; }
#mce-EMAIL::-webkit-input-placeholder { opacity: 1; color: #fff; }
#mce-EMAIL::-moz-placeholder { opacity: 1; color: #fff; }
#mce-EMAIL:-ms-input-placeholder { opacity: 1; color: #fff; }
#mce-EMAIL:-moz-placeholder { copacity: 1; color: #fff; }
.bttn-subscribe { background: url('../img/10_button_submit_2x.png') no-repeat center center; background-size: 208px 99px; width: 208px; height: 99px; border: 0; font-size: 0; }
.bttn-subscribe:hover { opacity: 0.4; }

@media screen and (max-width: 320px) {
	#mce-EMAIL { min-width: 200px; max-width: 300px; padding: 40px 10px; margin-right: 0; }

}
@media screen and (max-width: 640px) {
	.bttn-subscribe { background-size: 166px 79px; width: 166px; height: 79px; }
}