@charset "utf-8"; 
/* CSS Document */

/*Blue Font is #4c55b0 Orange Font is #9d5622 Yellow is #F2D191*/

body
{
	position: absolute;
	height: 100%;
	margin: 0px;
	padding: 0px;
	width: 100%;
	border-bottom-width: 0px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-left-width: 0px;
	background-repeat: repeat;
	background-color: #ffffff;
	background-attachment: scroll;
}

#leftPadding
{
   height: 10px;
}

#wrapperWrapper
{
   margin: 0px;
   padding: 10px 10px 10px 10px;
}

#wrapper {
   margin: 0px auto 10px auto;
   padding: 0px;
   width: 100%;
   max-width: 960px; 
	background-color: #ffffff;
	border:0px solid #000;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	/*float: none;*/
	/*clear: both;*/
}

#wrapper h1
{
	color: #303030;
	text-align: center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 13pt;
	margin: 15px 0px 0px 0px;
	padding: 0px;
	font-weight: bold;
}

#content
{
	height: auto;
	margin: 0px;
	padding: 0px;
}

#content h1
{
	color: #9d5622;
	text-align: center;
}

#content p
{
	color: #9d5622;
	text-align: center;
}

#header
{
   height: 300px;
}

#header_backupL
{
   background-image: url(../pics/bannerLogo.png);
}

#header_backupXXS
{
   background-image: url(../pics/bannerLogoXXS.png);
}

/*(for the navbar)*/
#links {
   margin: 0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   width: 100%;
   max-width: 960px;
   /*height: 50px;*/
   /* background-image: / *<JBOTMJ linkBG_Pic>* /url(../pics/linksBackground.png)/*</JBOTMJ linkBG_Pic>* /;*/
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 100% 100%; /*cover;*/
}

#linksCollapsedBackup
{
   /* background-image: / *<JBOTMJ linkBG_Pic>* /url(../pics/linksBackground.png)/*</JBOTMJ linkBG_Pic>* /;*/
}

#linksExpandedBackup
{
   /* background-image: / *<JBOTMI expandedNavbarBG_FN>* /url(../pics/linksBackgroundExpanded.png)/*</JBOTMI expandedNavbarBG_FN>* /; */
}

#links ul
   {
   list-style:none;
   margin: 0px;
   padding: 0px;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:11pt;
   color: #fff;
   /*float: left;*/
   float: none;
   display:inline-block;
   white-space:nowrap; 
}

#links li
   {
   display:inline;
   text-decoration:none;
   margin:0px 0px 0px 0px;
   /*<JBOAdded>*/
   padding: 0px;
   /*</JBOAdded>*/
   background-color: rgba(0, 0, 0, 0);
}

#links a
   {
   display: block;
   color: #ccbfa8;
   text-decoration:none;
   font-weight: bold;
   margin: 0px;
   padding: 10px 15px;
}

#links li a:hover
   {
   color: #ffffff;
   cursor:pointer;
   background-color: rgba(0, 0, 0, 0);
}

#links .current a
{
   color: #ffffff;
   cursor:pointer;
}

.navbar
{
   /*min-height: 1px; /*defaults to 50px;*/
   border-radius: 0px;
   border: 0px solid transparent;
}

.toggleNavButton
{
   background-color: #ffffff;
}

#column1_wrapper
{
   margin: 0px;
   padding: 0px;
}

#column1 {
	padding: 0px;
   width: calc(100% - 10px);
   max-width: 266px;
	height:327px;
   overflow: hidden;
   background-image: url(../pics/sidebarGraphic.png);
   background-position: center center;
   background-repeat: no-repeat;
   background-size: cover;
	border: 0px solid #9F815D;
	margin: 0px 10px 0px 0px; /* touching. blah9. blah10; */
}

#column1  #tryItButton1{
	text-align: center;
	width: 128px;
	height: 30px;
	margin: 0px 0px 0px 66px;
	padding: 0px;
}

#column1 a {
	margin: 0px;
	padding: 0px;
	border: 0px none #000;
}

#column1 h1 {
	font-size: 16pt;
	color: #9d5622;
	text-align: center;
}

#column1 p {
	color: #2c2c2c;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11pt;
	text-align:center;
	line-height:30px;
	font-weight:bold;
	margin:126px 0px 14px 20px;
}

