@media only screen and (max-width:1680px) {
	#header,
    #footer,
    .profile-img-wrap {        
        width: 350px;        
    }
    .profile-img-wrap {       
        left: 350px;        
    }
    .main-wrap {        
        padding: 0 0 0 700px;
    }
    .key-skill-animation {        
        font-size: 50px;        
    }
    ul.contact-details {        
        width: 100%;
    }
}
@media only screen and (max-width:1600px) {
	#logo {
        padding: 30px 15px;        
        font-size: 30px;
        line-height: 42px;
    }
    ul#menu li {        
        font-size: 13px;        
    }
    ul#menu li a {        
        padding: 10px 0;        
    }
    #header,
    #footer,
    .profile-img-wrap {        
        width: 300px;        
    }
    .profile-img-wrap {       
        left: 300px;        
    }
    .profile-img {
        width: 200px;
        height: 200px;       
    }
    .dot {       
        height: 300px;
        width: 300px;        
        top: -50px;
        left: -50px;        
    }
    .main-wrap {        
        padding: 0 0 0 600px;
    }
    ul.social li,
    ul.social li a {        
        height: 50px;        
    }
    ul.social li::after {        
        font-size: 20px;
        line-height: 50px;        
        height: 50px;       
    }
    ul.social {       
        margin: 0 0 15px;
    }
    .profile-content h2 {       
        line-height: 27px;
        font-size: 24px;
    }
    .profile-content h2 span {        
        font-size: 14px;
        line-height: 30px;
    }
    .home-content h1,
    .about-colum h1,
    .skill-colum h1,
    .experience-colum h1,
    .education-colum h1,
    .portfolio-colum h1,
    .contact-colum h1 {
        line-height:42px;       
        font-size: 30px;
    }
    .home-content {
        padding: 250px 70px 70px;        
    }
    .awesome-skill,
    .experience-top-colum,
    .education-top-colum,
    .portfolio-top-colum,
    .contact-top-colum{
       padding:30px 0; 
    }
    ul.inform-list {        
        margin: 30px 0;        
    }
    .education-colum h4,
    .about-colum h3 {
        font-size: 18px;
        line-height: 23px;        
    } 
    .experience-right span {
        font-size: 13px;        
    }   
    .experience-colum h3,
    .education-colum h3,
    .social-network h4,
    .contact-form-colum h3 {
        font-size: 16px;
        line-height: 21px;        
    }
    .experience-colum h4 {
        font-size: 21px;
        line-height: 25px;        
    }
}
@media only screen and (max-width:1440px) {	
	
}
@media only screen and (max-width:1400px) {
	.key-skill-animation {
		font-size: 40px;
	}
}
@media only screen and (max-width:1366px) {
    body {        
        font-size: 13px;
        line-height: 21px;        
    }
	#logo {
        padding: 20px 15px;
        font-size: 21px;
        line-height: 25px;
    }
    #header,
    #footer,
    .profile-img-wrap {        
        width:250px;        
    }
    .profile-img-wrap {       
        left:250px;        
    }
    .profile-img {
        width:150px;
        height:150px;       
    }
    .dot {       
        height:230px;
        width:230px;        
        top: -40px;
        left: -40px;        
    }
    .main-wrap {        
        padding: 0 0 0 500px;
    }
    ul#menu li {
        font-size: 12px;
    }
    ul#menu li a {
        padding: 8px 0;
    }
    #footer {       
        padding: 10px 0;        
    }
    #footer p {        
        font-size: 10px;        
        line-height: 15px;        
        margin: 0;
    }	
    ul.social li, 
    ul.social li a {
        height: 40px;
    }
    ul.social li::after {
        font-size: 16px;
        line-height: 40px;
        height: 40px;
    }
    .profile-content h2 {
        line-height: 25px;
        font-size: 21px;
    }
    .profile-content h2 span {
        font-size: 12px;
        line-height: 21px;
    }
    .home-content h1, 
    .about-colum h1, 
    .skill-colum h1, 
    .experience-colum h1, 
    .education-colum h1, 
    .portfolio-colum h1, 
    .contact-colum h1 {
        line-height: 32px;
        font-size: 24px;
    }
    .key-skill-animation {
        font-size: 40px;
        line-height: 60px;
    }
    .education-colum h4, 
    .about-colum h3,
    .skill-colum h3,
    .experience-top-colum h2,
    .experience-colum h3, 
    .education-colum h3, 
    .social-network h4, 
    .contact-form-colum h3,
    .education-top-colum h2,
    .education-top-colum h2,
    .portfolio-top-colum h2,
    .contact-top-colum h2 {
        font-size: 14px;
        line-height: 21px;
        margin: 0 0 10px;
    }
    .about-colum .btn-default{
        font-size: 11px;
    }
    .content-hold {
        padding: 30px 70px;        
    }
    .works-well-colum,
    .apps-tools-colum,
    .workflow-colum {
        padding: 30px 0;        
    }    
    .skill-table h4{
        font-size: 14px;
    }
    .skill-table small {        
        font-size: 12px;        
    }
    ul.apps-tools-list li {
        font-size: 13px;
        line-height: 19px;        
        margin: 0 0 8px 0;        
    }
    .skillbar-title {        
        font-size: 14px;        
        line-height:21px;
    }
    .experience-colum h4 {
        font-size: 16px;
        line-height: 19px;
    }
    .grid-wrap ul li figure figcaption img {        
        width: 31px;
        margin: 0 0 10px;
    }
    .grid-wrap ul li figure figcaption h3 {        
        font-size: 16px;        
    }
    .grid-wrap ul li figure figcaption span{
        font-size: 11px; 
        line-height: 15px;    
    }
    ul.contact-details li h4 {
        font-size: 12px;
        line-height: 17px;        
        margin: 0 0 2px;
    }
    ul.contact-details li:nth-of-type(1)::before {        
        font-size: 30px;
        line-height: 32px;
    }
    ul.contact-details li:nth-of-type(2)::before {        
        font-size: 26px;
        line-height: 28px;
    }
    ul.contact-details li:nth-of-type(3)::before {       
        font-size: 21px;
        line-height: 23px;
    }
    ul.contact-details li:nth-of-type(4)::before {       
        font-size: 23px;
        line-height: 25px;
    }
    ul.contact-details li {        
        padding: 0 0 0 35px;
    }
    .contact-colum ul.social {
        margin: 10px 0 0 0;
    }
    .contact-colum ul.social li {        
        width: 40px;
    }
    .contact-form-colum {       
        margin: 10px 0 0 0;        
        padding:15px;
    }
    .contact-form-colum .form-control {        
        height: 28px;
        padding: 3px 12px;
        font-size: 11px;        
        border-radius:2px;       
    }
    .contact-form-colum textarea.form-control {
        height: 114px;
    }
}
@media only screen and (max-width:1280px) {
	.content-hold {
		padding:30px;
	}
	.home-content {
		padding: 250px 30px 70px;
	}
	.key-skill-animation {
		font-size:35px;
	}
}
@media only screen and (max-width:1199px) {
	#header, 
	#footer, 
	.profile-img-wrap {
		width: 220px;
	}
	.profile-img-wrap {
		left: 220px;
	}
	.main-wrap {
		padding: 0 0 0 440px;
	}
}
@media only screen and (max-width:1170px) {	
	
}
@media only screen and (max-width:1024px) {
	.menu-wrap {        
        padding: 20px 15px;
    }	
	.profile-img-wrap {
		left: 0;
		height: auto;
		background: none;
		top: auto;
		bottom:70px;
	}
	.profile-content h2 {		
		display: none;
	}
	.profile-content h3 {		
		margin:5px 0 15px 0;
		border-top: 1px solid #f7ca5e;
		border-bottom: 1px solid #f7ca5e;
		padding: 10px 0;
		color: #fff;
	}
	.main-wrap {
		padding: 0 0 0 220px;
	}
}

