@font-face {
    font-family: 'helvetica';
    src: url('../fonts/helveticaneuecyr-roman-webfont.eot');
    src: url('../fonts/helveticaneuecyr-roman-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/helveticaneuecyr-roman-webfont.woff') format('woff'),
        url('../fonts/helveticaneuecyr-roman-webfont.ttf') format('truetype'),
        url('../fonts/helveticaneuecyr-roman-webfont.svg#helveticanuen') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'helveticb';
    src: url('../fonts/helveticaneuecyr-bold-webfont.eot');
    src: url('../fonts/helveticaneuecyr-bold-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/helveticaneuecyr-bold-webfont.woff') format('woff'),
        url('../fonts/helveticaneuecyr-bold-webfont.ttf') format('truetype'),
        url('../fonts/helveticaneuecyr-bold-webfont.svg#helveticanuen-b') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'helveticm';
    src: url('../fonts/helveticaneuecyr-medium.eot');
    src: url('../fonts/helveticaneuecyr-medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/helveticaneuecyr-medium.woff') format('woff'),
        url('../fonts/helveticaneuecyr-medium.ttf') format('truetype'),
        url('../fonts/helveticaneuecyr-medium.svg#helveticanuen-b') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'helvetical';
    src: url('../fonts/helveticaneuecyr-light-webfont.eot');
    src: url('../fonts/helveticaneuecyr-light-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/helveticaneuecyr-light-webfont.woff') format('woff'),
        url('../fonts/helveticaneuecyr-light-webfont.ttf') format('truetype'),
        url('../fonts/helveticaneuecyr-light-webfont.svg#helveticanuen-l') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'helveticaul';
    src: url('../fonts/helveticaneuecyr-ultralight-webfont.eot');
    src: url('../fonts/helveticaneuecyr-ultralight-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/helveticaneuecyr-ultralight-webfont.woff') format('woff'),
        url('../fonts/helveticaneuecyr-ultralight-webfont.ttf') format('truetype'),
        url('../fonts/helveticaneuecyr-ultralight-webfont.svg#helveticanuen-ul') format('svg');
    font-weight: normal;
    font-style: normal;
}
body{
    padding: 0px;
    margin: 0px;
    color: #fff;
    font-family: 'helvetical';
}
a{
    text-decoration: none;
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
    outline: 0px;
}
h1,h2,h3{
    margin: 0px;
    font-weight:100;
}
div.box{
    height: 100%;
    width: 100%;
    position: absolute;
}
div.slide{
    background: url(../images/main_lenovo.jpg) no-repeat center;
    width: 100%;
    height: 100%;    
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
    position: absolute;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
div.boxred{
    background-color: #e63c34;
    width: 44%;
    max-width: 440px;
    min-width: 300px;
    height: 100%;
    right: 0px;
    padding: 30px;
    position: absolute;
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
}
a.logotype{
    background-color: #141414;
    width: 138px;
    height: 138px;
    display: block;
   position: absolute;
}

div.boxred h1{
    font-size: 88px;
    font-family: 'helveticaul';
    text-transform: uppercase;
    line-height: 75px;
}
div.boxred h3{
    font-size: 26px;
    font-family: 'helveticaul';
    padding-top: 25px;
}
a.click{
    font-family: 'helveticb';
    font-size: 14px;
    text-transform: uppercase;
    color: #fff;
    margin-top: 40px;
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
}
a.arrow{
    background: url(../images/arrow_scroll_icon.png) no-repeat;
    width: 47px;
    height: 74px;
    display: block;
    margin: 0px auto auto;
    position: absolute;
    left: 50%;
    margin-left: -23px;
}
div.slide{
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
}
div.slide1{
    background-color: #e5e5e5;
    width: 100%;
    height: 820px;
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
    padding: 60px 0px;
    z-index: 5;
}
div.box_a{
    position: absolute;
    width: 100%;
}
div.twoarrows{
    position: absolute;   
    top: 50%;
    width: 100%; 
    z-index: 2;
}
a.el{
    background-color: #ffe400;
    width: 50px;
    height: 37px;
}
a.el span{
    width: 13px;
    height: 23px;
    margin: 7px auto auto;
    display: block;
}
span.arrowL{
    background: url(../images/arrow_left.png);  
}
span.arrowR{
    background: url(../images/arrow_right.png);  
}
a.elR{
    position: absolute;
    right: 0px;
}
div.bg_bocke{
    background: url(../images/drop_lenovo.jpg) center no-repeat;
    width: 500px;
    height: 530px;
    position: absolute;
    right: 0px;
    top: 0;
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    z-index: -1;
}

div.boxport{
    width: 100%;
    position: relative;
    white-space: nowrap;
    max-width: 645px;
}
div.portfolio {
    margin: 0px auto auto; 
    overflow: hidden;  
    max-width: 645px;
}
a.logotype span.imlogo{
    background: url(../images/logo_altwork.png) no-repeat;
    width: 63px;
    height: 56px;
    display: block;
    margin: 40px auto auto;
}

@media (min-width:240px){
    div.boxred h1{
        font-size: 70px;
        line-height: 66px;
    }
    div.boxred h3{
        font-size: 21px;
    }
    div.boxred{
        min-width: 0px;
        max-width: 100%;    
    }
    div.boxred a.arrow{
        display: none;
    }  
    div.bg_bocke{
        display: none;
    }
    a.click{
        margin-top: 20px;
    }
    div.portfolio img {
        width:100%;
        height: auto;      
        display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
  position: relative;
        max-width: 645px;
    }
    a.logotype {

width: 110px;
height: 110px;
    }
    a.logotype span.imlogo{
        margin: 25px auto auto;
    }
    
}
@media (min-width:480px){
    div.boxred h1{
        font-size: 70px;
        line-height: 66px;
    }
    div.boxred h3{
        font-size: 21px;
    }
   } 

@media (min-width:1024px){
    div.boxred{
        right: 0px ;
    }   
    div.bg_bocke {
        display: block;
    }
    div.boxred a.arrow{
        display: block;
    }
    div.boxred{
        max-width: 440px;
    }
    div.portfolio img{
    width: 100%;
    height: 821px;
    display:inline-block ; *display: inline; *zoom:1;
    vertical-align: top;
    position: relative;
}
a.logotype span.imlogo{
    background: url(../images/logo_altwork.png) no-repeat;
    width: 63px;
    height: 56px;
    display: block;
    margin: 40px auto auto;
}
a.logotype{
 
    width: 138px;
    height: 138px;
}
}