mirror of
https://github.com/biobulkbende/biobulkbende.org.git
synced 2025-10-19 10:16:31 +00:00
hot-it-works almost finished (error with images)
This commit is contained in:
@ -582,13 +582,21 @@ img {
|
||||
margin-right: auto; }
|
||||
.wrapper--medium {
|
||||
max-width: 976px; }
|
||||
.wrapper--centered {
|
||||
text-align: center; }
|
||||
@media (min-width: 1200px) {
|
||||
.wrapper--centered {
|
||||
text-align: left; } }
|
||||
.wrapper--small {
|
||||
max-width: 750px; }
|
||||
.wrapper--t-margins {
|
||||
margin-top: 100px; }
|
||||
|
||||
.page-section {
|
||||
position: relative; }
|
||||
.page-section--t-margin-external {
|
||||
margin-top: -70px; }
|
||||
@media (min-width: 800px) {
|
||||
.page-section--b-margin-external {
|
||||
margin-bottom: -140px; } }
|
||||
.page-section--tb-padding {
|
||||
padding: 1.2rem 0; }
|
||||
@media (min-width: 800px) {
|
||||
@ -621,38 +629,16 @@ img {
|
||||
.page-section--lightGreen {
|
||||
background-color: #A5C90F;
|
||||
color: #fff; }
|
||||
.page-section--arrow-down {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 70px solid transparent;
|
||||
border-right: 70px solid transparent;
|
||||
border-top: 85px solid #FF3D04;
|
||||
position: absolute;
|
||||
bottom: -60px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); }
|
||||
@media (min-width: 530px) {
|
||||
.page-section--arrow-down {
|
||||
position: relative;
|
||||
top: -10px;
|
||||
margin: auto;
|
||||
left: 0;
|
||||
transform: translateX(0%); } }
|
||||
@media (min-width: 800px) {
|
||||
.page-section--arrow-down {
|
||||
position: relative;
|
||||
top: 20px;
|
||||
margin: auto;
|
||||
left: 0;
|
||||
transform: translateX(0%); } }
|
||||
|
||||
.headline {
|
||||
margin: auto; }
|
||||
.headline strong {
|
||||
font-weight: 800; }
|
||||
.headline--lt-margin {
|
||||
margin-left: 55px;
|
||||
margin-top: -5px; }
|
||||
@media (min-width: 1200px) {
|
||||
.headline--lt-margin {
|
||||
margin-left: 55px; } }
|
||||
.headline--s-width {
|
||||
max-width: 500px; }
|
||||
@media (min-width: 800px) {
|
||||
@ -777,15 +763,30 @@ img {
|
||||
margin: 50px 0px; }
|
||||
.how-it-works strong {
|
||||
font-weight: 800; }
|
||||
.how-it-works--atSmall-centered {
|
||||
text-align: center; }
|
||||
@media (min-width: 1200px) {
|
||||
.how-it-works--atSmall-centered {
|
||||
text-align: left; } }
|
||||
.how-it-works--atSmall-t-margin {
|
||||
margin-top: 70px !important; }
|
||||
@media (min-width: 530px) {
|
||||
.how-it-works--atSmall-t-margin {
|
||||
margin-top: 20px; } }
|
||||
@media (min-width: 1200px) {
|
||||
.how-it-works--atSmall-t-margin {
|
||||
margin-top: 100px; } }
|
||||
.how-it-works--centered {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
transform: translateY(-50%);
|
||||
text-align: center; }
|
||||
.how-it-works--t-margin {
|
||||
margin-top: -30px; }
|
||||
@media (min-width: 530px) {
|
||||
.how-it-works--t-margin {
|
||||
margin-top: 10px; } }
|
||||
@media (min-width: 800px) {
|
||||
.how-it-works--t-margin {
|
||||
margin-top: -45px; } }
|
||||
.how-it-works__last-section {
|
||||
padding: 100px 0px 50px 0px;
|
||||
background-color: rgba(255, 255, 255, 0.9); }
|
||||
@ -806,9 +807,20 @@ img {
|
||||
.how-it-works__title {
|
||||
margin-top: 10px;
|
||||
font-size: 2.1rem; } }
|
||||
.how-it-works__img {
|
||||
display: none; }
|
||||
@media (min-width: 1200px) {
|
||||
.how-it-works__img {
|
||||
display: inline-block; } }
|
||||
.how-it-works__icon--1 {
|
||||
width: 225px;
|
||||
margin-left: 60px; }
|
||||
width: 150px; }
|
||||
@media (min-width: 800px) {
|
||||
.how-it-works__icon--1 {
|
||||
width: 200px; } }
|
||||
@media (min-width: 1200px) {
|
||||
.how-it-works__icon--1 {
|
||||
width: 225px;
|
||||
margin-left: 80px; } }
|
||||
.how-it-works__icon--2 {
|
||||
width: 130px;
|
||||
margin-right: .8rem;
|
||||
@ -822,4 +834,70 @@ img {
|
||||
margin-bottom: -30px;
|
||||
margin-right: 20px; }
|
||||
|
||||
.arrow {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 70px solid transparent;
|
||||
border-right: 70px solid transparent; }
|
||||
.arrow--about {
|
||||
position: absolute;
|
||||
bottom: -60px;
|
||||
z-index: 1;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); }
|
||||
@media (min-width: 800px) {
|
||||
.arrow--about {
|
||||
position: relative;
|
||||
bottom: -70px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); } }
|
||||
@media (min-width: 1200px) {
|
||||
.arrow--about {
|
||||
position: relative;
|
||||
bottom: -70px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); } }
|
||||
.arrow--how-it-works-1 {
|
||||
position: absolute;
|
||||
bottom: -60px;
|
||||
z-index: 1;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); }
|
||||
@media (min-width: 800px) {
|
||||
.arrow--how-it-works-1 {
|
||||
position: relative;
|
||||
bottom: -50px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); } }
|
||||
@media (min-width: 1200px) {
|
||||
.arrow--how-it-works-1 {
|
||||
position: relative;
|
||||
bottom: -50px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); } }
|
||||
.arrow--how-it-works-2 {
|
||||
position: absolute;
|
||||
bottom: -60px;
|
||||
z-index: 1;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); }
|
||||
@media (min-width: 800px) {
|
||||
.arrow--how-it-works-2 {
|
||||
position: relative;
|
||||
bottom: 0px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); } }
|
||||
@media (min-width: 1200px) {
|
||||
.arrow--how-it-works-2 {
|
||||
position: relative;
|
||||
bottom: 0px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%); } }
|
||||
.arrow--red {
|
||||
border-top: 85px solid #FF3D04; }
|
||||
.arrow--darkGreen {
|
||||
border-top: 85px solid #6F9C3D; }
|
||||
.arrow--lightGreen {
|
||||
border-top: 85px solid #A5C90F; }
|
||||
|
||||
/*# sourceMappingURL=style.css.map */
|
||||
|
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user