*{
padding: 0;
margin: 0;
list-style: none;
box-sizing: border-box;
text-align: center;
}
html,body{
height: 100%;
}
header {
background-image: url(../pic/mt-0951-home-header-bg.jpg);
background-color: #000;
width: 100%;
color:#fff;
height: 115%;
background-size: cover;
}
h2{
font-size: 50px;
}
p{
font-size: 16px;
}
.logo{
width: 1200px;
margin: auto;
}
.logo img,.logo h1,.logo nav,.logo li{
float: left;
padding: 5px 10px;
}
.nobackg{
color: #fff;
}
.block{
display: block;
width: 180px;
margin: auto;
}
.buttom{
width: 180px;
height: 60px;
border: 2px solid #fff;
line-height: 60px;
text-decoration: none;
}
.nobackg{
text-decoration: none;
}
header .buttom{
margin: 20px auto;
}
.today .buttom{
border-color: #000;
}
.item{
float: left;
width: 50%;
}
.title{
margin: 250px auto;
}
.title h3{
font-size: 30px;
}
.title h2{
font-size: 92px;
}
.nobackg .buttom:hover{
color: #DD5220;
background-color: #fff;
}
.banner{
width: 100%;
height: 80%;
}
.sbanner{
width: 70%;
}
.today{
/* width: 75%; */
margin:150px auto;
/* line-height: 10px; */
}
.today .item img{
width: 50%;
float: left;
padding: 5px;
}
.today .left img{
width: 60px;
height: 20px;
}
.today h2{
padding: 20px 0 10px;
}
.today p{
padding: 20px 0;
line-height: 2em;
}
.today a{
color: #000;
}
.today a:hover{
text-decoration: none;
}
.today .buttom{
background-color: #DD5220;
border: none;
color: #fff;
}
.today .buttom:hover{
background-color: #000;
color: #fff;
}
.about{
/* width: 100%; */
background-image: url(../pic/mt-0951-content-bg01.jpg);
background-attachment:fixed;
background-size: cover;
color: #fff;
height: 60%;
/* line-height: 25px; */
}
.about h2{
padding: 250px 0 50px;
}
.about a{
color: #fff;
}
.dec{
margin:150px auto;
width: 80%;
/* width: 90%; */
}
.dec h2{
font-size: 40px;
padding: 5px 0 40px;
}
.dec .left{
width: 40%;
}
.dec>.item>p,.dec>.item>h2{
text-align: left;
/* 為什麼不能在上面那個地方統一設定? */
}
.dec img{
padding: 20px;
text-align: right;
}
/* 為什麼這邊要設定img才會有bug阿? */
.total{
/* width: 100%; */
background-image: url(../pic/mt-0951-content-bg02.jpg);
background-attachment:fixed;
height: 60%;
color: #fff;
background-size: cover;
/* line-height: 10px; */
}
.total{
padding: 150px 0;
}
.total .item{
width: 25%;
}
.totalbox{
margin: auto;
width: 60%;
}
.total span{
font-size: 99px;
}
.total .item{
padding: 50px;
}
.menu{
margin: 150px auto;
}
.menubeloe{
text-align: left;
margin: 50px;
}
.menubeloe .border{
border-right: #ccc solid 1px;
}
.menubeloe .item{
padding: 0 50px;
}
.menubeloe .item h3{
font-size: 30px;
}
.menubeloe .item h4{
font-size: 20px;
padding: 20px 0 0;
}
.menubeloe>.item>h3,.menubeloe>.item>h4,.menubeloe>.item>p{
text-align: left;
}
.gallery{
/* width: 100%; */
height: 115%;
background-color: #242120;
color: #fff;
}
.gallery .top{
padding: 150px 0 40px;
}
.gallery div{
margin: auto;
}
.gallery .bot{
margin: auto;
width: 80%;
}
.bot img{
width: 20%;
padding: 5px;
}
.testimonial{
width: 40%;
margin: 150px auto;
}
.ournew{
/* width: 100%; */
background-color: #F4F4F4;
padding: 100px;
}
.news{
/* width: 100%; */
margin: auto;
}
.bot1i{
width: 280px;
background-image: url(../pic/mt-0951-gallery-img05.jpg);
height: 280px;
}
.bot2i{
width: 280px;
background-image: url(../pic/mt-0951-gallery-img03.jpg);
height: 280px;
}
.bot3i{
width: 280px;
background-image: url(../pic/mt-0951-gallery-img02.jpg);
height: 280px;
}
.news .bot{
width: 80%;
margin: auto;
text-align: center;
}
.news .bot .item{
margin: 5px;
}
.contact{
/* width: 100%; */
background-color: #242120;
height: 50%;
width: 100%;
}
.contact .box{
padding: 100px 0;
margin: auto;
width: 70%;
text-align: center;
}
.contact .block{
float: left;
width: 20%;
color: #F4F4F4;
margin: 10px 50px;
}
.block p{
color: #555453;
}
.block h4{
font-size: 30px;
}
.block h5{
font-size: 24px;
}
.block a{
color: #fff;
}
.clearfix{
clear: both;
}
#email{
background-color: #000;
border: none;
border-bottom: 1px solid #E5744D;
width: 200px;
}
footer{
background-color: #1F1C1C;
color: #494848;
height: 70px;
}
請先 登入 以發表留言。