diff options
Diffstat (limited to '05/css')
-rw-r--r-- | 05/css/styles.css | 158 |
1 files changed, 158 insertions, 0 deletions
diff --git a/05/css/styles.css b/05/css/styles.css new file mode 100644 index 0000000..8261682 --- /dev/null +++ b/05/css/styles.css @@ -0,0 +1,158 @@ +/* + Author: Name Surname + File Name: styles.css + Date: 2024/09/23 +*/ + +/* CSS Reset */ +body,header,nav,main,footer,img,h1,h3,ul{ + margin: 0px; + padding: 0px; + border: 0px; +} + + +/* Style rules for body and images */ +body{ + background-color: #F6EEE4; +} + +img{ + max-width: 100%; + display: block; +} + +/* Style rules for mobile viewport */ + +/* Style rules to show show mobiile class and hide tab-desk class */ +.mobile{ + display: block; + +} + +.tab-desk{ + display: none; +} + +/* Style rules for header area */ +.mobile h1, +.mobile h3{ + padding: 2%; + text-align: center; +} + +.mobile h1{ + font-family: "Emblema One",system-ui; + font-weight: 400; + font-style: normal; +} + +.mobile h3{ + font-family: "Lora",serif; + font-weight: 400; + font-style: normal; +} + +/* Style rules for navigation area */ +nav{ + background-color: #2A1F14; +} + +nav ul{ + list-style: none; + text-align: center; +} + +nav li{ + display: block; + font-size: 1.5em; + font-family: Geneva,Arial,sans-serif; + font-weight: bold; + border-top: 0.5px solid #F6EEE4; +} + +nav li a{ + display: block; + color: #F6EEE4; + padding-top: 0.5em; + padding-bottom: 0.5em; + padding-left: 2em; + padding-right: 2em; + text-decoration: none; +} + +/* Style rules for main content */ +main{ + padding: 2%; + font-family: "Lora",serif; + font-weight: 400; + font-style: normal; +} + +main p{ + font-size: 1.25em; +} + +main h3{ + padding-top: 2%; +} + +main ul{ + list-style: square; +} + +/* Style rules for class and id selectors */ +.link{ + color: #4D3319; + text-decoration: none; + font-weight: bold; + font-style: italic; +} + +.action{ + font-size: 1.75em; + font-weight: bold; + text-align: center; +} + +.round{ + border-radius: 6px; +} + +#info ul{ + margin-left: 10%; +} + +#contact{ + text-align: center; +} + +.tel-link{ + background-color: #2A1F14; + padding: 2%; + width: 80%; + margin: 0px auto 0px auto; +} + +.tel-link a{ + color: #F6EEE4; + text-decoration: none; + font-weight: bold; +} + +/* Style rules for footer content */ +footer{ + text-align: center; + font-size: 0.85em; + background-color: #2A1F14; + color: #F6EEE4; + padding-top: 1%; + padding-bottom: 1%; + padding-left: 0%; + padding-right: 0%; +} + +footer a{ + color: #F3E6D8; + text-decoration: none; +} |