@media only screen and (max-width:992px) {
	ul.inform-list,
	.about-colum p	{		
		padding: 0;
	}	
	.skill-chart {		
		width: 200px!important;		
	}
	.skill-chart canvas {		
		width: 200px!important;
		height: 200px!important;
	}
	.skill-char-text {		
		height: 200px;		
	}
	ul.apps-tools-list li {		
		width: 50%;		
	}
	.grid-wrap ul {		
		margin: 0;		
	}
	.grid-wrap ul li {		
		padding: 5px;
	}
	.grid-wrap ul li figure {		
		padding: 3px;		
	}
	.company-img {		
		width: 70px;
		height: 70px;		
	}
	.experience-right {		
		width: 70%;
		padding: 5px 0 0 15px;
	}
}
@media only screen and (max-width:767px) {
	body {        
        font-size: 12px;
        line-height:19px;        
    }
	html {
	  height: 100%;	  
	}
	body {
	  height:100%;	  
	}
	.hamberg{
		display:block;
	}
	#header{
		width:100%;
		height: auto;
		z-index:2;
	}
	.layout{
		z-index:1;		
	}
	#logo {
		padding:10px 15px;
		float:left;
		background:none;
		font-size: 16px;
		line-height: 21px;
	}
	ul#menu li a {
		padding: 3px 0;
		font-size: 11px;
	}
	.profile-img-wrap {
		left: 50%;		
		top: 0;
		bottom: auto;
		width:60px;
		margin: 0 0 0 -25px;
	}
	.profile-img {
		width:60px;
		height:60px;
		padding: 2px;
	}
	.dot {
		height: 80px;
		width: 80px;
		top: -10px;
		left: -10px;
	}
	.profile-content h3{
		display:none;
	}
	.menu-wrap {
		padding:40px 15px 0 15px;
		position: absolute;
		left: 0;
		top:40px;
		background: #ffb400;
	}
	.menu-wrap{
		-webkit-transition: 1s ease-in-out;
		-moz-transition: 1s ease-in-out;
		-o-transition: 1s ease-in-out;
		transition: 1s ease-in-out;
		-ms-transform: translate(-100%, 0);
		-webkit-transform: translate(-100%, 0);
		-o-transform: translate(-100%, 0);
		-moz-transform: translate(-100%, 0);
		transform: translate(-100%, 0);
	}
	.menu-wrap.open{
		-webkit-transition: 1s ease-in-out;
		-moz-transition: 1s ease-in-out;
		-o-transition: 1s ease-in-out;
		transition: 1s ease-in-out;
		-ms-transform: translate(0, 0);
		-webkit-transform: translate(0, 0);
		-o-transform: translate(0, 0);
		-moz-transform: translate(0, 0);
		transform: translate(0, 0);
	}
	
	
	.main-wrap {
		padding: 0;
		position:relative;
		min-height:100%;
		padding:0 0 90px 0;
	}
	.slide{
		height: auto;
		position: static;
		float: left;
		width: 100%;
	}
	.home-content h1, 
	.about-colum h1, 
	.skill-colum h1, 
	.experience-colum h1, 
	.education-colum h1, 
	.portfolio-colum h1, 
	.contact-colum h1 {
		line-height: 25px;
		font-size: 18px;
	}
	.home-content {
		padding:150px 15px 0;
	}
	.key-skill-animation {		
		margin: 50px 0 0 0;		
		font-size:25px;
		line-height:30px;		
		padding: 0;
	}
	.content-hold {
		padding: 80px 15px 0;		
	}
	ul.inform-list {
		margin: 15px 0 25px 0;
	}
	ul.inform-list li {		
		line-height: 19px;
		padding: 5px 0;
	}
	.awesome-skill, 
	.experience-top-colum, 
	.education-top-colum, 
	.portfolio-top-colum, 
	.contact-top-colum {
		padding:15px 0;
	}
	.works-well-colum, 
	.apps-tools-colum, 
	.workflow-colum {
		padding:15px 0;
	}
	.skill-chart canvas {		
		width: 250px!important;
		height: 250px!important;
	}
	.skill-char-text {		
		height: 250px;		
	}
	.skill-chart {
		width: 250px!important;
		float:none;
		display:inline-block;
		margin:15px 0 0 0;
	}
	ul.apps-tools-list li {
		width:100%;
	}
	ul.experience-list li {		
		padding: 20px 0 10px 0;
	}
	.company-img {
		width: 50px;
		height: 50px;
		border: 2px solid #ffb400;
		padding: 7px;
	}
	.experience-right {
		width:100%;
		padding:15px 0 0 0;
	}
	.experience-bottom {		
		padding: 7px 0 0 0;
	}
	.grid-wrap ul li {
		width:100%;
	}
	.contact-top-colum p {
		padding: 0;
	}
	#footer{
		position:absolute;
		float:left;
		width:100%;
		background: #ffb400;
	}
	ul.social {
		margin: 0 0 5px;
		text-align:center;
	}
	ul.social li, 
	ul.social li a {
		height: 25px;
		float:none;
		display:inline-block;
		width:25px;
	}
	ul.social li::after {
		font-size: 12px;
		line-height: 25px;
		height: 25px;
	}
}
@media only screen and (max-width:479px) {
	
}