get involved midway

ge-theme/static/css/get-involved.css

@@ -102,6 +102,73 @@
     padding-top: 30px;
     font-size: 20px;
 }
+.research-row{
+    padding-top: 50px;
+}
+.wrap-this-text{
+    box-sizing: border-box;
+    margin: auto;
+    max-width: 250px;
+}
+.pad-this-text{
+    padding-top: 30px;
+}
+.calender-wrap{
+    width: 40%;
+}
+.calender-text{
+    padding-top: 30px;
+    font-size: 20px;
+}
+.big-link-font{
+    font-size: 25px;
+    font-weight: bold;
+}
+.backimg-big{
+    padding-top: 60px;
+}
+.backimg-container{
+    position: relative;
+    text-align: center;
+    height: 100%;
+    width: 100%;
+}
+.streched-back-img{
+    position: relative;
+    width: 100%;
+}
+.logo-img{
+    position: absolute;
+    top: 30px;
+    left: 30px
+}
+.community-title-wrap{
+    position: absolute;
+    top: 40%;
+    left: 40%;
+}
+.community-title{
+    color: white;
+    font-weight: bold;
+    font-size: 70px;
+}
+.container-mooc{
+    width: 50%;
+}
+.line-above{
+    color: #A1A1A1;
+}
+.mooc-text-wrap{
+    box-sizing: border-box;
+    max-width: 600px;
+    margin: auto;
+}
+.mooc-small-font{
+    padding-top: 10px;
+    font-size: 20px;
+    padding-bottom: 10px;
+}
+
 @media only screen and (max-width: 480px){
     .text-inside1{
         font-size: 30px;
@@ -116,6 +183,31 @@
     .mobile-pad{
         padding-top: 30px;
     }
+    .pad-this-text{
+        padding-bottom: 30px;
+    }
+    .calender-wrap{
+        width: 100%;
+    }
+    .streched-back-img{
+        height: 300px;
+    }
+    .community-title-wrap{
+        top: 50%;
+        left: 45%;
+    }
+    .logo-img{
+        width: 40%;
+        height: 20%;
+        left: 10px
+    }
+    .community-title{
+        font-size: 30px;
+    }
+    .container-mooc{
+        width: 100%;
+    }
+
 }
 @media (min-width: 600px) and (max-width: 1024px){
     .text-inside1{
@@ -128,4 +220,18 @@
     .container-getinv{
         width: 80%;
     }
+    .calender-wrap{
+        width: 60%;
+    }
+    .community-title-wrap{
+        top: 50%;
+        left: 45%;
+    }
+    .community-title{
+        font-size: 30px;
+    }
+    .container-mooc{
+        width: 80%;
+    }
+
 }

ge-theme/templates/getInvolved.html

@@ -82,10 +82,68 @@
             </div>
         </div>
         <div class="research-title center-text">
-            <h1 class="big-title">Research,Intern,Volunteer& Explore!</h1>
+            <h1 class="big-title">Research,Intern,Volunteer & Explore!</h1>
             <p class="bigger-small-font">Volunteering, researching and being an intern with Grassroots Economics is a rewarding experience that can change the lives of people in need. You will be building a bridge between cultures and sharing your hope, enthusiasm, skills and dreams. Through this experience you will be able to fully understand how community currencies work and be able to take back and spread this knowledge with you.</p>
         </div>
     </div>
+    <div class="photo-grid">
+        <h2>photo grid missing!!!</h2>
+    </div>
+    <div class="research-row">
+        <div class="row center-text">
+            <div class="col-lg-4 col-md-4 col-sm-6">
+                <h2 class="big-title">Research</h2>
+                <div class="wrap-this-text">
+                    <p class="pad-this-text"> Masters/Phd thesis and publications come out yearly and help expand on our work and take it to other communities around the world</p>
+                </div>
+            </div>
+            <div class="col-lg-4 col-md-4 col-sm-6">
+                <h2 class="big-title">Intern</h2>
+                <div class="wrap-this-text">
+                    <p class="pad-this-text">Take part in developing cooperative businesses, designing social and environmental services and communication strategies to strengthen the use of community currencies</p>
+                </div>
+            </div>
+            <div class="col-lg-4 col-md-4 col-sm-6">
+                <h2 class="big-title">Volunteer</h2>
+                <div class="wrap-this-text">
+                    <p class="pad-this-text">Get involved in teaching and playing with children or on the development of different permaculture projects.</p>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="container calender-wrap">
+        <div class="row pt-4">
+            <div class="col-6 center-text">
+                <img class="img-fluid" src="{{SITEURL}}/theme/images/get-involved-imgs/calender-new.png">
+            </div>
+            <div class="col-6">
+                <div class="wrap-this-text">
+                    <p class="calender-text">Plan to  stay for at least 1 month and have a life changing experience</p>
+                </div>
+            </div>
+        </div>
+        <div class="center-text pt-3">
+            <a class="geinv-link big-link-font">CONTACT</a>
+        </div>
+    </div>
+    <div class="backimg-big">
+        <div class="backimg-container">
+            <img class="streched-back-img" src="{{SITEURL}}/theme/images/get-involved-imgs/back-img2.webp">
+            <img class="logo-img" src="{{SITEURL}}//theme/images/get-involved-imgs/logo-in-img.png">
+            <div class="community-title-wrap">
+                <h1 class="community-title">Community</h1>
+                <h1 class="community-title">Currency</h1>
+                <h1 class="community-title">Design Course</h1>
+            </div>
+        </div>
+    </div>
+    <div class="container container-mooc pt-5">
+        <hr class="line-above">
+        <div class="mooc-text-wrap center-text">
+            <p class="mooc-small-font">After understanding how to tap into the abundance of communities and build resilient thriving local economies, you will never look at money in the same way.</p>
+        </div>
+        <hr class="line-above">
+    </div>
 </div>
 
 {% endblock %}

output/pages/get-involved.html

@@ -145,10 +145,68 @@
             </div>
         </div>
         <div class="research-title center-text">
-            <h1 class="big-title">Research,Intern,Volunteer& Explore!</h1>
+            <h1 class="big-title">Research,Intern,Volunteer & Explore!</h1>
             <p class="bigger-small-font">Volunteering, researching and being an intern with Grassroots Economics is a rewarding experience that can change the lives of people in need. You will be building a bridge between cultures and sharing your hope, enthusiasm, skills and dreams. Through this experience you will be able to fully understand how community currencies work and be able to take back and spread this knowledge with you.</p>
         </div>
     </div>
+    <div class="photo-grid">
+        <h2>photo grid missing!!!</h2>
+    </div>
+    <div class="research-row">
+        <div class="row center-text">
+            <div class="col-lg-4 col-md-4 col-sm-6">
+                <h2 class="big-title">Research</h2>
+                <div class="wrap-this-text">
+                    <p class="pad-this-text"> Masters/Phd thesis and publications come out yearly and help expand on our work and take it to other communities around the world</p>
+                </div>
+            </div>
+            <div class="col-lg-4 col-md-4 col-sm-6">
+                <h2 class="big-title">Intern</h2>
+                <div class="wrap-this-text">
+                    <p class="pad-this-text">Take part in developing cooperative businesses, designing social and environmental services and communication strategies to strengthen the use of community currencies</p>
+                </div>
+            </div>
+            <div class="col-lg-4 col-md-4 col-sm-6">
+                <h2 class="big-title">Volunteer</h2>
+                <div class="wrap-this-text">
+                    <p class="pad-this-text">Get involved in teaching and playing with children or on the development of different permaculture projects.</p>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="container calender-wrap">
+        <div class="row pt-4">
+            <div class="col-6 center-text">
+                <img class="img-fluid" src="../theme/images/get-involved-imgs/calender-new.png">
+            </div>
+            <div class="col-6">
+                <div class="wrap-this-text">
+                    <p class="calender-text">Plan to  stay for at least 1 month and have a life changing experience</p>
+                </div>
+            </div>
+        </div>
+        <div class="center-text pt-3">
+            <a class="geinv-link big-link-font">CONTACT</a>
+        </div>
+    </div>
+    <div class="backimg-big">
+        <div class="backimg-container">
+            <img class="streched-back-img" src="../theme/images/get-involved-imgs/back-img2.webp">
+            <img class="logo-img" src="..//theme/images/get-involved-imgs/logo-in-img.png">
+            <div class="community-title-wrap">
+                <h1 class="community-title">Community</h1>
+                <h1 class="community-title">Currency</h1>
+                <h1 class="community-title">Design Course</h1>
+            </div>
+        </div>
+    </div>
+    <div class="container container-mooc pt-5">
+        <hr class="line-above">
+        <div class="mooc-text-wrap center-text">
+            <p class="mooc-small-font">After understanding how to tap into the abundance of communities and build resilient thriving local economies, you will never look at money in the same way.</p>
+        </div>
+        <hr class="line-above">
+    </div>
 </div>
 
 <div class="row">

output/theme/css/get-involved.css

@@ -102,6 +102,73 @@
     padding-top: 30px;
     font-size: 20px;
 }
+.research-row{
+    padding-top: 50px;
+}
+.wrap-this-text{
+    box-sizing: border-box;
+    margin: auto;
+    max-width: 250px;
+}
+.pad-this-text{
+    padding-top: 30px;
+}
+.calender-wrap{
+    width: 40%;
+}
+.calender-text{
+    padding-top: 30px;
+    font-size: 20px;
+}
+.big-link-font{
+    font-size: 25px;
+    font-weight: bold;
+}
+.backimg-big{
+    padding-top: 60px;
+}
+.backimg-container{
+    position: relative;
+    text-align: center;
+    height: 100%;
+    width: 100%;
+}
+.streched-back-img{
+    position: relative;
+    width: 100%;
+}
+.logo-img{
+    position: absolute;
+    top: 30px;
+    left: 30px
+}
+.community-title-wrap{
+    position: absolute;
+    top: 40%;
+    left: 40%;
+}
+.community-title{
+    color: white;
+    font-weight: bold;
+    font-size: 70px;
+}
+.container-mooc{
+    width: 50%;
+}
+.line-above{
+    color: #A1A1A1;
+}
+.mooc-text-wrap{
+    box-sizing: border-box;
+    max-width: 600px;
+    margin: auto;
+}
+.mooc-small-font{
+    padding-top: 10px;
+    font-size: 20px;
+    padding-bottom: 10px;
+}
+
 @media only screen and (max-width: 480px){
     .text-inside1{
         font-size: 30px;
@@ -116,6 +183,31 @@
     .mobile-pad{
         padding-top: 30px;
     }
+    .pad-this-text{
+        padding-bottom: 30px;
+    }
+    .calender-wrap{
+        width: 100%;
+    }
+    .streched-back-img{
+        height: 300px;
+    }
+    .community-title-wrap{
+        top: 50%;
+        left: 45%;
+    }
+    .logo-img{
+        width: 40%;
+        height: 20%;
+        left: 10px
+    }
+    .community-title{
+        font-size: 30px;
+    }
+    .container-mooc{
+        width: 100%;
+    }
+
 }
 @media (min-width: 600px) and (max-width: 1024px){
     .text-inside1{
@@ -128,4 +220,18 @@
     .container-getinv{
         width: 80%;
     }
+    .calender-wrap{
+        width: 60%;
+    }
+    .community-title-wrap{
+        top: 50%;
+        left: 45%;
+    }
+    .community-title{
+        font-size: 30px;
+    }
+    .container-mooc{
+        width: 80%;
+    }
+
 }

output/theme/css/get-involved.css~

@@ -6,20 +6,192 @@
 }
 .text-inside1{
     position: absolute;
-    top: 50%;
+    top: 70%;
     left: 50%;
     transform: translate(-50%, -50%);
     color: #e6e6e6;
     font-size: 70px;
-    font-weight: bold;
+    font-style: italic;
 }
 .text-inside2{
     position: absolute;
-    /*margin-bottom: 10px;*/
-    /*bottom: 0;*/
     left: 50%;
-    transform: translate(-50%, -40%);
-    color: #e6e6e6;
-    font-size: 70px;
+    transform: translate(-50%, -80%);
+    color: #ffffff;
+    font-size: 150px;
     font-weight: bold;
 }
+.container-getinv{
+    width: 50%;
+    padding-top: 40px;
+}
+.center-text{
+    text-align: center;
+}
+.ways-txt{
+    font-weight: bold;
+    padding-top: 20px;
+}
+.geinv-link{
+    text-decoration-line: underline;
+    text-decoration-style: solid;
+    text-decoration-color: black;
+    text-decoration-thickness: 3px;
+    color: black;
+}
+.geinv-link:hover{
+    color: black;
+}
+.geinv-butt-class{
+    padding-top: 40px;
+    gap: 30px;
+    text-align: center;
+}
+.geinv-buttons{
+    background: #ffffff;
+    border: 1px solid black;
+    color: black;
+    padding: 0.5em;
+    text-decoration: none;
+    width: 120px;
+    border-radius: 25px;
+}
+.line-deco{
+    padding-top: 50px;
+    width: 300px;
+    border-bottom: 3px solid black;
+}
+.available-positions{
+    padding-top: 60px;
+}
+.big-title{
+    font-weight: bold;
+}
+.row-pad{
+    padding-top: 60px;
+}
+.positions{
+    font-weight: bold;
+}
+.gev-img-round{
+    border-radius: 50%;
+    border: 1px solid #a3a3c2;
+    padding: 5px;
+}
+.img-pad{
+    padding-top: 30px;
+}
+.text-wrap{
+    box-sizing: border-box;
+    margin: auto;
+    max-width: 300px;
+}
+.gev-text{
+    padding-top: 30px;
+}
+.gev-small-text{
+    font-size: 13px;
+}
+.gev-italics{
+    font-style: italic;
+}
+.research-title{
+    padding-top: 60px;
+}
+.bigger-small-font{
+    padding-top: 30px;
+    font-size: 20px;
+}
+.research-row{
+    padding-top: 50px;
+}
+.wrap-this-text{
+    box-sizing: border-box;
+    margin: auto;
+    max-width: 250px;
+}
+.pad-this-text{
+    padding-top: 30px;
+}
+.calender-wrap{
+    width: 40%;
+}
+.calender-text{
+    padding-top: 30px;
+    font-size: 20px;
+}
+.big-link-font{
+    font-size: 25px;
+    font-weight: bold;
+}
+.backimg-big{
+    padding-top: 60px;
+}
+.backimg-container{
+    position: relative;
+    text-align: center;
+    height: 100%;
+    width: 100%;
+}
+.streched-back-img{
+    position: relative;
+    width: 100%;
+}
+.logo-img{
+    position: absolute;
+    top: 30px;
+    left: 30px
+}
+.community-title-wrap{
+    position: absolute;
+    top: 50%;
+    left: 40%;
+}
+.community-title{
+    color: white;
+    font-weight: bold;
+}
+
+@media only screen and (max-width: 480px){
+    .text-inside1{
+        font-size: 30px;
+        top: 60%;
+    }
+    .text-inside2{
+        font-size: 40px;
+    }
+    .container-getinv{
+        width: 100%;
+    }
+    .mobile-pad{
+        padding-top: 30px;
+    }
+    .pad-this-text{
+        padding-bottom: 30px;
+    }
+    .calender-wrap{
+        width: 100%;
+    }
+
+    /*.wrap-this-text2{*/
+    /*    box-sizing: border-box;*/
+    /*    width: 150px;*/
+    /*    margin: auto;*/
+    /*}*/
+}
+@media (min-width: 600px) and (max-width: 1024px){
+    .text-inside1{
+        font-size: 50px;
+        top: 60%;
+    }
+    .text-inside2{
+        font-size: 80px;
+    }
+    .container-getinv{
+        width: 80%;
+    }
+    .calender-wrap{
+        width: 60%;
+    }
+
+}