body {
margin: 0;
font-family: ProximaNova-Light;
min-width: 1200px;
}
header {
height: 104px;
background-color: #fff;
}
@font-face {
font-family: ProximaNova-Light;
src: url(https://storage.googleapis.com/cloud3/W2/10355.otf);
}
@font-face {
font-family: proximanova-b;
src: url(https://storage.googleapis.com/cloud3/W2/proximanova-bold.otf);
}
.main-wrap {
background: #ddd;
width: 100%;
background-color: #f3f5f7;
}
.wrapper {
width: 1170px;
margin: 0 auto;
padding: 15px;
}
.logo {
background: url(https://storage.googleapis.com/cloud3/W1/logo.png) no-repeat center;
width: 66px;
height: 60px;
float: left;
margin: 0 15px;
}
.title {
text-transform: uppercase;
color: #415779;
font-family: “Arial”;
font-weight: bold;
line-height: 60px;
margin: 0;
display: inline-block;
font-size: 24px;
}
.head-block {
height: 207px;
}
.background_img {
background-image: linear-gradient(178deg, rgba(61,64,107,.86) -25%, rgba(77,162,167,.86) 125%);
background: url(https://storage.googleapis.com/cloud3/W1/tran-background.png) no-repeat;
}
.head-block .wrapper {
padding: 0 15px;
position: relative;
}
.title-head-block {
color: #fff;
font-size: 27px;
font-weight: bold;
display: inline-block;
text-transform: uppercase;
font-family: proximanova-b;
}
.contact-wrap {
height: 60px;
float: right;
display: table;
}
.contact {
display: table-cell;
vertical-align: middle;
font-size: 18px;
color: #415779;
font-weight: bold;
font-family: proximanova-b;
text-transform: uppercase;
padding: 0 15px 0 0;
}
.contact span {
display: inline-block;
float: right;
clear: both;
}
.menu {
text-transform: uppercase;
background: url() no-repeat bottom left 20px;
}
.menu a {
line-height: 45px;
color: #fff;
}
.menu a:hover {
color: #7bb5bd;
}
.menu .item {
min-width: 110px;
display: inline-block;
padding: 0px 0px;
border-bottom: 2px solid rgba(0, 0, 0, 0);
position: relative;
text-align: center;
height: 45px;
vertical-align: middle;
font-size: 13px;
font-family: proximanova-b;
}
.menu .item:hover {
border-bottom: 2px solid #7bb5bd;
}
.search {
width: 20px;
height: 20px;
background: url() no-repeat center;
position: absolute;
right: 60px;
top: 20px;
}
.wrap-title-head-block {
max-width: 1100px;
margin: 10 0 0 15;
text-align: right;
vertical-align: text-bottom;
line-height: 200px;
}
.main-picture-wrap {
width: 570px;
height: 500px;
background-color: #fff;
margin: 0 auto;
}
.main-picture {
padding-top: 20px;
width: 100%;
height: 435px;
background: url(
https://storage.googleapis.com/cloud3/Case/HAF902.jpg

) no-repeat center;
}
.features-gaming-pc {
display: inline-block;
float: right;
padding: 10px 20px 0 0;
font-size: 12px;
width: 490px;
position: relative;
}
.col_left-specification {
width: 50%;
float: left;
top: -65px;
position: relative;
}
.features-gaming-pc .list{
padding: 6px 6px;
font-size: 0;
}
.features-gaming-pc .list:nth-child(odd){
background-color: #dae1e7;
}
.features-gaming-pc .list:nth-child(even){
background-color: transparent;
}
.features-gaming-pc .name {
display: inline-block;
text-align: right;
vertical-align: top;
width: 25%;
font-size: 12px;
}
.features-gaming-pc .description {
padding: 0 0 0 15px;
display: inline-block;
width: 75%;
font-size: 12px;
box-sizing: border-box;
}
.detail-specification .item-title {
color: #4da1a7;
text-align: center;
font-size: 16px;
text-transform: uppercase;
font-family: proximanova-b;
}
.clear {
clear: both;
}
.specification-block {
-moz-box-shadow: 0 0 150px rgba(32,96,116,.33);
-webkit-box-shadow: 0 0 150px rgba(32,96,116,.33);
box-shadow: 0 0 150px rgba(32,96,116,.33);
background-color: rgba(231, 237, 241, 0.41);
}
.detail-specification-wrap {
margin: 0 auto; padding-top: 25px
}
.detail-specification {
display: flex;
flex-direction: row;
align-items: stretch;
flex-wrap: wrap;
}
.detail-specification .item {
width: 33.33%;
padding: 0 1.5%;
box-sizing: border-box;
margin: 15px 0;
}
.item-wrap {
background: #fff;
padding: 20px;
height: 100%;
box-sizing: border-box;
}
.item-decription {
padding: 10px 15px;
}
.item-decription .item-title {
font-family: proximanova-b;
}
.item-decription .list{
padding: 6px 6px;
font-size: 0;
}
.item-decription .list:nth-child(odd){
background-color: #ebeff1;
}
.item-decription .list:nth-child(even){
background-color: transparent;
}
.item-decription .name {
display: inline-block;
text-align: left;
vertical-align: top;
width: 40%;
font-size: 12px;
}
.item-decription .decription {
padding: 0 5 0 0px;
display: inline-block;
text-align: right;
width: 60%;
font-size: 12px;
box-sizing: border-box;
}

.item-decription2 {
padding: 3px 15px;
}
.item-decription2 .item-title {
font-family: proximanova-b;
}
.item-decription2 .list{
padding: 6px 6px;
font-size: 0;
}
.item-decription2 .list:nth-child(odd){
background-color: #ebeff1;
}
.item-decription2 .list:nth-child(even){
background-color: transparent;
}
.item-decription2 .name {
display: inline-block;
text-align: left;
vertical-align: top;
width: 40%;
font-size: 12px;
}
.item-decription2 .decription {
padding: 0 5 0 0px;
display: inline-block;
text-align: right;
width: 60%;
font-size: 12px;
box-sizing: border-box;
}

.detail-specification .img {
width: 100%;
height: 220px;
background: url(https://storage.googleapis.com/cloud3/Content/processor.png) no-repeat top center;
/*background-size:contain !important;*/
}
.advantages-item-wrap {
display: flex;
flex-direction: row;
align-items: stretch;
flex-wrap: wrap;
}
.advantages-item {
width: 25%;
height: 232px;
margin: 15px 0;
padding: 0 1.5%;
box-sizing: border-box;
}
.advantages-back {
background: url(https://storage.googleapis.com/cloud3/W2/advantages-back.jpg) no-repeat top center;
min-height: 150px;
background-size: 100%;
height: 100%;
position: relative;
}
.advantages-img {
width: 60px;
height: 60px;
position: absolute;
top: -20px;
left: -14px;
}
.advantages-item:nth-child(1) .advantages-img {
background: url(https://storage.googleapis.com/cloud3/W2/forma_1_2.png) no-repeat center,url(https://storage.googleapis.com/cloud3/W2/advantages-back-small.jpg) no-repeat top center;
}
.advantages-item:nth-child(2) .advantages-img {
background: url(https://storage.googleapis.com/cloud3/W2/shape_1_2.png) no-repeat center,url(https://storage.googleapis.com/cloud3/W2/advantages-back-small.jpg) no-repeat top center;
}
.advantages-item:nth-child(3) .advantages-img {
background: url(https://storage.googleapis.com/cloud3/W2/shape_1_3.png) no-repeat center,url(https://storage.googleapis.com/cloud3/W2/advantages-back-small.jpg) no-repeat top center;
}
.advantages-item:nth-child(4) .advantages-img {
background: url(https://storage.googleapis.com/cloud3/W2/forma_1_4.png) no-repeat center,url(https://storage.googleapis.com/cloud3/W2/advantages-back-small.jpg) no-repeat top center;
}
.advantages-item-title {
color: #83c3c7;
padding: 10px 10px 0 55px;
text-transform: uppercase;
font-size: 13px;
line-height: 1.5;
font-weight: bold;
min-height: 40px
}
.advantages-item-text {
color: #fff;
padding: 10px 15px 15px 15px;
line-height: 1.7;
font-size: 14px;
}
.advantages-title {
background: url(https://storage.googleapis.com/cloud3/W2/line.png) left center;
text-align: center;
background-repeat: repeat-x;
}
.advantages-text {
text-align: center;
display: inline-block;
background: #f3f5f7;
padding: 10px;
color: #2f8494;
font-family: proximanova-b;
text-transform: uppercase;
}
footer {
height: 104px;
background: #fff;
color: #415779;
}
footer .wrapper {
box-sizing: border-box;
vertical-align: middle;
line-height: 104px;
padding: 0 15px;
}
.logo-footer {
width: 40px;
height: 29px;
background: url(https://storage.googleapis.com/cloud3/W1/logo-footer.png) no-repeat top center;
display: inline-block;
vertical-align: middle;
}
.title-footer {
display: inline-block;
padding: 0 10px;
font-size: 16px;
text-transform: uppercase;
vertical-align: middle;
}