Difference between revisions of "User:Loch210/Rufus styleCSS"
Jump to navigation
Jump to search
| Line 8: | Line 8: | ||
z-index: 1; | z-index: 1; | ||
} | } | ||
| − | |||
.demo .large-header { | .demo .large-header { | ||
background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/499416/demo-bg.jpg"); | background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/499416/demo-bg.jpg"); | ||
} | } | ||
| − | |||
.main-title { | .main-title { | ||
position: absolute; | position: absolute; | ||
| Line 24: | Line 22: | ||
transform: translate3d(-50%, -50%, 0); | transform: translate3d(-50%, -50%, 0); | ||
} | } | ||
| − | |||
.demo .main-title { | .demo .main-title { | ||
text-transform: uppercase; | text-transform: uppercase; | ||
| Line 30: | Line 27: | ||
letter-spacing: 0.1em; | letter-spacing: 0.1em; | ||
} | } | ||
| − | |||
.main-title .thin { | .main-title .thin { | ||
font-weight: 200; | font-weight: 200; | ||
} | } | ||
| − | |||
@media only screen and (max-width: 768px) { | @media only screen and (max-width: 768px) { | ||
.demo .main-title { | .demo .main-title { | ||
Revision as of 12:14, 4 August 2020
.large-header {
position: relative;
width: 100%;
background: #111;
overflow: hidden;
background-size: cover;
background-position: center center;
z-index: 1;
}
.demo .large-header {
background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/499416/demo-bg.jpg");
}
.main-title {
position: absolute;
margin: 0;
padding: 0;
color: #F9F1E9;
text-align: center;
top: 50%;
left: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
}
.demo .main-title {
text-transform: uppercase;
font-size: 4.2em;
letter-spacing: 0.1em;
}
.main-title .thin {
font-weight: 200;
}
@media only screen and (max-width: 768px) {
.demo .main-title {
font-size: 3em;
}
}