#column2 {
	font-family: Verdana, Geneva, sans-serif;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	background-color: #ffffff;
}

#column2 #table {
	width: 100%; /* 524px; /*was 200px; 594px*/
	margin: 0px;
	padding: 0px 20px 0px 20px;
	text-align: left;
}

#column2 #table ul{
	font-family: Arial, Helvetica, sans-serif;
	margin: 0px;
	font-size: 10pt;
    color: #4d4d4d;
	font-weight: normal;
	list-style-type: disc;
	padding-top: 4px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#column2 #table li {
	list-style:none;
	color: #4d4d4d
	display: block;
    font-size: 10pt;
	background-image:url(../pics/bullet.png);
	background-position:left top;
	background-repeat:no-repeat;
	padding:0px 0px 0px 10px;
	margin:5px 0px 5px 0px;
}

#column2 table, th, td {
	margin: 0px;
	text-align: left;
	border-collapse: collapse;
	padding: 0px;
	border: 0px;/*1px solid black;*/
}

#column2  #tryItButton2{
	text-align: center;
	width: 100%;/* 640px; */
	padding: 0px;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	height: 35px;
}

#column2 h1 {
	color: #4d4d4d;
	font-size: 13pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin: 15px 0px 0px 0px;
	padding: 0px;
	font-weight: bold;
	text-align: center;
}

/*<JBOAdded>*/

#column2 a {
	color: #0052fc;
	text-decoration: underline;
	font-weight:normal;
	font-size: 10pt;
   border-width: 0px;
}

#column2 a:hover
{
   color: #0052fc;
}

#column2 h1 a 
{
	color: #0052fc;
	text-decoration: underline;
	font-weight: bold;
	font-size: 13pt;
   border-width: 0px;
}

/*</JBOAdded>*/
/*<JBORemoved/>
#column2 a {
	color: / *<JBOTMI inParagraphLinkColor>* /#0048ff/ *</JBOTMI inParagraphLinkColor>* /;
	text-decoration: / *<JBOTMI shouldUnderlineLinks>* /underline/ *</JBOTMI shouldUnderlineLinks>* /;
	font-weight:normal;
	font-size: 10pt;
         border-width: 0px;
}
*/

#column2 p {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10pt;
	font-style: normal;
	line-height:22px;
	color: #4d4d4d;
	text-align: justify;
	margin: 20px 15px 0px 15px;
}

#column2 h2 {
	color: #965525;
   /*<JBOAdded>*/
   font-family: Verdana, Arial, Helvetica, sans-serif;
   /*</JBOAdded>*/
	text-align: center;
	font-size: 12pt;
	margin: 5px;
	padding: 0px;
}

#column2 #orderForm{
	width: 280px; /*280px*/
	font-size:10pt;
	color: #000000;
	padding:20px 20px 20px 20px;
	margin: 20px auto;
	border: #c3c3c3 1px solid;
	background-color: #f4f4f4; 
}

#column2 #orderForm input 
{
	margin:0px 0px 10px 0px;
}

#column2 #orderForm2
{
	width: 180px;
	/* padding-top: 0px;
	/ * padding-right: 230px;
	/ * padding-bottom: 0px;
	/ * padding-left: 230px;
	/ * margin-top: 50px;
	/ * margin-right: 0px;
	/ * margin-bottom: 50px;
	/ * margin-left: 0px; */
	margin: 0px 210px;
	padding: 0px;
}

#copyright
{
	/* background-image:url(../pics/footer_bg.png); */
	/* background-repeat:repeat-x; */
	/*<JBORemove BB/>width: 950px;*/
	height:42px;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 0px;
}

#copyright  p
{
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	color: #3d3d3d;
	font-style: normal;
	/*<JBORemoved/>line-height: 10px;*/
   /*<JBOAdded>*/
   line-height: 15px;
   /*</JBOAdded>*/
	font-weight: normal;
	font-variant: normal;
	text-decoration: none;
	margin: 0px;
	padding: 5px;
	text-align: center;
}

#paypalLogo
{
	background-image: url(../pics/paypalLogo.png);
	height: 34px;
	width: 120px;
   margin: 5px auto 5px;
	/*margin-top: 0px;
	margin-right: 82px;
	margin-bottom: 0px;
	margin-left: 82px;*/
}

#paypalLogo2
{
	background-image: url(../pics/paypalLogo.png); 	/* paypal_logo.gif); */
        background-repeat: no-repeat;
	height: 50px;
	width: 120px;
	margin-top: 10px;
	margin-right: 4px;/* 17px; */
	margin-bottom: 0px;
	margin-left: 30px;/* 17px; */
	padding: 0px;
         border-color: 0xffffff;
}

/*<JBOAdded>*/
#paypal1
{
   margin: 0px;
   padding: 0px;
   width: 100%;
}

#paypal2
{
   margin: 0px;
   padding: 0px;
}

#paypal3
{
   margin: 0px;
   padding: 0px;
   width: 100%;
}

.paypal3_tr
{
   margin: 0px;
   padding: 0px;
}

.paypal3_td
{
   margin: 0px;
   padding: 0px;
}

.paypal3_inputField
{
   margin: 0px auto;
   padding: 0px;
   width: calc(100%); /*-4px*/
}

/*</JBOAdded>*/

#buyNowButton
{
	margin: 0px;
	padding: 0px;
}

#paypal
{
	background-color: #FFF;
	padding: 0px;
	width: 320px;
	margin-top: 0px;
	margin-right: 320px;
	margin-bottom: 0px;
	margin-left: 320px;
	border-top-width: 10px;
	border-right-width: 10px;
	border-bottom-width: 10px;
	border-left-width: 10px;
	border-top-color: #FFF;
	border-right-color: #FFF;
	border-bottom-color: #FFF;
	border-left-color: #FFF;
}

#contact
{
	/*<JBORemoved>width: 382px;</JBORemoved>*/
   /*<JBOAdded>*/
   min-width: 300px;
   max-width: 450px; /*This was the original width*/
   width: 90%;
   padding-bottom: 10px;
   /*</JBOAdded>*/
	font-size:10pt;
	/* margin: 0px 0px 0px 0px; */
	padding-top: 20px;
	padding-right: 10px;
	/*<JBORemoved>padding-bottom: 20px;</JBORemoved>*/
	padding-left: 10px;
	/*<JBORemoved/> margin:0px 0px 0px 140px; */
   /*<JBOAdded>*/
   margin: 0px auto;
   /*</JBOAdded>*/
	border: #c3c3c3 1px solid; /* blah 22; */
	background-color: #f4f4f4;
	color: #000000;
}

.contactFieldLabel
{
   padding-left: 5px; /* 5px; *//*10px;*/
   padding-right: 5px;
}

.contactField
{
   margin: 0px 0px 10px 0px;
   padding: 0px;
   width: calc(100% - 10px);
}

#contact input
{
 border:#c3c3c3 1px solid;
 margin: 0px 5px 10px 5px; /* 0px 10px 10px 10px; *//*0px 0px 10px 20px;*/
}

#contact textarea
{
 border:#c3c3c3 1px solid;
 margin: 0px 5px 10px 5px; /* 0px 10px 15px 10px; *//*0px 0px 10px 20px;*/
}

.sendButtonTD
{
   margin: 0px 10px;
}

#contact .sendButton
{
	background-image:url(../pics/contactSendButton.png);
	width:73px;
	height:27px;
	color:#FFFFFF;
	/*<JBORemoved/> margin:0px 0px 0px 193px; */
   /*<JBOAdded>*/
   margin: 0px calc((100% - 74px) / 2);
   /*</JBOAdded>*/
   
}

.error
{
	color: #F00;
}

.yellow
{
	color: #F2D191;
}

.blue
{
	color: #2A3F65;
}

br.clear
{
	clear:both;
	margin:0;
	font-size:1px;
	line-height:0;
	height:0;
}

.red {
	color: #F00;
	font-weight: bold;
}

