Sam-s-Mart-Website-Alternative/styles/style.css

177 lines
2.5 KiB
CSS
Raw Normal View History

2021-02-11 01:27:58 +00:00
/* This style sheet is taken from https://www.w3schools.com/howto/howto_js_tabs.asp> */
/* Style the tab */
.tab {
overflow: hidden;
border: 1px solid #ccc;
background-color: #f1f1f1;
}
/* Style the buttons that are used to open the tab content */
.tab button {
background-color: inherit;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
}
/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ddd;
}
/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}
/* Style the tab content */
.tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid #ccc;
border-top: none;
background-color: rgb(222, 224, 228);
}
.tablinks {
font-size: 20px;
}
/* title/header */
h1{
font-family: "Britannic Bold ", sans-serif;
font-weight: bolder;
2021-02-18 03:33:47 +00:00
color: #ffffff;
display:inline;
font-size: 3rem;
2021-02-11 01:27:58 +00:00
/* margin-right: 15px; */
}
/*footer with signatures */
.footer {
bottom: 0;
left: a;
width: 100%;
color: rgb(0, 0, 0);
text-align: center;
}
.copyright{
font-size: 15px;
}
.logo{
width: 5%;
height:auto;
vertical-align: middle;
margin-bottom: 10px;
}
body {
margin: 0px;
background-color: #66BFBF;
background-image: url("images/bg3.jpg");
text-align: center;
font-size : 20px;
}
img{
width: 30%;
padding: 3% 7%;
}
.company-name {
text-align: left;
2021-02-18 03:33:47 +00:00
float: left;
display:inline;
padding-left: 10px;
2021-02-11 01:27:58 +00:00
}
.cart-img {
height: 5%;
width: 5%;
padding: 0;
padding-left: 15px;
margin-top: 20px;
/*
position: relative;
top: 40px;
*/
}
h3 {
font-size: 30px;
}
p {
font-size: 25px;
}
i {
font-size: 17px;
2021-02-11 01:27:58 +00:00
}
.block {
font-size: 15px;
}
.sumo{
font-size: 15px;
2021-02-18 03:33:47 +00:00
}
/*
source:
https://www.w3schools.com/howto/howto_js_topnav_responsive.asp
*/
/* Style the navigation bar */
.navbar {
width: 100%;
background-color: rgb(212, 100, 100);
overflow: auto;
}
/* Navbar links */
.navbar a {
float: right;
padding: 12px;
color: white;
text-decoration: none;
font-size: 17px;
}
/* Navbar links on mouse-over */
.navbar a:hover {
background-color: rgb(53, 172, 166);
}
/* Current/active navbar link */
.active {
}
a.icon{
font-size: 25px;
}
/* Add responsiveness - will automatically display the navbar vertically instead of horizontally on screens less than 500 pixels */
@media screen and (max-width: 500px) {
.navbar a {
float: none;
display: block;
}
2021-02-11 01:27:58 +00:00
}