@import url('https://fonts.googleapis.com/css?family=Orbitron:700,900');

/* ========================================
 * David Lavoie
 *
 * david@nectyr.com
 * ======================================== */


/* ========================================
 * Higher Orbit Products page layout
 * ======================================== */

body { width: 1024px; margin: auto; display: block; color: #000000; background-image: url('http://testing.nectyr.com/higherorbitproducts/images/hop-bg-steel.jpg'); }
header, footer { display: block; }

/* a-href link and rollover activity */
a:link, a:visited { color: #612392; text-decoration: none; outline: none; }
a:hover { color: #555; }

.rightblox h3 { float:right; text-align:right; margin: 8px 10px 0px 10px; }
.rightblox a:link, .rightblox a:visited { text-decoration: underline; font-weight: bold; font-size: 14px; }

.right { float: right; }
.left { float: left; }
.absolute { position: absolute; }
.fiftyleft { margin-left: 50px; }

#maincontent { float: left; width: 1024px; margin-top: 20px; margin-bottom: 20px; border-left: 1px solid #00FE00; border-right: 1px solid #00FE00; border-bottom: 1px solid #00FE00;
-moz-box-shadow: 3px 3px 4px #333; -webkit-box-shadow: 3px 3px 4px #333; box-shadow: 4px 4px 4px #333;
/* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000'); }

.content { float: left; width: 1000px; background-color: #F2F2F2; padding: 20px 12px 20px 12px; }

h1.sorry { font-size: 3em; text-align: center; background-color: rgba(0,0,0,.4); border-radius: 4px; padding: 5.5em 0em; border: 1px solid #612392;}

/* basic text formatting */
p { font-size: 14px; line-height: 1.6em; color: #000000; }
ul { font-size: 14px; color: #000000; }

h1 { font-size: 16px; line-height: 1.3em; color: white; margin: 0px 100px 5px 100px; }
.content h2 { font-size: 18px; line-height: 1.3em; color: #612392; margin: 5px 0px 15px 0px; }
h3 { font-size: 16px; line-height: 1.3em; color: #612392; margin: 0px 100px 5px 0px; }
h4 { font-size: 16px; line-height: 1.3em; font-weight: bold; color: #333; }
h5 { font-size: 19px; line-height: 1.3em; margin: 0px 0px 20px 0px; font-weight: bold; color: #612392; }
h6 { font-size: 16px; line-height: 1.3em; font-weight: bold; color: #612392; font-style: italic; }
.faq p { font-size: 14px; line-height: 1.6em; color: #333; }

.highlight1 { color: #612392; font-weight: bold; }
.highlight2 { color: #54BC00; font-weight: bold; }

.underline { text-decoration: underline; }

/* header elements */
header { height: 150px; width: 1024px; background-color: #F2F2F2; border-top: 1px solid #00FE00; }
header h3 strong { font-size: 40px; font-weight: 900; margin: 0px; color: #000000; }
header h3 { font-family: 'Orbitron', sans-serif; text-transform: uppercase; line-height: 1.5em; font-size: 22px; margin: 40px 0px 0px 0px; font-weight: bold; color: #612392; }
#headercontent { display: block; margin-left: auto; margin-right: auto; text-align: center; }
header .left { float: left; width: 250px; }
header .right { float: right; width: 770px; }
#logo { margin: 17px 0px 0px 20px; }

/* index header elements */
header.indexheader { height: 150px; width: 1024px; background-color: #F2F2F2; border-top: 1px solid #00FE00; }
header.indexheader h3 strong { font-size: 40px; font-weight: 900; margin: 0px; color: #000000; }
header.indexheader h3 { font-family: 'Orbitron', sans-serif; text-transform: uppercase; line-height: 1.5em; font-size: 22px; margin: 40px 0px 0px 0px; font-weight: bold; color: #612392; }
#headercontent { display: block; margin-left: auto; margin-right: auto; text-align: center; }
header .left { float: left; width: 250px; }
header .right { float: right; width: 770px; }
#logo { margin: 17px 0px 0px 20px; }
#right-text h4 em#visible { z-index: 1000; }
#click #litetwo.clicktwo img { z-index: 1; }
.clickone { position: absolute; width: 150px; margin-left: 406px; top: 40px; }
.clicktwo { position: absolute; width: 150px; margin-left: 406px; top: 40px; }

header h4 { font-family: 'Actor', sans-serif; line-height: 1.5em; font-size: 22px; margin: 0px; font-weight: bold; color: #612392; }
#right-text { float: left; width: 615px; }

/* footer elements */
footer { float: left; width: 1024px; text-align: center; background-color: #21201E; border-top: 2px ridge #333; margin: 0px; padding: 10px 0px 10px 0px; }
footer p { font-size: 12px; color: #00FE00; }

/* index elements */
.index-box { float: left; width: 1000px; margin: 30px 0px 30px 0px; }
.index-image { float: left; width: 400px; margin: 0px 20px 0px 20px; }
.index-image img { border: 1px solid #00FE00; }
.index-text { float: left; width: 500px; margin: 0px 20px 0px 20px; }
.index-text p { font-size: 14px; margin: 0px 0px 10px 0px; line-height: 1.6em; }

.index-bottom { float: left; width: 975px; margin: 30px 20px 20px 20px; }
.index-bottom h4 { font-size: 19px; }

.prod-t { border: 2px solid #612392; }
.gallery p { font-size: 12px; text-align: center; }
p.plus { font-size: 30px; posiiton:absolute; margin-top: -85px; margin-left: 370px; margin-bottom: 0px; color: #54BC00; }
p.ouplus { font-size: 30px; posiiton:absolute; margin-top:-45px; margin-left: 340px; margin-bottom: 0px; color: #54BC00; }

/* menu elements */
nav { text-align: center; background-color: #612392; border-top: 2px ridge #54BC00; border-bottom: 3px ridge #54BC00; }
nav ul { padding: 10px 0px 10px 0px; margin: 0px; color: #D7A3FF; }
nav li { font-size: 13px; font-weight: bold; list-style-type: none; display: inline; margin: 0px 6px 0px 6px; }
nav a:link, nav a:visited { color: white; }
nav a:hover { color: #54BC00; }

/* table elements */
table#otheruses { text-align: center; color: #793F8C; padding: 0px; margin: 0px; }
td.tdimage { text-align: center; padding: 0px 20px 0px 20px; margin: 0px 20px 10px 20px; }
td.tdimage img { border: 1px solid #54BC00; text-align: center; margin-left: auto; margin-right: auto; display: block; }
td.tdtext { text-align: center; font-size: 14px; padding: 5px 0px 20px 0px; margin: 0px 10px 10px 10px; }
td.tdcaption { text-align: center; font-size: 16px; padding: 5px 0px 20px 0px; margin: 0px 10px 10px 10px; }

table#ordertable { text-align: center; color: #333; padding: 0px; margin: 0px; font-size: 115%; }
table#ordertable td { border-bottom: 1px solid #E2DAE5; }
table#ordertable .orderoptions td { border: none; }
.orderoptions select { border: 1px solid #793F8C; color: #793F8C; }
.orderoptions { color: #555; }

.productcode { font-weight: bold; color: #617552; width: 110px; vertical-align: top; }
.productdescription { color: #444; width: 400px; vertical-align: top;}
.productprice { font-weight: bold; color: #793F8C; width: 95px; vertical-align: top;}
.productbutton { vertical-align: bottom; }

/* order elements */
.acceptance li { list-style-type: none; }
.acceptance li a { list-style-type: none; color: #FFFFFF; padding: 5px 20px 8px 20px; margin-left: auto; margin-right: auto; display: block; margin-top: 15px; margin-bottom: 10px; text-align: center; width: 440px;
-moz-border-radius:12px; -webkit-border-radius: 12px; border-radius: 12px; }

.acceptance li#accept a:link, .acceptance li#accept a:visited { background-color: #53BC00; color: #FFFFFF; }
.acceptance li#decline a:link, .acceptance li#decline a:visited { background-color: red; color: #FFFFFF; }
.acceptance li#accept a:hover, .acceptance li#decline a:hover { background-color: #612392; color: #CCCCCC; }

.warnings { text-align: center; }
.warnings p { font-size: 20px; color: red; font-weight: bold; }

td.order-options { border: 0px; padding: 0px; }
td.order-options p { color: #555; font-size: 14px; line-height: 1.3em; background-color: #E5E5E5; padding: 1em; border-radius: .3em; text-align: center; border: 1px solid #793F8C; }

/* index slideshow elements */
.slideshow { height: 275px; padding-bottom: 20px; margin: 0px auto; position: relative; }
.slideshow img { width: 363px; border: 1px solid #612392; }
.slideshow img:hover { border: 1px solid #999; }
.slideshowinterior { display: block; }
.slideshowimg { float: left; width: 363px; height: 263px; margin: 20px auto 0px auto; }
.slideshowtext { float: left; width: 350px; margin: 20px 0px 0px 30px; padding: 0px; }
.slideshowtext h5 { margin: 0px; padding: 0px; color: #121212; }

#nav { list-style-type: none; z-index: 200; }
#nav li a { display: block; width: 25px; height: 44px; text-indent: -9999px; outline: none; }
#prev a { background-image: url('http://testing.nectyr.com/higherorbitproducts/images/left.png'); width: 25px; height: 44px; position: absolute; margin-top: -165px; }
#next a { background-image: url('http://testing.nectyr.com/higherorbitproducts/images/right.png'); width: 25px; height: 44px; position: absolute; margin-top: -165px; margin-left: 895px; }
#next a:hover { background-image: url('http://testing.nectyr.com/higherorbitproducts/images/right_over.png'); }
#prev a:hover { background-image: url('http://testing.nectyr.com/higherorbitproducts/images/left_over.png'); }

/* gallery elements */
.gallerysections { margin: auto; }
.gallerysections img { border: 1px solid #612392; }
.gallerysections p { text-align: center; }

.gallerysections { margin: 0px 12px 0px 12px; }
.gallerysections ul { margin: 0px; padding: 0px; text-align: center; }
.gallerysections li { display: inline-block; margin: 10px 18px 10px 18px;  padding: 0px; width: 200px; }
.gallerysections .gallerythumbs { clear:both; width: 100px; height: 100px; margin: 0px; }

/* contact elements */
.contact-form { text-align: left; margin-left: 10px; margin-bottom: 30px; }
.contact-form p { clear: left; color: #612392; margin: 0; padding: 5px 1px 5px 1px; }
.contact-form label { font-weight: normal; float: left; width: 220px; }
input.form-info, select.form-info { width: 180px; }
.contact-form textarea { width: 180px; height: 100px; }
select { color: #666; }

/* form behavior */
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }