@import "normalize.css";

html { font-size: 100%; }
body { background: #ECEDE7 repeat fixed; color: Black; font: 1em/1.4 Arial, Helvetica, sans-serif; }

header { margin: 0 0 1em; padding: 0.5em 0; width: 100%; text-align: center; background-color: #F38222; color: Black; border-top: 4px solid #0087C8; -webkit-box-shadow:0px 4px 10px #666; -moz-box-shadow:0px 4px 10px #666; box-shadow:0px 4px 10px #666; }
nav { margin: 0; padding: 0; }
nav ul { margin: 0 0.2em 0.1em; padding: 0 0.2em 0.1em; text-align: center; }
nav li { margin: 0; display: inline; }
nav a { background-color: transparent; color: Yellow; }
nav a:link { }
nav a:visited { }
nav a:hover { background-color: transparent; color: #FF9933; }
article { margin: 0.5em; padding: 0.5em; }
aside { margin: 0.5em; padding: 0.5em; border: thin dotted Blue; float: right; }
footer { margin: 0; padding: 0.5em 0; background-color: #C8E6EE; color: Black; clear: both; }

.container { margin: 0; padding: 0.5em; margin-left: auto; margin-right: auto; max-width: 65em; }

a { font-weight: bold; text-decoration: none; color: Blue; outline: none; background-color: transparent; }
a:link {  }
a:visited { }
a:hover { color : #B22222; }

button { margin: 0.2em; padding: 0.2em; cursor: pointer; background: #0057B0; color: White; font-weight: bold; }
button:hover { background: #00C0E2; color: Black; }
.small { font-size: 0.5em; }
.medium { font-size: 0.8em; }
.large { font-size: 1.2em; }

h1, h2, h3, h4, h5, h6 { margin: 0.33em 0; line-height: 1.2em; color: #0057B0; }
h1 { font-size: 1.8em; text-align: center; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.4em; }
h4 { font-size: 1.3em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.1em; }
hgroup { text-align: center; }
p, ul, ol, dl { margin: 0; padding: 0.5em 1em; text-align: left; }
ul { list-style: disc; }
ol { list-style: decimal; }
lh { font-weight: bold; font-size: larger; color : #0057B0; }
li { margin-left: 1em; }
dt { font-weight: bold; font-style: italic; color : #0057B0; }
hr { margin: 1em auto; padding: 0; width: 90%; border: thin solid #00C0E2; clear: both; }
blockquote { margin: 0.5em 1em; padding: 0.5em 1em; line-height: 1.2; font-style: italic; text-align: left; }

figure { margin: 0.5em auto; padding: 0; text-align: center; }
figcaption { font : italic bold 0.9em/1.3 Arial, Helvetica, sans-serif; text-align: center; }
img { max-width: 96%; height: auto; }

table { min-width: 320px; margin: 1em auto; }
table,td,th { border:1px solid #000; border-collapse:collapse; }
td,th { padding:.2em .5em; vertical-align:top; font-weight:normal; }
table caption { text-align:left; font-size: 120%; text-transform: lowercase; letter-spacing:-1px; }
thead th { background: #DC7D27; color: White; font-weight: bold; font-size: 140%; }
thead td { background : #FFFFF0; }
tbody td { background: #ecede7; }
tbody th { background: #d2d2d2; font-weight: bold; }
tbody tr.odd td { background:#eee; }
tbody tr.odd th { background:#ccc; }
tfoot th { background: #FFFFF0; }

.bold { font-weight:bold; }
.emphasis { font-style : italic; }
.box { margin: 0.5em; padding: 0.5em; border: thin solid Black; }
.clear { clear: both; }
.clearleft { clear: left; }
.clearright { clear: right; }
.left { margin: 0.5em; float: left; }
.right { margin: 0.5em; float: right; }
.cent { margin-left: auto; margin-right: auto; }
.price { color: #FF0000; font-weight: bold; }
.spacer { height: 1em; }
.special { margin: 1em auto; padding: 0.5em 1em; width: 92%; border: 2px outset #006633; background: #C8E6EE; color: black; }
.special h4 { text-align: center; }
.special img { max-width: 95%; height: auto; }
.txtleft { text-align: left; }
.txtcent { text-align: center; }
.txtjust { text-align: justify; }
.txtright { text-align: right; }

.menu { padding: 0.5em 0; text-align: center; font-size: 0.9em; }
.menu ul { }
.menu li { margin: 0; padding: 0.2em; list-style-type: none; }
.menu li a { background: #006633; border: 2px outset #0099CC; display: block; padding: 0.2em; text-transform:none; color : #FFFF33; }
.menu li a:hover { background: #0093D3; border: 2px inset #006633; color: #201E5D; }

.button { margin: 20px 0 0 0; padding: 8px 16px; background: #0087C8; color: white!important; cursor: pointer; font-size:15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; transition: all 0.25s linear; }
a.button:hover { text-decoration: none; background:#808080; color:#fff!important; }

#image ul { margin:0; padding:0; }
#image li { margin:0; padding:0; list-style:none; display:none; /* hide the items at first only to display one with javascript */ }
#image img { margin:0; padding:0; }
#image1 ul { margin:0; padding:0; }
#image1 li { margin:0; padding:0; list-style:none; display:none; /* hide the items at first only to display one with javascript */ }
#image1 img { margin:0; padding:0; }
#image2 ul { margin:0; padding:0; }
#image2 li { margin:0; padding:0; list-style:none; display:none; /* hide the items at first only to display one with javascript */ }
#image2 img { margin:0; padding:0; }
#image3 ul { margin:0; padding:0; }
#image3 li { margin:0; padding:0; list-style:none; display:none; /* hide the items at first only to display one with javascript */ }
#image3 img { margin:0; padding:0; }

.w10, .w20, .w30, .w40, .w50, .w60, .w70, .w80, .w90 { margin: 0.5em 0; padding: 0; }
.w10 { width: 10%; }
.w20 { width: 20%; }
.w30 { width: 30%; }
.w40 { width: 40%; }
.w50 { width: 50%; }
.w60 { width: 60%; }
.w70 { width: 70%; }
.w80 { width: 80%; }
.w90 { width: 90%; }

.w08, .w17, .w25, .w33, .w42, .w50, .w58, .w67, .w75, .w83, .w92 { margin: 0.5em 0; padding: 0; }
.w08 { width: 8.33%; }
.w17 { width: 16.66%; }
.w25 { width: 25%; }
.w33 { width: 33.33%; }
.w42 { width: 41.66%; }
.w50 { width: 50%; }
.w58 { width: 58.33%; }
.w67 { width: 66.66%; }
.w75 { width: 75%; }
.w83 { width: 83.33%; }
.w92 { width: 91.66%; }

.w240 { width: 240px }
.w320 { width: 320px }
.w480 { width: 480px }
.w640 { width: 640px }

@media (max-width: 800px) { 
.w10, .w20, .w30, .w40, .w50, .w60, .w70, .w80, .w90 { margin: 0.5em 0; padding: 0; width: 95%; float: none; }
.w08, .w17, .w25, .w33, .w42, .w50, .w58, .w67, .w75, .w83, .w92 { margin: 0.5em 0; padding: 0; width: 95%; float: none; }
}