html{height:100%}
body{height:100%;font:100% 'Raleway', sans-serif;color:#ecf0f1}
h1{margin:0 0 30px;font-weight:200;font-size:3em;line-height:1;text-transform:uppercase}
    h1 span{display:block;font-size:0.6em;text-transform:none}
h2{margin:0;font-weight:bold;font-size:1em;line-height:1;text-transform:uppercase;letter-spacing:2px}
h3{margin:0 0 20px;font-weight:normal;font-size:1.3em;line-height:1}
p{margin:0 0 15px;font-size:0.8em;line-height:1.5}
ol, ul{margin:0 0 15px;padding:0 0 0 40px;font-size:0.8em;line-height:1.5}
nav ol, nav ul{list-style:none;margin:0;padding:0}
a{color:#ecf0f1}
a:hover{text-decoration:none}
address{margin:0 0 15px;font-style:normal;font-size:0.8em;line-height:1.5}
blockquote{position:relative;margin:0;padding:0 0 0 40px}
.lt-ie8 blockquote{padding:0}
    blockquote:before{content:"„";position:absolute;left:0;top:-44px;font:4em/1 Verdana,Geneva,sans-serif}

.inp-b{position:relative;margin:0 0 20px}
    .inp-b .inp-b{margin:0}
    .inp-b .cols{margin-left:-10px}
    .lt-ie8 .inp-b .cols{margin:0}
    .inp-b .col{padding-left:10px}
    .lt-ie8 .inp-b .col{padding:0}
    .inp-b label.inp-error{position:absolute;left:15px;top:-18px;white-space:nowrap}
.inp-text, textarea{width:100%;margin:0;padding:0 0 10px;background:none;border:none;border-bottom:3px solid #CEA8AF;-webkit-border-radius:0;border-radius:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font:0.8em 'Raleway', sans-serif;color:#ecf0f1;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-appearance:none}
textarea{max-width:100%;resize:none}
.inp-text:focus, textarea:focus, textarea.inp-error:focus{border-bottom-color:#ECF0F1}
::-webkit-input-placeholder{color:#ecf0f1}
:-moz-placeholder, ::-moz-placeholder{color:#ecf0f1}
:-ms-input-placeholder{color:#ecf0f1}
label{padding:0;line-height:1}
input.inp-error, textarea.inp-error{border-bottom-color:#F75A53}
input.inp-success, textarea.inp-success{border-bottom-color:#58C3A5}
label.inp-error{overflow:hidden;display:none;width:0;height:0}

.clearfix:before, .clearfix:after, .cols:before, .cols:after{content:" ";display:table}
.clearfix:after, .cols:after{clear:both}
.lt-ie8 .clearfix, .lt-ie8 .cols{height:1%}

.sec-cont{position:relative;padding:30px 30px 0}

.cols{margin:0 0 0 -30px}
.col{float:left;padding:0 0 0 30px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.lt-ie8 .col{padding:0}
.col-1-2{width:50%}
.lt-ie8 .col-1-2{width:49.9%}
.col-1-3{width:33.3%}
.col-1-4{width:25%}
.lt-ie8 .col-1-4{width:24.9%}

.center{text-align:center}

.wrapper{overflow:hidden;min-height:100%;background:fixed #6F839E url(../img/bg/bg-1.jpg) no-repeat 50% 0;-webkit-background-size:100% 100%;background-size:100% 100%}

.wrap{width:940px;margin:auto;padding:0 0 30px}

.header{position:relative;padding:20px 0;text-align:center}

.main{-webkit-perspective:1200px;-moz-perspective:1200px;-ms-perspective:1200px;perspective:1200px}
.main-i{position:relative;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;transform-style:preserve-3d}
.js .main-i{height:840px}

.main-sec-b, .aside-sec-b, .secondary-aside-sec-b{background:rgba(51,63,81,0.3)}
.lt-ie9 .main-sec-b, .lt-ie9 .aside-sec-b, .lt-ie9 .secondary-aside-sec-b{background:#5F7489}
.js .main-sec-b{position:absolute;left:0;top:0;width:940px;height:470px}
    .js .main-sec-b .scroll-b{height:410px}
    .lt-ie8 .main-sec-b .scroll-b{position:relative;overflow:auto;height:1%}
.js .aside-sec-b{position:absolute;left:0;bottom:0;width:460px;height:350px}
.js .secondary-aside-sec-b{position:absolute;right:0;bottom:0;width:460px;height:350px}
.lt-ie10.js .main-sec-b, .lt-ie10.js .aside-sec-b, .lt-ie10.js .secondary-aside-sec-b{visibility:hidden}
.lt-ie10.js .first-sec, .lt-ie10.js .active-sec{visibility:visible}
.main-sec-b, .aside-sec-b, .secondary-aside-sec-b{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);-ms-transform:rotateY(180deg);transform:rotateY(180deg);z-index:5}
.first-sec.main-sec-b, .first-sec.aside-sec-b, .first-sec.secondary-aside-sec-b, .no-js .main-sec-b, .no-js .aside-sec-b, .no-js .secondary-aside-sec-b{-webkit-transform:rotateY(0deg);-moz-transform:rotateY(0deg);-o-transform:rotateY(0deg);-ms-transform:rotateY(0deg);transform:rotateY(0deg);z-index:10}
.main-sec-b.inactive-sec{-webkit-animation:hideSec 1s both;-moz-animation:hideSec 1s both;-o-animation:hideSec 1s both;-ms-animation:hideSec 1s both;animation:hideSec 1s both}
.aside-sec-b.inactive-sec{-webkit-animation:hideSec 1s both 0.2s;-moz-animation:hideSec 1s both 0.2s;-o-animation:hideSec 1s both 0.2s;-ms-animation:hideSec 1s both 0.2s;animation:hideSec 1s both 0.2s}
.secondary-aside-sec-b.inactive-sec{-webkit-animation:hideSec 1s both 0.4s;-moz-animation:hideSec 1s both 0.4s;-o-animation:hideSec 1s both 0.4s;-ms-animation:hideSec 1s both 0.4s;animation:hideSec 1s both 0.4s}
.main-sec-b.active-sec{-webkit-animation:showSec 1s both;-moz-animation:showSec 1s both;-o-animation:showSec 1s both;-ms-animation:showSec 1s both;animation:showSec 1s both;z-index:10}
.aside-sec-b.active-sec{-webkit-animation:showSec 1s both 0.2s;-moz-animation:showSec 1s both 0.2s;-o-animation:showSec 1s both 0.2s;-ms-animation:showSec 1s both 0.2s;animation:showSec 1s both 0.2s;z-index:10}
.secondary-aside-sec-b.active-sec{-webkit-animation:showSec 1s both 0.4s;-moz-animation:showSec 1s both 0.4s;-o-animation:showSec 1s both 0.4s;-ms-animation:showSec 1s both 0.4s;animation:showSec 1s both 0.4s;z-index:10}
    .js .aside-sec-b .scroll-b, .js .secondary-aside-sec-b .scroll-b{height:290px}

.profile-sec, .works-sec, .map-sec{background:none}
.services-sec{background:#2980B9}
.features-sec{background:#9B59B6}
.skills-sec{background:#FAE69D;color:#2C3E50}
.tools-sec{background:#BE7763}
.testimonials-sec{background:#F9644E}
.clients-sec{background:#58BBB8}
.contact-sec{background:#B0606D}
.info-sec{background:#1FA4C7}
    .services-sec .heading, .features-sec .heading, .experience-sec .heading, .skills-sec .heading, .tools-sec .heading, .testimonials-sec .heading, .clients-sec .heading, .contact-sec .heading, .info-sec .heading{padding-left:80px}

.nav{position:relative}
    .nav ul{font-weight:bold;font-size:0.8em;line-height:1;letter-spacing:2px;text-transform:uppercase}
    .nav li{display:inline-block}
    .lt-ie8 .nav li{display:inline}
    .nav a{position:relative;display:block;padding:14px 20px;-webkit-border-radius:25px;border-radius:25px;color:#2c3e50;text-decoration:none;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease}
    .js .nav a{outline:none}
    .nav a:hover{color:#ecf0f1}
    .nav .active{background:#2C3E50;color:#ecf0f1}
    .nav .nav-trigger{display:none;margin:auto}
    .nav .marker{position:absolute;left:50%;top:-100px;width:40px;height:10px;margin:0 0 0 -20px;background:#ecf0f1;-webkit-transition:all 0.4s ease, top 0.4s ease 0.4s;-moz-transition:all 0.4s ease, top 0.4s ease 0.4s;-o-transition:all 0.4s ease, top 0.4s ease 0.4s;transition:all 0.4s ease, top 0.4s ease 0.4s}

.social-nav{margin:0 0 30px;padding:0;list-style:none;line-height:1}
    .social-nav li{position:relative;display:inline-block;margin:0 3px}
    .lt-ie8 .social-nav li{margin:0 5px}
    .social-nav a{position:relative;display:block;width:40px;height:40px;background-color:#B9BFCA;background-color:rgba(236,240,241,0.3);background-image:url(../img/btns-social.png);-webkit-border-radius:50%;border-radius:50%;text-decoration:none;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease}
    .social-nav a:hover{background-color:#ECF0F1}
    .social-nav .item-1{background-position:0 0}
    .social-nav .item-1:hover{background-position:0 100%}
    .social-nav .item-2{background-position:-40px 0}
    .social-nav .item-2:hover{background-position:-40px 100%}
    .social-nav .item-3{background-position:-80px 0}
    .social-nav .item-3:hover{background-position:-80px 100%}
    .social-nav .item-4{background-position:-120px 0}
    .social-nav .item-4:hover{background-position:-120px 100%}
    .social-nav .item-5{background-position:-160px 0}
    .social-nav .item-5:hover{background-position:-160px 100%}
    .social-nav .item-6{background-position:-200px 0}
    .social-nav .item-6:hover{background-position:-200px 100%}
    .social-nav .item-7{background-position:-240px 0}
    .social-nav .item-7:hover{background-position:-240px 100%}
    .social-nav .item-8{background-position:-280px 0}
    .social-nav .item-8:hover{background-position:-280px 100%}
    .social-nav .item-9{background-position:-320px 0}
    .social-nav .item-9:hover{background-position:-320px 100%}
    .social-nav .item-10{background-position:-360px 0}
    .social-nav .item-10:hover{background-position:-360px 100%}
    .social-nav .item-11{background-position:-400px 0}
    .social-nav .item-11:hover{background-position:-400px 100%}

.btn{position:relative;display:inline-block;overflow:visible;margin:0 0 15px;padding:12px 20px;background:#2C3E50;background:rgba(44,62,80,0.3);border:none;-webkit-border-radius:25px;border-radius:25px;font:bold 0.8em 'Raleway', sans-serif;text-transform:uppercase;text-decoration:none;letter-spacing:2px;color:#ecf0f1;cursor:pointer;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease}
.btn:hover{background:#ECF0F1;color:#2C3E50}

.prev-btn, .next-btn{display:inline-block;width:40px;height:40px;background-image:url(../img/arrows.png);background-repeat:no-repeat;-webkit-border-radius:50%;border-radius:50%;overflow:hidden;white-space:nowrap;text-indent:100%;cursor:pointer;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease}
.lt-ie8 .prev-btn, .lt-ie8 .next-btn{text-indent:-9999px}
.prev-btn{background-position:0 0}
.prev-btn:hover{background-color:#203040;background-position:0 100%}
.next-btn{background-position:100% 0}
.next-btn:hover{background-color:#203040;background-position:100% 100%}

.zoom-btn, .view-btn{position:relative;display:inline-block;width:40px;height:40px;background-color:rgba(236,240,241,0.3);-pic-background-color:rgba(236,240,241,0.3);background-repeat:no-repeat;background-position:50% 0;-webkit-border-radius:50%;border-radius:50%;overflow:hidden;white-space:nowrap;text-indent:100%;cursor:pointer;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease;vertical-align:middle}
.lt-ie8 .zoom-btn, .lt-ie8 .view-btn{display:block;text-indent:-9999px}
.zoom-btn{background-image:url(../img/btn-zoom.png)}
.view-btn{background-image:url(../img/btn-view.png)}
.zoom-btn:hover, .view-btn:hover{background-color:#ecf0f1;background-position:50% 100%}

.nav-trigger{position:relative;width:40px;height:40px;background:#2C3E50;cursor:pointer}
.nav-trigger-a{background:#ECF0F1}
.nav-trigger:after{content:"";position:absolute;left:50%;top:50%;width:20px;height:12px;margin:-8px 0 0 -10px;border:2px solid #ECF0F1;border-left:none;border-right:none}
.nav-trigger-a:after{border-color:#2C3E50}
.nav-trigger:before{content:"";position:absolute;left:50%;top:50%;width:20px;height:2px;margin:-1px 0 0 -10px;background:#ECF0F1}
.nav-trigger-a:before{background:#2C3E50}

.icon{display:block;width:60px;height:60px;background-color:#203040;background-repeat:no-repeat;background-position:50% 50%}
.icon-services{background-image:url(../img/icon-services.png)}
.icon-features{background-image:url(../img/icon-features.png)}
.icon-experience{background-image:url(../img/icon-experience.png)}
.icon-skills{background-image:url(../img/icon-skills.png)}
.icon-tools{background-image:url(../img/icon-tools.png)}
.icon-testimonials{background-image:url(../img/icon-testimonials.png)}
.icon-clients{background-image:url(../img/icon-clients.png)}
.icon-contact{background-image:url(../img/icon-contact.png)}
.icon-info{background-image:url(../img/icon-info.png)}
.icon-settings{background-color:#ecf0f1;background-image:url(../img/icon-settings.png)}

.heading{position:relative;height:60px;padding:0 30px;background-color:#2C3E50;background-repeat:no-repeat;background-position:20px 50%;color:#ecf0f1}
    .heading .icon{position:absolute;left:0;top:0}
    .heading h2{margin:0;line-height:58px}
    .heading .prev-btn, .heading .next-btn{position:absolute;top:50%;margin-top:-20px}
    .no-js .heading .prev-btn, .no-js .heading .next-btn{display:none}
    .heading .prev-btn{right:50px}
    .heading .next-btn{right:10px}

.intro{position:relative;overflow:hidden;height:470px}
    .intro .intro-cont-wrapper{position:relative;display:table;width:100%;height:100%;margin:0;background:rgba(44,62,80,0.3);-pie-background:rgba(44,62,80,0.3);text-align:center}
    .intro .intro-cont{display:table-row;height:100%}
    .intro .intro-cont-i{position:relative;display:table-cell; vertical-align:bottom;padding:0;border:5px solid #2C3E50;border-left:none;border-right:none}
    .intro .btn{margin:0;background:#B9BFCA;background:rgba(236,240,241,0.3)}
    .intro .btn:hover{background:#ECF0F1}
    .intro .intro-photo{position:absolute;left:50%;top:0;width:100%;height:100%;margin-left:-470px}
        .intro .intro-photo img{vertical-align:bottom}

.slideshow{position:relative}
.slide{position:relative}
.slide h3{text-align:center}

.logo{margin:0 0 15px;text-align:center}
    .logo img{vertical-align:bottom}

.experience{position:relative;padding:0 0 5px;background:url(../img/exp-bg.png) repeat-y 50% 0}
.experience .item{position:relative;float:left;clear:both;width:50%;padding:0 40px 30px 0;text-align:right;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
    .experience .item:before{content:"";position:absolute;right:-10px;top:0;width:20px;height:20px;background:#2C3E50;-webkit-box-shadow:0 0 0 5px rgba(44,62,80,0.3);box-shadow:0 0 0 5px rgba(44,62,80,0.3);-webkit-border-radius:50%;border-radius:50%;-webkit-transition:all 0.8s ease;-moz-transition:all 0.8s ease;-o-transition:all 0.8s ease;transition:all 0.8s ease}
    .experience .item:hover:before{background:#ecf0f1}
.experience .alt-item{float:right;padding-right:0;padding-left:40px;text-align:left}
.experience .alt-item:before{right:auto;left:-10px}
.experience .period{position:absolute;right:-140px;top:2px;width:100px;text-align:left}
.experience .alt-item .period{right:auto;left:-140px;text-align:right}
.experience h3{margin:0 0 10px}
.experience p{margin:0}

.period{font-size:0.9em;line-height:1}

.skills .item{margin:0 0 15px}
.skills h3{display:inline-block;width:130px;margin:0;vertical-align:middle;font-size:1em}
.lt-ie8 .skills h3{display:inline}
.skills .progress{position:relative;display:inline-block;vertical-align:middle}
.lt-ie8 .skills .progress{display:inline}
.skills .point{position:relative;display:inline-block;width:15px;height:15px;margin:0 6px 0 0;background:#2C3E50;-webkit-border-radius:50%;border-radius:50%;vertical-align:middle}
.lt-ie8 .skills .point{display:inline}
.active-sec .skills .point{-webkit-animation:grow 0.5s both 0.3s;-moz-animation:grow 0.5s both 0.3s;-o-animation:grow 0.5s both 0.3s;-ms-animation:grow 0.5s both 0.3s;animation:grow 0.5s both 0.3s}
.active-sec .skills .point:nth-child(2){-webkit-animation-delay:0.4s;-moz-animation-delay:0.4s;-o-animation-delay:0.4s;-ms-animation-delay:0.4s;animation-delay:0.4s}
.active-sec .skills .point:nth-child(3){-webkit-animation-delay:0.5s;-moz-animation-delay:0.5s;-o-animation-delay:0.5s;-ms-animation-delay:0.5s;animation-delay:0.5s}
.active-sec .skills .point:nth-child(4){-webkit-animation-delay:0.6s;-moz-animation-delay:0.6s;-o-animation-delay:0.6s;-ms-animation-delay:0.6s;animation-delay:0.6s}
.active-sec .skills .point:nth-child(5){-webkit-animation-delay:0.7s;-moz-animation-delay:0.7s;-o-animation-delay:0.7s;-ms-animation-delay:0.7s;animation-delay:0.7s}
.active-sec .skills .point:nth-child(6){-webkit-animation-delay:0.8s;-moz-animation-delay:0.8s;-o-animation-delay:0.8s;-ms-animation-delay:0.8s;animation-delay:0.8s}
.active-sec .skills .point:nth-child(7){-webkit-animation-delay:0.9s;-moz-animation-delay:0.9s;-o-animation-delay:0.9s;-ms-animation-delay:0.9s;animation-delay:0.9s}
.active-sec .skills .point:nth-child(8){-webkit-animation-delay:1s;-moz-animation-delay:1s;-o-animation-delay:1s;-ms-animation-delay:1s;animation-delay:1s}
.active-sec .skills .point:nth-child(9){-webkit-animation-delay:1.1s;-moz-animation-delay:1.1s;-o-animation-delay:1.1s;-ms-animation-delay:1.1s;animation-delay:1.1s}
.active-sec .skills .point:nth-child(10){-webkit-animation-delay:1.2s;-moz-animation-delay:1.2s;-o-animation-delay:1.2s;-ms-animation-delay:1.2s;animation-delay:1.2s}

.tools{margin:0;padding:0;list-style:none;font-size:1em;line-height:1}
    .tools li{display:inline-block;margin:0 6px 10px 0;padding:12px 15px;border:1px solid #ecf0f1}
    .lt-ie8 .tools li{display:inline;margin-right:10px}

.js .works-sec .scroll-b{height:470px}
.works .item{position:relative;overflow:hidden;float:left;width:235px;height:235px}
.lt-ie8 .works .item{width:230px;height:230px}
.works .thumb{position:absolute;left:0;top:0;overflow:hidden;width:100%;height:100%}
    .works .thumb img{vertical-align:bottom}
.works .overlay{position:absolute;left:0;top:0;display:table;width:100%;height:100%;background:#2C3E50;background:rgba(44,62,80,0.7);text-align:center;opacity:0;-webkit-transform:scale(2);-moz-transform:scale(2);-ms-transform:scale(2);-o-transform:scale(2);transform:scale(2);-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;transition:all 0.4s ease}
.lt-ie9 .works .overlay{display:none}
.works .item:hover .overlay, .works .hover .overlay{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
.lt-ie9 .works .item:hover .overlay{display:block;display:table}
.works .overlay-i{display:table-row}
.works .overlay-i-2{display:table-cell;vertical-align:middle}
    .works .overlay a{margin:0 3px}
.works h3{margin-bottom:10px;font-size:1em}

.photo{position:relative;overflow:hidden;width:80px;height:80px;margin:0 auto 15px;background:#2C3E50;-webkit-border-radius:50%;border-radius:50%}
    .photo img{position:relative;-webkit-border-radius:50%;border-radius:50%;vertical-align:bottom}

.map{height:470px}

.message{padding:20px;font-size:1.4em;text-align:center;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.message-ok{background:#58A384}
.message-error{background:#FF4C78}

.loading{display:inline-block;width:43px;height:11px;background:url(../img/loading.gif) no-repeat 0 0;vertical-align:middle}

.contact-form{position:relative;width:100%}
    .contact-form .message{position:absolute;left:0;top:0;display:none;width:100%;padding-top:80px;padding-bottom:80px;z-index:100}
    .contact-form .loading{position:absolute;left:50%;top:50%;margin:-6px 0 0 -21px;z-index:100}

.info{text-align:center}
    .info h3{margin:0 0 5px}
    .info p, .info address{margin:0 0 20px}

.intro-cont-wrapper{behavior:url("assets/plugins/CSSPIE/PIE.htc")}

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

    .sec-cont{padding-bottom:30px}

    .header{padding-bottom:0}

    .inp-b{margin:0}
        .inp-b .cols{margin:0}
        .inp-b .col{padding:0}
    .inp-text, textarea{margin:0 0 10px}

    .cols{margin:0}
    .col{float:none;width:auto;padding:0 0 30px}

    .wrap{width:auto;padding:0}

    .js .main-i{height:auto}

    .js .main-sec-b, .js .aside-sec-b, .js .secondary-aside-sec-b{position:static;width:auto;height:auto}
    .js .main-sec-b .scroll-b, .js .aside-sec-b .scroll-b, .js .secondary-aside-sec-b .scroll-b{height:auto}
    .main-sec-b, .aside-sec-b, .secondary-aside-sec-b{-webkit-transform:rotateY(0deg);-moz-transform:rotateY(0deg);-o-transform:rotateY(0deg);-ms-transform:rotateY(0deg);transform:rotateY(0deg)}
    .main-sec-b.active-sec, .aside-sec-b.active-sec, .secondary-aside-sec-b.active-sec, .main-sec-b.inactive-sec, .aside-sec-b.inactive-sec, .secondary-aside-sec-b.inactive-sec{-webkit-animation:none;-moz-animation:none;-o-animation:none;-ms-animation:none;animation:none}

    .js .nav .nav-trigger{display:block}
    .js .nav ul{display:none}
    .nav ul{background:rgba(236,240,241,0.3);-pic-background:rgba(236,240,241,0.3)}
    .nav li{display:block;margin:0}
    .nav a{-webkit-border-radius:0;border-radius:0}
    .nav a:hover{background:#2C3E50}
    .lt-ie8 .nav li{display:block}
    .js .nav .marker{display:none}

    .works{padding:30px 0;text-align:center}
    .js .works .items{margin:0}
    .works .item{float:none;display:inline-block;vertical-align:top;margin:0 0 0 -5px}
    .touch .works .overlay{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);display:none}
    .touch .works .hover .overlay{display:table}
    .touch .works .item:hover{display:none}

}

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

    .sec-cont{padding:15px}

    .col{padding:0 0 15px}

    .experience{padding:0;background-position:10px 0}
    .experience .item{float:none;width:100%;padding:0 0 15px 40px;text-align:left}
        .experience .item:before{left:0;top:0}
    .experience .alt-item{float:none}
    .experience .alt-item:before{left:0}
    .experience .period{position:static;right:0;top:0;width:auto;margin:0 0 10px}
    .experience .alt-item .period{left:0;text-align:left}

    .skills h3{width:100px;font-size:0.9em}
    .skills .point{width:10px;height:10px;margin-right:3px}
    
    .works{padding:15px 0}
    .works .item{margin:0}

}

@-webkit-keyframes showSec{
    0%{-webkit-transform:rotateY(180deg)}
    70%{-webkit-transform:rotateY(-15deg)}
    100%{-webkit-transform:rotateY(0deg)}
}
@-moz-keyframes showSec{
    0%{-moz-transform:rotateY(180deg)}
    70%{-moz-transform:rotateY(-15deg)}
    100%{-moz-transform:rotateY(0deg)}
}
@-o-keyframes showSec{
    0%{-o-transform:rotateY(180deg)}
    70%{-o-transform:rotateY(-15deg)}
    100%{-o-transform:rotateY(0deg)}
}
@-ms-keyframes showSec{
    0%{-ms-transform:rotateY(180deg)}
    70%{-ms-transform:rotateY(-15deg)}
    100%{-ms-transform:rotateY(0deg)}
}
@keyframes showSec{
    0%{transform:rotateY(180deg)}
    70%{transform:rotateY(-15deg)}
    100%{transform:rotateY(0deg)}
}

@-webkit-keyframes hideSec{
    0%{-webkit-transform:rotateY(0deg)}
    70%{-webkit-transform:rotateY(-195deg)}
    100%{-webkit-transform:rotateY(-180deg)}
}
@-moz-keyframes hideSec{
    0%{-moz-transform:rotateY(0deg)}
    70%{-moz-transform:rotateY(-195deg)}
    100%{-moz-transform:rotateY(-180deg)}
}
@-o-keyframes hideSec{
    0%{-o-transform:rotateY(0deg)}
    70%{-o-transform:rotateY(-195deg)}
    100%{-o-transform:rotateY(-180deg)}
}
@-ms-keyframes hideSec{
    0%{-ms-transform:rotateY(0deg)}
    70%{-ms-transform:rotateY(-195deg)}
    100%{-ms-transform:rotateY(-180deg)}
}
@keyframes hideSec{
    0%{transform:rotateY(0deg)}
    70%{transform:rotateY(-195deg)}
    100%{transform:rotateY(-180deg)}
}

@-webkit-keyframes grow{
    0%{-webkit-transform:scale(0);opacity:0}
    100%{-webkit-transform:scale(1);opacity:1}
}
@-moz-keyframes grow{
    0%{-moz-transform:scale(0);opacity:0}
    100%{-moz-transform:scale(1);opacity:}
}
@-o-keyframes grow{
    0%{-o-transform:scale(0);opacity:0}
    100%{-o-transform:scale(1);opacity:1}
}
@-ms-keyframes grow{
    0%{-ms-transform:scale(0);opacity:0}
    100%{-ms-transform:scale(1);opacity:1}
}
@keyframes grow{
    0%{transform:scale(0);opacity:0}
    100%{transform:scale(1);opacity:1}
}