

#head_nav li a span
{
	display: inline-block;
	text-shadow: 1px 1px 1px #fff, 0 0 5px #aaa;
	color: #4e4e4e;
	z-index: 0;
}


@media (max-width: 1270px)
{
	#main_preview{
		font-size: 22px;
	}
	.post_preview
	{
		font-size: 17px;
	}
  #headLinks a{
    font-size: 37px;
  }
  #headLinks{
    width: 74%;
  }
}


/* lg */
@media (max-width: 1200px){
  .search_box{
    top: 69px;
  }
}
@media (max-width: 1111px)
{
  #head_nav{
    margin-top: 17px;
  }
	.grid_box
	{
		width: 98.5%;
		height: 197px;
	}
	#head_nav li a.active_section,#head_nav li a:hover
	{
		box-shadow: none;
	}
  
	#main_preview{
		font-size: 21px;
	}
	#moon{
		right: 1px;
	}
  .post_preview {
    font-size: 18px;
    line-height: 1.4;
  }
  .search_box{
    top: 69px;
  }
  h1{
    font-size: 30px;
  }
  .post{
    font-size: 23px;
  }
  code[class*=language-] *,pre[class*=language-] *
	{
		font-size: 20px;
	}
}


@media screen and (max-width:1020px)
{
  
	.bar_transform2
	{
		-webkit-transform: translateX(-250px);
		-moz-transform: translateX(-250px);
		-ms-transform: translateX(-250px);
		-o-transform: translateX(-250px);
		transform: translateX(-250px)
	}
	.bar_transform_open
	{
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);
		transition: all 1s;
	}
	#content.cont_transform
	{
		padding: 5px 20px 20px
	}
	.category_hide
	{
		display: block;
	}
	.flex
	{
		width: 102%;
	}
  .post_preview {
    font-size: 16px;
    line-height: 1.15;
  }
  #main_preview {
    font-size: 18px;
  }
  #head_nav{
    margin-top: 24px;
  }
  #head_nav .logo{
    bottom: 12px;
  }
  #headLinks a{
    font-size: 27px;
  }
  #headLinks img{
    height: 42px;
  }
  #head_nav{
    margin-bottom: -10px;
  }
  h1{
    font-size: 27px;
  }
}


@media (max-width: 1000px){
  #head_nav .logo{
    bottom: 12px;
  }
  #headLinks a{
    font-size: 27px;
  }
  #headLinks img{
    height: 42px;
  }
}

/* md */
@media (max-width: 900px)
{
	#head_nav li a
	{
		font-size: 1.3em;
		padding: 3px;
	}
	.transform
	{
		transform: scale(0.9);
	}
	.transform2
	{
		transform: scale(0.9);
	}
	.transform3
	{
		top: 3px;
	}
	#formAuth
	{
		width: 60%;
		left: 20%;
	}
	h1
	{
		font-size: 26px;
	}
	.date
	{
		font-size: 14px;
	}
	code[class*=language-] *,pre[class*=language-] *
	{
		font-size: 12px;
		line-height: 1;
	}
  .forinput span{
    font-size: 13px;
  }
  
  #main_preview{
    font-size: 18px;
    line-height: 1.1;
  }
  .grid_box{
     height: 170px;
   }
   .post_date{
     font-size: 14px;
   }
   .post_tags{
     font-size: 16px;
   }
   #head_nav .logo{
    bottom: 17px;
  }
  #headLinks a{
    font-size: 27px;
  }
  #headLinks img{
    height: 42px;
  }
  .search_box{
    top: 40px;
    transform: scale(0.7);
    transform-origin: right;
  }
  .post{
    font-size: 20px;
  }
  code[class*=language-] *,pre[class*=language-] *
	{
		font-size: 18px;
		line-height: 1;
	}
}


/* sm */
@media (max-width: 850px){
  #head_nav .logo{
    bottom: 19px;
  }
}
@media (max-width: 800px)
{

	#formAuth
	{
		width: 60%;
		left: 20%;
	}
	.copyright
	{
		top: 2px;
	}
	.post_preview
	{
		font-size: 15px;
	}
	audio
	{
		width: 77%;
		height: 40px;
	}
  .post_title a{
    font-size: 20px;
  }
  .studio{
    font-size: 20px;
  }
  .post{
    font-size: 20px;
  }

  code[class*=language-], pre[class*=language-]{
    font-size:18px;
    line-height:1; 
  }
}

/* xs */
@media (max-width: 700px)
{
	#formAuth
	{
		width: 60%;
		left: 20%;
    font-size: 16px;
	}
  #output{
    display: none;
  }
  
  #main_preview{
    font-size: 15px;
  }
  .post_title a {
     font-size: 16px;
   }
   .grid_box{
     height: 155px;
     margin-left: 3px;
   }
   .post_preview{
     font-size: 13px;
   }
   #flex .post_meta .post_date{
     font-size: 11px !important;
   }
   #head_nav .logo{
    bottom: 18px;
  }
  #headLinks a{
    font-size: 21px;
  }
  #headLinks img{
    height: 42px;
  }
  .studio{
    font-size: 17px;
  }
  code[class*=language-],pre[class*=language-]
	{
		font-size: 12px;
	}
  .post{
    font-size: 17px;
  }
}




