@import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=latin,cyrillic-ext,greek-ext,vietnamese);
/*@font-face {
    font-family: 'Gentium Basic';
    src: url('../fonts/GenBasR.ttf');
     use 
    font-family: 'Pontano Sans', sans-serif;
    
}
@font-face {
    font-family: 'Fredoka One';
    src: url('../fonts/FredokaOne-Regular.ttf');
     use 
    font-family: 'Happy Monkey', cursive; 
    
}*/

/*@font-face {
    font-family: 'Happy Monkey';
    src: url('../fonts/HappyMonkey-Regular.ttf');
    /* use 
    font-family: 'Happy Monkey', cursive;
*//*
}*/

/*@font-face {
    font-family: 'Pontano Sans';
    src: url('../fonts/PontanoSans-Regular.ttf');
    /* use 
    font-family: 'Pontano Sans', sans-serif;
*//*
}*/

/*@font-face {
    font-family: 'Simonetta';
    src: url('../fonts/Simonetta-Regular.ttf');
     use 
    font-family: 'Simonetta', cursive;
    
}

@font-face {
    font-family: 'Overlock';
    src: url('../fonts/Overlock-Regular.ttf');
     use 
    font-family: 'Overlock', cursive;
    
}*/


html {
    overflow: -moz-scrollbars-vertical;
    margin: 0;
    padding: 0;
}
body {
    background-color: #ffffff;
    color: #000000;
    font-family: 'Open Sans', sans-serif !important;
    margin: 0px;
    padding: 0px;
}
body, td, th, input, textarea, select, a {
    font-size: 12px;
}
h1, .welcome {
    color: #636E75;
    font: 'Happy Monkey', cursive;
    margin-top: 0px;
    margin-bottom: 20px;
    font-size: 32px;
    font-weight: normal;
    text-shadow: 0 0 1px rgba(0, 0, 0, .01);
    overflow: hidden;
}
h1 small, .welcome small {
    font-size: 0.5em;
}
h2 {
    color: #000000;
    font-size: 16px;
    margin-top: 0px;
    margin-bottom: 5px;
}
p {
    margin-top: 0px;
    margin-bottom: 20px;
}
a, a:visited, a b {
    color: #006200;
    text-decoration: underline;
    cursor: pointer;
}
a:hover {
    text-decoration: none;
}
a img {
    border: none;
}
form {
    padding: 0;
    margin: 0;
    display: inline;
}
input[type='text'], input[type='password'], textarea {
    background: #F8F8F8;
    border: 1px solid #CCCCCC;
    padding: 3px;
    margin-left: 0px;
    margin-right: 0px;
}
select {
    background: #F8F8F8;
    border: 1px solid #CCCCCC;
    padding: 2px;
}
label {
    cursor: pointer;
}

#container { 
    background:url(../images/bg-flower-dim.png) center no-repeat;
    -moz-box-shadow: 0 0 10px 10px #C7D9BB;
    -webkit-box-shadow: 0 0 10px 10px #C7D9BB;
    box-shadow: 0 0 10px 10px #C7D9BB;
    background-attachment: fixed;
    text-align: left;
    margin: 20px;
}

