+
+
+
+
\ No newline at end of file
diff --git a/app/src/main/assets/Homepage/homepage.html b/app/src/main/assets/Homepage/homepage.html
new file mode 100644
index 00000000..8f194bae
--- /dev/null
+++ b/app/src/main/assets/Homepage/homepage.html
@@ -0,0 +1,98 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/app/src/main/assets/Homepage/javascript/enum-homepage.js b/app/src/main/assets/Homepage/javascript/enum-homepage.js
new file mode 100644
index 00000000..5d663e5c
--- /dev/null
+++ b/app/src/main/assets/Homepage/javascript/enum-homepage.js
@@ -0,0 +1,25 @@
+
+/*Enums*/
+
+var Commands = {
+ onLoadReferenceWebsites : "onLoadReferenceWebsites",
+ onClickReferenceWebsite : "onClickReferenceWebsite"
+};
+
+/*Links*/
+
+var GET = {
+ pData : "pData",
+};
+
+
+var UIID = {
+ mReferenceWebsites : "mReferenceWebsites",
+};
+
+var ReferenceWebsitesDataID = {
+ mIcon : "mIcon",
+ mHeader : "mHeader",
+ mBody : "mBody",
+ mUrl : "mUrl",
+};
diff --git a/app/src/main/assets/Homepage/javascript/js-homepage-dark.js b/app/src/main/assets/Homepage/javascript/js-homepage-dark.js
new file mode 100644
index 00000000..fdff7bcc
--- /dev/null
+++ b/app/src/main/assets/Homepage/javascript/js-homepage-dark.js
@@ -0,0 +1,82 @@
+
+/*Homepage Classes*/
+
+class homepage {
+
+ mLastLinkID = "";
+
+ constructor() {
+ }
+
+ /*Helper Methods*/
+
+ onLoadReferenceWebsites(){
+ document.getElementById('mReferenceWebsites').className = 'hide';
+ }
+
+ onLoadReferenceWebsiteContent(mJson){
+ var mResponseJson = mJson;
+ var mOBJ = JSON.parse(mResponseJson);
+ var mReferenceHTML = strings.emptyString;
+
+ var mIDCounter = 0;
+ Object.keys(mOBJ).forEach(function(key) {
+ var mObject = mOBJ[key];
+ mReferenceHTML += '
'+mObject[ReferenceWebsitesDataID.mBody]+'
'
+ mIDCounter+=1;
+ });
+
+
+ var mReferenceID = document.getElementById(UIID.mReferenceWebsites);
+ mReferenceID.innerHTML = mReferenceHTML;
+
+ document.getElementById('mReferenceWebsites').className = 'show';
+ }
+
+ onLoadStaticWebpage(pData){
+ if(this.mLastLinkID.localeCompare("") != 0){
+ document.getElementById(this.mLastLinkID).style.backgroundColor = "#1c1b21";
+ }
+
+ document.getElementById(pData[0]).style.backgroundColor = "#18171c";
+ window.open(pData[1],"_self");
+ this.mLastLinkID = pData[0];
+ }
+
+ /*Ajax Request*/
+
+ onParseReferenceWebsites() {
+ var $_GET=[];
+ decodeURIComponent(window.location.href).replace(/[?&]+([^=&]+)=([^&]*)/gi,function(a,name,value){$_GET[name]=value;});
+
+ setTimeout(mHomepageLoader.onLoadReferenceWebsites, 500);
+ setTimeout(mHomepageLoader.onLoadReferenceWebsiteContent, 1000, $_GET[GET.pData]);
+ }
+
+}
+
+let mHomepageLoader = new homepage();
+
+/*Helper Classes Manager*/
+function onTriggerScriptHandler(pCommand,pData) {
+ if(pCommand == Commands.onLoadReferenceWebsites){
+ mHomepageLoader.onParseReferenceWebsites()
+ }
+ else if(pCommand == Commands.onClickReferenceWebsite){
+ mHomepageLoader.onLoadStaticWebpage(pData)
+ }
+}
+
+/*Default Loaders*/
+$(window).on('load', function() {
+ /* For Local Testing */
+
+ // var mResponseJson = '[{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://wikileaks.org/static/img/wl-logo.png", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"}]';
+ // setTimeout(mHomepageLoader.onLoadReferenceWebsites, 500);
+ // setTimeout(mHomepageLoader.onLoadReferenceWebsiteContent, 1000, mResponseJson);
+ document.getElementById("pBody").classList.toggle('body_fadein');
+
+ setTimeout(function (){
+ onTriggerScriptHandler(Commands.onLoadReferenceWebsites, null)
+ }, 100);
+});
diff --git a/app/src/main/assets/Homepage/javascript/js-homepage.js b/app/src/main/assets/Homepage/javascript/js-homepage.js
new file mode 100644
index 00000000..e1f665bd
--- /dev/null
+++ b/app/src/main/assets/Homepage/javascript/js-homepage.js
@@ -0,0 +1,82 @@
+
+/*Homepage Classes*/
+
+class homepage {
+
+ mLastLinkID = "";
+
+ constructor() {
+ }
+
+ /*Helper Methods*/
+
+ onLoadReferenceWebsites(){
+ document.getElementById('mReferenceWebsites').className = 'hide';
+ }
+
+ onLoadReferenceWebsiteContent(mJson){
+ var mResponseJson = mJson;
+ var mOBJ = JSON.parse(mResponseJson);
+ var mReferenceHTML = strings.emptyString;
+
+ var mIDCounter = 0;
+ Object.keys(mOBJ).forEach(function(key) {
+ var mObject = mOBJ[key];
+ mReferenceHTML += '
'+mObject[ReferenceWebsitesDataID.mBody]+'
'
+ mIDCounter+=1;
+ });
+
+
+ var mReferenceID = document.getElementById(UIID.mReferenceWebsites);
+ mReferenceID.innerHTML = mReferenceHTML;
+
+ document.getElementById('mReferenceWebsites').className = 'show';
+ }
+
+ onLoadStaticWebpage(pData){
+ if(this.mLastLinkID.localeCompare("") != 0){
+ document.getElementById(this.mLastLinkID).style.backgroundColor = "#ffffff";
+ }
+
+ document.getElementById(pData[0]).style.backgroundColor = "#f2f2f2";
+ window.open(pData[1],"_self");
+ this.mLastLinkID = pData[0];
+ }
+
+ /*Ajax Request*/
+
+ onParseReferenceWebsites() {
+ var $_GET=[];
+ decodeURIComponent(window.location.href).replace(/[?&]+([^=&]+)=([^&]*)/gi,function(a,name,value){$_GET[name]=value;});
+
+ setTimeout(mHomepageLoader.onLoadReferenceWebsites, 500);
+ setTimeout(mHomepageLoader.onLoadReferenceWebsiteContent, 1000, $_GET[GET.pData]);
+ }
+
+}
+
+let mHomepageLoader = new homepage();
+
+/*Helper Classes Manager*/
+function onTriggerScriptHandler(pCommand,pData) {
+ if(pCommand == Commands.onLoadReferenceWebsites){
+ mHomepageLoader.onParseReferenceWebsites()
+ }
+ else if(pCommand == Commands.onClickReferenceWebsite){
+ mHomepageLoader.onLoadStaticWebpage(pData)
+ }
+}
+
+/*Default Loaders*/
+$(window).on('load', function() {
+ /* For Local Testing */
+
+ // var mResponseJson = '[{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://wikileaks.org/static/img/wl-logo.png", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"},{ "mIcon":"https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196", "mHeader":"Experience", "mBody":"Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui"}]';
+ // setTimeout(mHomepageLoader.onLoadReferenceWebsites, 500);
+ // setTimeout(mHomepageLoader.onLoadReferenceWebsiteContent, 1000, mResponseJson);
+ document.getElementById("pBody").classList.toggle('body_fadein');
+
+ setTimeout(function (){
+ onTriggerScriptHandler(Commands.onLoadReferenceWebsites, null)
+ }, 1000);
+});
diff --git a/app/src/main/assets/Homepage/javascript/string-homepage.js b/app/src/main/assets/Homepage/javascript/string-homepage.js
new file mode 100644
index 00000000..34c05fbc
--- /dev/null
+++ b/app/src/main/assets/Homepage/javascript/string-homepage.js
@@ -0,0 +1,6 @@
+
+/*Strings*/
+
+var strings = {
+ emptyString : "",
+};
diff --git a/app/src/main/assets/Homepage/style/cs-dark_header.css b/app/src/main/assets/Homepage/style/cs-dark_header.css
new file mode 100644
index 00000000..cf39facb
--- /dev/null
+++ b/app/src/main/assets/Homepage/style/cs-dark_header.css
@@ -0,0 +1,76 @@
+.lh_light_background{
+ background-color: #1c1b21 !important;
+ color:#cccccc !important;
+}
+
+@media only screen and (max-width: 943px) {
+ .lh_light_header__catagory_image {
+ display : none
+ }
+}
+
+@media only screen and (max-width: 943px) {
+ .lh_light_header__catagory_bold_mobile {
+ font-weight: bold;
+ color: #f0f0f0 !important;
+ }
+}
+
+.lh_light_header{
+ color:#000000;
+ text-align: right;
+ padding-top: 0px;
+ border-bottom-color:#121212 !important;
+ padding-top: 10px;
+ padding-bottom: 15px;
+ border-style: solid;border-right-width: 0;
+ border-left-width: 0;border-top-width: 0;
+ border-bottom-width: 1px;
+}
+
+@media only screen and (max-width: 943px) {
+ .lh_light_header {
+ border-bottom-width: 1px;
+ padding-bottom: 15px;
+ }
+}
+
+#lh_light_header_identifier {
+ background-color:#ffffff;
+}
+
+@media only screen and (max-width: 943px) {
+ #lh_light_header_identifier {
+ background-color:#ffffff;
+ }
+}
+
+.lh_light_header__bold{
+ font-weight: bold;
+ color: #5f9aec !important;
+}
+
+.lh_light_header__catagory-spacing-right{
+ margin-right: 15px;
+}
+
+.lh_light_header__catagory{
+ cursor: pointer;
+ font-size: 14px;
+ color: black;
+ padding: 13px 9px 14px;
+}
+
+/*light-header events*/
+.lh_light_header__catagory:hover{
+ color: darkslategray;
+ text-decoration: none !important;
+ border-bottom: 4px solid lightslategray;
+ background: #18171c;
+}
+.lh_light_header__catagory:focus{
+ color: darkslategray;
+ text-decoration: none !important;
+ border-bottom: 4px solid lightslategray;
+ background: #18171c;
+}
diff --git a/app/src/main/assets/Homepage/style/cs-footer.css b/app/src/main/assets/Homepage/style/cs-footer.css
new file mode 100644
index 00000000..8355b1f9
--- /dev/null
+++ b/app/src/main/assets/Homepage/style/cs-footer.css
@@ -0,0 +1,99 @@
+/*footer-bar style*/
+.fb_shared-footer-bar{
+ position: relative;
+ margin-top: -86px;
+}
+
+@media only screen and (max-width: 943px) {
+ .fb_shared-footer-bar {
+ display : none
+ }
+}
+
+.fb_footer-bar__content_bottom{
+ background-color:#5c5cd6;
+ border-style: solid;
+ border-top-width: 0;
+ border-right-width: 0;
+ border-left-width: 0;
+ border-color:#3333cc;
+ border-bottom-width: 0;
+ width:100%;
+ text-align: center;
+ height: 43px;
+ padding: 10.5px 13px 8px;
+}
+
+.fb_footer-bar__content_top{
+ background-color:#5c5cd6;
+ border-style: solid;
+ border-top-width: 0;
+ border-right-width: 0;
+ border-left-width: 0;
+ border-color:#3333cc;
+ border-bottom-width: 0;
+ width:100%;
+ text-align: center;
+ height: 43px;
+ padding: 10.5px 13px 8px;
+}
+
+.fb_footer-bar__border_bottom {
+ border-bottom-width: 1px;
+}
+
+.fb_footer-bar__text-bottom{
+ color:#767676;
+ font-size: 13px;
+ text-align:left;
+}
+
+.fb_footer-bar__catagories--padding{
+ padding: 15px 15px 8px;
+}
+
+.fb_footer-bar__catagories--padding:hover{
+ color: white !important;
+ text-decoration: none !important;
+ border-bottom: 4px solid whitesmoke !important;;
+}
+
+.fb_footer-bar__catagories--padding:focus {
+ color: white !important;
+ text-decoration: none !important;
+ border-bottom: 4px solid white !important;
+}
+
+.fb_footer-bar__catagories{
+ cursor: pointer;
+ color:white !important;
+ font-family: Arial, sans-serif;
+ font-size: 14px;
+ height: 43px;
+}
+
+/*footer-bar events*/
+
+.fb_footer-bar__catagories:hover{
+}
+
+.fb_footer-bar__catagories-start:hover{
+ color: white !important;
+ text-decoration: none !important;
+ border-bottom: 4px solid white !important;
+}
+
+.fb_footer-bar__catagories-start:focus {
+ color: white !important;
+ text-decoration: none !important;
+ border-bottom: 4px solid white !important;
+}
+
+.fb_footer-bar__catagories-start{
+ cursor: pointer;
+ color:white !important;
+ display: inline-block;
+ font-size: 14px;
+ font-family: Arial, sans-serif;
+ margin-left: 15px;
+}
diff --git a/app/src/main/assets/Homepage/style/cs-homepage-dark.css b/app/src/main/assets/Homepage/style/cs-homepage-dark.css
new file mode 100644
index 00000000..60fa1067
--- /dev/null
+++ b/app/src/main/assets/Homepage/style/cs-homepage-dark.css
@@ -0,0 +1,347 @@
+/*Search*/
+body{
+ opacity: 0;
+ transition: opacity 2s;
+ -webkit-transition: opacity 2s; /* Safari */
+}
+
+.body_fadein {
+ opacity: 1;
+ transition-duration: 0.5s;
+ transition-property: opacity;
+}
+
+.line-style {
+ border: 0;
+ height: 1px;
+ background-image: -webkit-linear-gradient(left, #212121, #0d0d0d, #212121);
+ background-image: -moz-linear-gradient(left, #212121, #0d0d0d, #212121);
+ background-image: -ms-linear-gradient(left, #212121, #0d0d0d, #212121);
+ background-image: -o-linear-gradient(left, #212121, #0d0d0d, #212121);
+ width:40% !important;
+ max-width:500px !important;
+}
+
+.hi_background{
+ background-color : #1c1b21 !important;
+}
+
+.clear_selection{
+ moz-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select:none;
+ user-select:none;
+ -o-user-select:none;
+}
+
+#hi_search_container {
+ margin-top:15vh;
+ margin-bottom: -25px;
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_search_container {
+ margin-top:9vh;
+ }
+}
+
+.hi_logo_text{
+ max-width: 450px;
+ width: 90%;
+ height: auto;
+ display: block;
+ margin-top: -20px;
+ margin-left: auto;
+ margin-right: auto;
+ margin-bottom: 10px;
+}
+
+@media only screen and (max-width: 943px) {
+ .hp_logo_text {
+ max-width: 380px;
+ }
+}
+
+.hi_logo_image{
+ max-width: 150px;
+ width: 30%;
+ height: auto;
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ margin-bottom: 00px;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_logo_image {
+ max-width: 100px;
+ }
+}
+
+.hi_search__logo{
+ text-align: center;
+ color: lightblue;
+ margin-bottom: -17px;
+ font-style: normal;
+ font-variant: normal;
+ line-height: 26px;
+ font-family: helvetica, monospace;
+ font-weight:bold;
+}
+
+.hi_search__search-box{
+ border-radius: 6px !important;
+ align-self: center;
+ height:42px !important;
+ outline: none;
+ color:#cccccc !important;
+ border-color: #3c3946 !important;
+ width:91% !important;
+ max-width: 575px;
+ display:block;
+ font:16px arial,sans-serif;
+ color: black;
+ padding-left:22px;
+ margin: 0 auto 5px;
+ background: #474554 !important;
+
+ box-shadow: 0 1px 1px 0 #535062;
+ -webkit-transition: .0s;
+ -moz-transition: .0s;
+ -o-transition: .0s;
+ transition: .0s;
+}
+
+.hi_reference{
+ align-self: center;
+ height:auto;
+ padding: 10px;
+ padding-bottom: 0px;
+ border-radius: 6px;
+ outline: none;
+
+ border: 1px solid #19181b;
+ box-shadow: 0 3px 3px 0 #0f0e11;
+ width:91% !important;
+ max-width: 575px;
+ display:block;
+ font:16px arial,sans-serif;
+ color: black;
+ margin: 0 auto 0px;
+ margin-top: -15px;
+ margin-bottom: 35px;
+
+ -webkit-transition: .0s;
+ -moz-transition: .0s;
+ -o-transition: .0s;
+ transition: .0s;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_search__search-box {
+ margin-top: 30px;
+ }
+}
+
+.hi_search__search-box:hover {
+ box-shadow: 0 4px 4px -1.5px #1c1b21;
+ -webkit-transition: .07s linear 0s;
+ -moz-transition: .07s linear 0s;
+ -o-transition: .07s linear 0s;
+ transition: .07s linear 0s
+}
+
+.hi_search__search-box:focus{
+ box-shadow: 0 4px 4px -1.5px #1c1b21 !important;
+ -webkit-transition: .07s linear 0s !important;;
+ -moz-transition: .07s linear 0s !important;;
+ -o-transition: .07s linear 0s !important;;
+ transition: .07s linear 0s !important;
+}
+
+/*footer-bar style*/
+.hi_search__logo{
+ margin:0 auto;
+ display:block;
+ width: 90%;
+ max-width: 400px;
+
+}
+
+.hi_search__language-text{
+ font-size: 14px;
+ text-align:center;
+ margin-top: 25px;
+ padding-top: 3px
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_search__language-text {
+ margin-top: 0px;
+ }
+}
+
+.hi_search__language-name{
+ color:#7173f8;
+}
+
+.hi_search__search-button{
+ margin-top: 12px;
+ background-color:#f2f2f2;
+ height: 35px;
+ width:110%;
+ text-align:center;
+ max-width: 130px;
+ border-width: 0;
+ color:#6c6c6c;
+ font-size: 14px;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_search__search-button {
+ width: 0;
+ height: 0;
+ visibility: hidden;
+ }
+}
+
+.hi_search__button-container{
+ display:block;
+ text-align: center;
+ width: 100% !important;
+}
+
+.hi_search__search-button--left-spacing{
+ margin-left: 0
+}
+
+/* Homepage Search Buttons */
+.hi_search__search-button:hover{
+ color : #000000;
+ background: linear-gradient(#f7f7f7,#f1f1f1);
+ border-style: solid;
+ border-width: 1px;
+ border-color:#C4C4C4;
+ border-radius: 4px;
+ cursor:pointer;
+}
+
+#hi_search_button {
+ font-size: 14px;
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_search__search-button {
+ visibility: hidden;
+ }
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_search_button {
+ font-size: 13px;
+ }
+}
+#hi_lucky_button {
+ font-size: 14px;
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_lucky_button {
+ font-size: 13px;
+ }
+}
+
+.hi_reference_website{
+ cursor: pointer;
+}
+
+.hi_container_size
+{
+ min-height: 100% !important;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_container_size {
+ }
+}
+
+
+.hi_loader {
+ border: 4px solid #f3f3f3;
+ border-radius: 50%;
+ border-top: 4px solid #3498db;
+ width: 30px;
+ float: left;
+ height: 30px;
+ -webkit-animation: spin 2s linear infinite; /* Safari */
+ animation: spin 2s linear infinite;
+}
+
+.hi_loader_item{
+ height:10px;
+ border-width:0;
+ color:gray;
+ background-color:#0d0d0d;
+}
+
+.hi_reference_body{
+ margin-left: 0px;
+ line-height: 18px;
+ margin-top: 15px;
+ color: #f0f0f0;
+ font-size: 14px;
+}
+
+.hi_reference_header{
+ margin-left: 50px;
+ padding-left: 10px;
+ border-left: 4px solid #161617 !important;
+ font-weight: bold;
+ font-size: 16px;
+ color: #8cb3d9;
+ height: 40px;
+ padding-top:9px;
+}
+
+.hi_image_container{
+ width: 40px;
+ height: 40px;
+ border-radius: 100px;
+ float: left;
+ background-color: #1a2f42;
+ display: flex;
+}
+
+.hi_reference_image{
+ max-width: 22px; /* Or whatever */
+ max-height: 22px; /* Or whatever */
+ margin: auto; /* Magic! */
+ border-radius: 4px;
+
+ float:left;
+ font-size: 20px;
+ color: #bfbfbf;
+ font-weight: bold;
+}
+
+line-style
+/* Safari */
+@-webkit-keyframes spin {
+ 0% { -webkit-transform: rotate(0deg); }
+ 100% { -webkit-transform: rotate(360deg); }
+}
+
+@keyframes spin {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(360deg); }
+}
+
+.show {
+ opacity: 1;
+ transition: opacity 500ms;
+}
+
+.hide {
+ opacity: 0;
+ transition: opacity 350ms;
+}
\ No newline at end of file
diff --git a/app/src/main/assets/Homepage/style/cs-homepage.css b/app/src/main/assets/Homepage/style/cs-homepage.css
new file mode 100644
index 00000000..d7c91a62
--- /dev/null
+++ b/app/src/main/assets/Homepage/style/cs-homepage.css
@@ -0,0 +1,341 @@
+/*Search*/
+body{
+ opacity: 0;
+ transition: opacity 2s;
+ -webkit-transition: opacity 2s; /* Safari */
+}
+
+.body_fadein {
+ opacity: 1;
+ transition-duration: 0.5s;
+ transition-property: opacity;
+}
+
+.line-style {
+ border: 0;
+ height: 1px;
+ background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
+ background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
+ background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
+ background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
+ width:40% !important;
+ max-width:500px !important;
+}
+
+.clear_selection{
+ moz-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select:none;
+ user-select:none;
+ -o-user-select:none;
+}
+
+#hi_search_container {
+ margin-top:15vh;
+ margin-bottom: -25px;
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_search_container {
+ margin-top:9vh;
+ }
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_search__search-button {
+ visibility: hidden;
+ }
+}
+
+.hi_logo_text{
+ max-width: 450px;
+ width: 90%;
+ height: auto;
+ display: block;
+ margin-top: -20px;
+ margin-left: auto;
+ margin-right: auto;
+ margin-bottom: 10px;
+}
+
+@media only screen and (max-width: 943px) {
+ .hp_logo_text {
+ max-width: 380px;
+ }
+}
+
+.hi_logo_image{
+ max-width: 150px;
+ width: 30%;
+ height: auto;
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ margin-bottom: 00px;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_logo_image {
+ max-width: 100px;
+ }
+}
+
+.hi_search__logo{
+ text-align: center;
+ color: lightblue;
+ margin-bottom: -17px;
+ font-style: normal;
+ font-variant: normal;
+ line-height: 26px;
+ font-family: helvetica, monospace;
+ font-weight:bold;
+}
+
+.hi_search__search-box{
+ border-radius: 8px !important;
+ align-self: center;
+ height:42px !important;
+ outline: none;
+
+ border-color: #e7e7e7;
+ width:91% !important;
+ max-width: 575px;
+ display:block;
+ font:16px arial,sans-serif;
+ color: black;
+ padding-left:22px;
+ margin: 0 auto 5px;
+
+ box-shadow: 0 1px 1px 0 #cccccc;
+ -webkit-transition: .0s;
+ -moz-transition: .0s;
+ -o-transition: .0s;
+ transition: .0s;
+}
+
+.hi_reference{
+ align-self: center;
+ height:auto;
+ padding: 10px;
+ padding-bottom: 0px;
+ border-radius: 6px;
+ outline: none;
+
+ border: 1px solid #f0f0f0;
+ box-shadow: 0 3px 3px 0 #cccccc;
+ width:91% !important;
+ max-width: 575px;
+ display:block;
+ font:16px arial,sans-serif;
+ color: black;
+ margin: 0 auto 0px;
+ margin-top: -15px;
+ margin-bottom: 35px;
+
+ -webkit-transition: .0s;
+ -moz-transition: .0s;
+ -o-transition: .0s;
+ transition: .0s;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_search__search-box {
+ margin-top: 30px;
+ }
+}
+
+.hi_search__search-box:hover {
+ box-shadow: 0 4px 4px -1.5px #cccccc;
+ -webkit-transition: .07s linear 0s;
+ -moz-transition: .07s linear 0s;
+ -o-transition: .07s linear 0s;
+ transition: .07s linear 0s
+}
+
+.hi_search__search-box:focus{
+ box-shadow: 0 4px 4px -1.5px #cccccc !important;
+ -webkit-transition: .07s linear 0s !important;;
+ -moz-transition: .07s linear 0s !important;;
+ -o-transition: .07s linear 0s !important;;
+ transition: .07s linear 0s !important;
+}
+
+/*footer-bar style*/
+.hi_search__logo{
+ margin:0 auto;
+ display:block;
+ width: 90%;
+ max-width: 400px;
+
+}
+
+.hi_search__language-text{
+ font-size: 14px;
+ text-align:center;
+ margin-top: 25px;
+ padding-top: 3px
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_search__language-text {
+ margin-top: 0px;
+ }
+}
+
+.hi_search__language-name{
+ color:#7173f8;
+}
+
+.hi_search__search-button{
+ margin-top: 12px;
+ background-color:#f2f2f2;
+ height: 35px;
+ width:110%;
+ text-align:center;
+ max-width: 130px;
+ border-width: 0;
+ color:#6c6c6c;
+ font-size: 14px;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_search__search-button {
+ width: 0;
+ height: 0;
+ }
+}
+
+.hi_search__button-container{
+ display:block;
+ text-align: center;
+ width: 100% !important;
+}
+
+.hi_search__search-button--left-spacing{
+ margin-left: 0
+}
+
+/* Homepage Search Buttons */
+.hi_search__search-button:hover{
+ color : #000000;
+ background: linear-gradient(#f7f7f7,#f1f1f1);
+ border-style: solid;
+ border-width: 1px;
+ border-color:#C4C4C4;
+ border-radius: 4px;
+ cursor:pointer;
+}
+
+#hi_search_button {
+ font-size: 14px;
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_search_button {
+ font-size: 13px;
+ }
+}
+#hi_lucky_button {
+ font-size: 14px;
+}
+
+@media only screen and (max-width: 943px) {
+ #hi_lucky_button {
+ font-size: 13px;
+ }
+}
+
+.hi_reference_website{
+ cursor: pointer;
+}
+
+.hi_container_size
+{
+ min-height: 100% !important;
+}
+
+@media only screen and (max-width: 943px) {
+ .hi_container_size {
+ }
+}
+
+
+.hi_loader {
+ border: 4px solid #f3f3f3;
+ border-radius: 50%;
+ border-top: 4px solid #3498db;
+ width: 30px;
+ float: left;
+ height: 30px;
+ -webkit-animation: spin 2s linear infinite; /* Safari */
+ animation: spin 2s linear infinite;
+}
+
+.hi_loader_item{
+ height:10px;
+ border-width:0;
+ color:gray;
+ background-color:#cccccc;
+}
+
+.hi_reference_body{
+ margin-left: 0px;
+ line-height: 18px;
+ margin-top: 15px;
+ color: #8c8c8c;
+ font-size: 14px;
+}
+
+.hi_reference_header{
+ margin-left: 50px;
+ padding-left: 10px;
+ border-left: 4px solid #ecf2f9;
+ font-weight: bold;
+ font-size: 16px;
+ color: #4080bf;
+ height: 40px;
+ padding-top:9px;
+}
+
+.hi_image_container{
+ width: 40px;
+ height: 40px;
+ border-radius: 100px;
+ float: left;
+ background-color: #f5f5f5;
+ display: flex;
+}
+
+.hi_reference_image{
+ max-width: 22px; /* Or whatever */
+ max-height: 22px; /* Or whatever */
+ margin: auto; /* Magic! */
+ border-radius: 4px;
+
+ float:left;
+ font-size: 20px;
+ color: #bfbfbf;
+ font-weight: bold;
+}
+
+line-style
+/* Safari */
+@-webkit-keyframes spin {
+ 0% { -webkit-transform: rotate(0deg); }
+ 100% { -webkit-transform: rotate(360deg); }
+}
+
+@keyframes spin {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(360deg); }
+}
+
+.show {
+ opacity: 1;
+ transition: opacity 500ms;
+}
+
+.hide {
+ opacity: 0;
+ transition: opacity 350ms;
+}
\ No newline at end of file
diff --git a/app/src/main/assets/Homepage/style/cs-light_header.css b/app/src/main/assets/Homepage/style/cs-light_header.css
new file mode 100644
index 00000000..02e1fecb
--- /dev/null
+++ b/app/src/main/assets/Homepage/style/cs-light_header.css
@@ -0,0 +1,71 @@
+@media only screen and (max-width: 943px) {
+ .lh_light_header__catagory_image {
+ display : none
+ }
+}
+
+@media only screen and (max-width: 943px) {
+ .lh_light_header__catagory_bold_mobile {
+ font-weight: bold;
+ color: #b3b3b3 !important;
+ }
+}
+
+.lh_light_header{
+ color:#000000;
+ text-align: right;
+ padding-top: 0px;
+ border-bottom-color:#efefef;
+ padding-top: 10px;
+ padding-bottom: 15px;
+ border-style: solid;border-right-width: 0;
+ border-left-width: 0;border-top-width: 0;
+ border-bottom-width: 1px;
+}
+
+@media only screen and (max-width: 943px) {
+ .lh_light_header {
+ border-bottom-width: 1px;
+ padding-bottom: 15px;
+ }
+}
+
+#lh_light_header_identifier {
+ background-color:#ffffff;
+}
+
+@media only screen and (max-width: 943px) {
+ #lh_light_header_identifier {
+ background-color:#ffffff;
+ }
+}
+
+.lh_light_header__bold{
+ font-weight: bold;
+ color: #1967d2 !important;
+}
+
+.lh_light_header__catagory-spacing-right{
+ margin-right: 15px;
+}
+
+.lh_light_header__catagory{
+ cursor: pointer;
+ font-size: 14px;
+ color: black;
+ padding: 13px 9px 14px;
+}
+
+/*light-header events*/
+.lh_light_header__catagory:hover{
+ color: darkslategray;
+ text-decoration: none !important;
+ border-bottom: 4px solid lightslategray;
+ background: whitesmoke;
+}
+.lh_light_header__catagory:focus{
+ color: darkslategray;
+ text-decoration: none !important;
+ border-bottom: 4px solid lightslategray;
+ background: whitesmoke;
+}