/*Basic styles*/
#cl-outer-wrapper {
	width: 976px;
    margin-bottom: 16px;
}
#cl-outer-wrapper #cl-inner-wrapper {
	width: 100%;
	height: auto;
	background-color: #333;
    position: relative;
}
#cl-outer-wrapper .intro {
    margin: 0 0 32px;
}
#cl-outer-wrapper #cl-inner-wrapper h2 {
  	color: #FFFFFF;
    font-size: 24px;
    height: 18px;
    letter-spacing: 1px;
    margin: 0;
    padding: 32px;
    text-transform: uppercase;
    width: 300px;
}
#cl-outer-wrapper .left {
    float: left;
}
/*Key*/
#cl-outer-wrapper .key {
    display: block;
    height: 16px;
    margin-bottom: 8px;
}
#cl-outer-wrapper .key li {
    margin-right: 16px;
}
/*
#cl-outer-wrapper .key li .square {
    height: 16px;
    width: 16px;
    display: block;
    background-color: #AA0088;
    margin-right: 8px;
}
*/
#cl-outer-wrapper .key li .description {
    background: url(/staticarchive/2d1d717b6435c308afc3d48dbcd2381a0b8f3ec1.gif) no-repeat 0 0;
    height: 22px;
    padding-left: 22px;
    line-height: 28px;
}
#cl-outer-wrapper .key li.key-print .description {
   /*background-color: #FF6600; */
   background-position: 0 6px;   
}
#cl-outer-wrapper .key li.key-computer .description {
    /*background-color: #99CC00;*/
	background-position: 0 -45px; 
}
#cl-outer-wrapper .key li.key-tv .description {
    /*background-color: #00CCFF;*/
	background-position: 0 -95px; 
}
#cl-outer-wrapper .key li.key-mobile .description {
    /*background-color: #FFCC00;*/
	background-position: 0 -148px; 
}
/*Timeline basic styles*/
#cl-outer-wrapper ul li {
	background-image: none;    
    padding: 0;    
}
/*Navigation*/
#cl-outer-wrapper #cl-inner-wrapper ul.nav {
    display: block;
    position: absolute;
    right: 9px;
    top: 10px;
    width: 596px;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li {
    float: left;
    margin: 0 1px 0 0;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li .year {
  letter-spacing: -1px;
  font-size: .9em;
  color: #A9A9A9;
  margin: 0 auto;
  visibility: hidden;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li:first-child .year {
    visibility: visible;
}

#cl-outer-wrapper #cl-inner-wrapper ul.nav li:hover {
    cursor: pointer;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li.print:hover > div {
    background-color: #FF6600;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li.computer:hover > div {
    background-color: #99CC00;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li.tv:hover > div {
    background-color: #00CCFF;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li.mobile:hover > div {
    background-color: #FFCC00;
}
#cl-outer-wrapper #cl-inner-wrapper ul.nav li .square {
    background-color: #505050;
    display: block;
    height: 16px;
    margin: 3px auto;
    width: 16px;
}
/*Timeline*/
#cl-outer-wrapper #cl-inner-wrapper ul.timeline {
    margin-bottom: 32px;
    position: relative;
}

#cl-outer-wrapper ul.timeline li {
    border-bottom: 1px solid #505050;
    height: 122px;
    margin-bottom: 16px;
    position: relative;
    width: 963px;
}
#cl-outer-wrapper ul.timeline li.last {
    border: medium none;
}

