body {
background-color:#e5dacf;
font-size:13px;
font-family: 'Courier New', sans-serif;
line-height:20px;
color:#7b6754;
padding:0;
margin:0;
}

* {
padding:0;
margin:0;
outline:none;
}

a { color:#ab2321; }
a:hover { color: #c83834;
text-decoration:none;
}

img {
border:none;
}

img.zoom {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}

img.zoom:hover {
 cursor: zoom-in;
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(3.0, 3.0);
 -moz-transform: scale(3.0, 3.0);
 -webkit-transform: scale(3.0, 3.0);
 -o-transform: scale(3.0, 3.0);
 -ms-transform: scale(3.0, 3.0);
}

h1{
font-size:20px;
margin:10px 0;
padding:0 0 5px 0;
color:#000;
border-bottom: 4px solid;
text-align: center;
}

h2{
font-size:16px;
margin:10px 0;
color:#000;
border-bottom: 2px solid;
text-align: center;
}

h3{
font-size:13px;
margin:10px 0;
color:#000;
}

h4{
font-size:11px;
margin:10px 0;
color:#000;
border-bottom: 1px solid;
text-align: center;
}

h5{
font-size:11px;
margin:10px 50px;
color:#000;
text-align: right;
}

#wrapper {
width:996px;
margin:30px auto;
}

#header {
clear:both;
background-image:url(../images/header.png);
background-repeat:no-repeat;
width:996px;
height:129px;
}

#logo  {
font-family: 'Lora', serif;
font-size:40px;
color:#fff;
position:relative; top:50px; left:40px;
}

#logo:hover {
text-decoration:none;
}

#topnav {
background-image:url(../images/topnav.png);
background-repeat:no-repeat;
width:996px;
height:77px;
padding:0;
margin:0;
}

#topnav ul {
margin:0;
padding:0;
list-style:none;
}

#topnav ul li {
float:left;
}

#topnav ul li a {
display:block;
height:30px;
padding:10px 20px 0;
color:#d8c4b1;
text-decoration:none;
text-transform:uppercase;
font-weight:bold;
}

#topnav ul li a:hover {
color:#fff;
}

#content {
background-image:url(../images/content_bg.png);
background-repeat:repeat-y;
width:996px;
text-align:justify;
padding:10px;
}

#textcontainer {
background-color:#EEEEEE;
width:936px;
padding:0 20px;
margin:-30px 0 0 0;
}

#footer {
background-image:url(../images/footer_shadow.png);
background-repeat:no-repeat;
width:996px;
height:9px;
margin:0 auto 0;
padding:10px 0;
}

#f_textcontainer {
width:976px;
padding:0 10px;
}

#zoom a {
	    float: right;
	    margin: 0 20px 10px 10px;
	    border: 1px solid #000;
	    text-indent: -1000em;
	    overflow: hidden;
	    display: block;
	    width: 200px;
	    height: 200px;
	    background: url(../images/sram1.jpg) no-repeat top left;
	    }
	 
#zoom a:hover {
	    width: 400px;
	    height: 400px;
	    background-position: 0 0px;
	    }
		
.copyButton {
		padding: 10px 20px;
		background-color: #3498db;
		color: white;
		border: none;
		border-radius: 5px;
		cursor: pointer;
		transition: background-color 0.3s;
    }
	
.copyButton:hover {
		background-color: #2980b9;
    }
	
.copyLink {
		padding: 10px 20px;
		background-color: #2ecc71;
		color: white;
		border: none;
		border-radius: 5px;
		cursor: pointer;
		transition: background-color 0.3s;
		text-decoration: none;
    }

.copyLink:hover {
		background-color: #27ae60;
		color: white;
}

.downloadLink {
		display: block;
		text-align: center;
		max-width: 200px;
		margin: 0 auto;
		padding: 10px 20px;
		background-color: #fc2403;
		color: white;
		border: none;
		border-radius: 5px;
		cursor: pointer;
		transition: background-color 0.3s;
		text-decoration: none;
    }

.downloadLink:hover {
		display: block;
		text-align: center;
		max-width: 200px;
		margin: 0 auto;
		background-color: #d40202;
		color: white;
}
	
#copyMessage {
		display: none;
		margin-top: 10px;
		padding: 5px;
		background-color: #2ecc71;
		color: white;
		border-radius: 5px;
		animation: fadeOut 2s ease-in-out;
    }