/* RESPONSIVE MEDIA QUERIES © Eborn Interactive */


/* Screen Widths

Tablet Portrait - 768px
Tablet Landscape - 1024px

iPhone 3,4,5 - 320px


/* iOS Specific
================================================== */

@supports (-webkit-overflow-scrolling: touch) {
	
  /* CSS specific to iOS devices */ 

}

/* ================================================ */

/* Other than iOS specific
================================================== */

@supports not (-webkit-overflow-scrolling: touch) {
	
  /* CSS for other than iOS devices */ 
  
}

/* ================================================ */


/* Responsive Width Section (General)
================================================== */

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


		.section.text-image .inner-content, .section.text-image.reverse .inner-content  {
		    flex-direction: column !important;
		}
		
		.text-image .text, .text-image.reverse .text {
		    width: 100%;
		    max-width: 850px;
		    padding-left: 0;
		    padding-top: 0;
		}
		
		
		.section.text-image {
			margin-top: 50px;
		}
		
		.section.introtext {
			margin-bottom: 100px;
		}
		

		.shorts {
			display: flex;
			overflow-x: auto;
			gap: 0;
			padding: 0 30px;
			scroll-snap-type: x mandatory;
			-webkit-overflow-scrolling: touch;
		}

	    .shorts-section .inner-content {
		    width: 100%;
	    }
	    
		.short {
			flex: 0 0 auto;
			scroll-snap-align: start;
		}
		
		.shorts::-webkit-scrollbar {
			display: none;
		}
		
	   .shorts-section .inner-content .short {
		   padding-left: 30px;
	   }
	   
	   .shorts-section .inner-content .short:last-of-type {
		  margin-right: 0;
	   }
		
		.section.quote-block {
		    margin: 100px 0 100px 0;
		}
		
		.section, .featured {
			margin-top: 50px;
		}
		
		.main-title {
		    margin-top: -10px;
		}
		
		.tracks {
			gap:20px;
		}
		
		.track {
		    width: calc(50% - 15px);
		    margin-bottom: -15px;
		}
		
		footer {
			padding-top: 100px;
		}
		
		.footercolumns {
			flex-direction:column;
			align-items: center;
			justify-content: center;
		}
		
		.rightcol, .leftcol {
		    width: 100%;
		    max-width: 750px;
		}
		
		.rightcol .text {
		    font-size: 20px;
		}
		
		.visitlink {
		    margin-top: 50px;
		    text-align: center;
		}

	}

/* ================================================ */


/* Responsive Width Section (Mobile Phone)
================================================== */

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


		.footerlogos {
			flex-wrap:wrap;
			align-items: center;
			justify-content: center;
		}
		
		.footerlogos .logo {
			margin: 15px 20px;
		}
		

	}

/* ================================================ */



/* Responsive Width Section (Smallest Mobile Screens)
================================================== */

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


		.featureimage .mobile {
			display: block;
		}
		
		.featureimage .desktop {
			display: none;
		}

	    .featured h2 {
	        margin-bottom: 0.659vw;
	        font-size: 14.593vw
	    }
		
		.featured .text {
			position: absolute;
			left: 10%;
			bottom: 11.989vw; /* 100px */
			text-align:left;
			width: calc(80%); /* - 100px */
			color: #dde1ef;
			font-weight: 400;
			font-size:4.916vw; /* 32px */
		}
		
	    .preheading {
	        font-size: 3.008vw;
	        color: #fff;
	        margin-bottom: -0.848vw;
	        text-transform: uppercase;
	        color: #e03030;
	        letter-spacing: 2px;
	        font-weight: 500;
	    }
		
		.featured .logos {
			display: flex;
			margin-top: 7.692vw; /*70px;*/
		}
		
		.featured .logo {
			width: 23.382vw; /*160px;*/
			margin-right: 7.692vw; /*70px;*/
			opacity: 0.85;
			transition:0.3s all ease;
		}
		
		.featured .logo:hover {
			opacity: 1;
		}
		
		.featured .logo.spotify {
			margin-top: -0.5vw /* px;*/
		}
		
		.featured .logo.youtube {
			width: 19.385vw; /*140px;*/
			margin-top: 0.879vw; /*8px;*/
		}
		
		.featured .logo.applemusic {
			width: 18.286vw; /*130px;*/
			margin-top: 0.659vw; /*6px;*/
			margin-right: 0;
		}		

	}

/* ================================================ */


/* Responsive Width Section (Mobile Phone)
================================================== */

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


		.topimage {
		    height: 700px;
		}
		
		.mainlogo {
		    top: 40px;
		    right: 20%;
		    width: 60%;
		}
		
		.gradient {
		    top: 50px;
		    height: 650px;
		}
		
	    .section.introtext {
	        margin-top: 0;
	    }
		
		.track {
		    width: 100%;
		    margin-bottom: -15px;
		}
		
		.footercolumns .rightcol .pres {
			flex-direction: column;
			align-items: center;
			justify-content: center;
		}
		
		.footercolumns .rightcol .text {
			text-align: center;
			margin-bottom: 30px;
		}
		
		.rightcol .image {
		    margin-left: 0;
		}
				
		footer {
		    padding: 70px 0 30px 0;
		}
		
		.footercolumns .leftcol {
			text-align: center;
		}
	
		.follow-button {
		    display: flex;
		    justify-content: center;
		}
		
	    .short {
	        width: calc(100vw - 10% - 20px);
	    }
	    
	    .shorts {
		    gap:0;
		    
	    }
	    
	    .shorts-section .inner-content {
		    width: 100%;
	    }
	    
	   .shorts-section .inner-content .short {
		   padding-left: 30px;
	   }
	   
	   .shorts-section .inner-content .short:last-of-type {
		  margin-right: 0;
	   }
	   
	   .footerlogos {
		   padding-top: 40px;
	   }
	   
		.footerlogos .logo {
		    width: 90px;
		    margin: 15px 12px;
		}
	   
		.footerlogos .logo.apple-music {
		    width: 80px;
		}	
		
		.footerlogos .logo.youtube {
		    width: 85px;
		}
		
		.footerlogos .logo.soundcloud {
		    width: 55px;
		}
		
		.footerlogos .logo.facebook {
		    width: 85px;
		}
		
		.footerlogos .logo.instagram {
		    width: 85px;
		    margin-bottom: 0;
		}
		
		.quote-block blockquote {
		    font-size: 28px;
		    line-height: 1.5;
		}	
		
		.text-image .text {
		    font-size: 22px;
		}
		
		.introtext .entry {
			line-height: 1.6;
		    font-size: 25px;
		}
		
		.section.quote-block {
	        margin: 60px 0 60px 0;
	    }
	    
		.section.text-image, .featured {
	        margin-top: 10px;
	    }
	    
		.text-image .anchor {
		    top: -30px;
		}
				
		.copyLinkBtn {
		    margin-bottom: 10px;
		}
			    
	    .section.introtext {
	        margin-bottom: 0px;
	        padding-bottom: 30px;
	        padding-top: 400px;
	    }
	    
		.main-title {
		    margin-top: 0;
		    margin-bottom: 25px;
		}
		
		.introtext .entry {
		    margin: -50px auto 0 auto;
		}	
		
		.quote-block blockquote cite {
		    font-size: 24px;
		}  		 	     

	}

/* ================================================ */


/* Responsive Width Section (Smallest Mobile Screens)
================================================== */

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





	}

/* ================================================ */