body {
margin:0px;
background-color:#959F72;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
color:#545454;
background-repeat:repeat;
}
div, ul, li, img {
margin:0px;
padding:0px;	
}
iframe, object, embed {
display:block;
margin:0px;
}
h1 {
font-family:'Michroma', sans-serif;
font-size:25px;
font-weight:bold;
text-align:left;
}
h2 {
font-family:'Michroma', sans-serif;
font-size:20px;
font-weight:bold;
color:#959F72;
text-align:left;
}
a:active {
text-decoration:none;
color:#FC7214;
}
a:link {
text-decoration:none;
color:#FC7214;
}
a:visited {
text-decoration:none;
color:#FC7214;
}
a:hover {
color:#959F72;
text-decoration:none;
}
select {
font-size:12px;
}
#framework {
position:relative;
margin:0px;
}
#header {
width:auto;
min-width:320px;
max-width:1000px;
min-height:110px;
line-height:110px;
position:relative;
margin-right:auto;
margin-left:auto;
vertical-align:bottom;
background-color:#FFFFFF;
}
#header-logo {
width:38%;
min-height:110px;
margin-left:2%;
float:left;
}
#header-logo img {
width:100%;
max-width:320px;
height:auto;
margin-bottom:20px;
vertical-align:bottom;
}
#header-buttons {
width:58%;
margin-right:2%;
float:right;
top:0px;
position:relative;
font-size:14px;
color:#000000;
text-align:right;
}
#header-buttons ul {
width:auto;
height:35px;
line-height:35px;
top:0px;
right:0px;
list-style:none;
}
#header-buttons li {
height:35px;
margin-left:15px;
float:right;
}
#header-buttons li a:active, #header-buttons li a:link, #header-buttons li a:visited {
display:block;
text-decoration:none;
height:35px;
line-height:35px;
color:#545454;
}
#header-buttons li a:hover {
background:none;
text-decoration:underline;
}
#header-brands {
height:75px;
float:right;
}
#header-brands img {
width:auto;
max-height:35px;
margin-left:2px;
margin-right:2px;
}
#animation {
width:auto;
min-width:320px;
max-width:1000px;
max-height:400px;
position:relative;
margin:0px;
margin-right:auto;
margin-left:auto;
background-repeat:no-repeat;
background-position:center top;
background-size:100%;
}
#animation img{
width:100%;
height:auto;
min-width:320px;
max-width:1000px;
display:block;
}
#content {
width:auto;
min-width:320px;
max-width:1000px;
position:relative;
margin:0px;
padding:0px;
margin-right:auto;
margin-left:auto;
padding-top:5px;
padding-bottom:25px;
background-color:#B5BC9C;
background-repeat:no-repeat;
background-position:center bottom;
}
#page-content {
margin-left:2%;
margin-right:2%;
}
.content-box{
width:20%;
float:left;
margin:2%;
text-align:center;
}
.content-box img{
width:100%;
max-width:200px;
height:auto;
}
.home-box{
width:31%;
float:left;
margin-left:1%;
margin-right:1%;
margin-bottom:20px;
margin-top:10px;
overflow:visible;
position:relative;
}
.home-box img{
width:100%;
max-width:480px;
height:auto;
opacity:1;
filter:alpha(opacity=100);
}
.home-box img:hover {
opacity:0.5;
filter:alpha(opacity=50);
}
.home-phrase{
width:96%;
bottom:0px;
padding:2%;
z-index:100;
position:absolute;
background:rgb(84, 84, 84); 
background:rgba(84, 84, 84, 0.75);
font-size:10px;
color:#FFFFFF;
}
.stockists-box{
width:29%;
min-height:190px;
float:left;
margin-left:1%;
margin-right:1%;
margin-bottom:20px;
margin-top:10px;
padding:1%;
position:relative;
border:1px solid #545454;
background-color:#B5BC9C; 
background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#B5BC9C), to(#FFFFFF));
background-image:-webkit-linear-gradient(top, #B5BC9C, #FFFFFF); 
background-image:-moz-linear-gradient(top, #B5BC9C, #FFFFFF);
background-image:-ms-linear-gradient(top, #B5BC9C, #FFFFFF);
background-image:-o-linear-gradient(top, #B5BC9C, #FFFFFF);
vertical-align:top;
-ms-word-break:break-all;
word-break:break-all;
word-break:break-word;
}
.stockists-box p{
margin:0px;
font-size:12px;
}
.stockists-box img{
margin:1px;
}
input {
border:1px solid #959F72;
background:#DADECE;
}
input:hover {
border:1px solid #545454;
background:#B5BC9C;
}
textarea {
width:90%;
border:1px solid #959F72;
background:#DADECE;
}
textarea:hover {
border:1px solid #545454;
background:#B5BC9C;
}
.form-details {
padding-left:10px;
background-color:#959F72;
color:#FFFFFF;
font-family:'Michroma', sans-serif;
}
.form-labels {
padding-left:10px;
background-color:#FFFFFF;
}
.form-fields {
padding-left:10px;
background-color:#FFFFFF;
}
.form-button {
padding:10px;
border:1px solid #545454;
background:#FFFFFF;
color:#545454;
font-family:'Michroma', sans-serif;
}
.form-button:hover {
border:1px solid #FFFFFF;
background:#545454;
color:#FFFFFF;
}
#footer {
width:auto;
min-width:320px;
max-width:1000px;
position:relative;
margin-right:auto;
margin-left:auto;
padding:0px;
background-color:#545454;
font-size:12px;
color:#979991;
}
#footer a:active, #footer a:link, #footer a:visited {
color:#FFFFFF;
}
#footer a:hover {
color:#FD9855;
}
#footer-copyright{
height:35px;
line-height:35px;
padding-left:2%;
font-size:12px;
background-color:#959F72;
color:#FFFFFF;
text-align:left;
}
#footer-copyright a:active, #footer-copyright a:link, #footer-copyright a:visited {
color:#FFFFFF;
}
#footer-copyright a:hover {
color:#FD9855;
}
.footer-box{
width:20%;
float:left;
margin:2%;
}
.footer-box p{
margin:0px;
}
.float-left {
float:left;
}
.float-right {
float:right;
}
.content-clear {
clear:both;
}
@media all and (max-width:768px) {
.content-box{
width:46%;
float:left;
margin:2%;
}
#header-brands img {
width:auto;
height:auto;
max-width:75px;
max-height:20px;
margin-left:2px;
margin-right:2px;
}
.home-box{
width:48%;
margin-left:0px;
}
.home-phrase{
font-size:12px;
}
.stockists-box{
width:45%;
}
.footer-box{
margin-left:1%;
margin-right:1%;
}
}
@media all and (max-width:600px) {
#header-brands img {
width:auto;
height:auto;
max-width:50px;
max-height:20px;
margin-left:2px;
margin-right:2px;
}
}
@media all and (max-width:480px) {
#header {
height:150px;
}
#header-logo {
width:auto;
height:auto;
}
#header-logo img{
top:5px;
}
#header-buttons {
width:auto;
}
#header-brands {
display:none;
}
#brands {
display:none;
}
.content-box{
width:98%;
float:left;
margin:2%;
}
.content-box img{
width:100%;
max-width:320px;
height:auto;
}
.home-box{
width:98%;
margin:2%;
}
.home-phrase{
font-size:14px;
}
.stockists-box{
width:95%;
margin:2%;
}
input {
max-width:90%;
}
.footer-box{
width:43%;
float:left;
margin-left:1%;
margin-right:1%;
font-size:14px;
}
.footer-contact{
width:53%;
}
.footer-wide{
width:98%;
float:left;
margin-top:0px;
margin-left:1%;
margin-right:1%;
font-size:30px;
text-align:center;
}
}