Brume's website https://brume.ink
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

269 lines
3.9 KiB

.parallax {
position: fixed;
z-index: -1;
width: 100%;
height: 30vw;
}
.legende {
font-size: 0.7em;
font-style: italic;
}
.cover-image {
min-width: 100%;
@media screen and (max-width: 600px) {
max-width: 300%;
}
}
.full-width {
width: 100%;
}
.content-parallax {
height: 100%;
padding-bottom: 100px;
background-color: whitesmoke;
}
.title-space {
margin-top: 12%;
margin-bottom: 20%;
}
.full-image {
width: 99vw;
overflow: hidden;
margin-left: -15vw;
margin-right: -15vw;
margin-top: 5vw;
margin-bottom: 5vw;
}
.limit-mid-size {
width: 49.5%;
min-width: 300px;
flex-basis: 1;
overflow: hidden;
padding: 10px;
}
.web-screens {
min-width: 300px;
width: 44%;
margin: 2%;
}
.limit-height-size {
max-height: 200px;
margin-top: 30px;
}
.limit-height-size2 {
max-height: 370px;
margin-top: 30px;
margin-bottom: 30px;
}
.limit-height {
margin: auto;
max-height: 50vw;
max-width: 50%;
margin-top: 30px;
margin-bottom: 30px;
}
.limit-width-size {
max-width: 50%;
margin: auto;
margin-top: 30px;
margin-bottom: 30px;
}
.limit-width-size2 {
max-width: 74%;
margin: auto;
margin-top: 30px;
margin-bottom: 30px;
}
.shadow {
box-shadow: 4px 4px 12px 0px rgba(0,0,0,0.85);
}
.limit-max-size {
max-width: 100%;
}
.limit-max-size-logo {
max-width: 100%;
@media screen and (max-width: 600px) {
margin-left: 15%;
margin-right: 15%;
max-width: 70%;
}
}
.center-little-image {
margin-left: 20%;
margin-right: 20%;
width: 60%;
@media screen and (max-width: 600px) {
margin-left: 5%;
margin-right: 5%;
width: 90%;
}
}
.two-parts {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
width: 100%;
}
.text-part {
flex-basis: 45%;
flex-grow: 2;
margin-left: 5%;
min-width: 200px;
}
.title-42l {
font-family: 'ubuntu';
font-weight: 300;
font-size: 7rem;
color: white;
text-shadow: 2px 3px 2px rgba(0, 0, 0, 0.18);
@media screen and (max-width: 600px) {
font-size: 3rem;
}
}
.title-tbf {
margin-left: 50px;
font-weight: 400;
font-size: 100px;
color: white;
text-shadow: 2px 3px 2px rgba(0, 0, 0, 0.18);
@media screen and (max-width: 600px) {
font-size: 3rem;
margin-left: 0px;
}
}
.subtitle-tbf {
margin-left: 50px;
font-weight: 600;
font-size: 60px;
color: white;
text-shadow: 2px 3px 2px rgba(0, 0, 0, 0.18);
margin-top: -80px;
@media screen and (max-width: 600px) {
font-size: 2rem;
margin-top: -30px;
margin-left: 0px;
}
}
.sec-subtitle-tbf {
margin-left: 50px;
font-weight: 600;
font-size: 40px;
color: white;
text-shadow: 2px 3px 2px rgba(0, 0, 0, 0.18);
margin-top: 20px;
@media screen and (max-width: 600px) {
font-size: 1.6rem;
margin-left: 0px;
}
}
.content {
color: #4a4a4a;
padding-top: 1vw;
margin-left: 15vw;
margin-right: 15vw;
font-family: 'ubuntu';
font-size: 1em;
line-height: 1.5;
max-width: 100%;
display: grid;
text-align: justify;
text-justify: inter-word;
@media screen and (max-width: 600px) {
margin-left: 10vw;
margin-right: 10vw;
}
}
.little-title {
color: #7a7a7a;
padding-top: 4vw;
text-transform: uppercase;
font-size: 1.3em;
letter-spacing: 0.2em;
margin-bottom: 3vw;
margin-top: 4vw;
}
.little-margin-top {
margin-top: 5vw;
}
.font-test-big {
text-align: center;
font-size: 7rem;
line-height: 1;
word-wrap: break-word;
@media screen and (max-width: 600px) {
font-size: 3rem;
}
}
.font-test-little {
word-wrap: break-word;
text-align: center;
font-size: 1.2rem;
}
.little-margin-left {
margin-left: 5vw;
@media screen and (max-width: 600px) {
margin-left:0;
}
}
.italic {
font-style: italic;
}
.blockquote {
border-left: 10px solid #2BA5D5AA;
margin: 1.5em 10px;
padding: 0.5em 10px;
quotes: "\201C""\201D""\2018""\2019";
}
.blockquote:before {
color: #2BA5D5AA;
content: open-quote;
font-size: 4em;
line-height: 0.1em;
margin-right: 0.25em;
vertical-align: -0.4em;
}
.blockquote p {
display: inline;
}
.quote {
text-align: right;
}