.tutorials {
		display:block;
		width:70%;
		min-height:450px;
		height:auto;
		background-color:rgba(240,240,240,0.2);
		box-shadow:1px 1px 5px 2px rgba(200,200,200,0.5),-1px -1px 5px 2px rgba(200,200,200,0.5);
		float:left;
		margin-bottom:50px;
	}
	.tutorials ul{
		float:left;
		list-style-type:none;
		margin-left:10px;
		margin-top:20px;
	}
	.tutorials ul li a{
		display:block;
		text-decoration:none;
		text-indent:5px;
		padding:5px 5px;
		color:rgb(55,55,55);
		border:0px solid rgb(60,60,60) !important;
		border-radius:5px;
		margin-bottom:10px;
		font-size:16px;
		font-weight:normal;
		box-shadow:3px 3px 3px 0px rgba(100,100,100,0.5) inset, 2px 2px 2px 0px rgba(100,100,100,0.7); 
	}
	.tutorials ul li a:hover{
		background-color:rgb(60,60,60);
		color:rgb(255,255,255);
		animation: floatWater 1s 1;
		animation-timing-function:ease-in;
		
	}
	.innerText{
		font-size:20px; 
		color:rgba(50,50,50,1); 
		text-align:center;
	}


.outer{
 float:left;
 height:auto;
 width:200px;
 border-left:5px solid rgba(200,200,200,0.5);
 }
 .new{
 position:relative;
 width:350px;
 top:0px;
 height:100px;
 background-color:rgba(240,240,240,1);
 border-radius:0px 10px 10px 0px; 
 box-shadow:3px 3px 3px 0px rgba(150,150,150,0.5) inset, 2px 2px 2px 0px rgba(150,150,150,0.7); 
 }

 .new:hover{
 animation:floatWater 1s 1;
 animation-timing-function:ease-in;
 }
 @keyframes floatWater{
 0%{
 margin-top:-5px;
 }
 50%{
 margin-top:0px;
 }
 75%{
 margin-top:-2.5px;
 }
 100%{
 margin-top:0px;
 }
 }
 
 ul#common{
