|
|
Line 207: |
Line 207: |
| padding: 50px 10px 0; | | padding: 50px 10px 0; |
| margin:0 auto; | | margin:0 auto; |
− | }
| |
− |
| |
− | .site-main {
| |
− | padding: 0px 20px 0;
| |
− | }
| |
− |
| |
− | article {
| |
− | width: 100%;
| |
− | max-width: 1160px;
| |
− | height: 100%;
| |
− | margin: 10px auto 0 auto;
| |
− | padding: 0;
| |
− | }
| |
− |
| |
− | article img {
| |
− | max-width: 100%;
| |
− | }
| |
− |
| |
− | .entry-header {
| |
− | text-align: center;
| |
− | ;
| |
− | }
| |
− |
| |
− | .entry-title {
| |
− | font-size: 2.625em;
| |
− | font-weight: 700;
| |
− | line-height: 1;
| |
− | margin: 20px 0 40px;
| |
− | color: #004a7c;
| |
− |
| |
− | }
| |
− | <!--title颜色-->
| |
− | .entry-header p {
| |
− | font-size: 1.5em;
| |
− | line-height: 1.3;
| |
− | margin: 0 auto 0.833em;
| |
− | width: 100%;
| |
− | max-width: 580px;
| |
− | }
| |
− |
| |
− | .entry-header hr {
| |
− | background-color: #2f353c;
| |
− | border: 0 none;
| |
− | width: 64px;
| |
− | height: 12px;
| |
− | margin: 0 auto 40px;
| |
− | }
| |
− |
| |
− | hr.short {
| |
− | display: inline-block;
| |
− | background-color: #2f353c;
| |
− | border: 0 none;
| |
− | width: 31px;
| |
− | height: 7px;
| |
− | margin-bottom: 1.500em;
| |
− | }
| |
− |
| |
− | .form-content {
| |
− | width: 50%;
| |
− | margin: 1.5em auto 0;
| |
− | }
| |
− |
| |
− | article .entry-content img {
| |
− | margin-bottom: 1em;
| |
− | }
| |
− |
| |
− | .text-center {
| |
− | margin: 0 auto;
| |
− | width: 100%;
| |
− | max-width: 580px;
| |
− | }
| |
− |
| |
− | .about-main {
| |
− | width: 80%;
| |
− | max-width: 1200px;
| |
− | height: 100%;
| |
− | margin: 0 auto;
| |
− | padding: 0 20px;
| |
− | }
| |
− |
| |
− | .about-main article hr,
| |
− | .contact .contact-header hr {
| |
− | background-color: #2f353c;
| |
− | border: 0 none;
| |
− | height: 12px;
| |
− | margin: 1.3em auto;
| |
− | width: 64px;
| |
− | }
| |
− |
| |
− | .hello {
| |
− | text-align: center;
| |
− | }
| |
− |
| |
− | .services,
| |
− | .approach {
| |
− | text-align: center;
| |
− | margin-bottom: 180px;
| |
− | }
| |
− |
| |
− | .process {
| |
− | text-align: center;
| |
− | margin-bottom: 90px;
| |
− | }
| |
− |
| |
− | #hello h1 {
| |
− | font-size: 2.625em;
| |
− | font-weight: 700;
| |
− | line-height: 1;
| |
− | margin-top: 20px;
| |
− | text-align: center;
| |
− | color: #004a7c;
| |
− | }
| |
− |
| |
− | #hello p{
| |
− | font-size: 1.325em;
| |
− | margin-bottom: 1.500em;
| |
− | line-height: 1.5;
| |
− | font-weight: 400;
| |
− | text-align:justify;
| |
− | }
| |
− |
| |
− |
| |
− | .services p,
| |
− | .approach p,
| |
− | .process p {
| |
− | font-size: 1.5em;
| |
− | line-height: 1.3;
| |
− | letter-spacing: 0.2px;
| |
− | max-width: 550px;
| |
− | margin: 0 auto 1.3em;
| |
− | }
| |
− |
| |
− | .services .content-column p,
| |
− | .approach .content-column p,
| |
− | .process .content-column p {
| |
− | font-size: 1em;
| |
− | }
| |
− |
| |
− | .services .content-column,
| |
− | .approach .content-column,
| |
− | .process .content-column {
| |
− | text-align: left;
| |
− | }
| |
− |
| |
− | #hello h2{
| |
− | clear: both;
| |
− | margin-bottom: 1.500em;
| |
− | line-height: 1.5;
| |
− | text-align:left;
| |
− | color: #004a7c;
| |
− | }
| |
− |
| |
− | .process h2 {
| |
− | font-size: 4.250em;
| |
− | font-weight: 700;
| |
− | }
| |
− |
| |
− | .services h2,
| |
− | .approach h2,
| |
− | .process h3 {
| |
− | font-size: 1.500em;
| |
− | font-weight: 700;
| |
− | border-top: 1px solid #c8c4bb;
| |
− | border-bottom: 1px solid #c8c4bb;
| |
− | padding: 10px 0;
| |
− | margin-bottom: 10px;
| |
− | }
| |
− |
| |
− |
| |
− | @media screen and (max-width: 768px) {
| |
− | .process .one_fourth {
| |
− | height: 300px;
| |
− | }
| |
− | .layer2,
| |
− | .layer3 {
| |
− | display: none;
| |
− | }
| |
− | .layer4 {
| |
− | display: block;
| |
− | position: absolute;
| |
− | top: 50px;
| |
− | right: 0;
| |
− | bottom: 0px;
| |
− | left: 0;
| |
− | z-index: 902;
| |
− | text-align: center;
| |
− | }
| |
− | #content {
| |
− | margin: 70px auto 0;
| |
− | }
| |
− | .form-content {
| |
− | width: 100%;
| |
− | }
| |
− | .menu-categories-container ul {
| |
− | margin: 80px 0 30px;
| |
− | }
| |
− |
| |
− |
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | @media screen and (max-width: 640px) {
| |
− | .layer4 {
| |
− | display: none;
| |
− | }
| |
− | .layer6 {
| |
− | display: block;
| |
− | position: absolute;
| |
− | top: 50px;
| |
− | right: 0;
| |
− | bottom: 0px;
| |
− | left: 0;
| |
− | z-index: 902;
| |
− | }
| |
− | .intro-text {
| |
− | max-width: 640px;
| |
− | padding: 20px;
| |
− | }
| |
− | .overview-testimonial,
| |
− | .overview-credits {
| |
− | width: 100%;
| |
− | }
| |
− | .overview-overview h2,
| |
− | .overview-overview p,
| |
− | .overview-testimonial h2,
| |
− | .overview-testimonial p,
| |
− | .overview-credits h2 {
| |
− | margin: 0 0 20px 0;
| |
− | }
| |
− | .entry-header p {
| |
− | width: 100%;
| |
− | }
| |
− | .full_width,
| |
− | .one_half,
| |
− | .one_third,
| |
− | .two_third,
| |
− | .one_fourth,
| |
− | .three_fourth,
| |
− | .one_fifth,
| |
− | .two_fifth,
| |
− | .three_fifth,
| |
− | .four_fifth,
| |
− | .one_sixth,
| |
− | .five_sixth {
| |
− | clear: both;
| |
− | margin-bottom: 1em;
| |
− | margin-left: 0;
| |
− | margin-right: 0;
| |
− | width: 100% !important;
| |
− | height: 100% !important;
| |
− | }
| |
− | .one_half>div {
| |
− | padding: 20px 0 !important;
| |
− | }
| |
− | .one_third>div {
| |
− | padding: 0 20px 30px !important;
| |
− | }
| |
− | .contact-details,
| |
− | .contact-text {
| |
− | padding: 0;
| |
− | width: 100%;
| |
− | }
| |
− | #pod-content {
| |
− | padding: 10px 0;
| |
− | }
| |
− | .site-main {
| |
− | padding: 50px 0 0;
| |
− | }
| |
− | .overview-credits p {
| |
− | margin-left: 0;
| |
− | }
| |
− | }
| |
− |
| |
− | @media screen and (max-width: 480px) {
| |
− | .overview-header {
| |
− | height: auto;
| |
− | }
| |
− | .work-pod,
| |
− | .news-pod,
| |
− | .tweet-pod {
| |
− | width: 100%
| |
− | }
| |
− | .news-summary-image,
| |
− | .news-summary-text {
| |
− | width: 260px;
| |
− | }
| |
− | .news-pod .news-inner,
| |
− | .tweet-pod .tweet-inner {
| |
− | float: none;
| |
− | margin: 0 auto;
| |
− | width: 260px;
| |
− | }
| |
− | .hello {
| |
− | margin: 60px 0 100px;
| |
− | }
| |
− | .services,
| |
− | .approach {
| |
− | margin-bottom: 100px;
| |
− | }
| |
− | .news-summary-text .date {
| |
− | display: none;
| |
− | }
| |
− | .news-summary-text h2 {
| |
− | margin-top: 1em;
| |
− | }
| |
− | .contact-details,
| |
− | .contact-text,
| |
− | .contact-map {
| |
− | padding: 0;
| |
− | }
| |
− | .overlay {
| |
− | display: none;
| |
− | }
| |
− | .contact-details p,
| |
− | .contact-text h2 {
| |
− | font-size: 1.250em;
| |
− | }
| |
− | .phone:before,
| |
− | email:before,
| |
− | .address:before {
| |
− | background: none;
| |
− | }
| |
− | .phone,
| |
− | .email,
| |
− | .address {
| |
− | padding-left: 0;
| |
− | }
| |
− | .footer-content {
| |
− | display: none;
| |
− | }
| |
− | .footer-mobile {
| |
− | display: block;
| |
− | }
| |
| } | | } |
Revision as of 00:52, 27 October 2017
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
1.0 Reset
2.0 Typography
3.0 Elements
4.0 Forms
5.0 Navigation
5.1 Links
5.2 Menus
6.0 Accessibility
7.0 Alignments
8.0 Clearings
9.0 Widgets
10.0 Content
10.1 Posts and pages
10.2 Asides
10.3 Comments
11.0 Infinite scroll
12.0 Media
12.1 Captions
12.2 Galleries
*/
/*--------------------------------------------------------------
1.0 Reset
*/
html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a{
border: 0;
font-family: inherit;
font-size: 100%;
font-style: inherit;
font-weight: inherit;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
html {
font-size: 62.5%;
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
article{
display: block;
}
a img {
border: 0;
}
margin: 0;
}
html,
body {
height: 100%;
}
- page {
min-height: 100%;
height: auto !important;
/* This line and the next line are not necessary unless you need IE6 support */
height: 100%;
margin: 0px auto -87px;
/* the bottom margin is the negative value of the footer's height */
}
/*--------------------------------------------------------------
2.0 Typography
*/
body {
font-family: "futura pt", "futura-pt", arial, sans-serif;
font-style: normal;
font-weight: 300;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.3;
color: #2f353c;
}
body {
background-color:#e8f1f5;
}
h1,
h3,
h4,
h5,
h6 {
clear: both;
margin-bottom: 1.500em;
line-height: 1.3;
}
h2{
clear: both;
margin-bottom: 1.500em;
line-height: 1.3;
text-align:center;
}
h1 {
font-size: 2.7 em;
font-weight: normal;
text-align:center;
}
h2 {
font-size: 1.500em;
font-weight: 700;
}
h3 {
font-size: 0.85em;
font-weight: 700;
}
h4 {
font-size: 1em;
font-weight: 700;
}
h5 {
font-size: 0.750em;
font-weight: 400;
}
p {
font-size: 1.125em;
margin-bottom: 1.500em;
line-height: 1.3;
font-weight: 400;
text-align:justify;
}
/************************字体*******************************/
@media screen and (min-width: 600px) {
h1 {
font-size: 2.800em;
}
}
@media screen and (min-width: 1200px) {
h1 {
font-size: 3.85em;
}
h5 {
font-size: 0.875em;
}
p {
font-size: 1.250em;
}
}
small {
font-size: 75%;
}
big {
font-size: 125%;
}
/*--------------------------------------------------------------
10.1 Posts and pages
*/
- primary {
background-color: #e8f1f5;
float: left;
width: 90%;
height: 100%;
padding: 50px 10px 0;
margin:0 auto;
}