html,body	                {margin: 0; padding: 0; width: 100%; height: 100%;}
:focus		                {outline: none;}

::placeholder               {color: #888; opacity: 1; /* Firefox */}
:-ms-input-placeholder      {color: #888; /* Internet Explorer 10-11 */}
::-ms-input-placeholder     {color: #888; text-align: ;  /* Microsoft Edge */}

@-ms-viewport               {width: device-width;}

html                        {box-sizing: border-box;}
*, *:before, *:after        {box-sizing: inherit;}


body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, select, p, blockquote, th, td, label
                            {margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif;}
body                        {background: rgb(198, 172, 138); position: relative;}

p                           {font-size: 13px; line-height: 13px; margin-top: 10px; margin-bottom: 15px;}
h1                          {font-size: 36px; line-height: 36px; margin-top: 25px;}
h2                          {font-size: 24px; line-height: 24px; margin-top: 25px;}
h3                          {font-size: 18px; line-height: 18px; margin-top: 15px;}
h4                          {font-size: 16px; line-height: 16px; margin-top: 15px;}
h5                          {font-size: 14px; line-height: 14px; margin-top: 10px;}
h6                          {font-size: 14px; line-height: 14px; margin-top: 10px;}

h1, h2, h3, h4, h5, h6      {margin-bottom: 10px; font-weight: normal;}

td, th                      {padding: 1px;}
img                         {border: none;}

a, a:link, a:visited, a:hover
                            {text-decoration: none;}

input[type='button'], input[type='submit'], input[type='checkbox'],
input[type='image'],  input[type='radio'],  select, button
                            {cursor: pointer;}


hr                          {margin: 15px 0 15px 0; display: block; background: #c8c8c8; height: 1px; border: none;}

blockquote                  {margin: 10px 0 10px 15px; font-style: italic; font-size: 130%;}
blockquote > *:first-child:first-letter
                            {font-size: 150%;}

.nowrap                     {white-space: nowrap;}


/*----------------------------------------------------------------*/


#container                  {min-width: 320px; padding: 0px;
                             background: -webkit-linear-gradient(  right, #f0f1f2, #f6f7f8, #f0f1f2);
                             background:      -o-linear-gradient(   left, #f0f1f2, #f6f7f8, #f0f1f2);
                             background:    -moz-linear-gradient(   left, #f0f1f2, #f6f7f8, #f0f1f2);
                             background:         linear-gradient(to left, #f0f1f2, #f6f7f8, #f0f1f2);}

@media screen and (min-width: 640px) {
    #container                  {padding: 20px;}
}

@media screen and (min-width: 1024px) {
    #container                  {max-width: 1024px; border-radius: 10px; margin: 10px auto; box-shadow: 0 0 10px #444;}
}

#header                     {width: 100%; padding: 10px 10px 0px 10px;}
#header .cont               {text-align: right; display: block; font-size: 0;}
#header a, #header p, #header .spacer
                            {display: inline-block; vertical-align: top; margin: 0; color: #a0a1a2; font-size: 11px; line-height: 32px;}

#header .spacer             {width: 32px; height: 32px; background: url('images/topmenu_item_bg.png') no-repeat center;}
#header .media              {width: 32px; height: 32px; margin: 0px 2px;}

@media screen and (min-width: 640px) {
    #header                     {padding: 0px;}
}


/*----------------------------------------------------------------*/


#menu .show-menu            {width: 100%; font-size: 16px; line-height: 28px; color: rgb(127,131,132); display: block; text-align: center;
                             box-shadow: 0 0 10px #888, 0 0 5px #fff inset;
                             background: -webkit-linear-gradient(      top, #f0f1f1, #e7e8e8);
                             background:      -o-linear-gradient(   bottom, #f0f1f1, #e7e8e8);
                             background:    -moz-linear-gradient(   bottom, #f0f1f1, #e7e8e8);
                             background:         linear-gradient(to bottom, #f0f1f1, #e7e8e8);}
#menu input[type=checkbox]  {display: none;}
#menu input[type=checkbox]:checked ~ ul {display: block;}

#menu                       {width:  90%; min-height: 52px; margin: 0 5%;}
#menu ul                    {width: 100%; list-style: none; margin: 0 0 32px 0; padding: 0; display: none;}
#menu li                    {width: 100%; text-align: center;}
#menu a                     {width: 100%; font-size: 16px; line-height: 28px; display: block; text-decoration: none;
                             color: rgb(127,131,132); box-shadow: 0 0 10px #888, 0 0 5px #fff inset;
                             background: -webkit-linear-gradient(      top, #f0f1f1, #e7e8e8);
                             background:      -o-linear-gradient(   bottom, #f0f1f1, #e7e8e8);
                             background:    -moz-linear-gradient(   bottom, #f0f1f1, #e7e8e8);
                             background:         linear-gradient(to bottom, #f0f1f1, #e7e8e8);}

#menu li ul                 {margin: 0; display: block; box-shadow: 0 0 10px #888, 0 0 5px #fff inset;}
#menu li ul a               {color: rgb(159,163,164); font-size: 14px; line-height: 28px; box-shadow: none;
                             background: -webkit-linear-gradient(      top, #feffff, #f0f1f1);
                             background:      -o-linear-gradient(   bottom, #feffff, #f0f1f1);
                             background:    -moz-linear-gradient(   bottom, #feffff, #f0f1f1);
                             background:         linear-gradient(to bottom, #feffff, #f0f1f1);}

@media screen and (min-width: 800px) {
    #menu                       {width: auto; margin: 0; position: relative;}
    #menu ul                    {list-style: none; font-size: 0; display: block; position: static; margin: 0;}
    #menu li                    {width: auto; display: inline-block; vertical-align: top; margin-right: 1px;
                                 box-shadow: 0 0 10px #888; border-radius: 10px 10px 0 0; position: relative;}
    #menu li:last-child         {margin-right: 0;}
    #menu a                     {width: auto; font-size: 15px; color: rgb(127,131,132); text-decoration: none; line-height: 46px;
                                 border-radius: 10px 10px 0 0; box-shadow: 0 0 5px rgb(248,249,250) inset;
                                 display: block; padding: 0 15px 4px 15px; margin: 0;
                                 background: -webkit-linear-gradient(      top, #f0f1f1, #e7e8e8);
                                 background:      -o-linear-gradient(   bottom, #f0f1f1, #e7e8e8);
                                 background:    -moz-linear-gradient(   bottom, #f0f1f1, #e7e8e8);
                                 background:         linear-gradient(to bottom, #f0f1f1, #e7e8e8);}

    #menu .show-menu            {display: none;}

    #menu li:hover a, #menu a.r1
                                {position: relative; z-index: 121; line-height: 46px; height: 52px;
                                 background: -webkit-linear-gradient(      top, #f0f1f1, rgb(248,249,250), rgb(248,249,250));
                                 background:      -o-linear-gradient(   bottom, #f0f1f1, rgb(248,249,250), rgb(248,249,250));
                                 background:    -moz-linear-gradient(   bottom, #f0f1f1, rgb(248,249,250), rgb(248,249,250));
                                 background:         linear-gradient(to bottom, #f0f1f1, rgb(248,249,250), rgb(248,249,250));}

    #menu li:hover a            {z-index: 125;}
    #menu a.r1                  {color: rgb(166, 126, 89);}
    #menu li ul li a.r1         {color: rgb(166, 126, 89); font-weight: bold;}

    /*-- sub menu css --*/

    #menu li ul, #menu li ul li, #menu li ul a, #menu li ul li a, #menu li ul li:hover, #menu li ul a:hover, #menu li ul li a:hover
                                {height: auto !important; background: none !important; box-shadow: none !important;
                                 border-radius: 0 !important; margin: 0 !important; padding: 0 !important; line-height: 28px !important;}

    #menu li div                {width: 240px; visibility: hidden; position: absolute; top: 44px; left: 0; z-index:124; padding: 2px 20px; overflow: hidden;
                                 border-radius: 0 10px 10px 10px; background: rgb(248,249,250); box-shadow: 0px 0px 10px #888; height: 0; transition: height 0.25s;}
    #menu li ul                 {width: 100%;}
    #menu li ul li              {width: 100%; text-align: left;}
    #menu li ul li a:hover      {color: rgb(166, 126, 89)}

    #menu li ul li              {border-bottom: 1px solid #eee; border-top: 1px solid #fff;}
    #menu li ul li:first-child  {border-top: none;}
    #menu li ul li:last-child   {border-bottom: none;}

    #menu li:hover div          {visibility: visible; /*height: 274px*/; height: 334px;}
}


@media screen and (min-width: 930px) {
    #menu li                    {margin-right: 4px;}
    #menu a                     {font-size: 18px;line-height: 46px;}
}


/*----------------------------------------------------------------*/

#banner                     {height: 164px; width: 100%; margin-top: -8px; box-shadow: 0 0 10px #888; position: relative;}
#bannerimages               {width: 100%; height: 100%; overflow: hidden; position: relative;}
#bannerimages div           {width: 100%; height: 100%; position: absolute; top: 256px; left: 0;}

@media screen and (min-width: 640px) {
    #banner                     {height: 256px; padding: 12px; border-radius: 10px 10px 0 0;
                                 background: -webkit-linear-gradient(      top, rgb(248,249,250), #e7e8e8);
                                 background:      -o-linear-gradient(   bottom, rgb(248,249,250), #e7e8e8);
                                 background:    -moz-linear-gradient(   bottom, rgb(248,249,250), #e7e8e8);
                                 background:         linear-gradient(to bottom, rgb(248,249,250), #e7e8e8);}
}

/*----------------------------------------------------------------*/

#mainbody                   {width: 100%; margin-top: -8px; position: relative; padding: 20px 20px 20px 20px;
                             border: 1px solid #fff; background: rgb(248,249,250); box-shadow: 0 0 10px #888;}
#mainbody.withbann          {margin-top: 0; box-shadow: 0 0 10px #888;}

#mainbody p                 {font-size: 13px; line-height: 150%; color: rgb(127, 131, 132);}
#mainbody h1                {font-size: 30px; line-height: 100%; color: rgb( 86, 89, 90);}
#mainbody h2                {font-size: 22px; line-height: 100%; color: rgb(166, 126, 89);}
#mainbody a                 {font-size: 13px; line-height: 100%; color: rgb(166, 126, 89); font-weight: bold;}

@media screen and (min-width: 640px) {
    #mainbody                   {border-radius: 0px;}
    #mainbody.withbann          {border-radius: 0px;}
}

#pagepath                   {height: 20px; list-style: none; margin: 0; padding: 0; font-size: 0;}
#pagepath li                {display: inline-block; vertical-align: middle; margin: 0; padding: 0 10px 0 15px;
                             background: url(images/breadcrumbs.png) 0 4px no-repeat;}
#pagepath li:first-child    {padding-left: 0px; background: none}
#pagepath li a              {font-size: 12px; font-weight: normal; margin: 0; padding: 0; display: block; line-height: 20px;}
#pagepath li p              {font-size: 12px; font-weight: bold  ; margin: 0; padding: 0; display: block; line-height: 20px;}
#pagepath li a:hover        {color: rgb(82,146,184)}

/*----------------------------------------------------------------*/

#servone, #servtwo, #servthr
                            {text-align: center; font-size: 0;}
#servone div p, #servone a p, #servtwo div p, #servtwo a p, #servthr div p, #servthr a p
                            {font-size: 13px; line-height: 200%; margin: 0; color: #fff; font-weight: normal; display: block;
                             position: absolute; bottom: 0px; left: 0; width: 100%; background: rgba(0,0,0,0.75);}
#servone span, #servtwo span, #servthr span
                            {font-size: 12px; line-height: 100%; color: rgb(127, 131, 132); text-align: center; display: block; margin: 2px 5%;}
#servone a, #servone div, #servtwo a, #servtwo div, #servthr a, #servthr div
                            {width: 100%; height: 208px; margin: 5px 0; display: inline-block; vertical-align: top; position: relative;}

@media screen and (min-width: 640px) {
    #servone a, #servone div    {width: 95%; height: 208px; margin: 5px 0;}

    #servtwo a, #servtwo div, #servthr a, #servthr div
                                {width: 45%; height: 208px; margin: 5px;}
}

@media screen and (min-width: 800px) {
    #servthr a, #servthr div    {width: 30%; height: 208px;}
}


/* ---------------------------------------------------------------*/


#feeds                      {text-align: center; font-size: 0; font-size: 0; margin-top: 20px;}
#facebook                   {width:  100%; height: 28px; display: inline-block; vertical-align: top;}
.fbfeed                     {display: none;}
.feedshead                  {max-width: 500px; margin: auto;}
.feedsjoin                  {height: 28px; text-align: center; margin: auto;}
.feedsjoin a                {height: 28px; text-align: center; margin: auto; font-size: 14px; line-height: 28px; color: #444; display: block;}
.feedslike                  {height: 28px; text-align: center; margin: auto;}

@media screen and (min-width: 640px) {
    #feeds                      {background: linear-gradient(to top, #d7d8d8, #e7e8e8); border-radius: 0 0 10px 10px; box-shadow: 0 0 10px #888; margin-top: 0px;}
    #facebook                   {height: 360px; margin: 10px 0;}
    .fbfeed, .fb-page           {max-width: 500px; height: 320px; margin: auto; display: block;}
    .fbfeed                     {padding: 4px; max-width: 510px; height: 357px;}
    .feedshead                  {position: relative; margin-top: 2px; min-height: 28px;}
    .feedsjoin                  {position: absolute; top: 2px; left: 2px; z-index: 10;}
    .feedsjoin a                {color: #000;}
    .feedslike                  {float: right; margin-top: 3px;}
}

/*----------------------------------------------------------------*/

#footer                     {width: 100%; margin-top: 20px; padding: 20px 0px 0 0px; position: relative; font-size: 0; text-align: center;}
#footer p                   {font-size: 12px; line-height: 120%; color: rgb(160, 161, 162); margin: 0px auto;}
#footer p a                 {font-size: 12px; line-height: 120%; color: rgb(166, 126,  89);}
#footer li a                {font-size: 14px; line-height: 200%; color: rgb(166, 126,  89);}
#footer a:hover             {text-decoration: underline;}

#footer a.top               {width: 41px; height: 45px; display: block; background: url('images/footer_anchor.png') no-repeat;}
#footer a:hover.top         {background-position: 0 -50px;}

#approv                     {display: block; margin: auto; margin-bottom: 32px;}
#siteseal                   {display: block; margin: auto; margin-bottom: 32px;}

#sitemap                    {padding: 40px 20px 0 20px; text-align: center;}
#sitemap ul                 {list-style: none; margin: 0 0 32px 0; padding: 0;}
#sitemap li                 {display: inline-block; vertical-align: middle; margin: 0; padding: 0;}
#sitemap a                  {padding: 0px 10px; ackground: url('images/bullet3.png') 100% 4px no-repeat;}

#footer span.big            {display: none;}
#footer p                   {display: block;}

@media screen and (min-width: 640px) {
    #footer                     {padding: 20px 20px 0 20px;}
    #footer p                   {font-size: 11px; color: rgb(160, 161, 162); margin: 0px auto;}
    #footer li a                {font-size: 11px; color: rgb(166, 126,  89);}
    #footer p a                 {font-size: 11px; color: rgb(166, 126,  89);}

    #approv                     {position: absolute; top: 10px; left: 0px;}
    #siteseal                   {position: absolute; top: 18px; right: 0px;}
    #sitemap                    {padding: 0px 164px;}

    #sitemap a                  {padding: 0px 5px;}

    #footer span.big            {display: inline-block;}
    #footer p                   {display: inline-block;}
}

/*----------------------------------------------------------------*/


fieldset                    {margin: 10px 0; padding: 20px 0; border: 1px solid #c8c8c8; border-left: none; border-right: none;}
legend                      {font-size: 16px; font-weight: bold; padding: 0 10px 0 0px; background: rgb(248,249,250); color: rgb(127,131,132);}

@media screen and (min-width: 640px) {
    fieldset                    {margin: 10px 0; padding: 20px; border: 1px solid #c8c8c8;}
    legend                      {font-size: 16px; font-weight: bold; padding: 0 10px 0 10px; background: rgb(248,249,250); color: rgb(127,131,132);}
}

#contform input,
#contform select,
#contform button,
#contform textarea          {font-size: 14px;}
#contform label             {font-size: 14px; line-height: 18px; color: rgb(127,131,132); font-weight: bold; min-width: 140px;}
#contform .option label     {font-size: 14px; line-height: 18px; color: rgb(127,131,132); font-weight: normal; min-width: auto; margin-left: 6px;}
#contform .smaller          {font-size: 11px; line-height: 18px; color: rgb(127,131,132);}
#contform .conterror        {font-size: 12px; line-height: 12px; color: #f42; margin-top: 2px;}
#contform .redstar	        {font-size: 14px; line-height: 18px; color: #f42;}

#contform input[type="text"], #contform input[type="email"], #contform input[type="number"],
#contform input[type="date"], #contform input[type="file"], #contform select,
#contform textarea          {width: 100%; height: 100%; padding: 5px; border: 1px solid #d4d0ba; background: #fff;}
#contform input[type="date"]
                            {max-width: 200px;}

#contform input[type='text']:focus, #contform input[type='email']:focus, #contform input[type='number']:focus,
#contform input[type='date']:focus, #contform input[type="file"]:focus, #contform select:focus,
#contform textarea:focus    {border: 2px solid #06c;}

#contform select            {min-width: 50%;}
#contform textarea          {overflow-y: auto;}
#contform button            {height: 30px;}

#contform .statinput        {width: 100%; height: 100%; padding: 5px; border: 1px solid #d4d0ba; background: #f4f0da;}
#contform .statformrow      {display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: flex-start;} /* Main Form */
#contform .statlabel        {display: flex; flex-wrap:    wrap; justify-content: space-between; align-items: center;}
#contform .statlabel        {flex: 1; min-width: 160px; min-height:  30px;}
#contform .statuserinput    {flex: 3;}
#contform .statinput        {flex: 1 100%; height:  30px;}

#contform .contformrow      {display: flex; flex-wrap:   wrap; justify-content: space-between; align-items: flex-start;} /* Main Form */
#contform .contlabel        {display: flex; flex-wrap:   wrap; justify-content: space-between; align-items: center;}     /* Label and small text */
#contform .contuserinput    {display: flex; flex-wrap:   wrap; justify-content: space-between; align-items: center;}     /* Whole input area */
#contform .contdate         {display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center;}     /* Date and Calendar input */
#contform .option           {display: flex; flex-wrap: nowrap; justify-content: flex-start;    align-items: center;}     /* Each Radio/Checkbox */

#contform                   {width: 100%;}
#contform .contformrow      {width: 100%;}

#contform .contlabel        {flex: 1 25%; min-width: 160px;}
#contform .contuserinput    {flex: 3 75%;}
#contform .spacer           {flex: 1 100%; height:  20px;}

#contform .conterror        {flex: 1 100%; height:  auto;}
#contform .continput        {flex: 1 100%; height:  30px;}
#contform .contselect       {flex: 1 100%; height:  32px;}
#contform .conttarea        {flex: 1 100%; height: 120px;}
#contform .contdate         {flex: 1 100%; height:  30px; position: relative;}

#contform .option           {flex: 1 25%; height: 18px; min-width: 136px;}

#contform #captchaimg       {max-height: 72px; margin: 0 20px 2px 1px; border: 4px solid #eee; outline: 1px solid #d4d0ba;}
#contform #refresh          {align-self: flex-end; cursor: pointer;}
#contform #refresh:hover    {color: #f42;}


/*----------------------------------------------------------------*/
/*  Calendar styles                                               */
/*----------------------------------------------------------------*/


#calcontain                 {position: absolute; top: 30px; right: 0; z-index: 200; display: none; text-align: center;} /* 252px for each month */
#calendar                   {background: rgba(255,255,255,0.5);} /* 206px for each month */
#calendar div               {font-size: 12px; font-family: Arial, Helvetica, sans-serif;}

#calendarDay, #calendarEntry, #calendarBlank, #calendarArrow
                            {width: 13.65%; height: 20px; border: 1px solid #888; margin: 1px 0; box-shadow: 0 0 5px #444; border-radius: 3px;}
#calendarTitle              {width: 71.15%; height: 20px; border: 1px solid #888; margin: 1px 0; box-shadow: 0 0 5px #444; border-radius: 3px;}

#calendarTitle              {line-height: 20px; background: #ccf; color: #000; font-weight: bold;}
#calendarArrow              {line-height: 23px; background: #ccf;              cursor: pointer;}
#calendarDay                {line-height: 20px; background: #ffa; color: #000;}
#calendarBlank              {line-height: 20px; background: #eee; color: #bbb;}
#calendarEntry              {line-height: 20px; background: #fff; color: #04c; cursor: pointer;}
#calendarEntry:hover        {background: #f90;}

#calendar .row              {display: flex; width: 240px; flex-wrap: nowrap; flex-direction: row; justify-content: space-between; align-items: stretch;}