diff --git a/css/output.css b/css/output.css index a244b87..af082c1 100644 --- a/css/output.css +++ b/css/output.css @@ -560,8 +560,8 @@ video { width: 100%; margin-right: auto; margin-left: auto; - padding-right: 20px; - padding-left: 20px; + padding-right: 30px; + padding-left: 30px; } @media (min-width: 640px){ @@ -596,10 +596,6 @@ video { } } -.fixed{ - position: fixed; -} - .absolute{ position: absolute; } @@ -620,10 +616,26 @@ video { bottom: 2.5rem; } +.bottom-32{ + bottom: 8rem; +} + +.left-12{ + left: 3rem; +} + +.right-12{ + right: 3rem; +} + .right-8{ right: 2rem; } +.top-10{ + top: 2.5rem; +} + .top-5{ top: 1.25rem; } @@ -653,6 +665,10 @@ video { margin-bottom: 1rem; } +.inline-block{ + display: inline-block; +} + .flex{ display: flex; } @@ -707,6 +723,12 @@ video { margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse))); } +.space-y-6 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)); +} + .space-y-8 > :not([hidden]) ~ :not([hidden]){ --tw-space-y-reverse: 0; margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); @@ -717,6 +739,10 @@ video { overflow: hidden; } +.rounded-lg{ + border-radius: 0.5rem; +} + .bg-color-blob{ --tw-bg-opacity: 1; background-color: rgb(164 39 223 / var(--tw-bg-opacity, 1)); @@ -747,11 +773,21 @@ video { padding-right: 1rem; } +.px-6{ + padding-left: 1.5rem; + padding-right: 1.5rem; +} + .py-20{ padding-top: 5rem; padding-bottom: 5rem; } +.py-3{ + padding-top: 0.75rem; + padding-bottom: 0.75rem; +} + .py-32{ padding-top: 8rem; padding-bottom: 8rem; @@ -789,6 +825,11 @@ video { line-height: 2.5rem; } +.text-6xl{ + font-size: 3.75rem; + line-height: 1; +} + .text-lg{ font-size: 1.125rem; line-height: 1.75rem; @@ -836,10 +877,18 @@ video { transition-duration: 150ms; } +.duration-200{ + transition-duration: 200ms; +} + .duration-300{ transition-duration: 300ms; } +.ease-in{ + transition-timing-function: cubic-bezier(0.4, 0, 1, 1); +} + .nav-link{ transition-duration: 300ms; transition-timing-function: cubic-bezier(0.4, 0, 1, 1); @@ -937,9 +986,14 @@ video { font-weight: 700; } +.hover\:bg-color-secondary:hover{ + --tw-bg-opacity: 1; + background-color: rgb(255 125 59 / var(--tw-bg-opacity, 1)); +} + @media (min-width: 768px){ - .md\:hidden{ - display: none; + .md\:ml-20{ + margin-left: 5rem; } .md\:w-1\/2{ @@ -958,6 +1012,18 @@ video { gap: 2rem; } + .md\:space-x-6 > :not([hidden]) ~ :not([hidden]){ + --tw-space-x-reverse: 0; + margin-right: calc(1.5rem * var(--tw-space-x-reverse)); + margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse))); + } + + .md\:space-y-0 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); + } + .md\:pr-10{ padding-right: 2.5rem; } @@ -966,6 +1032,10 @@ video { text-align: left; } + .md\:text-start{ + text-align: start; + } + .md\:text-2xl{ font-size: 1.5rem; line-height: 2rem; diff --git a/index.html b/index.html index a9a74b2..e70fedc 100644 --- a/index.html +++ b/index.html @@ -17,8 +17,8 @@ -
-