@import url(https://fonts.googleapis.com/icon?family=Material+Icons);
@@font-face { font-family: carlsberg; src: url('/source/carlsberg.ttf'); } 
@import url(https://www.w3schools.com/w3css/4/w3.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);

/* Main logo button formating */
.title a {
	font-family:carlsberg;
	font-size:60px;
	color:black;
	text-decoration: none;
}

/* whole page formating*/
html { 
 background: #009688;
 margin-left:7%;
 margin-right:7%;
 color:white;
}

/* formating for menu bar*/ 
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow:hidden;
    background-color: #000000;
}

li {
    float: left;
}

li a, .dropbtn {
	font-size:100%;
    display: block;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
	font-family:arial;
}


li:hover:not(.active){
    background-color: yellow;
	color:black;
}

.active {
background-color:yellow;
color:black;
}

li.dropdown {
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #000000;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: white;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {
	background-color: yellow;
	color:black;
	}

.dropdown:hover .dropdown-content {
    display: block;
}

/* Formating for cart button */
.fab {
   width: 72px;
   height: 72px;
   background-color: yellow;
   border-radius: 50%;
   box-shadow: 0 6px 10px 0 #666;
   transition: all 0.1s ease-in-out;
 
   font-size: 50px;
   color: white;
   text-align: center;
   line-height: 70px;
 
   position:fixed;
   right: 50px;
   bottom: 50px;
}
 
.fab:hover {
   box-shadow: 0 6px 14px 0 #666;
   transform: scale(1.05);
   cursor:pointer;
}
.material-icons {
	line-height:1.95;
	font-size:36px;
	color:black;
}
.material-icons.md-20 {
	font-size: 18px;
}

/* search bar formating */
.search  {
    float: right;
    padding: 6px;
    border: none;
    margin-top: 8px;
    margin-right: 16px;
    font-size: 15px;
	
}
.search input {
	float: right;
	padding: 6px;
	margin-top: 8px;
	margin-right: 16px;
	background: #ddd;
	font-size: 15px;
	border: none;
	cursor: pointer;	
}


/*formating for main body content */
.bodycontent {
	padding-top:40px;
	font-size:20px;
	padding-left:20px;
	font-family:arial;
	color:white;
	vertical-align:top;
	padding-right:5px
}

/*formating for sidebar */
.sidebar {
	padding:10px;
	width:275px;
	font-size:20px;
	font-family:arial;
	text-align:center;
	vertical-align:top;
	float:right;
}
/* formating for footer */
.footer {
	font-family:arial;
	font-size:20px;
	width:100%;
	padding:1.9%;
}
/*body content heading formating */
h2 {
	font-family:arial;
	font-weight:600;
	color:yellow;
}
/* top body text formating */
.toptext {
	font-size:24px;
	font-weight:500;
}
/* social links formating */
.fa { 
	
	padding: 4.4% !important;
    font-size: 150% !important;
    width: 16% !important;
	height:35% !important;
    text-align:center;
    text-decoration: none;
	float:left;
	display:block;

}
.fa:hover {
	opacity:0.8;
	
}
.fa-facebook {
	color: white;
}
.fa-twitter {
	color:white;
}
.fa-instagram {
	color: white;
}

.raisedbody {
	background:#00b3a1;
	border-radius:2px;
	width:100%;
	height:100%;
	padding:10px;
	border-radius:10px;
}
.bold {
	font-weight:bold;
}