/******************************************************************************/
/* MediaStuff */
/*
	According to w3schools, my definitive source (and this seems to be the correct one)
	My cell phone is 375px
	XXS < 574px
	574px <= XS < 768px
	768px <= Small < 992px
	992px <= Med < 1200px
	1200px <= Lg
   
   If you don't specify what to do for large, it just keeps using medium.

	According to the other random page I looked at:
	My cell phone is 375px
	XS < 575px (576px?)
	575px (576px?) <= Small < 768px
	768px <= Med < 992px
	992px <= Lg < 1200px
	1200px <= XL
*/
@media (max-width: 574px) /* xxs 574px and down */
{
   .xxs-appear
      {
      display: block;
   }
   
   .xxs-disappear
      {
      display: none;
   }
   
   #header
      {
      margin: 0px; /* 0px gap. blah8; */
      padding: 0px;
      width: 100%;
      max-width: 960px;
      background-image: url(../pics/bannerLogoXXS.png);
      background-position: center center; /*was center;*/
      background-repeat: no-repeat;
      background-size: cover;
   }
   
   #links
      {
      /*height: 50px;*/
      /* background-image: / *<JBOTMJ linkBG_Pic>* /url(../pics/linksBackgroundXXS.png)/ *</JBOTMJ linkBG_Pic>* /;*/
      /*background-size: 100% auto; / *cover;*/
   }
}

@media (min-width: 575px) /* xs 575px and up */
{
   .xs-appear
      {
      display: block;
   }
   
   .xs-disappear
      {
      display: none;
   }
   
   #header
      {
      margin: 0px; /* 0px gap. blah8; */
      padding: 0px;
      width: 100%;
      max-width: 960px;
      background-image: url(../pics/bannerLogo.png);
      background-position: center center; /*was center;*/
      background-repeat: no-repeat;
      background-size: cover;
   }
}

@media (min-width: 768px) /* small 768px and up */
{
   .sm-appear
      {
      display: block;
   }
   
   .sm-disappear
      {
      display: none;
   }
   
   /*blah2; (after the navbar goes away)*/
   
   #links {
      margin: 0px 0px 0px 0px;
      /* background-image: /*url(../pics/linksBackground.png)/*;*/
      padding: 0px 0px 0px 20px; /*<JBO/>7px 0px 0px 0px;*/
   }

   #links ul{
      margin: 0px;
      padding: 14px 0px; 
      list-style:none; 
      display:table;
      white-space:nowrap; 
      font-family:Verdana, Arial, Helvetica, sans-serif;
      font-size:11pt;
      color: #fff;
      float:left;
   }

   #links li {
      display:inline;
      text-decoration:none;
      color: #fff;
      margin:0px 0px 0px 0px;
      padding:0px 0px 0px 0px;
      float: none;
   }

   #links a {
      display: inline;
      color: #ccbfa8;
      text-decoration:none;
      /*<JBOAdded>* /font-weight: bold;/*</JBOAdded>*/
   }
   
   #header
      {
      margin: 0px; /* 0px gap. blah8; */
      padding: 0px;
      width: 100%;
      max-width: 960px;
      background-image: url(../pics/bannerLogo.png);
      background-position: center center; /*was center;*/
      background-repeat: no-repeat;
      background-size: cover;
   }
}

@media (min-width: 992px) /* med 992px and up */
{
   .md-appear
      {
      display: block;
   }
   
   .md-disappear
      {
      display: none;
   }
   
   #links li
      {
      padding:0px 0px 0px 5px;
   }
   
   #header
      {
      margin: 0px; /* 0px gap. blah8; */
      padding: 0px;
      width: 100%;
      max-width: 960px;
      background-image: url(../pics/bannerLogo.png);
      background-position: center center; /*was center;*/
      background-repeat: no-repeat;
      background-size: cover;
   }
}

@media (min-width: 1200px) /* large 1200px and up*/
{
   .lg-appear
      {
      display: block;
   }
   
   .lg-disappear
      {
      display: none;
   }
   
   #links li
      {
      padding:0px 0px 0px 5px; /*0px 18px 0px 45px; 40px?*/
   }
   
   #header
      {
      margin: 0px;
      padding: 0px;
      width: 100%;
      max-width: 960px;
      background-image: url(../pics/bannerLogo.png);
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover; /*contain; cover;*/
   }
}

html,body
{
   min-width: 320px;
   width: 100%;
}

/******************************************************************************/

<!--[if IE]>
<style type="text/css">
#nav ul {display:inline-block;}
#nav ul {display:inline;}
#nav ul li {float:left;}
#nav {text-align:center;}
</style>
<![endif]-->

/******************************************************************************/