#cl-outer-wrapper .yearTitle {
    background: none repeat scroll 0 0 #333333;
    color: #CCCCCC;
    display: block;
    height: 31px;
    left: -45px;
    margin: 0;
    position: absolute;
    top: 45px;
    width: 122px;    
}
#cl-outer-wrapper #cl-inner-wrapper ul li .yearTitle > p {
    color: #CCCCCC;
    text-align: right;
    padding: 4px 4px 0 0;
}
.ltr #cl-outer-wrapper #cl-inner-wrapper ul li .yearTitle > p {
    font-weight: bold;
    font-size: 20px;
    line-height: 20px;
}
#cl-outer-wrapper #cl-inner-wrapper ul li .img {
    display: block;
    height: 122px;
    left: 32px;
    position: absolute;
    width: 336px;

}
#cl-outer-wrapper #cl-inner-wrapper ul li .overlay {
	-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#aa000000,endColorstr=#aa000000);
    border-color: -moz-use-text-color #000000 #000000;
    border-image: none;
    border-style: none solid solid;
    border-width: medium 1px 1px;
    bottom: 0;
    height: 64px;
    left: 0;
    position: absolute;
    width: 64px;
    z-index: 10;
}
#cl-outer-wrapper #cl-inner-wrapper ul li .hotspot {
    background-image: url("/staticarchive/c350131c51a485638d69dfd5f4cf3f0ce7f74e85.gif");
    height: 64px;
    width: 64px;
}
#cl-outer-wrapper #cl-inner-wrapper ul li:hover .hotspot {
	background-color: #333;
}
#cl-outer-wrapper #cl-inner-wrapper ul li .description {
    height: 122px;
    left: 389px;
    position: absolute;
    width: 566px;
    top: -11px;
}
#cl-outer-wrapper #cl-inner-wrapper ul li .description > h3 {
	color: #CCCCCC;
    margin: 4px 0 12px;
    padding: 2px 0 0 23px;
    font-weight: bold;
    font-size: 20px;
    line-height: 24px;
}
#cl-outer-wrapper #cl-inner-wrapper ul li .description p {
	color: #CCCCCC;
    display: block;
    padding: 0 8px 0 0;
    font-size: 13px;
    line-height: 16px;
}
/*Experts opinion*/
#cl-outer-wrapper #cl-inner-wrapper .experts-opinion-holder {
    padding: 0 32px;
    width: 912px;
}
#cl-outer-wrapper #cl-inner-wrapper .experts-opinion-title {
    border-bottom: 1px solid #505050;
    padding-bottom: 8px;
    color: #A9A9A9;
    font-size: 20px;
    line-height: 20px;
    font-weight: bold;
}
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion{
    overflow: hidden;
}
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li {
    padding-right: 37px;
    width: 29%;
    float: left;
}
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li h4,
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li p {
    color: #CCCCCC;
    font-size: 13px;
    line-height: 16px;
    padding: 0 8px 0 0;
}
/*
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li:hover h4,
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li:hover p {
    color: #FFFFFF;
}

#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li:hover p a {
    color: #FFFFFF;
}
*/
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li h4 {
    margin-bottom: 8px;
    font-size: 18px;
    line-height: 16px;
}
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li p a {
    color: #CCCCCC;
}
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li .expert-name {
    color: #A9A9A9;
    display: block;
    height: 30px;
}
#cl-outer-wrapper #cl-inner-wrapper ul.experts-opinion li .expert-opinion {
    margin-top: 12px;
	font-size: 16px;
	line-height: 20px;
	background: url(/staticarchive/89073a3dbb5dbca7d457c72d9dfd76336158cffd.gif) no-repeat 0 0;
	padding-top: 42px;
}


/*Styles depending on the type of media*/
#cl-outer-wrapper #cl-inner-wrapper ul li.print .description h3 { 
    background: url("/staticarchive/8a015101cc0725eaef7c37f7f9d5353d12b3ea00.png") no-repeat scroll 0 0 transparent;
}
#cl-outer-wrapper #cl-inner-wrapper ul li:hover .clickable {
    cursor: pointer;
}
#cl-outer-wrapper #cl-inner-wrapper ul li:hover .yearTitle > p {
    color: #333333;
}
#cl-outer-wrapper #cl-inner-wrapper ul li.print:hover .yearTitle {
    background-color: #FF6600;
}    
#cl-outer-wrapper #cl-inner-wrapper ul li.computer:hover .yearTitle {
    background-color: #99CC00;
}
#cl-outer-wrapper #cl-inner-wrapper ul li.tv:hover .yearTitle {
    background-color: #00CCFF;
}
#cl-outer-wrapper #cl-inner-wrapper ul li.mobile:hover .yearTitle {
    background-color: #FFCC00;
}
#cl-outer-wrapper #cl-inner-wrapper ul li:hover .description h3 {
    color: #FFFFFF;
}
#cl-outer-wrapper #cl-inner-wrapper ul li:hover .description p {
    color: #EDEDED;
}
#cl-outer-wrapper #cl-inner-wrapper ul li.tv .description h3 {
   background: url("/staticarchive/8a015101cc0725eaef7c37f7f9d5353d12b3ea00.png") no-repeat scroll 0 -98px transparent;
   padding-left: 30px;
}
#cl-outer-wrapper #cl-inner-wrapper ul li.computer .description h3 {
    background: url("/staticarchive/8a015101cc0725eaef7c37f7f9d5353d12b3ea00.png") no-repeat scroll 0 -48px transparent;
    padding-left: 30px;
}
#cl-outer-wrapper #cl-inner-wrapper ul li.mobile .description h3 {
    background: url("/staticarchive/8a015101cc0725eaef7c37f7f9d5353d12b3ea00.png") no-repeat scroll 0 -150px transparent;
}

/*Special styles*/
.rotate {
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

/*Panels*/
#panel_popup {
    position: absolute;
    z-index: 99999;
}
.panel-container {
    background: none repeat scroll 0 0 #EDEDED;
    border: 2px solid #CCCCCC;
    border-radius: 0 0 0 0;
    box-shadow: none;
    color: #505050;
    padding: 22px 30px 10px 30px;
    font-size: 13px;
    line-height: 16px;

}
.panel-container .img_holder > img {
    width: auto;
}
.panel-container .img_holder {
    display: inline-block;
    width: auto;
    left: 25%;
}
.panel-close-box {
  height: 16px;
  width: 16px;
  background: url("/staticarchive/c473a5b0e6c8c5649193de3f3b3ed02145a02eed.png") no-repeat center center;
  top: 5px;
  left: 94%;    
  cursor: pointer;
  position:absolute;
}/*
#cl-outer-wrapper #cl-inner-wrapper ul li .overlay {

}
border-top: 25px solid #000; for IE 7/8
    border-top: 25px solid rgba(0,0,0,0.6);
    border-left: 48px solid transparent;
    border-right: 0 solid transparent;

    */