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

	.menu li{
		width:100px;
	}

}

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

	.menu li{
		width:70px;
	}

	.logo {
	   	 padding: 20px;
	   	 margin-bottom:0px;
	}

	.img-add{
		margin-left:21px;
	}

}


@media only screen and (max-width:950px){
	
	.menu li{
		width:90px;
		padding: 0 10px;
		overflow:hidden;
	}

	.work-li{
		width:116px !important;
	}

	.aboutme-menu{
		width:110px;
		height:128px;
	}

}		




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

	.eyes {
	    position: absolute;
	    width: 51px;
	    right: 6px;
	    bottom: -15px;
	    z-index: 1;
	}

	.digital-eye:hover {
	    margin-top:0px;
	}

	.analog-eye:hover {
	    margin-top:0px;
	}

	.menu{
		position:relative;
		right:0;
		left:0;
		float:left;
		width:100%;
	
	}

	.menu li {
	    width: 100% !important;
	    box-sizing: border-box;
	    height:auto !important;
	    margin-bottom:14px;
	}

	.work-abso,.fun-abso,.aboutme-abso,.lens-abso{
		position:relative;
		height:auto;
	}

	.work-li,.fun-li,.lens-li{
		height:auto !important;
	}

	.work-border-menu{
		margin-top:10px;
	}

	.work-border-menu,.fun-border-menu,.lens-border-menu {
	    height:30px;
	    position: relative;
	    clear: both;
	    display: block;
	}

	.aboutme-border-menu{
		display:none;
	}

	.work-abso a:hover .work-menu {
	    margin-top: 0px;
	    transform: scale(1);
	    -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.lens-abso a:hover .lens-menu {
	    margin-top: 0px;
	    transform: scale(1);
	    -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.lens-abso a:hover .lens-title{
		margin-bottom:7px;
		margin-top:0px;
		 -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.fun-abso a:hover .fun-menu {
	    margin-top: 0px;
	    transform: scale(1);
	    -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.aboutme-abso a:hover .aboutme-menu {
	    margin-top:0px;
	    transform: scale(1);
	    -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.work-abso a:hover + .work-border-menu {
	    height: 30px;
	}

	.fun-abso a:hover + .fun-border-menu {
	    height:30px;
	}

	.lens-abso a:hover + .lens-border-menu {
	    height:30px;
	}

	.work-menu{
		margin-bottom:0;
	}

	.fun-menu{
		margin-bottom:0px;
	}

	.lens-menu{
		margin-bottom:8px;
	}

	.work-li{
		margin-bottom:8px !important;
	}

	.aboutme-menu{
		margin-left:-1px;
	}

	.img-add{
		max-width:200px;
		padding-right:10px;
	}

	.menu{
		margin-top:20px;
		padding-bottom: 75px;
	}

	.img-add{
		float:right;
		clear:none;
		margin-top:20px;
	}

}




@media only screen and (max-width:500px){
	.img-add,.eyes{
		max-width:175px;
	}
}

@media only screen and (max-width:290px){
	.img-add{
		max-width:34%;
	}
}


@media only screen and (max-width:389px){
	.img-add,.eyes{
		max-width:116px;
	}

	.eyes{
		width: 42px;
	    right: 6px;
	    bottom: -10px;
	}
}




@media only screen and (max-width:668px){
	.menu li{
		width:90px;
	}
	.aboutme-menu{
		width:112px;
	}

	.work-li{
		width:103px !important;
	}


}


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

	.menu li{
		
		width:100% !important;
		box-sizing:border-box;
	}

	.work-abso,.fun-abso,.aboutme-abso,.lens-abso{
		position:relative;
		height:auto;
	}

	.work-border-menu{
		margin-top:10px;
	}

	.work-border-menu,.fun-border-menu,.lens-border-menu {
	    height:30px;
	    position: relative;
	    clear: both;
	    display: block;
	}

	.aboutme-border-menu{
		display:none;
	}

	.work-menu{
		margin-bottom:0;
		
	}

	.work-abso{
		margin-bottom:0;
	}

	.fun-abso{
		margin-bottom:0;
	}


	.work-li{
		margin-bottom:12px;
	}

	.lens-li {
	    margin-bottom: 12px;
	}

	.fun-li{
		margin-bottom:14px;
	}

	.aboutme-menu,.fun-menu{
		margin-bottom:0;
	}

	.logo{
		padding: 20px;
	}

	.work-li,.fun-li,.lens-li{
		height:auto !important;
	}

	.aboutme-li{
		height:auto !important;
	}


	.work-abso a:hover .work-menu {
	    margin-top: 0px;
	    transform: scale(1);
	    -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.fun-abso a:hover .fun-menu {
	    margin-top: 0px;
	    transform: scale(1);
	    -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.aboutme-abso a:hover .aboutme-menu {
	    margin-top:0px;
	    transform: scale(1);
	    -webkit-transform: scale(1);
	    -moz-transform: scale(1);
	    -ms-transform: scale(1);
	}

	.work-abso a:hover + .work-border-menu {
	    height: 35px;
	}

	.fun-abso a:hover + .fun-border-menu {
	    height:35px;
	}

}




/* ABOUT PAGE */


@media only screen and (max-width:1220px){
	.container{
		width:100%;
	}

	.fun-section-title,.fun-section-text{
		padding:0 14px;
		box-sizing:border-box;
	}
}


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

	.fun-images-block{
		margin-top:40px;
	}
}





@media only screen and (max-width:1024px){
	.work_read_block_info_video{
		height:415px;
	}

	.education_info{
		margin-top:40px;
	}

	.about-s-title,.work-title,.fun-section-title{
		margin-top:20px;
		margin-bottom:20px;
	}

	.Workblock{
		margin-bottom:30px;
	}

	.fun-images{
		
	}

}


@media only screen and (max-width:880px){
	.work-block article{
		margin-bottom:30px;
	}

	.analog-block article {
  	  margin-bottom: 30px;
	}

}


@media only screen and (max-width:820px){
	.work_read_block_info_video{
		height:370px;
	}

	.about_info{
		width:100%;
		padding: 0 15px;
		box-sizing:border-box;
		max-width:100%;
	}
}


@media only screen and (max-width:720px){
	.work-block article,.work_read_block_img li,.analog-block article,.boardblock article{
		width:50%;
		margin-bottom:14px;
		padding: 0 9px;
	}

	#work{
		margin-bottom:20px;
		float:left;
		display:block;
	}

	.board-img img{
		height: 82vw;
	}
}

@media only screen and (max-width:700px){
	.work_read_block_info_video{
		height:340px;
		margin-bottom:20px;
	}

	.work_read_block_info{
		margin-top:25px;
	}
}

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

	.work_read_block_info_video {
	    height: 302px;
	}

	.work_read_block_info{
		margin-top:20px;
	}

	.work_s-title{
		font-size:30px;
	}

}

@media only screen and (max-width:460px){
	.work_read_block_info_video {
	    height:250px;
	}

}

@media only screen and (max-width:414px){
	.work_read_block_info_video {
	    height:215px;
	}
}


@media only screen and (max-width:375px){
	.work_read_block_info_video {
	    height:175px;
	}

	.work-block article,.work_read_block_img li,.analog-block article{
		width:100%;
	}

	.analog-img{
		max-height:230px;
	}

	.work-text,.analog-text,.digital-text{
		margin-bottom:14px;
	}

}


@media only screen and (max-width:520px){
	.work_read_block_info_text,.about_info_text,.education_info-text,.Workblock-info,.fun-section-text{
		font-size:13.5px;

	}
}

@media only screen and (max-width:335px){
	.logo{
		padding: 10px;
	}

	.img-add{
		margin-top:10px;
	}

	.img-add, .eyes {
	    max-width: 116px;
	}

	.eyes{
		width:33px;
	}

}




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

	.icon-close-video{
		top:22%;
	}

}

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

	.icon-close-video{
		top:21%;
	}

}

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

	.work-block article,.analog-block article{
		width:100%;
		margin-bottom: 14px;
	    padding: 0 9px;
	}

	.work-text, .analog-text, .digital-text {
	    margin-bottom: 14px;
	}

}

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

	.digital-eye-title{
		    font-size: 25px;
		    top:10px;
	}

	.analog-eye-title{
		font-size:25px;
		top:7px;
		right:4pc;
	}

	.inpur-cust textarea{
		height:150px;
	}

}