/*
Theme Name: Bopgun
Theme URI: 
Author: bopgun
Author URI: https://www.bopgun.com
Description: 
Version: 1.0.0
Text Domain: 
*/

/* 
-----------
ABOVE 1920PX 
-----------
*/
@media screen and (min-width: 1920px) {

.home-hero .carousel .slick-slide {background-size: 1920px auto;}

}
/* 
-----------
BELOW 1920PX 
-----------
*/

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

	.header .podcast {
		margin: 30px -10px 0 20px;
	}
}




/* 
-----------
BELOW 1450PX 
-----------
*/
@media screen and (max-width: 1449px) {

h2 {font-size: 28px;}
h3 {font-size: 20px;}

/* Header */

.header,
.header-background {height: 80px;}
.wrapper.fixed .header.hide {top: -80px;}

.header .top-menu {padding: 30px 0 0 0;}

.header .logo {width: 120px; padding: 20px 0 0 0;}

.header .explore .toggle {margin: 20px 30px 0 -10px;}
.header .explore .title {padding: 30px 0 0 0;}

.header .subscribe p {padding: 30px 0 0 0;}

.header .search {margin: 20px -10px 0 20px;}

.header .subscribe .menu .list .item {padding: 0px 30px 0 0;}
.header .subscribe .menu .socials {padding: 25px 20px 0 0;}
.wrapper.fixed .header.hide .subscribe-panel {top: 80px;}

/* Home */

.home-title {
	height: 200px;
	margin: 0 0 80px 0;
}
.home-title img {width: 300px;}

.home-hero .carousel,
.home-hero .carousel .slick-slide {height: 550px;}

/* Menu */

.main-menu .top {height: 80px;}
.main-menu .top .logo {padding: 25px 0 0 0;}
.main-menu .top .close {margin-top: 20px;}

/* Category */

.category-header .button {padding: 5px 0 0 0;}

/* Tapered */

.tapered .amf-el.competition-question h4 {font-size: 28px;}

.header .podcast {
	margin: 20px -10px 0 20px;
}

.header .podcast-home {
	margin: 20px -10px 0 20px;
}

/* Single */

.single-content .recipe .hero .intro .recipe-intro p {font-size: 20px;}

}

/* 
-----------
BELOW 1280PX 
-----------
*/
@media screen and (max-width: 1279px) {

.fixed-width {
	width: 100%;
	padding: 0 20px;
}

/* Header */

.header .explore {width: auto;}
.header .explore .title {display: none;}
.header .banner {
	height: 100px;
	text-align: center;
	top: -100px;
}
.header .banner p {
	float: none;
	padding: 0 0 10px 0;
}
.header .banner form {
	float: none;
	margin: 0 auto;
}

/* Footer */

.footer .anthem .logo {margin: 0 20px 0 0;}
.footer .vegan {
    width: 34%;
    margin: 0 0 0 1%;
}
.footer .vegan .info {margin: 0 20px 0 0;}
.footer .newsletter {width: 27.5%;}

.cookies {padding: 20px 0;}
.cookies .copy {
	width: 100%;
	text-align: center;
	padding: 0 0 10px 0;
}
.cookies .button {
	width: 120px;
	display: block;
	margin: 0 auto;
	float: none;
	clear: both;
}

/* Home */

.home-hero .carousel .slick-slide .title {margin: 0 20px;}
.home-hero .carousel button.slick-prev {
	left: auto;
	right: 70px;
}
.home-hero .carousel button.slick-next {
	left: auto;
	right: 20px;
}

/* Melody */

.melody .tone.reveal .letterbox {background-size: 100% auto;}
.melody .tone.carousel .fixed-width {padding: 0 0 0 20px;}
.melody .tone.carousel .category-header {padding: 0 20px 20px 0;}

/* Single */

.single-featured img {max-width: 100%;}

/* Modern */

.modern .featured img {max-width: 100%}

}

/* 
-----------
BELOW 1000PX 
-----------
*/
@media screen and (max-width: 999px) {

/* Back to top button */

#backtotopbutton:after {line-height: 40px;}

#backtotopbutton {
	width: 40px;
    height: 40px;
    right: 10px;
    font-size: 15px;
}

.sponsor-banner p {width: 100%;}

/* Header */

.header .progress {background-color: transparent;}
.header .top-menu {display: none;}
.header .subscribe .menu .socials {
	opacity: 0;
	visibility: hidden;
}

.header .podcast-home {
	margin: 70px -10px 0 20px;
	position: relative;
    z-index: 1;
}

body.home .header,
body.home .header-background {height: 140px;}
body.home .header .subscribe {display: none;}
body.home .header .logo {
	width: 150px;
	float: none;
	margin: 0 auto;
}
body.home .header .explore,
body.home .header .search {
	margin-top: 70px;
	position: relative;
	z-index: 1;
}
body.home .header .mobile-menu {display: inline-block;}