border:2px solid rgba(220,220,220,0.5);
background-color:rgba(240,240,240,0.4);
list-style-type:none;
float:left;
padding-right:0px;
width:70%;
}
ul#common li{
border-bottom:1px solid rgba(220,220,220,0.5);
}
ul#common li:last-child{
border-bottom:1px solid rgba(240,240,240,0.4);
}


  .homeBackground{	
	background-color:rgba(29,161,242,0.4);
	width:100%;
	height:700px;
	box-shadow:5px 5px 61px 5px rgba(240,240,240,0.7) inset, -5px -5px 61px 5px rgba(240,240,240,0.7) inset;
  }
  .container1, .container2, .container3{
   background-color:rgba(240,0,0,0.7);
   width:100px;
   height:100px;
   border-radius:50%;
   text-align:center;
   line-height:100px;
   vertical-align:middle;
   color:white;
   text-decoration:none;
   font-size:22px;
   box-shadow:5px 5px 5px 0px rgba(240,240,240,0.5), -5px -5px 30px 1px rgba(240,240,240,0.5) inset;
   position:absolute;
  }

  .container1{
  left:10%;
  top:30%;
  }
  .container2{
  left:20%;
  top:64%;
  }
  .container3{
  left:30%;
  top:50%;
  }
  
  .container1:hover, .container2:hover, .container3:hover{
   animation:bounceSize 4s 1;
   color:white;
  } 
  @keyframes bounceSize{
	  0%{
		width:100px;
		height:100px;
		animation-timing-function:ease-in;
	  }
	  16.67%{
		width:150px;
		height:150px;
		line-height:150px;
		animation-timing-function:ease-out;
	  }
	  33%{
		width:100px;   
		height:100px;		
		animation-timing-function:ease-in;
	  }
	  50%{
		width:135px;
		height:135px;
		line-height:135px;
		animation-timin-function:ease-out;
	  }
	  66.67%{
		width:100px;
		height:100px;
		animation-timin-function:ease-in;
	  }
	  83%{
		width:120px;
		height:120px;
		line-height:120px;
		animation-timin-function:ease-out;
	  }
	  100%{
		 height:100px;
		 width:100px;
		 animation-timin-function:ease-in;
	  }
	  
  }
  

  .yes_article{
	  background-color:rgb(255,255,255);
  }
  .learnMore{
	padding:8px 16px;
	background:rgba(100,100,100,1);
	outline:1px solid rgba(100,100,100,1);
	border:1px solid white;
	color:white;
	text-decoration:none;
	font-family:athiti,sans-serif;
  }
  .learnMore:hover{
	outline:1px solid rgba(100,100,100,1);  
	border:1px solid rgba(100,100,100,1);
	color:white;
  }
  
  .howToContainer1{
	  width:100%; height:auto; background-color:rgba(240,240,240,0.5); padding:20px; float:left; margin-bottom:45px;
  }
  .howToContainer11{
	  width:50%; height:auto; float:left; padding:20px;
  }
  .howToContainer12{
	width:50%; height:auto; float:left;
  }
  .howToContainer2{
	  width:100%; height:auto; background-color:rgba(240,240,240,0.5); padding:20px; float:left; margin-top:45px; margin-bottom:30px;
  }
  .howToContainer21{
	  width:50%; height:auto; float:left;
  }
  .howToContainer22{
	  width:50%; height:auto;; float:left;
  }
  .howToContainer3{
	  width:100%; height:auto; background-color:rgba(240,240,240,0.5); padding:20px; float:left; margin-bottom:30px;
  }
  .hoTOContainer13{
	  width:50%; height:auto; float:left;
  }
  .howToContainer23{
  width:50%; height:auto; float:left;
  }
  .tip{
	  width:70%; margin:30px 0px; float:none;
  }
  .homeDescription{
	  width:60%; height:auto; border-radius:15px; text-align:center; color:rgba(0,0,0,1); margin:auto; position:relative; padding:10px;
	 
  }
  .homeDescription h3{
	  font-size:35px; margin:0px; font-family:'Athiti', sans-serif !important; font-weight:bold;
  }
  .homeDescription p{
	  font-family:'Athiti', sans-serif !important; font-size:25px; font-weight:500;
  }
    .howToContaineri{
	  width:50%; height:300px; float:left; font-family:'Athiti', sans-serif !important; text-align:center; margin-top:30px;
	  
  }
  .howToContainerj{
	  width:50%; height:auto; float:left; margin-top:40px; font-family:'Athiti', sans-serif !important; border-left:1px solid white;
  }
  @media only screen and (max-width:1050px)
  {
	  ul#common{
		 width:100%; 
	  }
	  .tutorials{
		  width:100%;
	  }
	  .homeDescription{
	  width:90%; 
  }
  .homeDescription{
	  width:90%; 
	  padding:5px;
  }
  .homeDescription h3{
	  font-size:23px; 

  }
   .homeDescription p{
	  font-size:18px;
  }
	  
  }
  @media only screen and (max-width:700px){
  
  .howToContainer1{
	  width:100%; height:auto; background-color:rgba(240,240,240,0.5); padding:5px; float:left; margin-bottom:45px;
  }
  .howToContainer11{
	  width:100%; height:auto; float:none; padding:5px;
  }
  .howToContainer12{
	width:100%; height:auto; float:none;
  }
  .howToContainer2{
	  width:100%; height:auto; background-color:rgba(240,240,240,0.5); padding:5px; float:left; margin-top:45px;
  }
  .howToContainer21{
	  width:100%; height:auto; float:none;
  }
  .howToContainer22{
	  width:100%; height:auto; float:none; margin-top:40px;
  }
    .howToContainer3{
	  width:100%; height:auto; background-color:rgba(240,240,240,0.5); padding:5px; float:left;
  }
  .hoTOContainer13{
	  width:100%; height:auto; float:none;
  }
  .howToContainer23{
  width:100%; height:auto; float:none; margin-top:40px;
  }
  .tip{
	  width:100%; margin:30px 0px; float:none;
  }
  
    .howToContaineri{
	  width:100%; float:none;
  }
  .howToContainerj{
	  display:none;
  }
  }
  
  @media screen and (max-width:800px){
nav ul li {
    float: none;
	z-index:1;
  }
  }
 #stylishLists{
	list-style-type:none;
	
 }

 #stylishLists li p::before{
	 content:'\2713';
	 margin-right:10px;
	 font-size:16px;
	 border:1px solid rgba(0,0,0,1);
	 border-radius:4px;
	 padding:0px 2px;
 }
 #stylishLists1{
	 list-style-type:none;
 }
 #stylishLists1 li p{
	 font-family:'Athiti', sans-serif !important;
	 font-size:22px;
	 font-weight:500;
 }
  #stylishLists1 li p::before{
	 content:'\2713';
	 margin-right:10px;
	 font-size:14px;
	 border:1px solid rgba(20,20,20,1);
	 border-radius:4px;
	 padding:0px 4px;
	 font-weight:500;
 }