body {
	width : 100%;
	margin:0;
	padding:0;
	background-color: #FFFFFF;
}

/* HTML Login Page */

.html-cont { background:url('../images/login-page/background.jpg'); }

.body-container { width:1280px; margin:0 auto; }
.full-row { width:100%; }

.fuschia-bg { background-color:#650026; }

.logo-image { text-align:center; padding:3rem 0 2rem; }
.form-container { padding:1rem 0 2rem; text-align:center; }

.gold-separator { height:15px;
    
    background: #ffd45a; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZDQ1YSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5ZDc1MjMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #ffd45a 0%, #9d7523 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffd45a), color-stop(100%,#9d7523)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffd45a 0%,#9d7523 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffd45a 0%,#9d7523 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffd45a 0%,#9d7523 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffd45a 0%,#9d7523 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd45a', endColorstr='#9d7523',GradientType=0 ); /* IE6-8 */

}

.beer-container { width:80%; margin:0 auto; }
.beer-banners { width:100%; margin:2em 0 0; }
.solo-beer-banner { width:49.7%; display:inline-block; }

.full-banner { width:80%; margin:0 auto; }
.fb-image { width:80%; }
.fb-image img { float:right; }

.beer-logo-container { width:80%; margin:0 auto; padding:4rem 0 2rem; }
.beer-logos { text-align:center; }
.solo-beer-logos { width:13.96%; display:inline-block; }

.footer-container {  }
.copyright { width:80%; margin:0 auto; color:#fff; text-align:center; font-size:0.83em; }
.copyright p { font-family:Arial; margin:0; }

/* Login Page Start */
#wrapAll {
	background: url("../images/loginbg.png") no-repeat;
	width : 260px;
	height: 262px;
	margin: 0 auto;
}
#wrapHeight {
	height: 200px;
}

.inputLogin{
	font-family: Arial,Georgia,Serif;
	background-color:#F3F3F3;
	width:200px;
	color:#838383;
	font-size: 12px;
	border-radius:5px 5px 5px 5px;
    border:1px solid #838383;
	padding: 5px
}

.inputSubmit{
	font-family: Arial,Georgia,Serif;
	background-color:#F3F3F3;
	width:60px;
	color:#838383;
	font-size: 12px;
	border-radius:5px 5px 5px 5px;
    border:1px solid #838383;
	padding: 5px
}

.usernameImg{
	background: url("../images/username.png") no-repeat right;
}
.passwordImg{
	background: url("../images/password.png") no-repeat right;
}
/* Login Page End */

/* Navigation Start */
.NaviImgDashBoard{
	background: url("../images/Dashboard.png") no-repeat right;
}

.greym1class{
	background: url("../images/Grey_Dashboard.png") no-repeat top center;
}
.greym2class{
	background: url("../images/Grey_Product.png") no-repeat top center;
}
.greym3class{
	background: url("../images/Grey_Customer.png") no-repeat top center;
}
.greym4class{
	background: url("../images/Grey_Invoice.png") no-repeat top center;
}
.greym5class{
	background: url("../images/Grey_Excel.png") no-repeat top center;
}
.greym6class{
	background: url("../images/Grey_Order.png") no-repeat top center;
}
.greym7class{
	background: url("../images/Grey_Sales.png") no-repeat top center;
}
.greym8class{
	background: url("../images/Grey_Report.png") no-repeat top center;
}

.redm1class{
	background: #FFFFFF url("../images/List_Dashboard.png") no-repeat top center;
}
.redm2class{
	background: #FFFFFF url("../images/List_Product.png") no-repeat top center;
}
.redm3class{
	background: #FFFFFF url("../images/List_Customer.png") no-repeat top center;
}
.redm4class{
	background: #FFFFFF url("../images/List_Invoice.png") no-repeat top center;
}
.redm5class{
	background: #FFFFFF url("../images/List_Excel.png") no-repeat top center;
}
.redm6class{
	background: #FFFFFF url("../images/List_Order.png") no-repeat top center;
}
.redm7class{
	background: #FFFFFF url("../images/List_Sales.png") no-repeat top center;
}
.redm8class{
	background: #FFFFFF url("../images/List_Report.png") no-repeat top center;
}

#m1class, #m2class, #m3class, #m4class, #m5class, #m6class, #m7class, #m8class{
	padding-top: 20px;
}