/* Footer */

.footer {padding: 50px 0 80px 0;}
.footer .newsletter {
	width: 100%;
	text-align: center;
	padding: 0 0 40px 0;
}
.footer .newsletter form {
	width: 300px;
	margin: 0 auto;
	margin-top: 10px;
	float: none;
	clear: both;
}
.footer .anthem,
.footer .vegan {
	width: 50%;
	margin: 0 auto;
}

/* Melody */

.melody .tone .label h6:before {right: 10px;}
.melody .tone .label h6:after {left: 10px;}

/* Single */

.single-toolbar {display: none;}
.single-content .recipe .stage .ingredients {width: 35%;}
.single-content .recipe .stage .method {width: 65%;}

/* Search Takeover */

.search-takeover form input[type=text] {font-size: 50px;}


}

/* 
-----------
BELOW 769PX 
-----------
*/


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

	.header .podcast-home {
		margin: 67px -10px 0 20px;
	}
}


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

button.slick-prev, 
button.slick-next {
	width: 40px;
	height: 40px;
	top: 15%;
}

/* Header */

.header,
.header-background {height: 60px;}
.wrapper.fixed .header.hide {top: -60px;}
.header .explore .toggle {margin: 10px 20px 0 -10px;}
.header .logo {
    width: 100px;
    padding: 12.5px 0 0 0;
}
.header .subscribe {width: auto;}
.header .subscribe p {padding: 20px 0 0 0;}
.header .search {margin: 10px -10px 0 15px;}
.wrapper.fixed .header.hide .subscribe-panel {top: 0px;}
.header .subscribe-panel {
	top: 0px;
	background-color: #5C8322;
}
.header .subscribe-panel .close {top: 10px;}
.header .subscribe-panel .magazine {
    padding: 0 0 30px 0;
    margin: 0 0 30px 0;
}
.header .subscribe-panel .blur {display: none;}
.header .subscribe-panel .modal {
	padding: 40px 20px 80px 20px;
	box-shadow: 0 0 0 #797979;
	top: 0px;
    transform: translateY(0%);
}

.header .podcast {
	margin: 10px -10px 0 20px;
}

.header .podcast-home {
		margin: 56px -10px 0 20px;
	}

body.home .header,
body.home .header-background {
	height: 120px;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
}
body.home .header .explore, 
body.home .header .search {margin-top: 60px;}
body.home .header .logo {
	width: 120px;
	padding: 10px 0 0 0;
}

/* Footer */

.footer {padding: 40px 0;}
.footer .anthem, 
.footer .vegan {
	width: 300px;
    float: none;
    text-align: center;
    margin: 0 auto;
    clear: both;
}
.footer .vegan .info {
	width: 100%;
	margin: 0 0 20px 0;
}

.footer .vegan .info .socials a {padding-right: 20px;}
.footer .vegan .info .socials {padding: 20px 47.5px 0 47.5px;}

.footer .anthem .logo {
	width: 100%;
	margin: 0 0 20px 0;
}
.footer .vegan .info .logo img,
.footer .anthem .logo img {
	width: 150px;
	float: none;
	margin: 0 auto;
}
.footer .vegan .menu,
.footer .anthem .menu {
    width: 100%;
    padding: 0 0 10px 0;
    margin: 0 0 20px 0;
    border-left: 0px;
    border-bottom: 1px solid #FFFFFF;
}
.footer .anthem .menu {border-bottom: 0px;}
.footer .vegan .menu a,
.footer .anthem .menu a {
	width: 50%;
	float: left;
}

/* Menu */

.main-menu .top {height: 60px;}
.main-menu .top .logo {padding: 15px 0 0 0;}
.main-menu .top .close {margin-top: 10px;}
.main-menu .socials a {width: 45px;}

/* Home */

.home-title {display: none;}
.home-hero {padding: 0 0 40px 0;}
.home-hero .carousel, 
.home-hero .carousel .slick-slide {height: 400px;}
.home-hero .carousel button.slick-prev {right: 60px;}
.home-hero .carousel ul.slick-dots {bottom: 205px;}

/* Single */

.single-back {display: block;}
.single-categories {
	overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    padding: 0 0 20px 0;
    margin: 0px;
    position: relative;
}
.single-categories .item {margin: 0 10px 0 0;}
.single-content .recipe .toggle {display: inline-block;}
.single-content .recipe .stage .ingredients {
	display: none;
    width: 100%;
    padding: 0px;
    border-right: 0px;
}
.single-content .recipe .stage .method {
	display: none;
    width: 100%;
    padding: 0px;
}
.single-content .recipe .stage .ingredients.show,
.single-content .recipe .stage .method.show {display: inline-block;}
.single-social {
	border-top: 30px solid #FFFFFF;
    border-bottom: 30px solid #FFFFFF;
}
.single-content .recipe .stage .title {display: none;}
.single-content .recipe .stage .title p {padding: 0 0 0 10px;}
.single-content .footer-ad .desktop {display: none;}
.single-content .footer-ad .mobile {display: block;}

