/*         */
/* General *//*//////////////////////////////////////////////////////////////*/
/*         */

.main-content
{

	box-sizing: border-box;

	justify-content: center;

}



.howtubes-ad
{

	margin-top: 30px;

}



.landing-page-container
{

	display: flex;
	flex-direction: row;
	align-content: center;
	align-items: center;
	justify-content: center;

	width: 100%;
	max-width: 1300px;

	margin-top: 20px;
	margin-bottom: 20px;

}





/*        */
/* Tablet *//*///////////////////////////////////////////////////////////////*/
/*        */

.landing-tablet
{

	box-sizing: border-box;

	width: calc(100% - 30px);
	max-width: 750px;

	margin-left: 15px;
	margin-right: 15px;

	background-color: black;

	box-shadow: 0 0 1px 1px rgba(0,0,0,0.4);

    overflow: hidden;

}



.landing-tablet .landing-video-wrapper
{

	width: 100%;

	overflow: hidden;

}



.landing-page-container .homepage-title-container
{

	display: none;

	margin-bottom: 0px;

}



.landing-page-container .homepage-title-container
{

	margin-bottom: 10px;

}



.homepage-title-navbar-slogan
{

	padding-top: 10px;
	padding-bottom: 30px;

	text-align: center;
	font-weight: bold;

}



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

	.section-intro
	{

		margin-top: 25px;

	}



	.landing-tablet
	{

		margin-left: 0px;
		margin-right: 0px;

	}


	.guest-homepage-title
	{

		display: none;

	}



	.landing-page-container .homepage-title-container
	{

		display: flex;

	}

}





/*           */
/* Nav Links *//*////////////////////////////////////////////////////////////*/
/*           */

.follow-us-nav-link
{

	display: flex !important;

}



.social-media-nav-links
{

	display: flex !important;
	justify-content: space-around;

}


/*
.sign-up-nav-link
{

	display: none;

}



.log-in-nav-link
{

	display: none;

}
*/


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

	.social-media-nav-links
 	{

		width: 100%;

	}

}





/*                   */
/* Homepage Sections *//*////////////////////////////////////////////////////*/
/*                   */

.homepage-sections
{

	width: 100%;
	max-width: 100vw;

}



.homepage-section
{

	position: relative;

	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	width: 100%;

	padding: 70px 0;

	background-color: transparent;

}

.homepage-section.last
{

	padding-bottom: 15px;

}



.homepage-section:nth-child(odd)::after
{

	position: absolute;

	top: 0;
	left: 0;

	content: "";

	width: 100%;
	height: 100%;

	margin: 10px 0;

	background-color: #6f11eb;

	outline: 1px solid transparent;

	clip-path: polygon(
		0 0,
		100% 6vw,
		100% 100%,
		0 calc(100% - 6vw)
	);

	z-index: -1;

	transition: 0.5s linear;

}



.homepage-section.skewed-left:nth-child(odd)::after
{

	clip-path: polygon(
		0 6vw,
		100% 0,
		100% calc(100% - 6vw),
		0 100%
	);

}



.homepage-section:last-of-type:nth-child(odd)::after
{

	clip-path: polygon(
		0 0,
		100% 6vw,
		100% 100%,
		0 100%
	);

}



.homepage-section.skewed-left:last-of-type:nth-child(odd)::after
{

	clip-path: polygon(
		0 6vw,
		100% 0,
		100% 100%,
		0 100%
	);

}



.homepage-section:nth-child(odd)::before
{

	position: absolute;

	top: 0;
	left: 0;

	content: "";

	width: 100%;
	height: 100%;

	margin: 10px 0;

	background-color: #25f8f0;

	clip-path: polygon(
		0 6vw,
		100% 0,
		100% calc(100% - 6vw),
		0 100%
	);

	z-index: -2;

	transition: 0.5s linear;

}



.homepage-section.skewed-left:nth-child(odd)::before
{

	clip-path: polygon(
		0 0,
		100% 6vw,
		100% 100%,
		0 calc(100% - 6vw)
	) !important;

}



.homepage-section-title
{

	margin: 0 6px;
	margin-top: 6px;
	margin-bottom: 20px;

	font-size: 40px;
	font-weight: bold;
	color: #6f11eb;
	text-align: center;

}

.homepage-section:nth-child(odd) .homepage-section-title
{

	margin-top: 40px;

	color: white;

}



.inner-homepage-section
{

	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;

	width: 1000px;
	max-width: 100%;

	height: 100%;

}

.homepage-section:nth-child(odd) .inner-homepage-section
{

	flex-direction: row-reverse;

}



.homepage-text
{

	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	width: 420px;
	max-width: 100%;

	margin: 20px;

	font-size: 18px;

}

.homepage-section:nth-child(odd) .homepage-text
{

	color: white;

}



.homepage-image-link
{

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

}



.homepage-image
{

	position: relative;

	width: 320px;
	max-width: calc(100% - 40px);

	margin: 20px;

	box-shadow: 3px 3px 7px 1px rgba(0,0,0,0.5);

	border-radius: 3px;

}





/*                  */
/* Support Creators *//*/////////////////////////////////////////////////////*/
/*                  */

.support-creators
{

	width: calc(100% - 20px);
	max-width: 940px;

	margin-top: 20px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;

}





/*                */
/* Home Container *//*///////////////////////////////////////////////////////*/
/*                */

.mature-homepage-description
{

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;

	margin: 15px;

	font-size: 18px;
	text-align: center;

}



.mature-homepage-description div
{

	margin: 0 5px;

}





/*                */
/* Home Container *//*///////////////////////////////////////////////////////*/
/*                */

.homepage-container
{

	box-sizing: border-box;

	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: flex-start;

	width: calc(100% - 40px);
	max-width: 1400px;
	min-height: calc(100vh - 220px);
    
	margin-left: 20px;
	margin-right: 20px;

	z-index: 1;

	background-color: transparent;

	border-top-left-radius: 8px;
	border-top-right-radius: 8px;

}



.homepage-videos
{

	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	flex-wrap: wrap;

	position: relative;

	width: 100%;
	min-height: calc(100vh - 190px);

	margin-top: 5px;

	padding: 10px;

}



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

	.homepage-container
	{

		max-width: 1100px;

	}

}

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

	.homepage-container
	{ 

		max-width: 900px;

	}

}

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

	.homepage-container
	{

		max-width: 650px;

	} 

}



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


	.homepage-videos .video-results > .channel-video:first-child
	{

		margin-top: 0 !important;

	}

}