forked from khushi-joshi-05/Food-ordering-website
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
e11dfd8
commit 0e9857c
Showing
1 changed file
with
80 additions
and
61 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,87 +1,106 @@ | ||
| body { | ||
| font-family: 'Poppins', sans-serif; | ||
| background-image: linear-gradient(115deg, rgba(126, 3, 3, 0.696), rgba(7, 5, 7, 0.67)), url(../Images/homeSliderImages/home-slider-3.jpg); | ||
| color: #fff; | ||
| margin: 0; | ||
| background-size: cover; | ||
| background-position: center; | ||
| font-family: 'Poppins', sans-serif; | ||
| background-image: linear-gradient(115deg, rgba(126, 3, 3, 0.696), rgba(7, 5, 7, 0.67)), url(../Images/homeSliderImages/home-slider-3.jpg); | ||
| color: #fff; | ||
| margin: 0; | ||
| background-size: cover; | ||
| background-position: center; | ||
| overflow-x: hidden; | ||
| } | ||
|
|
||
| /* Scrollbar track */ | ||
| ::-webkit-scrollbar-track { | ||
| -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.6); | ||
| background-image: linear-gradient(to top, rgb(246, 10, 10), rgb(248, 145, 49), rgb(236, 239, 56)); | ||
| } | ||
|
|
||
| /* Scrollbar */ | ||
| ::-webkit-scrollbar { | ||
| width: 12px; | ||
| } | ||
|
|
||
| /* Scrollbar thumb */ | ||
| ::-webkit-scrollbar-thumb { | ||
| background-color: #ff0707; | ||
| border-radius: 10px; | ||
| border: 0.3px solid white; | ||
| background-image: -webkit-linear-gradient( | ||
| 90deg, | ||
| rgb(20, 21, 12) 0%, | ||
| rgb(0, 0, 0) 25%, | ||
| transparent 100%, | ||
| rgb(247, 4, 4) 75%, | ||
| transparent | ||
| ); | ||
| transition: background-color 0.3s; | ||
| } | ||
|
|
||
| -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.6); | ||
| background-image: linear-gradient(to top, rgb(246, 10, 10), rgb(248, 145, 49), rgb(236, 239, 56)); | ||
| overflow-x: hidden; | ||
|
|
||
| ::-webkit-scrollbar-thumb:hover { | ||
| background-color: #dc3545; | ||
| cursor: pointer; | ||
| } | ||
| } | ||
|
|
||
| .main-container { | ||
| width: 65%; | ||
| margin: 20px auto; | ||
| padding: 20px; | ||
| background: linear-gradient(to top , rgb(255, 211, 145), #ffffff); | ||
| box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); | ||
| border-radius: 10px; | ||
|
|
||
| /* Scrollbar */ | ||
| ::-webkit-scrollbar { | ||
| width: 12px; | ||
| overflow-x: hidden; | ||
|
|
||
| } | ||
|
|
||
| /* Scrollbar thumb */ | ||
| ::-webkit-scrollbar-thumb { | ||
| background-color: #ff0707; | ||
| border-radius: 10px; | ||
| border: 0.3px solid white; | ||
| background-image: -webkit-linear-gradient(90deg, | ||
| rgb(20, 21, 12) 0%, | ||
| rgb(0, 0, 0) 25%, | ||
| transparent 100%, | ||
| rgb(247, 4, 4) 75%, | ||
| transparent); | ||
| transition: background-color 0.3s; | ||
| overflow-x: hidden; | ||
|
|
||
| } | ||
|
|
||
|
|
||
| ::-webkit-scrollbar-thumb:hover { | ||
| background-color: #dc3545; | ||
| cursor: pointer; | ||
| } | ||
|
|
||
| .main-container { | ||
| width: 65%; | ||
| margin: 20px auto; | ||
| padding: 20px; | ||
| background: linear-gradient(to top, rgb(255, 211, 145), #ffffff); | ||
| box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); | ||
| border-radius: 10px; | ||
| overflow-x: hidden; | ||
| } | ||
|
|
||
| .main-container h1 { | ||
| text-align: center; | ||
| font-weight: bold; | ||
| font-size: 44px; | ||
| color: #980816; | ||
| text-align: center; | ||
| font-weight: bold; | ||
| font-size: 44px; | ||
| color: #980816; | ||
| } | ||
|
|
||
| .main-container hr { | ||
| border: 0; | ||
| border-top: 1px solid #980816; | ||
| margin: 20px 0; | ||
| border: 0; | ||
| border-top: 1px solid #980816; | ||
| margin: 20px 0; | ||
| } | ||
|
|
||
| .main-container h2 { | ||
| color: #dc3545; | ||
| /* background-color: #ff6666; */ | ||
| border-radius: 5px; | ||
| font-size: 26px; | ||
| color: #dc3545; | ||
| /* background-color: #ff6666; */ | ||
| border-radius: 5px; | ||
| font-size: 26px; | ||
| } | ||
|
|
||
| .main-container p { | ||
| color: #333; | ||
| font-size: 19px; | ||
| color: #333; | ||
| font-size: 19px; | ||
| } | ||
|
|
||
| .main-container ul { | ||
| list-style-type: disc; | ||
| padding-left: 20px; | ||
| color: #333; | ||
| list-style-type: disc; | ||
| padding-left: 20px; | ||
| color: #333; | ||
| } | ||
|
|
||
|
|
||
| .main-container ul li { | ||
| font-size: 18px; | ||
| } | ||
|
|
||
|
|
||
| .main-container ul li { | ||
| font-size: 18px; | ||
| @media (max-width: 780px) { | ||
|
|
||
| .main-container { | ||
| width: 95%; | ||
| margin: 60px auto; | ||
| padding: 14px; | ||
| background: linear-gradient(to top, rgb(255, 211, 145), #ffffff); | ||
| box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); | ||
| border-radius: 10px | ||
| } | ||
|
|
||
| } |