modifyed the css
This commit is contained in:
		
							parent
							
								
									01fadc2ccf
								
							
						
					
					
						commit
						2ca055b4c1
					
				
					 3 changed files with 104 additions and 33 deletions
				
			
		|  | @ -252,7 +252,7 @@ header a:hover { | |||
| } | ||||
| 
 | ||||
| /* Form styling */ | ||||
| form { | ||||
| #contactForm { | ||||
|     max-width: 600px; | ||||
|     margin: 0 auto; | ||||
|     background: var(--input-background-color); /* Use the input background color variable */ | ||||
|  | @ -261,14 +261,14 @@ form { | |||
|     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */ | ||||
| } | ||||
| 
 | ||||
| form label { | ||||
| #contactForm label { | ||||
|     color: var(--text-color); /* Use the text color variable */ | ||||
|     display: block; /* Ensure labels are block elements */ | ||||
|     margin-bottom: 5px; /* Add some space below labels */ | ||||
| } | ||||
| 
 | ||||
| form input, | ||||
| form textarea { | ||||
| #contactForm input, | ||||
| #contactForm textarea { | ||||
|     color: var(--text-color); /* Use the text color variable */ | ||||
|     background-color: var(--history-background-color); /* Use a contrasting background */ | ||||
|     border: 1px solid var(--input-button-color); /* Use the input button color for borders */ | ||||
|  | @ -278,7 +278,7 @@ form textarea { | |||
|     margin-bottom: 15px; | ||||
| } | ||||
| 
 | ||||
| form button { | ||||
| #contactForm button { | ||||
|     background-color: var(--input-button-color); /* Use the input button color */ | ||||
|     color: var(--background-color); /* Use the background color for text */ | ||||
|     border: none; | ||||
|  | @ -288,6 +288,49 @@ form button { | |||
|     transition: background-color 0.3s; /* Smooth transition for hover effect */ | ||||
| } | ||||
| 
 | ||||
| form button:hover { | ||||
| #contactForm button:hover { | ||||
|     background-color: var(--input-button-hover-color); /* Use the hover color variable */ | ||||
| } | ||||
| 
 | ||||
| /* FAQ Section */ | ||||
| #faq { | ||||
|     max-width: 800px; | ||||
|     width: 90%; | ||||
|     margin-top: 50px; | ||||
|     padding: 20px; | ||||
|     background-color: #222; | ||||
|     border-radius: 10px; | ||||
|     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); | ||||
| } | ||||
| 
 | ||||
| #faq h2 { | ||||
|     text-align: center; | ||||
|     color: #00ccff; | ||||
|     font-size: 2em; | ||||
|     margin-bottom: 20px; | ||||
| } | ||||
| 
 | ||||
| .faq-item { | ||||
|     margin-bottom: 20px; | ||||
|     padding: 10px; | ||||
|     border-radius: 5px; | ||||
|     background-color: #333; | ||||
| } | ||||
| 
 | ||||
| .faq-item h3 { | ||||
|     color: #00ccff; | ||||
|     margin-bottom: 10px; | ||||
|     font-size: 1.5em; | ||||
| } | ||||
| 
 | ||||
| .faq-item p { | ||||
|     color: #ddd; | ||||
|     font-size: 1.1em; | ||||
|     line-height: 1.5; | ||||
| } | ||||
| 
 | ||||
| /* Add some hover effects for the FAQ items */ | ||||
| .faq-item:hover { | ||||
|     background-color: #444; | ||||
|     transition: background-color 0.3s; | ||||
| } | ||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue