@charset "UTF-8";

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body,ul,li,h4 {
	padding: 0;
	margin: 0;
	border: 0;
}

body {
	font-size: 65%;
	font-family: 'Titillium Web', sans-serif;
	color: #282828;	
}

#header {
	position: fixed;
	padding: 24px 0px 100px 10px;
	background-image: url(graphics/mobile-top-grad.jpg);
	background-repeat: repeat-x;
	opacity: 0.98;
	top: -26px;
	z-index: 10;
	width: 100%;		
}

@media screen and (min-width:479px) and (max-width:640px) {
	
#header {
	position: absolute;
	padding: 24px 0px 100px 10px;
	background-image: url(graphics/mobile-top-grad.jpg);
	background-repeat: repeat-x;
	opacity: 0.98;
	top: -26px;
	z-index: 10;
	width: 100%;
		
}	
}	
#logo {	
	width: 160px;
	height: 84px;
	float: left;	
	background-image: url(graphics/logoYellow.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	background-size: 90%;
}
/**/
#headlineTop {
	
	padding: 10em 2em 0em 2em;
}

/* ==================================    NAV  =============================   */
#nav {padding: 0px 0px 0px 0px;
	position: fixed;
	top: 65px;	
	left: 12px;	
}

@media screen and (min-width:479px) and (max-width:767px) {
#nav {padding: 0px 0px 0px 0px;
	position: absolute;
	top: 91px;
	left: 12px;	
}
}

#nav li {
	display: inline-block;
	text-decoration: none;	
	text-align: left;
	font-family: 'Titillium Web', sans-serif;
	font-weight: 400; 
	font-size: 1.5em;
	text-shadow: -1px 1px #777;
}

.design a, .mobile a, .seo a, .photo a {	
	padding: 8px 4px 6px 10px;
	display: inline-block;
	text-decoration: none;
}

