#pkc-content h1 {display:none;}

#ae-bg {
background: url(../images/ae-nav.jpg) top left no-repeat;
width:984px;
height:862px;
margin-top:20px;
font-family:Helvetica, Arial, sans-serif;
}
#ae-header {
background: url(../images/ae-header.jpg) top left no-repeat;
width:730px;
height:200px;
}

.app {
	float: left;
	width: 222px;
	height: 180px;
	background-color: #FFF;
	margin: 10px 10px 10px 10px;
	overflow:hidden;
	cursor:pointer;
	/*filter:alpha(opacity=50); /*For IE*/
	/*opacity: 0.5;*/
	}
.app:hover {
	filter:alpha(opacity=70); /*For IE*/
	opacity: 0.7;
}
.appheader {
	border-bottom: 1px solid #666666;
	width: 227px;
	color: #333333;
	background: url("../images/microsites/Lighting2-gradient.png") repeat-x scroll left bottom #FFFFFF;
	height:20px;
	font-weight:bold;
	font-size:12px;
	text-align:center;
	/*padding-left:15px;
	padding-top:5px;*/
	vertical-align:middle;
	opacity: 0.9;
}

#app01 {background: url('../images/microsites/automotive-block-image.jpg') top left no-repeat transparent;}
#app02 {background: url('../images/microsites/wireless-block-image.jpg') top left no-repeat transparent;}
#app03 {background: url('../images/microsites/sensor-block-image.jpg') top left no-repeat transparent;}
#app04 {background: url('../images/microsites/adas-block-img.png') top left no-repeat transparent;}
#app05 {background: url('../images/microsites/automotive-app-infotainment.jpg') top left no-repeat transparent;}
#app06 {background: url('../images/microsites/main-home-automation-fig-5.jpg') top left no-repeat transparent;}


#app07 {background: url('../images/microsites/medical-application-stethoscope-242px.jpg') top left no-repeat transparent;}
#app08 {background: url('../images/microsites/medical-application-thermometer-242px.jpg') top left no-repeat transparent;}
#app09 {background: url('../images/microsites/medical-application-hearing-242px.jpg') top left no-repeat transparent;}
#app10 {background: url('../images/microsites/medical-application-infusion-242px.jpg') top left no-repeat transparent;}
#app11 {background: url('../images/microsites/medical-application-pulseox-242px.jpg') top left no-repeat transparent;}

.new {
	display:none;
	height:45px;
	width:45;
	position:relative;
	background: url('../images/microsites/Medical-NewApp.png') top left no-repeat transparent;
}

#app01 div.new {display:block;}
#app02 div.new {display:block;}
#app04 div.new {display:block;}
#app06 div.new {display:block;}