.single-content .recipe .hero .servings .rating {margin: 15px 15px 0 15px;}

/* Melody */

.melody .spacer {height: 0px;}
.melody .alm-load-more-btn {width: auto !important;}
.melody .tone.column-4 .item {flex: 1 1 40%;}
.melody .tone.column-4 .item:nth-child(2n+2) {margin-right: 0px;}
.melody .tone.column-3 .item {
    flex: 1 1 100%;
    display: flex;
    margin-right: 0px;
    padding-bottom: 0px;
    border-bottom: 0px;
}
.melody .tone.column-3 .item .image {
	width: 50%;
	margin: 0 20px 0 0;
}
.melody .tone.column-3 .item .title {
    width: 50%;
    float: left;
    border-bottom: 1px solid #D1D1D1;
}
.melody .tone.column-3 .item.item-advert {
	display: block;
	border-bottom: 1px solid #D1D1D1;
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
}
.melody .tone.column-3 .item.item-advert .image {
	width: 100%;
	margin: 0 0 20px 0;
}
.melody .tone.column-2 .item {
	flex: 1 1 100%;
	margin-right: 0px;
}
.melody .tone.column-1 .image {
	flex: 1 1 100%;
	margin-right: 0px;
}
.melody .tone.carousel .item {width: 40vw !important;}
.melody .tone.column-1 .copy .title {margin: 20px 0 0 0;}
.melody .tone.column-1 .copy .category,
.melody .tone.column-1 .copy .excerpt,
.melody .tone.column-1 .copy .button {display: none;}
.melody .tone.child-category .item {flex: 1 1 40%;}
.melody .tone.reveal .label {padding: 0 0 10px 0;}
.melody .tone.reveal .label.continue {padding: 10px 0 20px 0;}
.melody .tone.recommend .banner .desktop {display: none;}
.melody .tone.recommend .banner .mobile {display: inline-block;}
.melody .alm-btn-wrap.desktop {display: none;}
.melody .alm-btn-wrap.mobile {display: inline-block;}
.melody .tone .item.item-advert {margin-bottom: 0px;}
.melody .tone.reveal .letterbox .size .desktop {display: none;}
.melody .tone.reveal .letterbox .size .mobile {display: block;}
.fixed-ad img.desktop {display: none;}
.fixed-ad img.mobile {display: block;}

/* Modern */

.modern .banner,
.modern .title {padding: 20px 0;}
.modern .layout.l-gallery .list .item {flex: 1 1 40%;}
.modern .layout.l-gallery .list.count-3 .item:nth-child(2n+2),
.modern .layout.l-gallery .list.count-4 .item:nth-child(2n+2) {margin-right: 0px;}

/* Search Takeover */

.search-takeover form input[type=text] {
	font-size: 30px;    
	border-bottom: 2px solid #FFFFFF;
}

/* Category */

.category-hand {display: inline-block;}

}

/* 
-----------
ABOVE 690PX 
-----------
*/

/* 
-----------
BELOW 599PX 
-----------
*/


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

h1 {font-size: 25px;}
h2 {font-size: 20px;}
h3 {font-size: 16px;}
h4 {font-size: 16px;}
h5 {font-size: 16px;}
h6 {font-size: 14px;}

p, td, li, label, select {font-size: 16px;}

.fixed-width {padding: 0 10px;}

/* Menu */

.main-menu .top {padding: 0 10px;}
.main-menu ul li a {padding: 10px;}
.main-menu ul li ul li a {padding-left: 20px;}
.main-menu ul li ul li ul li a {padding-left: 30px;}
.main-menu .socials {padding: 40px 10px 120px 10px;}
.main-menu ul li .arrow {right: 0;}

.header .mobile-menu {bottom: 17.5px;}

.podcast-nav {
	background-position: 215px;
}

/* Melody */

.melody .alm-load-more-btn {
	height: 30px !important;
	font-size: 14px !important;
}
.melody .tone .item {
	padding: 0 0 10px 0;
	margin-right: 10px;
	margin-bottom: 30px;
}
.melody .tone .item .image {margin: 0 0 10px 0;}
.melody .tone.column-3 .item .image {margin: 0 10px 0 0;}
.melody .tone.column-3 .item.item-advert .image {margin: 0 0 10px 0;}
.melody .tone .label h6 {font-size: 12px;}
.melody .tone.carousel .fixed-width {padding: 0 0 0 10px;}
.melody .tone.carousel .category-header {padding: 0 10px 20px 0;}