.mobile a:hover {color: #fff;}
.design a:hover {color: #fff;}
.seo a:hover {color: #fff;}
.photo a:hover {color: #fff;}

.design a {color: #FEE704;}
.mobile a {color: #83F5F5;}
.seo a {color: #9F9;}
.photo a {color: #FFCCFF;}



.applink a {
	font-size: 1.3em;
	color:#83F5F5;	
	display: inline-block;
	text-decoration: none;
	text-shadow: -1px 1px #777;
}


/* ======    END NAV  ======   */

h1 {
	font-family: 'Titillium Web', sans-serif;
	font-weight: 600;
	font-size: 3em;
	color: #F3D800;
	text-shadow: -1px 0px #666;
}

h2 {
	font-weight: 400;
	font-family: 'Titillium Web', sans-serif;
	font-size: 2.6em;
	color: #5F8950;
	text-transform: none;
	text-shadow: -1px 0px #444;
	margin: 0;
	padding: 0em 0em 0em 0em;
}

h4 {
	font-weight: 400;
	font-family: 'Titillium Web', sans-serif;
	font-size: 1.8em;
	color: #666;
	font-weight: bold;
	margin: 0em 0em 0em 0em;
}
h5 {
	font-weight: normal;	
	font-size: 2em;
	color: #444;	
	margin: 0.4em 0em 0.3em 0em;
}
h5 a {
	text-decoration: none;
	color: #444;
	margin: 0.4em 0em 0.3em 0em;
}
p {	padding: 0em 0em 0em 0em;
	font-size: 2em;
	line-height: 1.4em;
	font-weight: 200;
}

.align-right { float:right; margin: 0 0 5px 5px; }

.align-left {
	float: left;
	margin: 0em 0em 0em 0em;
}

.top3em { margin: 3em 0em 0em 0em; }

.width100 { 
	width: 100%;
	margin: 0em 0em 0em 0em; }


/* ======================     COLOURED HEADLINES  ===========================   */
.headline {
	margin: 0% 0% 0% 0%;
	clear: both;
	display: inline-block;
	width: 100%;
	padding: 6% 0% 2% 6%;
}

.headline h2{
	font-weight: 600;
	text-shadow: -1px 0px #888;
	margin: 0% 0% 0% 0%;
	clear: both;
	display: inline-block;
	text-align: left;
	width: 100%;
	padding: 0em 0em 0em 0em;
}

.design2 {
	color: #F3D800;
}

.mobile2 {
	color: #53E4E4;
}

.seo2 {
	padding: 1em 0em 0.5em 0em;
	color: #79E178;
}
.photo2 {
	color: #E7AEEC;
}
/* ======   END COLOURED HEADLINES  ======   */


#message {	

	padding: 4em 2em 0em 2em;
	text-align: left;
	width: 100%;		
}

#messagephoto {
	margin: -2em 0em -2em 0em;
	width: 100%;
	height: 18em;
	background-image: url(photos/m-3devices.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 85%;
}

@media screen and (min-width:479px) and (max-width:639px) {
    #messagephoto {
	width: 100%;
	height: 24em;
	margin: 0em;
	background-image: url(photos/m-3devices.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 80%;
}
}
@media screen and (min-width:640px) and (max-width:767px) {
    #messagephoto {
	width: 100%;
	height: 28em;
	margin: 0em;
	background-image: url(photos/3devices.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 80%;
}
}


.oscormobile {
	width: 100%;
	margin: 1em 0em 0em 0em;
	padding: 2em 0em 0em 0em;
	background: url(photos/m-iPhone-oscor-angled-left.jpg) no-repeat center center;	
	background-size: 100%;
	}	

@media screen and (min-width:479px) and (max-width:767px) {
	.oscormobile {
	width: 100%;
	margin: 1em 0em 0em 0em;
	padding: 2em 0em 0em 0em;
	background: url(photos/iPhone-oscor-angled-left.jpg) no-repeat center center;	
	background-size: 100%;
	}	
	
	
}
	
	
.mobileLeft {padding: 0em 2em 0em 2em;}

.QR {
	position: absolute;
	top: -9000px;
}

.QRtext {
	position: absolute;
	top: -9000px;
}

.colLeft {	padding: 0em 2em 0em 2em;}

.colRT {
	text-align: left;
	padding: 0em 2em 0em 2em;
}

/* ======================== SCROLLER WEBSITES DATA =====================   */
.global1 {background-image: url(photos/m-global1.jpg);}
.global2 {background-image: url(photos/m-global2.jpg);}
.oscor1 {background-image: url(photos/m-oscor1.png);}
.oscor2 {background-image: url(photos/m-oscor2.png);}
.ap {background-image: url(photos/m-ap.png);}
.mdTrail {background-image: url(photos/m-mdTrail.png);}
.keenan1 {background-image: url(photos/m-keenan1.png);}
.brut {background-image: url(photos/m-brut.png);}
.pv1 {background-image: url(photos/m-pv1.png);}
.pv2 {background-image: url(photos/m-pv2.png);}



/* ======================== SCROLLER ADDONS DATA =====================   */
			

.slideshow {background-image: url(addons/m-slideshow.png);}
.cart {background-image: url(addons/m-cart.png);}
.light-table {background-image: url(addons/m-light-table.png);}
.slider {background-image: url(addons/m-slider.png);}
.storefinder {background-image: url(addons/m-storefinder.png);}
.video {background-image: url(addons/m-video.png);}
.tabs {background-image: url(addons/m-tabs.png);}
.concertina {background-image: url(addons/m-concertina.png);}
.search {background-image: url(addons/m-search.png);}
.ticker {background-image: url(addons/m-ticker.png);}

/* ==================== SCROLLER PHOTO DATA ===========================   */
.oscor10 {background-image: url(photos/photoheader-implantable.jpg);}
.oscor11 {background-image: url(photos/photoheader-adaptors.jpg);}
.oscor13 {background-image: url(photos/photoheader-pacemakers.jpg);}
.oscor15 {background-image: url(photos/photoheader-introducers.jpg);}
.oscor16 {background-image: url(photos/photoheader-accessories.jpg);}
.oscor17 {background-image: url(photos/photoheader-heartwires.jpg);}
.oscor19 {background-image: url(photos/photoheader-OEM.jpg);}
.wine1 {background-image: url(photos/riverRd.jpg);}
.wine2 {background-image: url(photos/riverRdTrees.jpg);}
.wine3 {background-image: url(photos/contento.jpg);	}
		
	
/* =======================  SCROLLER WEBSITES ===========================   */

.text {
	position: relative;
	top: 10%;
	left: 54%;	
	width: 47%;		
}
#wrapper1 p {padding: 0% 0% 0% 0%;
	font-size: 1.5em;
	}
	
@media screen and (min-width:479px) and (max-width:667px) {
.text {
	top: 19%;
	left: 55%;	
	width: 35%;		
}	
}
@media screen and (min-width:668px) and (max-width:767px) {
.text {
	top: 27%;
	left: 55%;	
	width: 30%;		
}		
}

#wrapper1 {	
	
	margin: 0% 0% 4% 0%;
	overflow: hidden;
	-ms-touch-action: none;
	border-top-width: 3px;
	border-bottom-width: 3px;
	border-top-style: dashed;
	border-bottom-style: dashed;
	border-bottom-color: #E1E0E2;
	border-top-color: #E1E0E2;
}

#wrapper1 .scroller {
	width: 1500%;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	/*	-moz-user-select: 260;*/
	-ms-user-select: none;
	user-select: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-o-text-size-adjust: none;
	text-size-adjust: none;
}
/* adjust height with scroller li *
/* adjust image size with background-size 100%; */
#wrapper1 .scroller li {
	height: 23em;
	width: 6.666%;
	float: left;	
	overflow: hidden;		
	background-repeat: no-repeat;
	background-position: center center;	
	background-size: 115%;	
}

@media screen and (min-width:479px) and (max-width:667px) {
#wrapper1 .scroller li {
	height: 28em;
	background-size: 115%;	
}
}

@media screen and (min-width:668px) and (max-width:767px) {
#wrapper1 .scroller li {
	height: 32em;
	background-size: 115%;	
}
}

#wrapper1 .scroller ul {
	position: relative;
	z-index: 5;
	list-style: none;
	width: 150%;
	padding: 0;
	margin: 0;
}

 /* =====  END SCROLLER WEBSITES   ======   */
	