.navi a{
	text-decoration : none; 
	color : #C3C3C3; 
	font-weight: bold;
	padding: 30px 10px 5px 10px;
}

.subMenu{
	border-collapse:collapse;
	color:white;
	font-size:11px;
	font-weight:bold;
	position:absolute;
	width:140px;
	margin-top:-1px;
	z-index:100;
}

.subMenu td{
	background: #383838;
	height:30px;
	border-bottom :1px solid #FFFFFF;
	padding-left:5px;
	text-align: left;
}

.subMenu td a{
	color: #C3C3C3;
}

.subMenu td a:hover{
	color: #FFFFFF; 
}
/* Navigation End */

.bgmain{
	font-family: Arial,Georgia,Serif;
	background: url("../images/bgmain.png") repeat-x;
	color: #888888;
	font-size: 12px;
}

img{
	border-style:none;
}

a{
	text-decoration : none; 
	color : #454545; 
}

a:hover{
	color : #000000; 
}

.pageNum{
	text-decoration : none; 
	color : #6F6F6F; 
	background-color: #F7F7F7;
	padding: 10px;
	text-align: center;
	border:1px solid #FFFFFF;
}

.currentPage{
	background-color: #FFFFFF;
	color: #000000;
	border-bottom: 2px solid #FF0000;
}

.pageNum a{
	text-decoration : none; 
	color : #6F6F6F; 
}

.pageNum a:hover{
	color : #85CBF8; 
}

.btnuser{
	background: #E6412D url("../images/btnuser.png") no-repeat;
	color: #FFFFFF;
	text-indent: 20px;
}

#titleTable, #recordTable, #pageTable{
	margin-top: 15px;
	margin-bottom: 15px;
}

#area, #area div{
	margin-top: 5px;
	margin-bottom: 5px;
}



.titleTableImgAdd{
	background: url("../images/titleTableImgAdd.png") no-repeat right;
}

.titleTableImg1{
	background: url("../images/titleTableImg1.png") no-repeat right;
}

.btnRed{
	background: url("../images/btnred.png") no-repeat;
	height: 29px;
	width: 67px;
	text-align: center;
}

.bluebox{
	background: url("../images/bluebox.png") no-repeat;
}

.greenbox{
	background: url("../images/greenbox.png") no-repeat;
}

.redbox{
	background: url("../images/redbox.png") no-repeat;
}

.dashboardgraph{
	background: url("../images/Dashboardgraph.png") no-repeat right;
}

.inputClass{
	background-color:#FFFFFF;
	width:700px;
	color:#494949;
	height:30px;
	border-radius:5px 5px 5px 5px;
    border:1px solid #B5B5B5;
}

.inputItem{
	background-color:#FFFFFF;
	width:150px;
	color:#494949;
	height:25px;
    border:1px solid #B5B5B5;
}

.inputItem2{
	background-color:#FFFFFF;
	width:60px;
	color:#494949;
	height:25px;
    border:1px solid #B5B5B5;
}

.inputItemquantity{
	background-color:#FFFFFF;
	width:60px;
	color:#494949;
	height:25px;
    border:1px solid #B5B5B5;
	text-align: center;
}

.inputQuantity{
	background-color:#FFFFFF;
	width:60px;
	color:#494949;
	height:20px;
    border:1px solid #B5B5B5;
	text-align: center;
}

.inputDate{
	background-color:#FFFFFF;
	width:80px;
	color:#494949;
    border:1px solid #B5B5B5;
	text-align: center;
}

.inputTextarea{
	background-color:#FFFFFF;
	width:700px;
	color:#494949;
	font-size:13px;
	height:100px;
	border-radius:5px 5px 5px 5px;
	z-index: 1;
	border:1px solid #B5B5B5;
}

.tableList{
	 border-collapse:collapse;
	 border:1px solid #B5B5B5;
}

.tableList tr{
	border:1px solid #EBEBEB;
}

.tableList .evenRow{
	background-color:#FFFFFF;
	height:30px;
	color:#6F6F6F;
}

.tableList .oddRow{
	background-color:#F7F7F7;
	height:30px;
	color:#6F6F6F;
}

.trth{
	background: url("../images/recordTable.png") repeat-x left;
	height: 50px;
	color: #FEEDDB;
}

.thborder{
	background: url("../images/border.png") no-repeat right;
}

