html, body{
	overflow-x: hidden;
	max-width: 100%;
}
body{
	position: relative;
	margin:0;
	font-family:"Gill Sans MT";
	background-color: #ddd;
	/*background: linear-gradient(-45deg, red, #FFC7B7,#AAAAAA ,gray);
	background-size: 400% 400%;*/
	animation: gradient 15s ease infinite;
}

input, textarea{
	-webkit-appearance:none;
	border-radius: 0;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
	height:50px;
}

li {
  float: left;
}

li a, .dropbtn {
  display: inline-block;
  color: white;
  text-align: center;
  text-decoration: none;
}


.alia:hover {
  background-color: red;
}


.dropdown {
  display: inline-block;
	position:absolute;
	right:0px;
	z-index: 3;
}

.dropdown-content {
  display: block;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 4;
  right:0;
  top:45px;
  transform: translate(170px,0);
	transition-duration: 0.4s;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1;}


.bot-line{
	transition-duration: 0.4s;
	border-left: 26px solid white;
  height: 5px;
	margin:4px;
	z-index: 3;
}

.mid-line{
	transition-duration: 0.4s;
	border-left: 26px solid white;
  height: 5px;
	margin:4px;
	z-index: 3;
}

.top-line{
	transition-duration: 0.4s;
	border-left: 26px solid white;
  height: 5px;
	margin:4px;
	z-index: 3;
}

.alia{
	padding: 16px 16px;
}

.dropbtn{
	margin-top:7px;
	margin-right:7px;
	padding:3px;
	z-index:3;
}

.textfield{
	position:absolute;
	top:0;
	right:92px;
	padding-bottom: 0;
	padding-top: 0;
	 padding-left: 1ex;
	height:50px;
	opacity: 0.5;
	outline:none;
	font-size:20px;
	border:none;
	font-style: bold;
	z-index: 1;
	transform:translate(300px);
	transition-duration: 0.6s;
	border-radius: 0;
}

.search-button{
	padding: 0;
	position:absolute;
	right:54px;
	top:7px;
	font-size: 30px;
	color:white;
	background-color:transparent;
	border:none;
	z-index:3;
}
.search-button:hover{
	opacity: 0.8;
}

input:focus, textarea:focus, select:focus, button:focus{
	outline: none;
}


#hiding-box{
	background-color: #333;
	height: 50px;
	position: absolute;
	width:92px;
	z-index:2;
	top:0;
	right:0
}


.pic-h{
	float:left;
	width:26.5%;
	margin-top:20px;
	margin-left:1.5%;
}

.container-h{
	position: relative;
	float:left;
	width:55.5%;
	margin-top: 20px;
	margin-left:1.5%;
	
}

/*.text-block-h {
  position: absolute;
  top: 1ex;
  left: 0;
  width: 17ex;
  color: black;
  margin-left: 3%;
  font-size:200%;
}*/

.fb-link-h{
	width: 10%;
  background:rgba(0,0,0,0);
  color: black;
	float: right;
}

.insta-link{
	width: 10%;
	margin-right:2%;
  background:rgba(0,0,0,0);
  color: black;
	float: right;
}

.youtube-link{
	width: 10%;
	margin-right:2%;
  background:rgba(0,0,0,0);
  color: black;
	float: right;
}

.right-ad-h{
	background-color: white;
	float:right;
	height:700px;
	width: 12%;
	margin-top:100px;
	margin-right:1.5%
}

.recommended-h{
	float:left;
	width: 26.5%;
	margin-top:20px;
	margin-left:1.5%
}

.recommended-vid{
	text-align: center;
	background-color:white;
}

.recommended-vid-title{
	color:black;
	font-size:130%;
	background-color: white;
}

.vid-title{
	position: absolute;
	top:1ex;
	left:1ex;
	color: white;
	font-size: 100%;
}

.recommended-img{
	padding-bottom: 0;
}

.recommended-vid-bar{
	text-align: center;
	width: 100%;
	font-size: 117%;
	padding-top:0.4ex;
	padding-bottom: 0.4ex;
	background-color: #453e3e;
	color:white;
	box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
}

.soap-title{
	padding-bottom: 2px;
}

.saboun-h{
	background-color:white;
	position:relative;
	float:left;
	width: 26.5%;
	margin-top:20px;
	margin-left:1.5%;
	text-align: center;
	box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
}

.saboun-h:hover{
	opacity: 0.8;
}

.bottom-ad-h{
	float: left;
	background-color: white;
	width: 70%;
	height: 80px;
	margin-top:20px;
	margin-bottom:20px;
	margin-left: 15%;
}

.main-h{
	background-color: white;
	float:right;
	width: 50%;
	margin-top:20px;
	/*margin-right:4%;*/
	margin-right:15%;
	/*none*/
	margin-bottom: 4ex;
}

.recent-vid-bar{
	text-align: center;
	width: 100%;
	font-size: 200%;
	padding-top:0.4ex;
	padding-bottom: 0.4ex;
	background-color: #453e3e;
	color:white;
	box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
}

.recent-vid{
	width:80%;
	margin-left: 10%;
	margin-top:2ex;
	text-align: center;
	box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
}

.recent-vid-title{
	color:black;
	font-size: 130%;
	background-color: white;
}

.cut{
	width: 90%;
	margin-left:5%;
	margin-top:2ex;
	height: 0.2ex;
	background-color: lightgrey;
}

a{
	text-decoration: none;
}

.video-ref:hover{
	opacity: 0.9;
}


/* small devices (phones, 768px and down) */
@media only screen and (max-width: 768px) {
	.recommended-vid-bar{
		font-size:100%;
	}
	.text-block-h{
		font-size:150%;
	}
	.recent-vid-bar{
		font-size:150%;
	}
	.pic-h{
		float:left;
		width:19%;
		margin-top:20px;
		margin-left:1.5%;
	}

	.container-h{
		position: relative;
		float:left;
		width:58%;
		margin-top: 20px;
		/*margin-left:1.5%;*/
		margin-left:6.5%;

	}
	.right-ad-h{
		width:17%;
	}
	.main-h{
		/*margin-right:2%;*/
		margin-right:15%;
	}
	.fb-link-h{
		width: 20%;
	}
	.insta-link{
		width:20%;
		margin-right:3%;
	}
	.youtube-link{
		width:20%;
		margin-right:3%;
	}
}

@media only screen and (max-width: 600px){
	.textfield{
		width:130px;
	}
	.search-button{
		top:5px;
	}
}

@media only screen and (max-width:450px){
	/*none*/
	.main-h{
		margin-right: 1.5%;
		width:65.5%;
	}
	.container-h{
		/*none*/
		margin-left:1.5%;
		/*width:68.5%;*/
		width:65.5%
	}
	.pic-h{
		/*width:26.5%;*/
		width:29.5%;
	}
	.right-ad-h{
		margin-top:20px;
	}
	.text-block-h{
		font-size:120%;
	}
	.recent-vid-bar{
		font-size:110%;
	}
	.recommended-vid-bar{
		font-size:73%;
	}
	.recent-vid{
		font-size:75%;
	}
	.vid-title{
		font-size:75%;
	}
	.saboun-h{
		/*none*/
		width:29.5%;
		font-size:75%;
	}
	.recommended-vid-title{
		font-size:100%;
	}
	/*none*/
	.recommended-h{
		width:29.5%;
	}
		
	
}