/* =======================  SCROLLER ADDONS  ===========================   */
.addonstext {
	position: relative;
	top: 18%;
	left: 50%;	
	width: 50%;		
}

#wrapperAddons p {padding: 0% 0% 0% 0%;
	font-size: 1.5em;
	}
	
@media screen and (min-width:479px) and (max-width:667px) {
.addonstext {
	top: 22%;
	left: 50%;	
	width: 35%;		
}	
}
@media screen and (min-width:668px) and (max-width:767px) {
.addonstext {
	top: 22%;
	left: 45%;	
	width: 30%;		
}		
}

#wrapperAddons {	
	clear: both;
	margin: 1% 0% 0% 0%;
	overflow: hidden;
	-ms-touch-action: none;
	border-top-width: 3px;
	border-bottom-width: 3px;
	border-top-style: dashed;
	border-bottom-style: dashed;
	border-bottom-color: #E1E0E2;
	border-top-color: #E1E0E2;
}

#wrapperAddons .scroller {
	width: 1500%;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	/*	-moz-user-select: 260;*/
	-ms-user-select: none;
	user-select: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-o-text-size-adjust: none;
	text-size-adjust: none;
}
/* adjust height with scroller li */
/* adjust image size with background-size: 95%; */
#wrapperAddons .scroller li {

	height: 22em;
	width: 6.666%;
	float: left;	
	overflow: hidden;		
	background-repeat: no-repeat;
	background-position: 10% center;	
	background-size: 95% auto;	
	
}

@media screen and (min-width:479px) and (max-width:538px) {
#wrapperAddons .scroller li {
	height: 24em;
	background-size: 90% auto;	
}
}
@media screen and (min-width:539px) and (max-width:667px) {
#wrapperAddons .scroller li {
	height: 26em;
	background-size: 80% auto;
}
}


@media screen and (min-width:668px) and (max-width:767px) {
#wrapperAddons .scroller li {
	height: 28em;
	background-size: 70% auto;
}
}
#wrapperAddons .scroller ul {
	position: relative;
	z-index: 1;
	list-style: none;
	width: 150%;
	padding: 0;
	margin: 0;
}

.live {
	margin: 0em 0em 2em 0em;
	height: 42px;
	width: 140px;
	line-height: 40px;
	text-align: center;
	
	}
	
.live a {
	display: inline-block;
	color: #60954F;
	font-size: 2em;
	font-family: 'Titillium Web', sans-serif;
	font-weight: 400;
	width: 140px;
	line-height: 40px;
	text-decoration: none;
	border-top: 1px solid #F4F3F6;
	border-right: 1px solid #F4F3F6;
	border-bottom: 2px solid #EDECEF;
	border-left: 2px solid #E5E3E6;
	border-radius: 2px 2px 2px 2px;
	text-align: center;
	background: #F6F6F6;
	}
		
.live a:hover {
	display: inline-block;
	color: #60954F;
	font-size: 2em;
	font-family: 'Titillium Web', sans-serif;
	font-weight: 400;
	width: 140px;
	line-height: 40px;
	text-decoration: none;
	border-radius: 2px 2px 2px 2px;
	text-align: center;
	background-color: #EEEDEF;
	}

 /* =====  END SCROLLER ADDONS   ======   */


 /* ======================  SCROLLER PHOTO ============================   */
#wrapper2 {
	margin: 0% 0% 0% 0%;
	overflow: hidden;
	-ms-touch-action: none;
	border-top-width: 3px;
	border-bottom-width: 3px;
	border-top-style: dashed;
	border-bottom-style: dashed;
	border-bottom-color: #E1E0E2;
	border-top-color: #E1E0E2;
}

#wrapper2 .scroller {
	width: 1000%;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	/*	-moz-user-select: 260;*/
	-ms-user-select: none;
	user-select: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-o-text-size-adjust: none;
	text-size-adjust: none;
}
/* adjust height and image size with scroller li */
#wrapper2 .scroller li {
	height: 16em;
	width: 10%;
	float: left;	
	overflow: hidden;
	text-align: center;
	background-repeat: no-repeat;
	background-position: center center;	
	background-size: 97%;	
}

@media screen and (min-width:479px) and (max-width:667px) {
#wrapper2 .scroller li {
	height: 20em;

}
}
@media screen and (min-width:668px) and (max-width:767px) {
#wrapper2 .scroller li {
	height: 24em;
}
}
#wrapper2 .scroller ul {
	position: relative;
	z-index: 5;
	list-style: none;
	width: 100%;
	padding: 0;
	margin: 0;
}
 /* ======  END SCROLLER PHOTO   ======   */