/* Copyright (c)2012 Thinkroomten Ltd.  All rights reserved.  */

/* POSITIONING
****************************************************************************************************/
*               {margin:0px; padding:0px;} /*RESET ALL DEAD SPACE */

html          {height:100%; overflow-y:scroll; }
body          {min-height:100%; width:100%; background:#ebebeb;}

#container    {margin:0 auto; width:980px; background:#555 url('../graphics/bg-main.jpg') repeat-x center top;}

#header      {margin:0 auto; width:960px; height:130px;}
#header img    {display:block; float:left;}
#navigation    {padding:79px 40px 0 0; width:auto; text-align:right; float:right;}

#banner      {margin:0 auto; width:960px; height:313px;}

#content    {padding:31px 53px 62px;}

#footer      {height:251px; background:#000;}
#footer-nav    {padding:48px 0 67px 53px;}
#footer-left  {padding-left:53px; width:580px; float:left;}
#footer-right  {padding-right:53px; width:275px; float:right; text-align:right;}
#linkedinbox {float: left; padding-left: 36px; padding-top: 30px;}
#facebookbox {float: left; padding-left: 5px; padding-top: 31px;}
#footer-left p, #footer-right p  {font-size:13px; line-height:21px;}


.clear      {clear:both; height:0; display:block;}


/* TEXT STYLES
****************************************************************************************************/
@fontface {font-family:'Quicksand Book'; src:url(../fonts/Quicksand Book.otf); }

html {font-size:16px; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
body {font:normal 1em/1.25em Arial, sans-serif; color:#fff; }

.home p {padding:0 0 30px 323px; width:520px; color:#f4f4f4; font-size:18px; line-height:25px;}
.home h1 {padding:0 0 30px 323px; width:520px;}

h1, h2, h3, h4, h5, h6 {
 font:normal 1em/1em Dosis, sans-serif;
 padding-bottom:0.5em;
 }
h1 {
 font-size:32px;
 font-weight:100;
 color:#464646;
 }
h2 {
 font-size:26px;
 font-weight:100;
 color:#464646;
 }
h3 {
 font-size:18px;
 font-weight:100;
 color:#464646;
 }
h4 {
 font-size:16px;
 font-weight:400;
 color:#464646;
 }
h5 {
 font-size: 28px;
 font-weight: 100;
 color:#709e00;
 }
h6 {
 /* style if needed */
 }
hr {
 width:95%;
 display: block;
 height: 1px;
 color:#555; 
 background-color:#555; 
 border:none; 
 margin:7px auto;
 }

 
/* TABLE STYLES
****************************************************************************************************/
table, table.contentpaneopen {
 border-collapse: collapse;
 border-spacing: 0;
 width:100%;
 }

 
/* FORM STYLES
****************************************************************************************************/
fieldset {
 border: 0;
 }
textarea {
 overflow: auto;
 vertical-align: top;
 }
legend {
 border: 0;
 *margin-left: -7px; /*IE fix*/
 }
button, input, select, textarea {
 vertical-align: baseline;
 *vertical-align: middle; /*IE fix*/
 }
button, input {
 line-height: normal;
 *overflow: visible; /*IE fix*/
 }
button, input[type="button"], input[type="reset"], input[type="submit"] {
 cursor: pointer;
 background:#303030;
 display:block;
 text-transform:uppercase;
 color:#fff;
 line-height:2.5em;
 height:41px;
 width:104px;
 border:none;
 }
input[type="checkbox"], input[type="radio"] {
 box-sizing: border-box;
 }
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 {
 -webkit-appearance: none;
 }
button::-moz-focus-inner, input::-moz-focus-inner {
 border: 0;
 padding: 0;
 }
/* Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7 */
table button, table input {
 *overflow: auto; /*IE fix*/
 }
label      {
 }
legend.sectiontableheader          {
 }
/*  TRANSPARENT SEACH VIA DIV 'search' */
div.search input:focus {outline:none;}
div.search input {background-color:transparent; border:none; color:#777; padding:1px; margin:0px;}

/* LIST STYLES
****************************************************************************************************/
ul, ol {
 list-style-position: inside;
 }
ul li, ol li {
 margin: 0 1.42em;
 }
li ul, li ol {
 margin: 0 1.42em;
 }
dl dd {
 margin-left: 1.42em;
 }

/* ANCHORS, IMAGES, EMBEDDED CONTENT
****************************************************************************************************/
a, a:visited     {font-family: Arial, sans-serif; text-decoration: none; color: #fff; }
a:hover       {color:#999;}
a:focus, a img     {outline:none;}
a:hover, a:active   {outline: none;}
img {
 border:none;
 display:block;
 -ms-interpolation-mode: bicubic; /* Improve IE's resizing of images: css-tricks.com/ie-fix-bicubic-scaling-for-images */
 }
/* Corrects overflow displayed oddly in IE9 */
svg:not(:root) {
 overflow: hidden;
 }
a.thumb, img.thumb {filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);-moz-opacity: 0.8; opacity: 0.8; margin:0px; padding:0px;}
a.thumb:hover, img.thumb:hover  {filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);-moz-opacity: 1.0; opacity: 1.0;}

/*  TOOL TIPS
****************************************************************************************************/
.tip-wrap { 
 -moz-background-clip:border;
 -moz-background-inline-policy:continuous;
 -moz-background-origin:padding;
 background:#FFFFCC none repeat scroll 0 0;
 border:1px solid #D4D5AA;
 float:left;
 max-width:200px;
 padding:5px;
 color:#222;
}
.tip-title {
 -moz-background-clip:border;
 -moz-background-inline-policy:continuous;
 -moz-background-origin:padding;
 background:transparent url(../../system/images/selector-arrow.png) no-repeat scroll 0 0;
 font-size:100%;
 font-weight:bold;
 margin:-15px 0 0;
 padding:15px 0 5px;
 color:#222;
}
.tip-text {
 font-size:100%;
 margin:0;
 color:#222;
}

/* SYSTEM MESSAGES
****************************************************************************************************/
#system-message dt.message, #system-message dt.error, #system-message dt.notice {display:none; visibility:hidden;}
#system-message ul {list-style-type:none; padding:0px;}
#system-message dd.message ul li, .shop_info, .shop_debug, .shop_tip, #system-message dd.error ul li, .shop_critical, .shop_error, .shop_warning, #system-message dd.notice ul li {
 font-family: Arial, Helvetica, sans-serif;
 font-size:13px;
 line-height:18px;
 font-weight:normal;
 letter-spacing:normal;
 margin:0px 0px 2px 0px;
 padding:10px 30px 10px 50px;
}
#system-message dd.message ul, .shop_info, .shop_debug, .shop_tip {
 background:#C3D2E5 url(../../system/images/notice-info.png) no-repeat scroll 4px center;
 border-bottom:2px solid #0000CC;
 border-top:2px solid #0000CC;
 color:#000066;
}
#system-message dd.error ul, .shop_critical, .shop_error, .shop_warning {
 background:#E6C0C0 url(../../system/images/notice-alert.png) no-repeat scroll 4px center;
 border-bottom:2px solid #CC0000;
 border-top:2px solid #CC0000;
 color:#660000;
}
#system-message dd.notice ul {
 background:#EFE7B8 url(../../system/images/notice-note.png) no-repeat scroll 4px center;
 border-bottom:2px solid #00CC00;
 border-top:2px solid #00CC00;
 color:#006600;
}
#system-message dd.message ul li {color:#000066; }
#system-message dd.error ul li {color:#660000; }
#system-message dd.notice ul li {color:#006600; }
#system-message ul li {margin:0px; list-style-image: none; width:inherit;}
dd.message {margin:0px 0px 10px 0px;}
.shop_debug    { width:600px;}
#debug-pane   { width:600px;}
.red, form strong, .missing        {color:#ff0000;}
#whitetext {color:#fff;}

/* MEDIA QUERIES
****************************************************************************************************/
/* FULL LANDSCAPE DESKTOP */
@media screen and (min-width:1025px) and (orientation:landscape) {

}

/* FULL PORTRAIT DESKTOP */
@media screen and (min-width:801px) and (orientation:portrait) {

}

/* LANDSCAPE TABLET */
@media screen and (min-width:801px) and (max-width:1024px) and (orientation:landscape) {

}

/* PORTRAIT TABLET */
@media screen and (min-width:481px) and (max-width:800px) and (orientation:portrait) {


/* LANDSCAPE SMARTPHONE */
@media screen and (max-width:800px) and (orientation:landscape) {

}

/* PORTRAIT SMARTPHONE */
@media screen and (max-width:480px) and (orientation:portrait) {

}