.ae-appheader-blue {font-size:16px;font-weight:bold;color:#0e4d83;margin:10px 0 10px 0;}
.ae-appheader-line-blue {width:100%;background-color:#0e4d83;height:3px; margin-top: 10px;}

.ae-appheader-orange {font-size:16px;font-weight:bold;color:#f1662a;margin:10px 0 10px 0;}
.ae-appheader-line-orange {width:100%;background-color:#f1662a;height:3px;}

#ae-featprod {float:left;width:500px;margin-right:7px;}

#ae-featart {float:left;width:220px; padding-top:10px;}
/* #ae-featart a {color:#f1662a;} */
#ae-featart h2 {margin:15px 0 0 0;font-size:13px;font-weight:bold;color:#0e4d83;}
#ae-featart h3{margin:0px;font-size:12px;font-style:italic;color:#797979;font-weight:normal;}
#ae-featart p {padding:0px;margin:5px 0 0 0;color:#333333;line-height:1.3em;}
.featart-read {margin:5px 0 0 0;font-size:11px;font-weight:bold;color:#f1662a;text-align:right;}
.featart-break {color:#c3c3c3;margin-top:10px;border-bottom:dashed 1px;}

.ae-featprod2 {/*float:left;*/width:150px;margin:5px 10px 0 0; display: inline-block;}
.ae-featprod2 p {margin:0;padding:0;text-align:center;}
#ae-featprod h2 {font-size:11px;margin:10px 0 20px 0;padding:0;font-weight:normal;text-align:center;color:#333333;}

.ae-featzine {
  display: inline-block;
  margin-right: 5em;
}
.ae-featzine .featpdf {
  display: block;
  width: 30em;
  height: auto;
}
ae.featzine h2 {
  padding: 1em 0 1em 0;
}

/* You can alter this CSS in order to give Smooth Div Scroll your own look'n'feel */

/* Invisible left hotspot */
div.scrollingHotSpotLeft
{
	/* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
	min-width: 75px;
	width: 5%;
	height: 100%;
	/* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
	background-image: url(../flash/js/pkc/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	left: 0;
	/*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
	cursor: url(../flash/js/pkc/cursors/cursor_arrow_left.png), url(../flash/js/pkc/cursors/cursor_arrow_left.cur),w-resize;
}

/* Visible left hotspot */
div.scrollingHotSpotLeftVisible
{
	background-image: url(../flash/js/pkc/arrow_left.gif);				
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.40; /* Standard CSS3 opacity setting */
	-moz-opacity: 0.40; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */
	filter: alpha(opacity = 40); /* Opacity for Internet Explorer. */
	zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */
}

/* Invisible right hotspot */
div.scrollingHotSpotRight
{
	min-width: 75px;
	width: 5%;
	height: 100%;
	background-image: url(../flash/js/pkc/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	right: 0;
	cursor: url(../flash/js/pkc/cursors/cursor_arrow_right.png), url(../flash/js/pkc/cursors/cursor_arrow_right.cur),e-resize;
}

/* Visible right hotspot */
div.scrollingHotSpotRightVisible
{
	background-image: url(../flash/js/pkc/arrow_right.gif);
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.40;
	filter: alpha(opacity = 40);
	-moz-opacity: 0.40;
	zoom: 1;
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper
{
	position: relative;
	overflow: hidden;
	width: 80%;
	height: 100%;
	margin:0 auto;
}

div.scrollableArea
{
	position: relative;
	width: auto;
	height: 100%;
}

#makeMeScrollable
{
	width:100%;
	height: 74px;
	position: relative;
}

#makeMeScrollable div.scrollableArea img
{
	position: relative;
	float: left;
	margin: 0;
	padding: 0 25px 0 0;
	/* If you don't want the images in the scroller to be selectable, try the following
	   block of code. It's just a nice feature that prevent the images from
	   accidentally becoming selected/inverted when the user interacts with the scroller. */
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}
		
.caption {
/*display:none;*/
padding:0;
margin:0;
width:0px;
display:inline;
font-size:11px;
font-weight:bold;
position:relative;
float:left;
/*left:-90px;*/
top:60px;
text-align: center;
color:#0060db;
background-color: #333333;
z-index:100;
}

#makeMeScrollable a {text-decoration: none;}
	
#makeMeScrollable img {
   opacity: 1.0;
   
}
#makeMeScrollable img:hover {
   opacity: 0.5;
   /*background-color:#ffff00;*/
   padding:0;
   margin:0;
}
/*#makeMeScrollable img:hover + .caption {
   display:inline;
   font-size:12px;
   font-weight:bold;
   position:relative;
   float:left;
   left:-90px;
   top:60px;
   text-align: center;
   color:#0060db;
}*/



/*BREAK IN THE ACTION*/

ul {
/*list-style-image:url(../flash/js/pkc/list-style.gif);*/
}
#gallery {margin:25px;}
#ae-header {
background: url(../images/ae-header.jpg) top left no-repeat;
width:730px;
height:200px;
}

.ad-gallery {
  width: 680px;
  /*background-color:#ff0000;*/
}
.ad-gallery, .ad-gallery * {
  margin: 0;
  padding: 0;
}
  .ad-gallery .ad-image-wrapper {
    width: 100%;
    height: 400px;
    margin-bottom: 10px;
    position: relative;
    overflow: hidden;
  }
    .ad-gallery .ad-image-wrapper .ad-loader {
      position: absolute;
      z-index: 10;
      top: 48%;
      left: 48%;
    }
    .ad-gallery .ad-image-wrapper .ad-next {
      position: absolute;
      right: 0;
      top: 0;
      width: 25%;
      height: 100%;
      cursor: pointer;
      display: block;
      z-index: 200;
    }
    .ad-gallery .ad-image-wrapper .ad-prev {
      position: absolute;
      left: 0;
      top: 0;
      width: 25%;
      height: 100%;
      cursor: pointer;
      display: block;
      z-index: 200;
    }
    .ad-gallery .ad-image-wrapper .ad-prev, .ad-gallery .ad-image-wrapper .ad-next {
      /* Or else IE will hide it */
      background: url(../flash/js/pkc/trans.gif);
    }
      .ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image, .ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
        background: url(../flash/js/pkc/ad_prev.png);
        width: 30px;
        height: 30px;
        display: none;
        position: absolute;
        top: 47%;
        left: 0;
        z-index: 101;
      }
      .ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
        background: url(../flash/js/pkc/ad_next.png);
        width: 30px;
        height: 30px;
        right: 0;
        left: auto;
      }
    .ad-gallery .ad-image-wrapper .ad-image {
      position: absolute;
      overflow: hidden;
      top: 0;
      left: 0;
      z-index: 9;
    }
      .ad-gallery .ad-image-wrapper .ad-image a img {
        border: 0;
      }
.ad-gallery .ad-controls {
height: 20px;
}
.ad-gallery .ad-info {
float: left;
}
.ad-gallery .ad-slideshow-controls {
float: right;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-start, .ad-gallery .ad-slideshow-controls .ad-slideshow-stop {
padding-left: 5px;
cursor: pointer;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-countdown {
padding-left: 5px;
font-size: 0.9em;
}
.ad-gallery .ad-slideshow-running .ad-slideshow-start {
cursor: default;
font-style: italic;
}
.ad-gallery .ad-nav {
width: 98%;
padding:0 10px 0 10px;
position: relative;
}
.ad-gallery .ad-forward, .ad-gallery .ad-back {
position: absolute;
top: 0;
height: 100%;
z-index: 10;
}
/* IE 6 doesn't like height: 100% */
* html .ad-gallery .ad-forward, .ad-gallery .ad-back {
height: 100px;
}
.ad-gallery .ad-back {
cursor: pointer;
display: block;
left: -20px;
width: 23px;
background: url(../flash/js/pkc/cursor-left.png) 0px 0px no-repeat;
}
.ad-gallery .ad-forward {
cursor: pointer;
display: block;
right: -20px;
width: 23px;
background: url(../flash/js/pkc/cursor-right.png) 0px 0px no-repeat;
}
.ad-gallery .ad-nav .ad-thumbs {
overflow: hidden;
width: 100%;
}
.ad-gallery .ad-thumbs .ad-thumb-list {
float: left;
list-style: none;
}
.ad-gallery .ad-thumbs li {
float: left;
text-align:center;
width:70px;
}
.ad-thumbs img {
padding:0 8px 0 12px;
}


.icon-desc {
width:60px;
/*text-align:center;*/
z-index:100;
line-height:12px; 
font-size:12px;
font-family: Arial, Helvetica, sans-serif;
color:#004a85;
font-weight:500;
padding-top:10px;
margin:0 auto;
margin-top: -20px\0/; /*IE8only*/
*margin-top: -20px; /*Read by IE7 and earlier versions*/
_margin-top: -20px; /*Read by IE6 and earlier versions*/
}
:root .icon-desc {
margin-top:0px;	
}

/*.icon-desc:hover {
position: relative;  
cursor: pointer;
width:60px;
height:50px;
background: #ff0000;
opacity:0.4; 
content: "";  
display: block;  
top: 0;  
bottom: 0;  
left: 0;  
right: 0;  
-moz-transition: background .3s linear;  
-webkit-transition: background .3s linear;  
-ms-transition: background .3s linear;  
-o-transition: background .3s linear;  
transition: background .3s linear; 
border-radius: 8px; 
}*/


/*.ad-thumb-list li img:hover {
background-color:#CC3366;
opacity:.75; 
filter: alpha(opacity=75);
}*/

    .tint {  
        position: relative;  
        cursor: pointer;
		width:60px;
		height:50px;
    }  
      
    /*.tint:before {  
        background: none;  
    } */ 
      
	
    .tint:hover:after { 
		background: rgba(0,101,253, 0.4);  
        content: "";  
        display: block;  
        position: absolute;  
        top: 0;  
        bottom: 0;  
        left: 11px;  
        right: 0;  
        -moz-transition: background .3s linear;  
        -webkit-transition: background .3s linear;  
        -ms-transition: background .3s linear;  
        -o-transition: background .3s linear;  
        transition: background .3s linear; 
		border-radius: 8px; 
	}
	
	.img-scroll {}
	.img-scroll:hover {background-color:rgba(0,101,253);filter: alpha(opacity=50);}
	
		/*Grant Imahara Promo Banner*/
	.bannergrant {
	width: 100%;
	/*height: 100px;*/
	/*background: url('/images/microsites/EIT-Articles-Banner-Gray.jpg') no-repeat;*/
	padding: 0px;
	padding-bottom: 10px;
}

/* restyling the article section for use with the RSS script*/
#article_wrapper {
  width: 220px;
  border: none;
}
.article_header {
  display: none;
}
.article_container {
  border-style: none none solid none;
  border-width: 1px;
  border-color: #DDDDDD;
  margin-bottom: 1.4em;
  margin-right: 0.3em;
  width: 100%;
}
.article_title {
  min-height: 22px;
  height: auto;
  font-weight: bold;
  padding: 0.3em 0.3em 0 0.5em;
}
.article_title a {
  font-size: 1.2em;
}
.article_author {
  padding: 0.3em;
  font-weight: bold;
  display: none;
}
.article_teaser {
  height: 100%;
  margin-bottom: 1em;
}
.article_more {
  display: block;
  min-height: 15px;
  height: auto;
  bottom: 0;
  font-weight: bold;
  padding; 0 0.3em 0.3em;
  text-align: right;
  font-size: 1.2em;

}
.article_more a {
  color: #FF8000;
}
#article3 {
  border: none;
}


