@ -1,5 +1,5 @@
/ *
! tailwindcss v3 . 0 . 18 | MIT License | https : / / tailwindcss . com
! tailwindcss v3 . 3 . 6 | MIT License | https : / / tailwindcss . com
* /
/ *
@ -30,6 +30,8 @@
2 . Prevent adjustments of font size after orientation changes in iOS .
3 . Use a more readable tab size .
4 . Use the user ' s configured ` sans ` font-family by default .
5 . Use the user ' s configured ` sans ` font-feature-settings by default .
6 . Use the user ' s configured ` sans ` font-variation-settings by default .
* /
html {
@ -44,6 +46,10 @@ html {
/* 3 */
font-family : ui-sans-serif , system-ui , -apple-system , BlinkMacSystemFont , "Segoe UI" , Roboto , "Helvetica Neue" , Arial , "Noto Sans" , sans-serif , "Apple Color Emoji" , "Segoe UI Emoji" , "Segoe UI Symbol" , "Noto Color Emoji" ;
/* 4 */
font-feature-settings : normal ;
/* 5 */
font-variation-settings : normal ;
/* 6 */
}
/ *
@ -115,8 +121,10 @@ strong {
}
/ *
1 . Use the user ' s configured ` mono ` font family by default .
2 . Correct the odd ` em ` font sizing in all browsers .
1 . Use the user ' s configured ` mono ` font-family by default .
2 . Use the user ' s configured ` mono ` font-feature-settings by default .
3 . Use the user ' s configured ` mono ` font-variation-settings by default .
4 . Correct the odd ` em ` font sizing in all browsers .
* /
code ,
@ -125,8 +133,12 @@ samp,
pre {
font-family : ui-monospace , SFMono-Regular , Menlo , Monaco , Consolas , "Liberation Mono" , "Courier New" , monospace ;
/* 1 */
font-size : 1em ;
font-feature-settings : normal ;
/* 2 */
font-variation-settings : normal ;
/* 3 */
font-size : 1em ;
/* 4 */
}
/ *
@ -185,8 +197,14 @@ select,
textarea {
font-family : inherit ;
/* 1 */
font-feature-settings : inherit ;
/* 1 */
font-variation-settings : inherit ;
/* 1 */
font-size : 100 % ;
/* 1 */
font-weight : inherit ;
/* 1 */
line-height : inherit ;
/* 1 */
color : inherit ;
@ -333,6 +351,14 @@ menu {
padding : 0 ;
}
/ *
Reset default styling for dialogs .
* /
dialog {
padding : 0 ;
}
/ *
Prevent resizing textareas horizontally by default .
* /
@ -353,13 +379,6 @@ input::-moz-placeholder, textarea::-moz-placeholder {
/* 2 */
}
input : -ms-input-placeholder , textarea : -ms-input-placeholder {
opacity : 1 ;
/* 1 */
color : # 9ca3af ;
/* 2 */
}
input :: placeholder ,
textarea :: placeholder {
opacity : 1 ;
@ -415,15 +434,15 @@ video {
height : auto ;
}
/ *
Ensure the default browser behavior of the ` hidden ` attribute .
* /
/* Make elements with the HTML hidden attribute stay hidden by default */
[ hidden ] {
display : none ;
}
* , :: before , :: after {
--tw-border-spacing-x : 0 ;
--tw-border-spacing-y : 0 ;
--tw-translate-x : 0 ;
--tw-translate-y : 0 ;
--tw-rotate : 0 ;
@ -435,6 +454,59 @@ Ensure the default browser behavior of the `hidden` attribute.
--tw-pan-y : ;
--tw-pinch-zoom : ;
--tw-scroll-snap-strictness : proximity ;
--tw-gradient-from-position : ;
--tw-gradient-via-position : ;
--tw-gradient-to-position : ;
--tw-ordinal : ;
--tw-slashed-zero : ;
--tw-numeric-figure : ;
--tw-numeric-spacing : ;
--tw-numeric-fraction : ;
--tw-ring-inset : ;
--tw-ring-offset-width : 0px ;
--tw-ring-offset-color : # fff ;
--tw-ring-color : rgb ( 59 130 246 / 0 . 5 ) ;
--tw-ring-offset-shadow : 0 0 # 0000 ;
--tw-ring-shadow : 0 0 # 0000 ;
--tw-shadow : 0 0 # 0000 ;
--tw-shadow-colored : 0 0 # 0000 ;
--tw-blur : ;
--tw-brightness : ;
--tw-contrast : ;
--tw-grayscale : ;
--tw-hue-rotate : ;
--tw-invert : ;
--tw-saturate : ;
--tw-sepia : ;
--tw-drop-shadow : ;
--tw-backdrop-blur : ;
--tw-backdrop-brightness : ;
--tw-backdrop-contrast : ;
--tw-backdrop-grayscale : ;
--tw-backdrop-hue-rotate : ;
--tw-backdrop-invert : ;
--tw-backdrop-opacity : ;
--tw-backdrop-saturate : ;
--tw-backdrop-sepia : ;
}
:: backdrop {
--tw-border-spacing-x : 0 ;
--tw-border-spacing-y : 0 ;
--tw-translate-x : 0 ;
--tw-translate-y : 0 ;
--tw-rotate : 0 ;
--tw-skew-x : 0 ;
--tw-skew-y : 0 ;
--tw-scale-x : 1 ;
--tw-scale-y : 1 ;
--tw-pan-x : ;
--tw-pan-y : ;
--tw-pinch-zoom : ;
--tw-scroll-snap-strictness : proximity ;
--tw-gradient-from-position : ;
--tw-gradient-via-position : ;
--tw-gradient-to-position : ;
--tw-ordinal : ;
--tw-slashed-zero : ;
--tw-numeric-figure : ;
@ -526,9 +598,9 @@ Ensure the default browser behavior of the `hidden` attribute.
bottom : 1rem ;
}
. my-5 {
margin-top : 1 . 2 5rem ;
margin-bottom : 1 . 2 5rem ;
. mx-2 {
margin-left : 0 . 5rem ;
margin-right : 0 . 5rem ;
}
. my-2 {
@ -536,9 +608,9 @@ Ensure the default browser behavior of the `hidden` attribute.
margin-bottom : 0 . 5rem ;
}
. mx-2 {
margin-left : 0 . 5rem ;
margin-right : 0 . 5rem ;
. my-5 {
margin-top : 1 . 2 5rem ;
margin-bottom : 1 . 2 5rem ;
}
. ml-auto {
@ -577,8 +649,8 @@ Ensure the default browser behavior of the `hidden` attribute.
min-height : 100vh ;
}
. w-full {
width : 100 % ;
. w-3 \ / 4 {
width : 75 % ;
}
. w-4 \ / 5 {
@ -589,8 +661,8 @@ Ensure the default browser behavior of the `hidden` attribute.
width : 83 . 333333 % ;
}
. w-3 \ / 4 {
width : 75 % ;
. w-full {
width : 100 % ;
}
. min-w- \ [ 60vw \ ] {
@ -617,81 +689,76 @@ Ensure the default browser behavior of the `hidden` attribute.
justify-content : center ;
}
. rounded-xl {
border-radius : 0 . 75rem ;
}
. rounded-md {
border-radius : 0 . 375rem ;
. rounded-2xl {
border-radius : 1rem ;
}
. rounded-3xl {
border-radius : 1 . 5rem ;
}
. rounded-2xl {
border-radius : 1 rem;
. rounded-md {
border-radius : 0 . 375 rem;
}
. bg-transparent {
background-color : transparent ;
. rounded-xl {
border-radius : 0 . 75rem ;
}
. bg-mycol2 {
. bg- \ [ \ # 000000 \ ] {
--tw-bg-opacity : 1 ;
background-color : rgb ( 22 21 36 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 0 0 0 / var ( --tw-bg-opacity ) ) ;
}
. bg-indigo-900 {
. bg- \ [ \ # 283F3B \ ] {
--tw-bg-opacity : 1 ;
background-color : rgb ( 49 46 12 9 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 40 63 5 9 / var ( --tw-bg-opacity ) ) ;
}
. bg-white {
. bg- \ [ \ # D0E7A6 \ ] {
--tw-bg-opacity : 1 ;
background-color : rgb ( 255 255 255 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 208 231 166 / var ( --tw-bg-opacity ) ) ;
}
. bg- \ [ \ # D0 E7A6 \ ] {
. bg- \ [ \ # E94F3 7 \ ] {
--tw-bg-opacity : 1 ;
background-color : rgb ( 208 231 166 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 233 79 55 / var ( --tw-bg-opacity ) ) ;
}
. bg- \ [ \ # 283F3B \ ] {
. bg-indigo-900 {
--tw-bg-opacity : 1 ;
background-color : rgb ( 40 63 5 9 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 49 46 12 9 / var ( --tw-bg-opacity ) ) ;
}
. bg- \ [ \ # E94F37 \ ] {
. bg-mycol2 {
--tw-bg-opacity : 1 ;
background-color : rgb ( 233 79 55 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 22 21 36 / var ( --tw-bg-opacity ) ) ;
}
. bg- \ [ url \ ( \ '\.\.\/img\/bground1\.jpg\' \ ) \ ] {
background-image : url ( '../img/bground1.jpg' ) ;
. bg-transparent {
background-color : transparent ;
}
. bg- \ [ url \ ( \ '\.\.\/\.\.\/img\/bground1\.jpg\' \ ) \ ] {
background-image : url ( '../../img/bground1.jpg' ) ;
. bg-white {
--tw-bg-opacity : 1 ;
background-color : rgb ( 255 255 255 / var ( --tw-bg-opacity ) ) ;
}
. bg-cover {
background-size : cover ;
. bg- \ [ url \ ( \ '\.\.\/\.\.\/img\/bground1\.jpg\' \ ) \ ] {
background-image : url ( '../../img/bground1.jpg' ) ;
}
. py-10 {
padding-top : 2 . 5rem ;
padding-bottom : 2 . 5rem ;
. bg- \ [ url \ ( \ '\.\.\/img\/bground2\.png\' \ ) \ ] {
background-image : url ( '../img/bground2.png' ) ;
}
. px-8 {
padding-left : 2rem ;
padding-right : 2rem ;
. bg-cover {
background-size : cover ;
}
. py-5 {
padding-top : 1 . 2 5rem ;
padding-bottom : 1 . 2 5rem ;
. px-10 {
padding-left : 2 . 5rem ;
padding-right : 2 . 5rem ;
}
. px-2 {
@ -699,11 +766,6 @@ Ensure the default browser behavior of the `hidden` attribute.
padding-right : 0 . 5rem ;
}
. py-1 {
padding-top : 0 . 25rem ;
padding-bottom : 0 . 25rem ;
}
. px-3 {
padding-left : 0 . 75rem ;
padding-right : 0 . 75rem ;
@ -714,9 +776,19 @@ Ensure the default browser behavior of the `hidden` attribute.
padding-right : 1 . 25rem ;
}
. px-10 {
padding-left : 2 . 5rem ;
padding-right : 2 . 5rem ;
. px-8 {
padding-left : 2rem ;
padding-right : 2rem ;
}
. py-1 {
padding-top : 0 . 25rem ;
padding-bottom : 0 . 25rem ;
}
. py-10 {
padding-top : 2 . 5rem ;
padding-bottom : 2 . 5rem ;
}
. py-3 {
@ -724,28 +796,41 @@ Ensure the default browser behavior of the `hidden` attribute.
padding-bottom : 0 . 75rem ;
}
. py-5 {
padding-top : 1 . 25rem ;
padding-bottom : 1 . 25rem ;
}
. pb-10 {
padding-bottom : 2 . 5rem ;
}
. pr-5 {
padding-right : 1 . 2 5rem ;
. pb-2 {
padding-bottom : 0 . 5rem ;
}
. pb-7 {
padding-bottom : 1 . 75rem ;
. pb-3 {
padding-bottom : 0 . 75rem ;
}
. pl -5 {
padding-left : 1 . 25rem ;
. pb -5 {
padding-bottom : 1 . 25rem ;
}
. pb-6 {
padding-bottom : 1 . 5rem ;
}
. pb-3 {
padding-bottom : 0 . 75rem ;
. pb-7 {
padding-bottom : 1 . 75rem ;
}
. pl-5 {
padding-left : 1 . 25rem ;
}
. pr-5 {
padding-right : 1 . 25rem ;
}
. text-left {
@ -760,15 +845,6 @@ Ensure the default browser behavior of the `hidden` attribute.
font-family : manrope ;
}
. text- \ [ 3em \ ] {
font-size : 3em ;
}
. text-sm {
font-size : 0 . 875rem ;
line-height : 1 . 25rem ;
}
. text-3xl {
font-size : 1 . 875rem ;
line-height : 2 . 25rem ;
@ -782,11 +858,20 @@ Ensure the default browser behavior of the `hidden` attribute.
font-size : 2em ;
}
. text- \ [ 3em \ ] {
font-size : 3em ;
}
. text-lg {
font-size : 1 . 125rem ;
line-height : 1 . 75rem ;
}
. text-sm {
font-size : 0 . 875rem ;
line-height : 1 . 25rem ;
}
. text-xl {
font-size : 1 . 25rem ;
line-height : 1 . 75rem ;
@ -796,10 +881,6 @@ Ensure the default browser behavior of the `hidden` attribute.
font-weight : 900 ;
}
. font-normal {
font-weight : 400 ;
}
. font-bold {
font-weight : 700 ;
}
@ -808,13 +889,17 @@ Ensure the default browser behavior of the `hidden` attribute.
font-weight : 800 ;
}
. font-normal {
font-weight : 400 ;
}
. tracking-wide {
letter-spacing : 0 . 025em ;
}
. text-white {
. text-black {
--tw-text-opacity : 1 ;
color : rgb ( 255 255 255 / var ( --tw-text-opacity ) ) ;
color : rgb ( 0 0 0 / var ( --tw-text-opacity ) ) ;
}
. text-red-300 {
@ -822,14 +907,13 @@ Ensure the default browser behavior of the `hidden` attribute.
color : rgb ( 252 165 165 / var ( --tw-text-opacity ) ) ;
}
. text-black {
. text-white {
--tw-text-opacity : 1 ;
color : rgb ( 0 0 0 / var ( --tw-text-opacity ) ) ;
color : rgb ( 255 255 255 / var ( --tw-text-opacity ) ) ;
}
. underline {
-webkit-text-decoration-line : underline ;
text-decoration-line : underline ;
text-decoration-line : underline ;
}
. shadow {
@ -850,6 +934,10 @@ Ensure the default browser behavior of the `hidden` attribute.
outline-width : 2px ;
}
. outline-8 {
outline-width : 8px ;
}
. outline-white {
outline-color : # fff ;
}
@ -866,9 +954,9 @@ Ensure the default browser behavior of the `hidden` attribute.
}
. transition {
transition-property : color , background-color , border-color , fill , stroke , opacity , box-shadow , transform , filter , -webkit-text-decoration-colo r , -webkit-backdrop-filter ;
transition-property : color , background-color , border-color , text-decoration-color , fill , stroke , opacity , box-shadow , transform , filter , -webkit-backdrop-filter ;
transition-property : color , background-color , border-color , text-decoration-color , fill , stroke , opacity , box-shadow , transform , filter , backdrop-filter ;
transition-property : color , background-color , border-color , text-decoration-color , fill , stroke , opacity , box-shadow , transform , filter , backdrop-filter , -webkit-text-decoration-color , -webkit- backdrop-filter ;
transition-property : color , background-color , border-color , text-decoration-color , fill , stroke , opacity , box-shadow , transform , filter , backdrop-filter , -webkit-backdrop-filter ;
transition-timing-function : cubic-bezier ( 0 . 4 , 0 , 0 . 2 , 1 ) ;
transition-duration : 150ms ;
}
@ -876,7 +964,7 @@ Ensure the default browser behavior of the `hidden` attribute.
@ font-face {
font-family : 'manrope' ;
src : url ( './manrope .ttf' ) ;
src : url ( './jetbrains .ttf' ) ;
}
body {
@ -965,61 +1053,21 @@ p{
}
. wave {
-webkit-animation-name : wave-animation ;
animation-name : wave-animation ;
-webkit-animation-duration : 2 . 5s ;
animation-duration : 2 . 5s ;
-webkit-animation-iteration-count : infinite ;
animation-iteration-count : infinite ;
animation-name : wave-animation ;
animation-duration : 2 . 5s ;
animation-iteration-count : infinite ;
transform-origin : 70 % 70 % ;
display : inline-block ;
}
. emohi : hover {
-webkit-animation-name : wave-animation ;
animation-name : wave-animation ;
-webkit-animation-duration : 2 . 5s ;
animation-duration : 2 . 5s ;
-webkit-animation-iteration-count : 1 ;
animation-iteration-count : 1 ;
animation-name : wave-animation ;
animation-duration : 2 . 5s ;
animation-iteration-count : 1 ;
transform-origin : 70 % 70 % ;
display : inline-block ;
}
@ -webkit-keyframes wave-animation {
0 % {
transform : rotate ( 0 . 0deg )
}
10 % {
transform : rotate ( 14 . 0deg )
}
20 % {
transform : rotate ( -8 . 0deg )
}
30 % {
transform : rotate ( 14 . 0deg )
}
40 % {
transform : rotate ( -4 . 0deg )
}
50 % {
transform : rotate ( 10 . 0deg )
}
60 % {
transform : rotate ( 0 . 0deg )
}
100 % {
transform : rotate ( 0 . 0deg )
}
}
@ keyframes wave-animation {
0 % {
transform : rotate ( 0 . 0deg )
@ -1106,14 +1154,14 @@ button:hover{
font-size : large ;
}
. hover \ : bg-indigo-900 : hover {
. hover \ : bg- \ [ \ # 283F3B \ ] : hover {
--tw-bg-opacity : 1 ;
background-color : rgb ( 49 46 12 9 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 40 63 5 9 / var ( --tw-bg-opacity ) ) ;
}
. hover \ : bg- \ [ \ # 283F3B \ ] : hover {
. hover \ : bg-indigo-900 : hover {
--tw-bg-opacity : 1 ;
background-color : rgb ( 40 63 5 9 / var ( --tw-bg-opacity ) ) ;
background-color : rgb ( 49 46 12 9 / var ( --tw-bg-opacity ) ) ;
}
@ media ( min-width : 640px ) {
@ -1143,16 +1191,16 @@ button:hover{
background-color : transparent ;
}
. md \ : py-3 {
padding-top : 0 . 75rem ;
padding-bottom : 0 . 75rem ;
}
. md \ : px-7 {
padding-left : 1 . 75rem ;
padding-right : 1 . 75rem ;
}
. md \ : py-3 {
padding-top : 0 . 75rem ;
padding-bottom : 0 . 75rem ;
}
. md \ : text-xl {
font-size : 1 . 25rem ;
line-height : 1 . 75rem ;