/* XS Portrait */
@media (max-width: 600px)
{
	#formAuth
	{
		width: 60%;
		left: 20%;
		padding: 5px;
	}
  #formAuth input{
    font-size: 13px;
    padding: 5px;
  }
	.category_hide
	{
		height: 44px;
	}
	#contacts img
	{
		height: 55px;
	}
	#footer li *, .copyright
	{

		font-size: 1em !important;
	}
	.copyright
	{
		top: -1px;
	}
	.post_preview
	{
		font-size: 14px;
	}
	.post_title a
	{
		font-size: 16px;
	}
	.flex
	{
		padding-left: 0;
	}
	#main_preview{
		font-size: 11px;
	}
	.post_meta .post_date{
		font-size: 11px;
	}
	.forinput span{
		margin-top: 5px;
	}

  .search_box
	{
		top: 33px;
	}
  h1{
    font-size: 22px !important;
  }
  .post_meta .post_tags{
    font-size: 15px;
  }
  .post_meta .post_date{
    font-size: 13px;
  }
  .grid_box{
    margin-left: 11px;
    height: 180px;
  }
	.transform img
	{
		width: 100% !important;
	}
	.transform
	{
		margin-left: 3px;
		transform: scale(1.1,0.8);
	}
  #head_nav .logo{
    bottom: 18px;
  }
  #headLinks a{
    font-size: 20px;
    bottom: 10px;
  }
  #headLinks img{
    height: 33px;
  }
  #headLinks a.active_section, #headLinks a:hover
{
  background-color: #e4e4e4;
  box-shadow: inset 0 -2px #3a9289
}
  .studio{
    font-size: 12px;
    line-height: 1;
  }
  .works{
    font-size: 20px;
  }
  .studio h1.h1{
    font-size: 27px !important;
  }
  code[class*=language-],pre[class*=language-]{
    width: 103%;
  }
  code[class*=language-],pre[class*=language-],
  code[class*=language-] *,pre[class*=language-] *
	{
		font-size: 11px !important;
	}
  #post .post{
    font-size: 16px;
    line-height: 1;
  }
  #header .start_search{
    transform: scale(1.4, 1);
  }
  #output{
    font-size: 15px;
  }
  .pagination{
    right: 15px;
  }
  #openChat{
    height: 50px;
  }
}






@media (max-width: 500px)
{
	.grid_box
	{
		margin-left: 11px;
	}
	.audioWrap{
		width: 90%;
	}
	#moon{
		top: 9px;
	}
	#star{
		top: 11%;
    z-index: 777;
	}
	#formAuth
	{
	
	}
  audio
	{
		width: 90%;
	}
  #main_preview{
		font-size: 13px;
	}
  .grid_box{
    height: 180px;
    padding: 7px;
  }
  .post_preview{
    font-size: 11px;
  }
  .post_title a{
    font-size: 15px;
  }
  #head_nav .logo{
    bottom: auto;
    top: -15px;
  }
  #headLinks a{
    font-size: 13px;
  }
  #headLinks img{
    height: 28px;
  }
  #headLinks{
    width: 70%;
    padding-right: 0px;
    margin-bottom: -20px;
  }
  .search_box
	{
		top: 22px;
    transform: scale(0.65);
	}
  
  #header .start_search img{

  }

}







@media (max-width: 400px)
{
  #header img:first-child{
    z-index: 777;
    position: relative;
  }
  #head_nav .logo{
    width: 100px;
    position: absolute;
    top: -26px;
    
  }
	.logo img {
		width: 100%;
	}

	.transform img
	{
		width: 100% !important;
	}
	.transform
	{
		margin-left: 3px;
		transform: scale(1.1,0.8);
	}
	#footer li
	{
		margin-left: 11px;
	}
	#footer li *, .copyright
	{
		font-size: 1.5em !important;
	}
	.copyright
	{
		top: 0px;
    font-size: 1.2em !important;
    margin-left: 17px;
	}
	.post_preview
	{
		font-size: 13px;
    
	}
	.left1
	{
		left: -25px;
	}
	.post_title a
	{
		font-size: 15px;
	}
	.post_meta{
		font-size: 13px;
	}
  .post_date{
    font-size: 11px;
  }
	#formAuth input{
		font-size: 15px;
	}  
  .transform2{
    transform: scale(0.8);
  }
  .transform3{
    top: 4px;
  }
  #header .search_box{
    width: 151%;
  }
  #header .search_field{
    left: 3px;
  } 
  #header .start_search{
   
  }
  
  #hide4 img{
    height: 22px;
    top: 8px;
    right: 12px;
    cursor: pointer;
  }
  a.studio{
    width: 107%;
  }
  .noneBr{
    display: block;
  }
  .pagination{
    bottom: 0;
  }
  .grid_box
	{
		height: 222px;
	}
  #main_preview{
		font-size: 14px;
	}
  #headLinks a{
    font-size: 19px;
    padding: 0 2px;
  }
  #headLinks img{
    height: 28px;
  }
  #headLinks{
    width: 99%;
    right: 9px;
    left: auto;
    padding-right: 0px;
    margin-bottom: -10px;
    bottom: 3px;
  }
  #head_nav2 img{
    height: 33px;
  }
  .search{
    margin-left: -2px;
  }
  .studio{
    font-size: 17px;
  }
  .works{
    font-size: 19px;
  }
  code[class*=language-],pre[class*=language-],
  code[class*=language-] *,pre[class*=language-] *
	{
		font-size: 14px !important;
	}
  #post .post{
    font-size: 18px;
  }
  #formAuth{
    width: 90%;
    left: 5%;
  }
  #output{
    font-size: 15px;
  }
  .pagination{
    
  }
  #hideBr{
    display: block;
  }
  .pagSpan{
    display: inline-block;
    bottom: 11px;
  }
  #chat-body{
    height: 300px;
  }
  #chat-panel{
    width: 300px;
  }
}