.melody .tone .item.sponsored .sponsor-overlay {
	font-size: 12px;
	padding: 5px 5px 5px 10px;
	left: -5px;
	right: auto;
}
.melody .tone .item.sponsored .sponsor-overlay .corner {
    width: 5px;
    height: 5px;
    bottom: -4.75px;
    left: 0px;
    right: auto;
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 100% 100%);
}

.melody .tone.introduction .copy {max-height: 50px;}
.melody .tone.introduction .button {
	height: 30px;
    font-size: 14px;
    padding: 3px 20px 0 20px;
}

.melody .tone.quicklinks .boxes .box {margin-right: 10px;}
.melody .tone.quicklinks .boxes .box .image .gradient {opacity: 0;}
.melody .tone.quicklinks .boxes .box .title {
	width: 100%;
	float: left;
	padding: 10px 0 0 0;
	position: static;
}
.melody .tone.quicklinks .boxes .box .title h3 {color: #000000;}

/* Home */

.home-hero {padding: 0 0 20px 0;}
.home-hero .carousel {height: auto;}
.home-hero .carousel .slick-slide {
	height: auto;
	background-image: none !important;
}
.home-hero .carousel ul.slick-dots {display: none !important;}
.home-hero .carousel button.slick-next {
	top: 30%;
	right: 0px;
}
.home-hero .carousel button.slick-prev {
	top: 30%;
	right: auto;
	left: 0px;
}
.home-hero .carousel .slick-slide .image {display: inline-block;}
.home-hero .carousel .slick-slide .title {
	width: 100%;
	height: auto;
	float: left;
    margin: 0 auto;
    text-align: left;
    background-color: transparent;
    bottom: auto;
    left: auto;
    right: auto;
    position: relative;
}
.home-hero .carousel .slick-slide .title h2 {
	padding: 0px;
	position: relative;
	top: 0%;
    transform: translateY(0%);
    left: auto;
    right: auto;
}

/* Single */

.single-intro .title {margin: 20px 0;}
.single-social {
	border-top: 20px solid #FFFFFF;
    border-bottom: 20px solid #FFFFFF;
	padding: 10px 0;
}
.single-content .recipe .hero .intro h3 {margin: 0 auto;}
.single-content .recipe .hero .intro .recipe-intro p {font-size: 16px;}
.single-content .recipe .hero .intro .recipe-intro p:nth-last-child(1) {margin: 0 auto;}
.single-content .recipe .hero .servings .details h2:after {width: 20px;}
.single-content .recipe .hero .servings .control h2 {width: 100%;}
.single-content .recipe .hero .servings .control input {
	width: 80%;
	float: none;
	margin: 25px 0 0 0;
}
.single-social .item img {
	width: 25px;
    height: 25px;
}
.single-content .recipe .toggle {margin-top: -20px;}

/* Category */

.category-header .button {    
	padding: 0px;
    font-size: 16px;
}

/* Tapered */

.tapered {padding: 0 10px;}
.tapered .amf-el.competition-question h4 {font-size: 20px;}

/* Modern */

.modern .layout {padding: 0px;}
.modern .layout.l-excerpt,
.modern .layout.l-image,
.modern .layout.l-carousel {padding: 0 0 20px 0;}
.modern .layout.l-buttons {padding: 0 0 10px 0;}
.modern .layout.l-buttons .list.count-1 .item,
.modern .layout.l-buttons .list.count-2 .item,
.modern .layout.l-buttons .list.count-3 .item {
	width: 100%;
	display: inline-block;
	margin: 0 0 10px 0;
}
.modern .layout.l-buttons .list .item p.CTA {margin: 10px 0;}
.modern .featured {padding: 0 0 20px 0;}

.modern .layout.l-image p,
.modern .layout.l-carousel p {font-size: 12px;}
.modern .layout.l-affiliatelinks .buttons a {margin: 0 10px 10px 0;}
.modern .layout.l-affiliatelinks .buttons .button {
	height: 30px;
	padding: 3px 20px 0 20px;
}
	

}

/* 
-----------
BELOW 405PX 
-----------
*/


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

	.header .subscribe p {display: none;}

}




/* 
-----------
ADS
-----------
*/

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

.melody .tone.reveal.googleads .letterbox {height: 476px;}

}

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

.melody .tone.reveal.googleads .letterbox {height: 518px;}

}

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

.melody .tone.reveal.googleads .letterbox {height: 469px;}


}

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

	.header .podcast-home {
    	margin: 57px -14px 0 20px;
}

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

	.header .podcast-home {
		margin: 57px -16px 0 21px;
	}
}

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

.melody .tone.reveal.googleads .letterbox {height: 400px;}

.header .podcast-home {
	display: none;
}

}