/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
    font-family:Verdana;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Start My Styles */

header,.left,.mid,.right
{
    height:140px;
}

header
{
    width:100%;
    z-index:9999;
}




header .left
{
    width:15%;
    float:left;
    background:url('images/slice.jpg') 0 0 repeat-x;
}

header .mid
{
    width:70%;
    float:left;
    background:url('images/slice1.jpg') 0 0 repeat-x;
}

header .mid #logo
{
    float:left;
}

header .mid #dates
{
    
    float:right;
    width:550px;
    margin-top:30px;
}

#dates li
{
    background:url('images/sep.gif') 100% center no-repeat;
    padding:10px 22px 10px 16px;
    margin-top:10px;
    float:left;
}

#dates li:first-of-type
{
    float:left;
    padding:2px 15px 0 0;
}
#dates li a
{
    color:white;
    text-decoration:none;
    font:bold 12px verdana;
}

#dates li:last-of-type
{
    background:none;
    padding:10px 0px 10px 16px;
}

#dates li a:hover
{
    color:#faed21;
}

#dates li a.selected
{
    color:#faed21;
}


header .right
{
    width:15%;
    float:left;
    background:url('images/slice1.jpg') 0 0 repeat-x;
}

#main
{
    width:100%;
    height:600px;
    background:white;
}

#slider
{
  position:absolute;
  top:-40px;
  right:0;
  width:1000px;
  height: 620px;
  float:right;
  z-index:1;
  background:url('images/content-bg.png') 0 0 no-repeat;

}


    #timeline {
		    width: 420px;
		    height: 520px;
		    overflow: hidden;
		    margin:0;
            float:right;
		    position: relative;
	    } 
				    
		
		    #issues {
			    width: 420px;
			    height: 520px;
			    overflow: hidden;
		    }	
			    #issues li {
				    width: 420px;
				    height:520px;
				    list-style: none;
				    float: left;
			    }
				    #issues li.selected img {
					    -webkit-transform: scale(1.1,1.1);
					    -moz-transform: scale(1.1,1.1);
				        -o-transform: scale(1.1,1.1);
				        -ms-transform: scale(1.1,1.1);
				        transform: scale(1.1,1.1);
				    }
				    #issues li img {
					    float: left;
					    margin: 40px 30px 10px 30px;
					    background: transparent;
					    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE 8 */   
					    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);/* IE 6 & 7 */      
					    zoom: 1;
					    -webkit-transition: all 2s ease-in-out;
					    -moz-transition: all 2s ease-in-out;
					    -o-transition: all 2s ease-in-out;
					    -ms-transition: all 2s ease-in-out; 
					    transition: all 2s ease-in-out;
					    -webkit-transform: scale(0.7,0.7);
					    -moz-transform: scale(0.7,0.7);
				        -o-transform: scale(0.7,0.7);
				        -ms-transform: scale(0.7,0.7);
				        transform: scale(0.7,0.7);
				    }
				    #issues li h1 {
					    color: #000;
                        float:left;
					    font-size: 18px;
					    margin: 20px 0;
					    text-shadow: #000 1px 1px 2px;
				    }
				    #issues li p {
                        float:left;
					    font-size: 14px;
					    margin-right: 20px;
					    font-weight: normal;
					    line-height: 22px;
                        text-align:justify;
                        width:400px;
				    }
		
		



#main .content
{
    width:70%;
    margin:0 auto;
    height:600px;
    position:relative;
   
}

#main .content .product
{
    width:350px;
    height:591px;
    position:absolute;
    top:10px;
    z-index:2;
    left:-50px;
}

#main .content .hot
{
    width:246px;
    height:32px;
    position:absolute;
    top:30px;
    z-index:2;
    left:150px;
}

#main .content .links
{
    position:absolute;
    bottom:0px;
    right:0;
    width:630px;
    z-index:2;
    
}

#main .content .links a
{
    float:right;
    background:url('images/links.png') 0 0 no-repeat;
    width:170px;
    height:88px;
    color:white;
    text-decoration:none;
    font:bold 16px verdana;
    padding:10px 20px;
}

#main .content .links a span
{
    color:black;
     margin:10px 0;
     font:normal 13px verdana;
}

footer
{
    width:100%;
    height:40px;
    background:#ed1c24;
}

footer .subfooter
{
    width:70%;
    margin:0 auto;
    height:40px;
    color:white;
    
}

footer .subfooter p
{
    float:left;
    padding:10px 0;
    font:bold 12px verdana;
}


footer .subfooter .social
{
    width:210px;
    float:right;
}

footer .subfooter .social a
{
    margin-top:3px;
   float:left;
}

footer .subfooter .social img
{
   width:32px;
   height:32px;
}
