@font-face {
    font-family: 'BravoRGRegular';
    src: url('../fonts/bravorg.eot');
    src: url('../fonts/bravorg.eot') format('embedded-opentype'),
    url('../fonts/bravorg.woff') format('woff'),
    url('../fonts/bravorg.ttf') format('truetype'),
    url('../fonts/bravorg.svg#BravoRGRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'RegularBold';
    src: url('../fonts/regular-bold.eot');
    src: url('../fonts/regular-bold.eot') format('embedded-opentype'),
    url('../fonts/regular-bold.woff') format('woff'),
    url('../fonts/regular-bold.ttf') format('truetype'),
    url('../fonts/regular-bold.svg#RegularBold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'RegularLight';
    src: url('../fonts/regular-light.eot');
    src: url('../fonts/regular-light.eot') format('embedded-opentype'),
    url('../fonts/regular-light.woff') format('woff'),
    url('../fonts/regular-light.ttf') format('truetype'),
    url('../fonts/regular-light.svg#RegularLight') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'RegularRegular';
    src: url('../fonts/regular-regular.eot');
    src: url('../fonts/regular-regular.eot') format('embedded-opentype'),
    url('../fonts/regular-regular.woff') format('woff'),
    url('../fonts/regular-regular.ttf') format('truetype'),
    url('../fonts/regular-regular.svg#RegularRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body, div, span, h1, h2, h3, h4, h5, h6, p, img, sub, sup, ol, ul, li, form, label, input, select, button, textarea, table, tbody, tfoot, thead, tr, th, td, a { margin: 0; padding: 0;}
body { min-width: 998px; font: 24px/31px 'RegularLight', sans-serif; color: #4a4a4a; background: #262a33 url("../images/all_bg.jpg") 50% 0 no-repeat;}
img { border: none;}
a { cursor: pointer;}
p { margin-bottom: 15px;}
h1, h2, h3, h4, h5, h6 { margin-bottom: 15px; font-weight: 300; font-family: 'RegularLight', sans-serif; text-transform: uppercase;}
h1 { font-size: 64px;}
h2 { font-size: 58px;}
h3 { font-size: 44px;}
h4 { font-size: 34px;}
h5 { font-size: 28px;}
h6 { font-size: 24px;}
input[type='submit'], input[type='button'] { cursor: pointer;}
ol, ul { margin-bottom: 20px;}
li { list-style: none;}

.header:after, .form_container:after { content: ''; display: table; clear: both;}

.header_wr { height: 96px; background: url("../images/t_bg.png") repeat-x;}
.header { width: 993px; margin: 0 auto; padding-left: 5px;}
.logo { float: left; padding: 29px 0 0;}
.logo a { display: block; width: 180px; height: 45px; background: url("../images/logo.png") no-repeat;}
.nav { width: 667px; float: right;}
.nav ul { margin: 0;}
.nav li { margin-right: 11px; float: left;}
.nav li a { display: block; height: 70px; padding: 32px 40px 0; position: relative;}
.nav li a span { display: inline-block; height: 16px; background: url("../images/sprite_nav.png") no-repeat;}
.nav li a .nav_1 { width: 76px; background-position: 0 0;}
.nav li a .nav_2 { width: 58px; background-position: -77px 0;}
.nav li a .nav_3 { width: 88px; background-position: -137px 0;}
.nav li a .nav_4 { width: 57px; background-position: -227px 0;}
.nav li a:after { content: ''; display: block; width: 91px; height: 6px; background: #a2a6ae; position: absolute; bottom: 6px; left: 50%; margin-left: -45px;}
.nav li a:hover { background: url("../images/nav_bg.png") repeat-x;}
.nav li a:hover:after { bottom: 0; background: #b7484e;}
.nav li a:hover .nav_1 { background-position: 0 -18px;}
.nav li a:hover .nav_2 { background-position: -77px -18px;}
.nav li a:hover .nav_3 { background-position: -137px -18px;}
.nav li a:hover .nav_4 { background-position: -227px -18px;}

.wrap01 { height: 618px; background: url("../images/processor.png") 50% 0 no-repeat;}
.section01 { width: 470px; margin: 0 auto; padding: 137px 30px 0 498px; font-size: 22px; line-height: 26px; color: #ffffff;}
.h101 { width: 324px; height: 75px; margin-bottom: 24px; padding: 23px 0 0 20px; font-size: 27px; line-height: 26px; background: url("../images/title_bg.png") no-repeat;}
.h101 span { font-family: 'RegularBold', sans-serif;}

.wrap02 { margin-top: -66px; position: relative;}
.wrap02:before { content: ''; display: block; width: 50%; height: 66px; padding-left: 1px; background: #ffffff; position: absolute; left: 50%; margin-left: -1px;}
.h201 { width: 493px; height: 66px; margin: 0 auto; padding: 0 500px 0 5px; font-size: 73px; line-height: 84px; color: #ffffff;}
.h201 img { margin-right: 11px;}
.section02_wr { padding-bottom: 121px; background: #ffffff;}
.section02 { width: 658px; margin: 0 auto; padding: 98px 340px 39px 0; position: relative;}
.section02:before { content: ''; display: block; width: 305px; height: 407px; background: url("../images/ico.png") no-repeat; position: absolute; right: 0; bottom: 0;}

.wrap03 { margin-top: -54px; position: relative;}
.h202 { width: 993px; height: 54px; margin: 0 auto; padding-left: 5px; font-size: 64px; line-height: 66px; color: #b7484e; position: relative; z-index: 10;}
.h202 img { margin-right: 4px;}
.section03_wr01 { height: 391px; background: url("../images/inv_bg_x.jpg") repeat-x;}
.section04_wr02 { height: 391px; background: url("../images/inv_bg.jpg") 50% 0 no-repeat; position: relative;}
.section04_wr02:before { content: ''; display: block; width: 689px; height: 350px; background: url("../images/inv_title.png") no-repeat; position: absolute; top: -96px; left: 50%; margin-left: -618px; z-index: 1;}
.section03 { width: 788px; height: 301px; padding: 90px 200px 0 0; margin: 0 auto; font-size: 26px; color: #ffffff; background: url("../images/mouse.png") 899px 79px no-repeat; position: relative; z-index: 10;}
.contact { padding-top: 6px;}
.contact a { display: inline-block; height: 58px; padding: 0 47px; border: 6px solid #ffffff; font: 26px/58px 'RegularRegular', sans-serif; color: #ffffff; text-transform: uppercase; text-decoration: none;}
.contact a:hover { border-color: #23262c; color: #21242b;}

.wrap04 { background: #353a43;}
.section04 { width: 998px; margin: 0 auto; padding: 91px 0 101px;}
.h203 { margin-bottom: 59px; font-size: 32px; color: #ffffff; text-transform: none;}
.h203 img, .h203 span { vertical-align: middle;}
.h203 img { margin-right: 20px;}
.form_container { margin-bottom: 42px;}
.form_i { width: 252px; float: left;}
.i_wr { height: 51px;}
.i_wr:first-child { margin-bottom: 17px;}
.i_wr input { width: 224px; height: 51px; padding: 0 14px; border: none; background: url("../images/input.png") no-repeat; font: 19px/51px 'RegularRegular', sans-serif; color: #3b3b3b;}
.ie8 .i_wr input { font-size: 18px;}
.i_wr input.error { background: url("../images/input_error.png") no-repeat; color: #bf444c;}
.form_ta { width: 731px; height: 118px; float: right;}
.form_ta textarea { width: 703px; height: 88px; padding: 15px 14px; border: none; background: url("../images/textarea.png") no-repeat; font: 19px/22px 'RegularRegular', sans-serif; color: #3b3b3b; resize: none; overflow: auto;}
.ie8 .form_ta textarea { font-size: 17px;}
.form_ta textarea.error { background: url("../images/textarea_error.png") no-repeat; color: #bf444c;}
.form_button { text-align: center; position: relative;}
.form_button:before, .form_button:after { content: ''; display: block; width: 384px; height: 4px; background: #64686e; position: absolute; top: 26px;}
.form_button:before { left: 0;}
.form_button:after { right: 0;}
.form_button a { display: inline-block; height: 44px; padding: 0 53px; border: 6px solid #d5686e; font: 22px/44px 'RegularRegular', sans-serif;; color: #d5686e; text-transform: uppercase; text-decoration: none;}
.form_button a:hover { border-color: #729fc9; color: #b1d9ff;}

.footer { width: 998px; margin: 0 auto; padding: 66px 0 77px; text-align: center;}
.foot_logo { margin-bottom: 33px;}
.foot_logo a { display: inline-block; width: 83px; height: 82px; background: url("../images/foot_logo.png") no-repeat;}
.foot_tx { font-size: 23px; color: #ffffff;}

.popup_wr { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100;}
.tr_bg { width: 100%; height: 100%; background: #161212; opacity: 0.75; filter: alpha(opacity=75);}
.popup { width: 354px; height: 108px; padding: 120px 30px 0; position: fixed; top: 50%; left: 50%; margin: -120px 0 0 -207px; background: #ffffff url("../images/popup_mess.png") 176px 51px no-repeat; border-top: 11px solid #b2b3b4; text-align: center; font-size: 26px; color: #3d3939; text-transform: uppercase;}    
© TrueDev.org