﻿/* ==========================================================
		OMC Connect | omcconnect.com
		Client:
		Creation Date:
		Author:
		stylesheet base version 1.1  |  2012/05/07
		♥ props to the html5 boilerplate team: h5pb.com ♥
	========================================================== */

/* === RESET - based on the html5 boilerplate reset: h5pb.com updated 2012/05/07 === */article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;}audio,canvas,video{display:inline-block;*display:inline;*zoom:1;}audio:not([controls]){display:none;}[hidden]{display:none;}a:hover,a:active{outline:0;}b,strong{font-weight:bold;}blockquote{margin:1em 40px;}dfn{font-style:italic;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding: 0;}ins{background:#ff9;color:#000;text-decoration:none;}mark{background:#ff0;color:#000;font-style:italic;font-weight:bold;}abbr[title]{border-bottom:1px dotted;}pre,code,kbd,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em;}pre{ white-space:pre;white-space:pre-wrap;word-wrap:break-word;}q{quotes:none;}q:before,q:after{content:"";content:none;}small{font-size:85%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}svg:not(:root){overflow:hidden;}img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle;}figure{margin:0;}.chromeframe{margin:0.2em 0;background:#ccc;color:black;padding:0.2em 0;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}form{margin:0;}fieldset{border:0;margin:0;padding:0;}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;}textarea{overflow:auto;vertical-align:top;resize:vertical;}input:valid,textarea:valid{}input:invalid,textarea:invalid{background-color:#f0dddd;}table{ border-collapse:collapse;border-spacing:0;}td{vertical-align:top;}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}/* end reset */

/*  =======================================================================
		BASE STYLES - please don't use class/id selectors in this section
	=======================================================================  */

html, button, input, select, textarea { 
	font-family: sans-serif;
	color: #222; }

body { 
	margin: 0; 
	font-size: 12px; 
	line-height: 15px; }
	
::-moz-selection {
	background: #fe57a1;
	color: #fff;
	text-shadow: none; }
	
::selection { 
	background: #fe57a1; 
	color: #fff; 
	text-shadow: none; }
	
a { color: #00e; text-decoration: none; }
a:visited { color: #00e; }
a:hover { color: #F66D49; }
a:focus { outline: none; }

ul, ol { 
	margin: 1em 0; 
	padding: 0 0 0 40px; }
	
dd { margin: 0 0 0 40px; }

h1, h2, h3, h4, h5, h6 {
	font-family: sans-serif;
	margin: 0 0 10px;
	padding: 0;
	line-height: 1;}

h1 {
	font-size: 36px; 
    line-height: 40px;
	font-family: arial, sans-serif; 
	font-weight: bold; 
    color: #AD3442; 
    margin: 0 0 20px 0; 
    text-transform: uppercase; }
	
h2 {
	font-size: 30px; 
    line-height: 34px;
	font-family: arial, sans-serif; 
	font-weight: normal; 
    color: #414141; }
	
h3 {
	font-size: 16px;
    line-height: 22px;
	font-family: arial, sans-serif; 
	font-weight: 600;  
    color: #414141; }

h4 {
	font-size: 14px;
    line-height: 18px;
	font-family: arial, sans-serif; 
	font-weight: 700; 
    color: #414141; }
	
h5 {
	font-family: arial, sans-serif; 
	font-size: 12px;
	font-weight: 700; 
    color: #414141; }
	
h6 {
	font-size: 10px; }
	
p {
	margin: 0 0 15px; }
	
.separator {
	border-top: 1px solid #f2f2f2;
	padding: 0 0 20px 0;
	margin: 20px 0 0 0; }


/* ==========================================================================
		WEB FONTS
   ========================================================================== */	

{	
font-family: 'Roboto Slab', serif; }

	
/* ==========================================================================
		SPLASH TEMP
   ========================================================================== */

.home {
	font-family: 'Roboto Slab' Courier New, serif;
	text-align: center; 
	background: #FFF; }
	
.home img {
	margin: 0 0 50px 0; }
	
.fullWrapper {
	width: 100%; }
	
.logo {
	background: url("/img/layout/bbx-logo.png") no-repeat center #FFFFFF;
	background-position: 50%;
	width: 1000px;
	height: 278px;
	margin-top: 100px; }
	
.tagline {
	font-size: 30px;
    line-height: 18px;
	font-family: 'Roboto Slab' Courier New, serif; 
	font-weight: 100; 
    color: #404041;
    margin: 100px 0 100px 0; }
    
.textOrange {
	color: #d5632a; }
	
.downArrow {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 100px;
	width: 150px;
	height: 50px;
	background: url("/img/layout/arrow-down-orange.png") no-repeat center;
    -webkit-transition: all 600ms;
    transition:         all 600ms;  }
	
.downArrow:hover {
	background: url("/img/layout/arrow-down-grey.png") no-repeat center; }
    
.footerWrapper {
	position: relative;
	width: 100%;
	height: 500px;
	background: #d5632a; }
	
.detailsWrapper {
	margin: auto;
	width: 700px;
	height: 500px; }

.detailsContainer {
	bottom: 0;
	float: left;
	position: absolute;
	display: table-cell inline-block;
	text-align: center;
	width: 700px;
	height: 175px;
	padding-bottom: 30px;
	border-bottom: 2px dotted #FFF;
	margin-bottom: 133px; }

.details {
	float: left;
	width: 250px;
	text-align: left;
	font-size: 23px;
    line-height: 30px;
	font-family: 'Roboto Slab' Courier, serif; 
	font-weight: 100; 
    color: #FFF;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 150px; }
    
.details a {
	color: #FFF; }
	
.details a:hover {
	color: #404041; }
    
.details ul, li {
	list-style: none;
	padding: 0px;
	margin-bottom: 5px; }
	
.iconMobile {
	height: 35px;
	vertical-align: middle;
	display: table-cell;
	padding-left: 50px;
	background: url("/img/layout/icon-mobile.png") no-repeat transparent; }
	
.iconWeb {
	height: 35px;
	vertical-align: middle;
	display: table-cell;
	padding-left: 50px;
	background: url("/img/layout/icon-web.png") no-repeat transparent; }
	
.iconEmail {
	height: 35px;
	vertical-align: middle;
	display: table-cell;
	padding-left: 50px;
	background: url("/img/layout/icon-email.png") no-repeat transparent; }

.brochureBtn {
	margin-top: 30px;
	background: #404041;
	position: absolute;
	right: 0;
	float: right;
	width: 315px;
	height: 100px;
	text-align: center;
	font-size: 20px;
    line-height: 100px;
	font-family: 'Roboto Slab' Courier, serif; 
	font-weight: 700; 
    color: #FFF; }
    
.brochureBtn:hover {
	background: #FFF;
    color: #d5632a;
    -webkit-transition: all 600ms;
    transition:         all 600ms;  }
	    
.logotype {
	bottom: 50px;
	float: left;
	position: absolute;
	width: 700px;
	height: 33px;
	background: url("/img/layout/bbx-logotype.png") no-repeat;
	background-position: 0%; }
	
.arrow {
	left: 0;
	float: left;
	background: url("/img/layout/arrow-white.png") no-repeat;	
	width: 133px;
	height: 400px;
	margin-top: -458px;
	margin-left: 0px; }	
	
.footerCorner {
	position: absolute;
	float: right;
	right: 0;
	top: 0;
	width: 172px;
	height: 185px;
	background: url("/img/layout/corner-fold.png") no-repeat right top; }	
	
/*  =======================================================================
		CLIENT STYLES - please place important/frequently applied styles
		in this section so they appear higher in the list in the WYSIWIG
	=======================================================================  */
	
.left {
	float: left;
	margin: 0 10px 10px 0; }
	
.right {
	float: right;
	margin: 0 0 10px 10px; }

/* ==========================================================================
		CONTAINERS AND LAYOUT (TEMPLATES)
   ========================================================================== */

.wrapper {
	width: 1000px;
	margin: 0 auto; }

nav ul, nav ol { 
	list-style: none; 
	list-style-image: none;
	margin: 0; 
	padding: 0; }
	
.colLeft {
	float: left; }

.colRight {
	float: right; }

.sideContainer {
	width: 220px;
	height: auto;
	margin: 0 0 20px 0;
	clear: both; }

/* ==========================================================================
		SLIDER - DELETE IF NOT USING
   ========================================================================== */

.sliderContainer {
	width: 980px;
	height: 250px;
	float: left;
    overflow: hidden;
    position: relative; }
	
.slider li {
	height: 250px;
	width: 980px;
	overflow: hidden; }
	
.slider ul, 
.slider li {
	list-style: none outside none;
	margin: 0;
	padding: 0; }
	
#controls {
	float: left;
	margin: 0;
	overflow: hidden;
	position: relative;
	z-index: 995; }
	
#controls li {
    display: inline-block;
    float: left;
    list-style: none outside none;
    margin: 0; }
	
#controls li a {
    color: #FFFFFF;
    display: block;
    height: 14px;
    width: 14px;
    outline: medium none; }






/* ==========================================================================
		WEBAPPS
   ========================================================================== */



/* ==========================================================================
		ONLINE SHOP - insert styles from BC defaults
   ========================================================================== */

.productItemNotFound,
.catalogueItemNotFound {
	display: none; }


.shop-catalogue {
	width: 230px; 
	min-height: 200px; 
	margin: 0 20px 30px 0; }
	
.shop-catalogue .image {
	background: url("/img/layout/bg-catalogue.png") no-repeat scroll center bottom #FFFFFF; 
	padding: 0 0 22px 0; 
	text-align: center; }
	
.shop-catalogue .image img {
	width: 200px; }

.shop-catalogue h4,
.shop-catalogue h4 a {
	text-align: center; 
	color: #414141; }

.shop-catalogue h4 a:hover {
	color: #ED4B3B; }

.breadcrumbs {
	padding: 0 0 20px 0;
	font-size: 11px; }

.shopCart {
	border: 1px solid #EAEAEA;
	padding: 20px;
	margin: 0 0 20px 0; }
	
.shop-product-small {
	width: 200px; 
	min-height: 200px;
	padding: 0 20px 0 0; 
	margin: 0 20px 0 0; }
	
.shop-product-small .image img {
	width: 200px; }

/* ==========================================================================
		CART
   ========================================================================== */

.cart {
	background: #fff;
	width: 100%; 
	font-family: "Raleway", arial, sans-serif; }
   
.cart th {
	padding: 10px; 
	font-weight: bold;
	text-align: left; }
	
.giftvoucher,
.cart th {
	border-bottom: 1px solid #eee; }

.cart td {
	padding: 10px; }
	
.shipping td {
	padding: 15px 10px; }
	
.cartInputText {
	width: 50px; }

input#DiscountCode, input#GiftVoucher {
	width: 70px; }

select.shippingDropDown {
	width: 150px; }

.productitemcell {}


table.cart th.quantity {
	text-align: right; }

table.cart td.quantity {
	text-align: right; }


table.cart td.actions {
	text-align: right; }



/* ==========================================================================
		BUTTONS
   ========================================================================== */

/* ==========================================================================
		WEB FORMS - insert styles from BC defaults
   ========================================================================== */
   
dl {
	width: 100%; 
	font-family: "Raleway";
	font-size: 12px; }

dt {
	width: 260px;
	float: left;
	text-align: right;
	margin: 0 0 5px 0; }


dd {
	width: 330px;
	margin: 0 0 5px 275px;
	text-align: left; }

dd, dt {
	min-height: 40px;
	line-height: 35px;
	overflow: hidden; }

dt h4 {
	margin: 0; }


.captchaimg {
	margin: 0 0 5px 0; }

dt label {  }

.cat_textbox,
.cat_textbox_small,
.cat_listbox,
.cat_dropdown,
.cat_dropdown_smaller,
.cat_listbox,
.textbox,
.productTextInput,
.discountcodeInput,
.cartInputText {
	border: 1px solid #e1e1e1;
	padding: 10px;
	background: transparent; }
	
.productTextInput,
.discountcodeInput,
.cartInputText {
	padding: 9px 10px; }
	
.readonly {
	border: none; }
	
input[type="checkbox"], 
input[type="radio"] {
	margin-right: 5px; }


/* ==========================================================================
		MISCELLANEOUS - don't just dump crap in here!
   ========================================================================== */  



/* ===========================================================================
    TEMPLATE ELEMENTS
   =========================================================================== */
#colophon {
	width: 960px;
	margin: 0 auto;
	padding: 4px 0;
	text-align:center; }
	
#colophon ul {
	display: inline;
	list-style: none;
	padding: 0;
	margin: 0;
	border: 0; }
	
#colophon ul li {
	display: inline; }
	
.sitestamp, .copyright {
	color: #787878; 
	font-size: 13px;
	font-family: 'Raleway', sans-serif; }

.copyright {
	margin-right: 4px;
	padding-right: 4px;
	border-right: 1px solid; }
	
.sitestamp a {
	vertical-align: baseline;
	font-size: 12px;
	line-height: 10px; }
	
	
#omc-logo {height: 8px;width: 32px; margin-left: 2px; background-attachment: scroll; background-position: 0 0; background-repeat:no-repeat; display: inline-block; vertical-align: middle;}
.c000 {color: #000; border-color: #000;}
.c333 {color: #333; border-color: #333;}
.c666 {color: #666; border-color: #666;}
.c999 {color: #999; border-color: #999;}
.cccc {color: #CCC; border-color: #ccc;}
.cfff {color: #FFF; border-color: #fff;}
.c000 #omc-logo {background-image: url("/img/layout/omc/omc000.png");}
.c333 #omc-logo {background-image: url("/img/layout/omc/omc333.png");}
.c666 #omc-logo {background-image: url("/img/layout/omc/omc666.png");}
.c999 #omc-logo {background-image: url("/img/layout/omc/omc999.png");}
.cccc #omc-logo {background-image: url("/img/layout/omc/omcCCC.png");}
.cfff #omc-logo {background-image: url("/img/layout/omc/omcFFF.png");}


/* ==========================================================================
	MEDIA QUERIES
   ========================================================================== */
   
   
   
   
   

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
  
  
  
  
.000 #omc-logo,
.333 #omc-logo,
.666 #omc-logo,
.999 #omc-logo,
.ccc #omc-logo,
.fff #omc-logo {background-size: 32px 8px;}  

}

/* ==========================================================================
	HELPER CLASSES - Leave directly before print styles
	.ir (image replacement)  |  .hidden (display:none)  .visuallyhidden  
	.clearfix (for naughty floats: h5bp.com/q)
   ========================================================================== */

.noscript {background: #000; font: bold 10px/12px sans-serif; color:#ff0; text-align: center; padding: 5px;}

.ir {display:block;border:0;text-indent:-999em;overflow:hidden;background-color:transparent;background-repeat:no-repeat;text-align:left;direction:ltr;*line-height:0;}.ir br{display:none;}
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* ==========================================================================
	PRINT STYLES - leave as last item
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