.tdborder{
	border:1px solid #EBEBEB;
}

/* Font Style Start */
.whiteBtnWord{
	color: #FFFFFF;
	font-weight: bold;
	padding-top: 6px;
}

.blackBigWord{
	color: #000000;
	font-size: 20px;
	font-weight: bold;
}

.greyBiggerWord{
	color: #707070;
	font-size: 80px;
}

.greyBigWord{
	color: #707070;
	font-size: 25px;
	height: 35px;
}

.redBigWord{
	color: #E5412E;
	font-size: 25px;
}

.errortext, .redtext {
	font-weight: bold;
	color: #FF0000;
}
/* Font Style End */

#footer{
	color:#AAAAAA;
	font-size:10px;
	text-align:center;
}



/*
  Docs at http://http://simpleweatherjs.com

  Look inspired by http://www.degreees.com/
  Used for demo purposes.

  Weather icon font from http://fonts.artill.de/collection/artill-weather-icons
*/

@font-face {
    font-family: 'weather';
    src: url('https://dl.dropboxusercontent.com/u/2086809/weatherfont/artill_clean_icons-webfont.eot');
    src: url('https://dl.dropboxusercontent.com/u/2086809/weatherfont/artill_clean_icons-webfont.eot?#iefix') format('embedded-opentype'),
         url('https://dl.dropboxusercontent.com/u/2086809/weatherfont/artill_clean_icons-webfont.woff') format('woff'),
         url('https://dl.dropboxusercontent.com/u/2086809/weatherfont/artill_clean_icons-webfont.ttf') format('truetype'),
         url('https://dl.dropboxusercontent.com/u/2086809/weatherfont/artill_clean_icons-webfont.svg#artill_clean_weather_iconsRg') format('svg');
    font-weight: normal;
    font-style: normal;
}

#weather {
  width: 200px;
  margin: 0px auto;
  text-align: right;
  text-transform: uppercase;
}

i {
  color: #E5412D;
  font-family: weather;
  font-size: 80px;
  font-weight: normal;
  font-style: normal;
  line-height: 1.0;
}

.icon-0:before { content: ":"; }
.icon-1:before { content: "p"; }
.icon-2:before { content: "S"; }
.icon-3:before { content: "Q"; }
.icon-4:before { content: "S"; }
.icon-5:before { content: "W"; }
.icon-6:before { content: "W"; }
.icon-7:before { content: "W"; }
.icon-8:before { content: "W"; }
.icon-9:before { content: "I"; }
.icon-10:before { content: "W"; }
.icon-11:before { content: "I"; }
.icon-12:before { content: "I"; }
.icon-13:before { content: "I"; }
.icon-14:before { content: "I"; }
.icon-15:before { content: "W"; }
.icon-16:before { content: "I"; }
.icon-17:before { content: "W"; }
.icon-18:before { content: "U"; }
.icon-19:before { content: "Z"; }
.icon-20:before { content: "Z"; }
.icon-21:before { content: "Z"; }
.icon-22:before { content: "Z"; }
.icon-23:before { content: "Z"; }
.icon-24:before { content: "E"; }
.icon-25:before { content: "E"; }
.icon-26:before { content: "3"; }
.icon-27:before { content: "a"; }
.icon-28:before { content: "A"; }
.icon-29:before { content: "a"; }
.icon-30:before { content: "A"; }
.icon-31:before { content: "6"; }
.icon-32:before { content: "1"; }
.icon-33:before { content: "6"; }
.icon-34:before { content: "1"; }
.icon-35:before { content: "W"; }
.icon-36:before { content: "1"; }
.icon-37:before { content: "S"; }
.icon-38:before { content: "S"; }
.icon-39:before { content: "S"; }
.icon-40:before { content: "M"; }
.icon-41:before { content: "W"; }
.icon-42:before { content: "I"; }
.icon-43:before { content: "W"; }
.icon-44:before { content: "a"; }
.icon-45:before { content: "S"; }
.icon-46:before { content: "U"; }
.icon-47:before { content: "S"; }

#weather h2 {
  margin: 0 0 8px;
  color: #707070;
  font-size: 20px;
  font-weight: 300;
  text-align: right;
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);
}

#weather ul {
  margin: 0;
  padding: 0;
}

#weather li {

  display: inline-block;
}


#weather .currently {
  margin: 0 20px;
}