.main{ margin-top:80px; } /*.news-banner{*/ /* width:100%;*/ /* height: 460px;*/ /* background: url('../images/newsBanner.jpg') no-repeat left top/cover;*/ /*}*/ .stepsWords{ text-align: center; position: relative; margin:120px auto 40px; width:210px; font-size:32px; } .stepsWords .steps-left{ position:absolute; top:10px; left:0; width:25px; height:25px; background: url("../images/sprite.png") no-repeat 0 0; } .stepsWords .steps-right{ position:absolute; top:10px; right:0; width:25px; height:25px; background: url("../images/sprite.png") no-repeat -25px 0; } .line{ width:100%; height:1px; background-color: #ccc; } .news-thumbnail{ margin-top:50px; } .caption{ background-color: #f5f5f5; } .pagination>.active>a{ background-color: coral; } .news-title{ display: inline-block; } .news-title:hover { color:#ee8333; } .news-time:hover{ color:#ee8333; } .news-time{ margin-top:30px; } .thumbnail-img{ overflow: hidden; } .thumbnail-img .img{ width:100%; transition: transform .5s; } .thumbnail-img:hover img{ transform:scale(1.1); } @media screen and (min-width: 1367px) and (max-width: 1440px) { } @media screen and (min-width: 1281px) and (max-width: 1366px) { .news-title{ font-size: 22px; width:370px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .news-time{ margin-top: 26px; } } @media screen and (min-width: 1025px) and (max-width: 1280px) { .news-title{ font-size: 22px; width:310px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .news-time{ margin-top: 26px; } .stepsWords{ margin-top:100px; } } @media screen and (min-width: 0) and (max-width: 1024px) { .news-title{ font-size: 20px; width:240px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .news-time{ margin-top: 26px; font-size: 13px; } .stepsWords{ margin-top:100px; } .news-thumbnail{ margin-top:35px; } }