From c425e5cce7423d7e27031b866670dcb11801fa5e Mon Sep 17 00:00:00 2001 From: NateNear Date: Fri, 14 Oct 2022 00:08:23 +0530 Subject: [PATCH] Changes Done --- index.html | 22 +++++++++++++++---- src/css/style.css | 55 +++++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 71 insertions(+), 6 deletions(-) diff --git a/index.html b/index.html index 440658e..83f489d 100644 --- a/index.html +++ b/index.html @@ -1,8 +1,8 @@ - + - + @@ -26,7 +26,9 @@ - + +
+ - + @@ -285,6 +287,18 @@
Subscribe to our newsletter
+ diff --git a/src/css/style.css b/src/css/style.css index f0a6d21..1e6b3fa 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -11,6 +11,57 @@ v996-008 premium src: url("../../res/fonts/MagilioRegular-8Mxvg.otf"); } */ + /* Center the loader */ + #loader { + position: absolute; + left: 50%; + top: 50%; + z-index: 1; + width: 120px; + height: 120px; + margin: -76px 0 0 -76px; + border: 16px solid #f3f3f3; + border-radius: 50%; + border-top: 16px solid #3498db; + -webkit-animation: spin 2s linear infinite; + animation: spin 2s linear infinite; +} + +@-webkit-keyframes spin { + 0% { -webkit-transform: rotate(0deg); } + 100% { -webkit-transform: rotate(360deg); } +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + + + /* Add animation to "page content" */ + .animate-bottom { + position: relative; + -webkit-animation-name: animatebottom; + -webkit-animation-duration: 1s; + animation-name: animatebottom; + animation-duration: 1s + } + + @-webkit-keyframes animatebottom { + from { bottom:-100px; opacity:0 } + to { bottom:0px; opacity:1 } + } + + @keyframes animatebottom { + from{ bottom:-100px; opacity:0 } + to{ bottom:0; opacity:1 } + } + + #myDiv { + display: none; + text-align: center; + } + body { padding-top: 35px; /* background-image: url("https://images.pexels.com/photos/4202924/pexels-photo-4202924.jpeg?cs=srgb&dl=pexels-karolina-grabowska-4202924.jpg&fm=jpg"); */ @@ -59,7 +110,7 @@ body { /* add space above to give a little room between grid and header */ .ui.grid { margin-top: 20px; -} +} .card:hover { filter: brightness(100%); @@ -77,4 +128,4 @@ body { .offcanvas-collapse, .open { background: #076ae1; -} \ No newline at end of file +}