#header{ 
    padding: 10px;
    margin-top:40px;
    position: relative;
    z-index: 99;
    background-color: #C7D9BB ;
    background: -webkit-linear-gradient(top, #fff 0%, #C7D9BB 100%);
    background: -linear-gradient(top, #fff 0%, #C7D9BB 100%);
    background: -moz-linear-gradient(top, #fff 0%, #C7D9BB 100%);
    background: -o-linear-gradient(top, #fff 0%, #C7D9BB 100%);
    background: -ms-linear-gradient(top, #fff 0%, #C7D9BB 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#C7D9BB'); /* IE6 & IE7 */  
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#C7D9BB')"; /* IE8+ */  
    height:auto;
    overflow: hidden;
}

/*#header * {display:inline-block;}*/
/*#left-border{float:left; background:url(../images/header_left.gif) no-repeat left top; width:21px; height:201px;}*/
#logo{ float:left; margin:25px 20px 20px 20px; }
#head-title{float:left; margin-top:14px;}
#top-box { float:left; background:url(../images/box-bg.jpg) repeat-x left center; border-radius: 10px; width:auto; height:51px; margin-top:5px; line-height: 51px; text-align: center; padding:0 10px;}
#top-box select option{display:block;}
#top-box label, #top-box select { line-height: 51px; vertical-align: middle;}

#searchBox { float:right; background:url(../images/box-bg.jpg) repeat-x left center; border-radius: 10px; width:auto; height:51px; display:block; }
#searchBox label{float:left; text-indent:20px; margin-top:12px;}
#searchBox *{line-height:28px; }
/*#searchBox .searchBoxEnd { background:url(../images/bg_SearchBox.gif) no-repeat 100% 0 ; width:10px; float:right; }*/

#herbBox{ float:left; }
#herbBox #herbQuery,
#herbBox .herbQuery{ width:260px; height:20px; margin-top:14px; }
#herbBox #herbContainer{ width: 260px; left:-140px; top:35px;}

.loginBox { background: url(../images/header_bg.gif) left top repeat-x; border-radius: 10px; width:288px; height: 140px; margin:5px 0 0 0; }
.loginBox div, .loginBox h1,
.loginBox ul, .loginBox li { display:block !important; }
.loginBox ul {text-align: left; }
.loginBox ul li {  }
.loginBox h1 { background: #D7E0D2 ; padding:5px 5px 0 5px; border-top-right-radius: 10px; border-top-left-radius: 10px; margin:0; }

.loginBox .left { margin:2px 0 0 3px; }
.loginBox .right { margin:2px 5px 0 0; }
.loginBox .text { color:#000; font-weight: 700; display:inline; }
.loginBox .field { height: 11px !important; width: 174px; border:1px solid #ccc; display:inline; }
.loginBox .button { margin-top:12px; background: url(../images/button_login.gif); width:54px; height: 29px; border:0; text-indent:-2000px; display:inline; }
.loginBox .forget { color: #000; text-decoration: none; display:inline; }
.loginBox .forget:hover { text-decoration: underline; }

.carttxt { margin-top:10px; line-height: 40px; padding-left:70px; }

.GoButton{ background:url(../images/button_go.gif); border:0; height:28px; width:36px; margin-top:12px; float:left; margin-right:10px; }

.boxBorder{border:1px inset #000;}

.BlackBold{ font-weight:700; color:#555 !important; }
.number{ color:#cc0000 !important; }
/*.highlight { color:#eeeb33 !important; }*/

.NewsPanel{ float:left; height: 74px; margin-bottom:10px; color:#000; font-weight: 500; font-size: medium; }
.PaneLeft{background: url(../images/news-pane-left-light.gif) no-repeat left top; width:14px; height:100%; float:left;}
.PaneRight{background: url(../images/news-pane-right-light.gif) no-repeat right top; width:16px; height:100%;  float:left;}
.PaneCenter{background: url(../images/news-pane-repeater-light.gif) repeat-x left top; padding:10px 2px 10px 2px; height:100%; float:left;}
#headingCenter { float:left; width:95%; height: 100%; }
#headingCenter .leftBox { width:590px; }
/*#rightBorder{float:right; background:url(../images/header_right.gif) no-repeat right top; width:21px; height:201px; display:block;}*/

#main{ text-align: left; padding:10px; }

#leftPane{ width:19%; float:left; margin-top:10px;}

#leftMenu li
{
    width:130px;
    line-height:30px;
    list-style-type:none;
    /*background:transparent url(../images/menu_button.gif) no-repeat center;*/
    background:transparent url(../images/button-bg.gif) no-repeat center;
    text-align:center;
    margin:10px auto 0 auto;

}
#leftMenu li a:link,
#leftMenu li a:visited
{text-decoration:none; text-transform:uppercase; color:#000000; font-size:14px; font-weight:500;}
#leftMenu li a:hover{color:#FFFFFF;}

#rightPane{ /*width:79%; float:right; margin-top:5px; min-height:400px; text-align:left;*/}
/* End Body */

/* Footer */
#leftFlower{
    overflow: hidden;
    margin:0;
    background:transparent url(../images/bottom-left-flower.gif) no-repeat 0% 100%; 
    /*background:transparent url(../images/footer-grass.png) repeat-x 0% 100%;*/
    min-height: 200px;
}
#rightFlower{ 
    overflow: hidden;
    margin:0;
    background:transparent url(../images/bottom-right-flower.gif) no-repeat 100% 100%; 
    min-height: 200px;
}

#adds{
    margin:10px 5px;
    clear:both;
    border:1px solid #008200;
}

#footer {
    margin:0; 
    clear: both;
    overflow: auto;
    padding-top: 20px;
    border-top:2px solid #008200;
    border-bottom:0;
    background-color: #C7D9BB ;
    background: -webkit-linear-gradient(top, #C7D9BB 0%, #fff 100%) ;  /*chrome, safari */
    background: linear-gradient(top, #C7D9BB 0%, #fff 100%);  /* standard */
    background: -moz-linear-gradient(top, #C7D9BB 0%, #fff 100%); /*  mozilla */
    background: -o-linear-gradient(top, #C7D9BB 0%, #fff 100%); /*  Opera */
    background: -ms-linear-gradient(top, #C7D9BB 0%, #fff 100%); /* IE 10 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#C7D9BB', endColorstr='#ffffff'); /* IE6 & IE7 */  
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#C7D9BB', endColorstr='#ffffff')"; /* IE8+ */  
    font-size:14px !important;
    font-family: 'Pontano Sans', sans-serif !important;
}

#footer ul { text-align:center; margin-bottom:0px; }
#footer ul li { 
    border-width: 2px;
    border-style: solid;
    border-color: #000;
    border-top-style: outset; 
    border-left-style: outset; 
    list-style:none; 
    display:inline-block; 
    padding:5px; 
    margin-top:10px;
}
#footer ul li:hover ,
#footer ul li.active {border-style: inset;}

#footer ul li a:link,
#footer ul li a:visited {text-decoration:none; text-transform:uppercase; color:#333; font-weight: 900; width: 100%; }

/*#footer ul li:last-child {border-right:none; }*/

#footer ul li a:hover,
#footer ul li.active a { color:#000 }

#footer address{
    margin-top:80px;
    text-align: center;
    background: rgb(255, 255, 255);
    /* RGBa with 0.4 opacity */
    background: rgba(255, 255, 255, 0.6);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF)";
}

/* End Footer */

/* General CSS */
.border{ width:2px; background:url(../images/border.gif) center no-repeat;}
.super-heading, p.heading,
.heading{ color:#077b3f; font-size:18px; font-weight:700; float:left; clear:left; }
p.heading{float:none;}
.super-heading { font-size:28px; text-decoration: underline; }

.tableHeading{font-weight:bold; font-size:larger; }
.smallText{font-size:10px; font-weight:normal; color:black;}
.SearchHeading { height:20px; background:#d7e0d2; width:100%;}

/* Herb List Css */

.Panel{ display:none;}
#Row0 {display:block;}

.herbList{ border:1px solid #000; font-family:'Pontano Sans', sans-serif; font-weight:900; font-size:11px; padding:2px; width:98%; overflow: hidden; }
.herbList .selected a:link {border:0 !important; }
.herbList a:link,
.herbList a:visited{text-decoration:none !important; color:#077b3f; border:0 !important; font-weight: 900 !important;}
.herbList a:hover{text-decoration:none !important; color:#0066A4 !important;}

.herbList .Row{}

.herbList .head { clear:both; }
.herbList .head th {border-bottom:1px solid #000; height:25px; line-height:25px; font-size:14px; text-align:center; background:#d7e0d2;}
.herbList .head .Col { border-right:1px solid #000; }
.herbList .head .ColLast { }


.herbList .data td { height :60px; line-height:60px; border-bottom:1px solid #000; font-weight: 800; }
.herbList .data:hover {background-color:#d7e0d2;}
.herbList .data .Col { height:100%; border-right:1px solid #000;}
.herbList .data .Col img{ padding:2px; border:1px solid #ccc;}
.herbList .data .ColLast { padding:0; margin:0; height:100%; position:relative; }
.herbList .data .ColLast .qtyBox{ margin:10px 3px 10px 15px; width:25px; float:left; }
.herbList .data .ColLast .submit { background:url('../images/icons/add-to-cart.jpg') no-repeat; width:48px; height: 38px; text-indent: -2000px; border:0; float:left;}

.herbList .data .ColLast .submit,

.herbList .SerialCol{text-align:center;}
.herbList .NameCol{ font-size: 16px; vertical-align: middle; line-height: 25px;}
.herbList .OriginCol{}
.herbList .PartCol{}
.herbList .PriceCol{ font-size: 16px; }
.herbList .OrderCol{text-align:center;}

.padding{padding-left:5px;}
a.price{float:right; padding-right:8px;}

.herbList .tableFooter{ width:99%; clear:both; height:25px; line-height:25px; display:inline-block; }
.herbList .tableFooter .left{ /*float:left;*/ width:48%; border-right:1px solid; }
.herbList .tableFooter .right{ /*float:right;*/ width:48%; text-align:right; }

.herbList .left { margin: 10px; }

.herbList .right { margin: 10px; }

.datalist { margin:0 auto; border:1px solid #aaa; list-style-position:outside; list-style-type:decimal; }
.datalist li.thead{ background:#d7e0d2; list-style-type:none; }
.datalist li.thead div{ text-align:center; min-height:30px; }

.datalist li { min-height:25px; line-height:25px; clear:both; margin-left:25px; }
.datalist li.even,
.cart-table .even{ background:#eee; }

.datalist li.odd,
.cart-table .odd { background:transparent; }
.datalist li:hover,
.cart-table tr:hover{ background:#d7e0d2; }

.datalist .image{ height:50px; text-align:center; margin:5px auto; }
.datalist .action,
.datalist .lastUpdate { text-align:center; }
.datalist .active,
.datalist .price{ text-align:right; }

.Column{ display:inline-block; }

div.TableEnd{ float:right; margin:10px 50px 10px 0; height:50px; display:none;}

table.PriceTable, table.PriceTable td {border:1px solid gray; white-space: nowrap;}
table.PriceTable td{ padding:5px; }
table.PriceTable th{text-align:center;}
table.PriceTable .ListField{width:50px; text-align:right;}

table.AdminListTable td{height:30px; vertical-align:middle;}

.floatingPanel { position:absolute; background-color: #ffffcc; border:5px groove green; line-height:15px; padding:2px; font-size: 12px !important; }
.floatingPanel dl {font-weight: 400;}
.hidden {display:none !important; visibility: hidden !important; }

/* herb/details.php */
.PriceListBox{ display:inline-block; width:30%; padding:5px; margin:2px; border:3px solid #999; border-left:1px solid #ccc; border-top:1px solid #ccc; }
.PriceListBox { list-style: none; }
.PriceListBox dt { color: #077b3f; font-size: 18px; }
.PriceListBox dd { color:#8a1f11; font-size: 22px;  }

/* Main Page News */
div.NewsPane
{
    background:transparent url(../images/NewsPane.png) center no-repeat;
    width:313px;
    height:276px;
    font-family:Arial;
    font-size:11px;
    color:#553333;
    font-weight:700;
}
div.NewsPane p{padding:10px 15px; text-align:center; margin-top:0; margin-bottom:0;}
div.NewsPane a:link,div.NewsPane a:visited{ color:#553333; text-decoration:none;}
div.NewsPane a:hover{ color:#553333; text-decoration:underline; font-size:12px;}
table.NewsList {text-align:left; margin-left:20px;}

.addButton,
.editButton,
.saveButton,
.delButton{ background-repeat:no-repeat; width:15px; height:15px; border:0; }

.addButton { background-image:url(../images/icons/add.gif); }
.saveButton { background-image:url(../images/icons/save.gif); }
.editButton{ background-image:url(../images/icons/edit.gif); }
.delButton{ background-image:url(../images/icons/delete.gif); }

.addButton:hover,
.saveButton:hover,
.editButton:hover,
.delButton:hover { outline:1px inset #333; }

/*admin */
#upload-status{ font-size:12px; width:80%; margin:10px; padding:5px; border:1px dotted #999; background:#eee; }
#upload-status, #loader, #thumbnail_form, #herbArea, #save_thumb_col{display:none;}
#MessagePane{border:1px solid gray; width:100%; color:#077b3f; font-size:larger;}

#genusBox,
#speciesBox,
#partBox,
#originBox,
#supplierBox,
#herbListBox,
#herb_name{width:12em;}

/* ol */
.database li{ float:left; width:30%; margin-left:10px; height: 53px;}

/* end css by rehan anis */

#content
{
    padding:0 10px;
    overflow-x: hidden;
}

@media (min-width: 1024px) {
    #menu + #content{
        margin-left:220px;
    }
}



#menu.collapse + #content{
    margin-left:0;
}


#sidebar
{
    padding: 10px 20px;
}
/*
* Menu
*/
/* menu */

#menu{
    background: #f5f5f5;
    line-height: 30px;
    margin-bottom: 20px;
    padding: 5px 5px;
    height: auto;
    width: 200px;
    border-radius: 10px;
    float: left;
}

#menu ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

#menu > ul > li{ /* Top Level */
    padding: 6px 5px 5px 0px;
}

#menu > ul > li > a, /* opencart menu */
#menu > ul > li > span /* yii menu */
{
    font-size: 14px;
    color: #1d2e7b;
    line-height: 14px;
    font-weight: 700;
    text-decoration: none;
    display:block;
    padding: 6px 10px 6px 10px;
}

/* Second Level */
#menu > ul ul{ /*This defines every level */
    /*display: none;*/
    /*background-color: #1d2e7b;*/
    padding: 5px;
    border: 1px solid #000000;
    border-radius: 0px 0px 5px 5px;
}

/*#menu > ul > li:hover > div, opencart menu
#menu > ul > li:hover > ul yii menu
{
    display: table;
    position:absolute;
    z-index: 25;
}*/

#menu a.parent::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top:   4px solid;
    border-right: 4px solid transparent;
    border-left:  4px solid transparent;
    content: " ";
}

#menu > ul > li > ul > li > a,
#menu > ul > li > ul > li > span
{
    text-decoration: none;
    /*color: #f5f5f5;*/
    white-space: nowrap;
    display: block;
    font-weight: 700;
    padding: 5px;
    /*text-align: left;*/
}

#menu ul li:hover > a,
#menu ul li:hover > span
{
    background-color: #1d2e7b;
    border-radius: 5px;
    color:#f5f5f5;
}

#menu > ul > li > ul li > ul{    /*Third Level & beyond */

}
#menu > ul > li > ul li:hover > ul{

}
#menu > ul > li > ul > li ul > li > a, #menu > ul > li > ul > li ul > li > span{
    text-decoration: none;
    padding: 4px;
    /*color: #FFFFFF;*/
    display: block;
}
#menu > ul > li > ul > li ul > li:hover > a,
#menu > ul > li > ul > li ul > li:hover > span{
    /*background: #008200;*/
}

/* end of css menu from http://stackoverflow.com/questions/12359829/how-to-add-a-3rd-level-to-my-css-drop-down-menu */


#menu > ul > li ul + ul{
    padding-left: 20px;
}

.wiiMenu, #wiiMenu,
.PMSMenu, #PMSMenu {clear:both;}

.small ul li span,
.small ul li a { font-size:9px !important; padding:5px 2px !important; }


div.form .rememberMe label
{
    display: inline;
}

div.view
{
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #C9E0ED;
}

div.view b,
div.view span{
    margin:auto 2px;
    width:90px;
    display:inline-block;
}

div.breadcrumbs
{
    font-size: 0.9em;
    padding: 5px 20px;
    float: left;
}

div.breadcrumbs span
{
    font-weight: bold;
}

div.search-form
{
    padding: 10px;
    margin: 10px 0;
    background: #eee;
}

#tabs{
    overflow: hidden;
}

#gallery { padding: 10px; width:40%; }
#gallery ul { list-style: none; background-color:#ddd ;}
#gallery ul li { display: inline; }
#gallery ul li img {border:5px solid #fff;}

.ui-autocomplete {max-height: 200px !important; overflow-y: scroll !important;}

#right, .right {float:right !important;}
#left, .left {float: left !important;}

.modal-body {overflow: hidden;}

.modal-body form div.row {margin-left:5px; margin-right: 5px;}

#loading { display: none; height: 37px; width: 25px; background: transparent url('../images/webcare-pk-animation-25px.gif') no-repeat center !important; opacity: 1; }

.loading { background: #fff url('../images/webcare-pk-animation.gif') no-repeat center 10px !important; opacity: 1; }
.loading * { opacity: .8; }