@media all and (max-width:1360px){

}

@media all and (max-width:1280px){

}

@media all and (max-width:1120px){

}

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

}

@media all and (max-width:1024px){
  .container-right { width:calc(50% - 140px); }
  .skills .inner { margin:0 5%; }

}

@media all and (max-width:960px){
  .header .page-title { font-size:90px; line-height:90px; }
  .container-right { width:calc(50% - 80px); }
  .container-left .inner { width:90%; }
  .skills .right .skill .title { width: 150px; padding: 0 20px 0 40px; }
  .skills .right .skill .rating { left:210px; }
  .skills .left .skill .title { width: 150px; padding: 0 40px 0 20px; }
  .skills .left .skill .rating { right:210px; }
}

@media all and (max-width:860px){
  .container-right { width:50%; }
  .container-right .inner { width:90%; float:right; }
  .skills .right .skill { padding: 10px 0 27px 0; }
  .skills .right .skill .title { width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
  .skills .right .skill .rating { left: 35px; transform: translateY(0); top: auto; bottom: 10px; }
  .skills .left .skill { padding: 10px 0 27px 0; }
  .skills .left .skill .title { width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
  .skills .left .skill .rating { right: 40px; transform: translateY(0); top: auto; bottom: 10px; }
}

@media all and (max-width:768px){
  .header .page-title { font-size:80px; line-height:80px; padding-top:50px; }
  .container-left.main { float:none; width:100%; text-align: center;}
  .container-left.main .inner { width:100%; padding:0; }
  .container-left.main .main-pic { float:none; display: inline-block; max-width:400px; }
  .container-right.personal { width:50%; float:left; margin:20px 0 0 0; }
  .container-right.personal .inner { width:100%; padding:0 15%; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;  }
  .container-right.education { width:50%; float:right; margin:20px 0 0 0; }
  .container-right.education .education { padding:0; }
  .container-right.education .inner { width:100%; padding:0 15%; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
  .container-left.experience .inner { width:100%; padding:0 15%; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
  .container-left.experience .experience .text { padding:0 0 0 50px; }
  .container-left.experience .experience { padding:53px 0 100px 0; margin:70px 0 0 0; }
  .container-left.experience .experience:before { width:100%; }
  .container-right .languages h2.title { font-size:50px; }
}

@media all and (max-width:640px){
  body:after { width:100%; }
  p a:after { display: none; }
  .header .page-title { font-size:70px; line-height:70px; }
  .container-right.personal { width:100%; background:#fff; margin: 40px 0 0 0; padding:20px 0 0 0;}
  .container-right.personal .inner { max-width:400px; margin:0 auto; padding:0; float:none; }
  .container-right.education { width:100%; background:#fff; margin:0; padding:0 0 40px 0; }
  .container-right.education .inner { max-width:400px; margin:0 auto; padding:0; float:none; }
  .container-left.experience { width:100%; }
  .container-left.experience .experience { padding:53px 0 50px 0; }
  .container-left.experience .experience .text { padding: 0 0 0 75px; }
  .container-left.experience .inner { max-width:400px; margin:0 auto; padding:0; float:none; overflow:hidden; }
  .container-right.languages { width:100%;background:#6abe84; }
  .container-right.languages .languages { margin:0; padding: 60px 0 50px; }
  .container-right.languages .inner { width:100%; margin:0 auto; float:none; max-width:400px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
  .header .social-media .item a:after { display:none; }
  .header .logo:before { background:#323339; transform:translateX(-50%); }
  .header .logo:after { display: none; }
  .skills { margin:20px 0 50px 0; }
  .skills h2.title { text-align: left; padding:0 20px; }
  .skills .divider { display: none; }
  .skills .left { width:100%; text-align: left; }
  .skills .left .skill { padding: 10px 0; }
  .skills .left .skill .title { width:50%; float:left; }
  .skills .left .skill .rating { right:20px; bottom:auto; top: 50%; transform: translateY(-50%); }
  .skills .right { width:100%; }
  .skills .right .skill { padding: 10px 0; }
  .skills .right .skill .title { padding:0 40px 0 20px; width:50%; }
  .skills .right .skill .rating { right:20px; left:auto; bottom:auto; top: 50%; transform: translateY(-50%); }
  .footer { background:#fff; margin:0; }
  .footer .divider { display: none; }
  .footer .social-media .item a:after { display:none; }
}

@media all and (max-width:480px){
  .header { padding:20px 0 0 0; text-align: center;}
  .header .logo { top:71px; }
  .header .page-title { font-size:50px; line-height:50px; padding-top:100px; }
  .container-left.main .main-pic { max-width:100%; }
  .container-left.main .main-pic img { padding:0 10%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
  .container-right.personal .inner { max-width:100%; padding:0 10%; }
  .container-right.education .inner { max-width:100%; padding:0 10%; }
  .container-left.experience .inner { max-width:100%; padding:0 10%; }
  .container-left.experience .experience .text { padding:0 0 0 50px; }
  .container-right.languages .inner { max-width:100%; padding:0 10%; }
  .container-right.languages .languages { padding: 50px 0 40px; }
  .container-right .languages h2.title { font-size:40px; }
  .skills .inner { padding:0 10%; margin:0; }
  .skills h2.title { text-align: left; padding:0; }


  .skills .left .skill { padding: 10px 0 27px 0; }
  .skills .left .skill .title { width:100%; padding:0; }
  .skills .left .skill .rating { left:0; right:auto; transform: translateY(0); top: auto; bottom: 10px; }
  .skills .left .skill .rating .item { margin:0 5px 0 0; }

  .skills .right { border-top: 1px solid #c1c6b6; margin: 25px 0 0 0; padding: 15px 0 0 0; }
  .skills .right .skill .rating .item { margin:0 5px 0 0; }
  .skills .right .skill { padding: 10px 0 27px 0; }
  .skills .right .skill .title { width:100%; padding:0; }
  .skills .right .skill .rating { left:0; right:auto; transform: translateY(0); top: auto; bottom: 10px; }

}

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

}