home page styling
This commit is contained in:
parent
d42eb0df77
commit
c5136ba65e
|
|
@ -1,10 +1,11 @@
|
|||
.row-one-words{
|
||||
text-align: center;
|
||||
font-size: 40px;
|
||||
padding-top: 50px;
|
||||
}
|
||||
.row-one-img{
|
||||
padding: 20px;
|
||||
}
|
||||
/*.row-one-img{*/
|
||||
/* padding: 20px;*/
|
||||
/*}*/
|
||||
.height-row{
|
||||
height: 80%;
|
||||
}
|
||||
|
|
@ -16,8 +17,9 @@
|
|||
|
||||
}
|
||||
.wrapper-col{
|
||||
margin-top: 100px;
|
||||
margin-left: 150px;
|
||||
/*margin-top: 100px;*/
|
||||
/*margin-left: 150px;*/
|
||||
margin: auto;
|
||||
border-style: solid;
|
||||
border-color: #ffffff;
|
||||
box-sizing: border-box;
|
||||
|
|
@ -28,22 +30,54 @@
|
|||
box-sizing: border-box;
|
||||
margin: auto;
|
||||
border-style: solid;
|
||||
border-color: #0040D0;
|
||||
max-height: 600px;
|
||||
border-color: #ffffff;
|
||||
max-height: 800px;
|
||||
max-width: 400px;
|
||||
}
|
||||
.h2-title{
|
||||
padding-top: 30px;
|
||||
padding-top: 100px;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
.row-2-words{
|
||||
padding-top: 40px;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.row-margin{
|
||||
margin-bottom: 50px;
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
.style-img{
|
||||
width: 100%;
|
||||
}
|
||||
.butt-style{
|
||||
background: #ffffff;
|
||||
border: 2px solid black;
|
||||
color: black;
|
||||
display: block;
|
||||
padding: 15px 10px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
width: 180px;
|
||||
border-radius: 25px;
|
||||
margin: auto;
|
||||
}
|
||||
.butt-style:hover{
|
||||
background-color: #3E3F45;
|
||||
color: #ffffff;
|
||||
}
|
||||
/*.words-col-wrapper a{*/
|
||||
/* text-decoration: none;*/
|
||||
/* color: black;*/
|
||||
/* border-color: black;*/
|
||||
/* border-width: 2px;*/
|
||||
/* padding: 20px 10px;*/
|
||||
/* border-radius: 2px;*/
|
||||
|
||||
/*}*/
|
||||
@media only screen and (max-width: 480px){
|
||||
.img-style{
|
||||
padding-left: 20px;
|
||||
|
|
@ -52,6 +86,7 @@
|
|||
max-width: 400px;
|
||||
}
|
||||
.row-one-words{
|
||||
padding-top: 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
.wrapper-col{
|
||||
|
|
@ -60,4 +95,17 @@
|
|||
max-height: 400px;
|
||||
/*border-color: #ff4c85;*/
|
||||
}
|
||||
.row-2-words{
|
||||
padding-top: 20px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.row-margin{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.h2-title{
|
||||
padding-top: 20px;
|
||||
}
|
||||
.style-img{
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 206 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 180 KiB |
|
|
@ -24,11 +24,35 @@
|
|||
<div class="words-col-wrapper">
|
||||
<h2 class="h2-title">Ending poverty lies in building communities</h2>
|
||||
<p class="row-2-words">Through Community Inclusion Currencies people have a way to exchange goods and services and incubate projects and businesses, without relying on scarce national currency and volatile markets.</p>
|
||||
<a href="{{SITEURL}}/pages/how-it-works.html" class="butt-style">how it works</a>
|
||||
<a href="{{SITEURL}}/pages/how-it-works.html" class="butt-style">How it works</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<img class="img-fluid" src="{{SITEURL}}/theme/images/home-imgs/home-img2.webp">
|
||||
<img class="img-fluid style-img" src="{{SITEURL}}/theme/images/home-imgs/home-img2.webp">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row row-margin">
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<img class="img-fluid style-img" src="{{SITEURL}}/theme/images/home-imgs/home-img3.webp">
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<div class="words-col-wrapper">
|
||||
<h2 class="h2-title">We envision prospering economies built by thriving communities</h2>
|
||||
<p class="row-2-words">Grassroots Economics is a non-profit foundation that has been seeking to empower marginalized communities to take charge of their own livelihoods and economic future since 2010.</p>
|
||||
<a href="{{SITEURL}}/pages/about-us.html" class="butt-style">About us</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row row-margin">
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<div class="words-col-wrapper">
|
||||
<h2 class="h2-title">Get involved</h2>
|
||||
<p class="row-2-words">Communities should be afforded the same privileges as nations and be empowered to develop their own prospering economies with the stability of their own currencies.</p>
|
||||
<a href="{{SITEURL}}/pages/get-involved.html" class="butt-style">Support us</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12 col-md-12">
|
||||
<img class="img-fluid style-img" src="{{SITEURL}}/theme/images/home-imgs/home-img4.webp">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -66,11 +66,35 @@
|
|||
<div class="words-col-wrapper">
|
||||
<h2 class="h2-title">Ending poverty lies in building communities</h2>
|
||||
<p class="row-2-words">Through Community Inclusion Currencies people have a way to exchange goods and services and incubate projects and businesses, without relying on scarce national currency and volatile markets.</p>
|
||||
<a href="../pages/how-it-works.html" class="butt-style">how it works</a>
|
||||
<a href="../pages/how-it-works.html" class="butt-style">How it works</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<img class="img-fluid" src="../theme/images/home-imgs/home-img2.webp">
|
||||
<img class="img-fluid style-img" src="../theme/images/home-imgs/home-img2.webp">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row row-margin">
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<img class="img-fluid style-img" src="../theme/images/home-imgs/home-img3.webp">
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<div class="words-col-wrapper">
|
||||
<h2 class="h2-title">We envision prospering economies built by thriving communities</h2>
|
||||
<p class="row-2-words">Grassroots Economics is a non-profit foundation that has been seeking to empower marginalized communities to take charge of their own livelihoods and economic future since 2010.</p>
|
||||
<a href="../pages/about-us.html" class="butt-style">About us</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row row-margin">
|
||||
<div class="col-lg-6 col-md-12 col-sm-12">
|
||||
<div class="words-col-wrapper">
|
||||
<h2 class="h2-title">Get involved</h2>
|
||||
<p class="row-2-words">Communities should be afforded the same privileges as nations and be empowered to develop their own prospering economies with the stability of their own currencies.</p>
|
||||
<a href="../pages/get-involved.html" class="butt-style">Support us</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12 col-md-12">
|
||||
<img class="img-fluid style-img" src="../theme/images/home-imgs/home-img4.webp">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
.row-one-words{
|
||||
text-align: center;
|
||||
font-size: 40px;
|
||||
padding-top: 50px;
|
||||
}
|
||||
.row-one-img{
|
||||
padding: 20px;
|
||||
}
|
||||
/*.row-one-img{*/
|
||||
/* padding: 20px;*/
|
||||
/*}*/
|
||||
.height-row{
|
||||
height: 80%;
|
||||
}
|
||||
|
|
@ -16,8 +17,9 @@
|
|||
|
||||
}
|
||||
.wrapper-col{
|
||||
margin-top: 100px;
|
||||
margin-left: 150px;
|
||||
/*margin-top: 100px;*/
|
||||
/*margin-left: 150px;*/
|
||||
margin: auto;
|
||||
border-style: solid;
|
||||
border-color: #ffffff;
|
||||
box-sizing: border-box;
|
||||
|
|
@ -28,22 +30,54 @@
|
|||
box-sizing: border-box;
|
||||
margin: auto;
|
||||
border-style: solid;
|
||||
border-color: #0040D0;
|
||||
max-height: 600px;
|
||||
border-color: #ffffff;
|
||||
max-height: 800px;
|
||||
max-width: 400px;
|
||||
}
|
||||
.h2-title{
|
||||
padding-top: 30px;
|
||||
padding-top: 100px;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
.row-2-words{
|
||||
padding-top: 40px;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.row-margin{
|
||||
margin-bottom: 50px;
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
.style-img{
|
||||
width: 100%;
|
||||
}
|
||||
.butt-style{
|
||||
background: #ffffff;
|
||||
border: 2px solid black;
|
||||
color: black;
|
||||
display: block;
|
||||
padding: 15px 10px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
width: 180px;
|
||||
border-radius: 25px;
|
||||
margin: auto;
|
||||
}
|
||||
.butt-style:hover{
|
||||
background-color: #3E3F45;
|
||||
color: #ffffff;
|
||||
}
|
||||
/*.words-col-wrapper a{*/
|
||||
/* text-decoration: none;*/
|
||||
/* color: black;*/
|
||||
/* border-color: black;*/
|
||||
/* border-width: 2px;*/
|
||||
/* padding: 20px 10px;*/
|
||||
/* border-radius: 2px;*/
|
||||
|
||||
/*}*/
|
||||
@media only screen and (max-width: 480px){
|
||||
.img-style{
|
||||
padding-left: 20px;
|
||||
|
|
@ -52,6 +86,7 @@
|
|||
max-width: 400px;
|
||||
}
|
||||
.row-one-words{
|
||||
padding-top: 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
.wrapper-col{
|
||||
|
|
@ -60,4 +95,17 @@
|
|||
max-height: 400px;
|
||||
/*border-color: #ff4c85;*/
|
||||
}
|
||||
.row-2-words{
|
||||
padding-top: 20px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.row-margin{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.h2-title{
|
||||
padding-top: 20px;
|
||||
}
|
||||
.style-img{
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
padding: 20px;
|
||||
}
|
||||
.height-row{
|
||||
height: 60%;
|
||||
height: 80%;
|
||||
}
|
||||
.img-style{
|
||||
padding-left: 180px;
|
||||
|
|
@ -28,18 +28,54 @@
|
|||
box-sizing: border-box;
|
||||
margin: auto;
|
||||
border-style: solid;
|
||||
border-color: #0040D0;
|
||||
max-height: 500px;
|
||||
border-color: #ffffff;
|
||||
max-height: 800px;
|
||||
max-width: 400px;
|
||||
}
|
||||
.h2-title{
|
||||
padding-top: 100px;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
.row-2-words{
|
||||
padding-top: 40px;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.row-margin{
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
.style-img{
|
||||
width: 100%;
|
||||
}
|
||||
.butt-style{
|
||||
background: #ffffff;
|
||||
border: 2px solid black;
|
||||
color: black;
|
||||
display: block;
|
||||
padding: 15px 10px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
width: 180px;
|
||||
border-radius: 25px;
|
||||
margin: auto;
|
||||
}
|
||||
.butt-style:hover{
|
||||
background-color: #3E3F45;
|
||||
color: #ffffff;
|
||||
}
|
||||
/*.words-col-wrapper a{*/
|
||||
/* text-decoration: none;*/
|
||||
/* color: black;*/
|
||||
/* border-color: black;*/
|
||||
/* border-width: 2px;*/
|
||||
/* padding: 20px 10px;*/
|
||||
/* border-radius: 2px;*/
|
||||
|
||||
/*}*/
|
||||
@media only screen and (max-width: 480px){
|
||||
.img-style{
|
||||
padding-left: 20px;
|
||||
|
|
@ -48,6 +84,7 @@
|
|||
max-width: 400px;
|
||||
}
|
||||
.row-one-words{
|
||||
padding-top: 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
.wrapper-col{
|
||||
|
|
@ -56,4 +93,16 @@
|
|||
max-height: 400px;
|
||||
/*border-color: #ff4c85;*/
|
||||
}
|
||||
.row-2-words{
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
/*.row-margin{*/
|
||||
/* margin-bottom: 1px;*/
|
||||
/*}*/
|
||||
.h2-title{
|
||||
padding-top: 20px;
|
||||
}
|
||||
.style-img{
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 206 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 180 KiB |
Loading…
Reference in New Issue