/* 
 --------------------------------------
 ----- Stylesheet info ----------------
 -------------------------------------- 
	Description: DDMF website stylesheet
	Version: 1.2
	Author: Lighezan Alexandru
	Contact: alighe89@gmail.com
*/

/* 
 --------------------------------------
 ----- Eric Meyer CSS RESET v1.0 ------
 -------------------------------------- 
*/
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, font, 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 {
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; font-weight:normal;}
body {line-height: 1; font-family:Arial, Helvetica, sans-serif;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none; }
a {text-decoration:none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse; border-spacing: 0;}
/* 
 --------------------------------------
 ----- LAYOUT STYLING -----------------
 -------------------------------------- 
*/
body {
  background-color:#131313;
  background:#020101 url(images/bg_rpt.png);
}

.wrapper {
  width: 700px;
  margin:0 auto;
  position:relative;
}

#content {
  padding-top:40px;
}

#content .wrapper > * {
  margin-left:-4px;
}


/* 
 --------------------------------------
 ----- MASTHEAD STYLING ---------------
 -------------------------------------- 
*/
#masthead {
  width:100%;
  height:150px;
  border-bottom:3px solid #ff9900;
  background:#020101 url(images/bg_rpt.png);
  text-align:center;
  position:relative;
}

#masthead .wrapper {
  height:150px;	
}

#masthead h1 {
  float:left;
  margin-top:35px;
  font-size:18px;
  color:#ff9900;
}

#masthead ul {
  position:absolute;
  left:0;
  bottom:0;
}

#masthead ul li {
  float:left;
  width:132px;
  height:28px;
  margin-right:8px;
  margin-top:3px;
}

#index_page .index_page, #products_page .products_page, 
#freeware_page .freeware_page, #contact_page .contact_page,
#faq_page .faq_page {
  width:130px;
  height:36px;
  margin-top:0;
}

#masthead ul li a {
  background:url(images/menu_item.png) no-repeat;
  display:block;
  text-align:center;
  font-size:18px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  line-height:28px;
  color:white;
}

#masthead ul li a:hover {
  background:url(images/menu_item_hover.png) no-repeat;
}

#index_page #masthead .index_page a, #products_page #masthead  .products_page a, 
#freeware_page #masthead  .freeware_page a, #contact_page #masthead  .contact_page a ,
#faq_page #masthead .faq_page a {
  background:url(images/menu_selected.png) no-repeat;
  font-size:19px;
  line-height:33px;
  padding-bottom:3px;
}


/* 
 --------------------------------------
 ----- SPOTLIGHT STYLING --------------
 -------------------------------------- 
*/
#spotlight {
  background:url(images/spotlight_bg.png) no-repeat;
  width:630px;
  height:260px;
  float:left;
  position:relative;
  padding-top:18px;
  padding-left:26px;
  padding-right:22px;
  padding-bottom:15px;
  height:245px;
}

#spotlight h3 {
	font-size:30px;
	font-weight:bold;
	color:white;
	margin:0;
}

#spotlight .product {
	position:relative;
	width: 604px;
	height:auto;
	margin-top:10px;
	float:left;
	padding:10px;
	padding-bottom: 100px;
}

#spotlight .product_content {
	position:relative;
	z-index:4;
	color:white;
}
  
.product_content a {
	background-color:#323232;
	padding:2px 7px;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color:white;
	margin-left:7px;
	margin-top:2px;
}
.product_content a:hover {
	background-color:#666;
}

.product_content p {
	line-height:22px;
}

#spotlight .image {
	width:120px;
	height:60px;
	float:left;
	border:2px solid white;
	overflow:hidden;
	position:absolute;
	z-index:3;
	margin-right:15px;
	display:block;
	bottom:19px;
}

#spotlight .image img {
	width:100%;
}

#spotlight .action {
	position:absolute;
	bottom:19px;
	right:15px;
}

#spotlight .button {
	width:270px;
	font-size:22px;
	font-weight:bold;
	line-height:38px;
}

#spotlight .button .info {
	font-weight:normal;
	font-size:20px;
}

#spotlight .demo {
	width:110px;
	margin-left:40px;
	float:right;
	margin-right:25px;
}

#spotlight .wslide-menu {
	position:absolute;
	top:30px;
	right:26px;
}

.wslide-menu a {
	display:block;
	text-indent:-1000px;
	overflow:hidden;
	background:url(images/bullet.png);
	width:15px;
	height:15px;
	float:left;
	margin-left:7px;
}

.wslide-menu a.wactive {
	background-image:url(images/bullet_hover.png);
}


/* 
 --------------------------------------
 ----- PRODUCTS PAGE STYLING ----------
 -------------------------------------- 
*/
#products {
  float:left;
  margin-top:10px;
  width:700px;
  overflow:hidden;
}

#products td {
  padding-top:10px;
  padding-bottom:10px;
  padding-right:25px;
  text-align:center;
  vertical-align:top;
}

#products td a{
  position:relative;
}

#products td img {
  width:210px;
}

.title{
  position:absolute;
  bottom:10px;
  left: 3%;
  width: 84%;
  padding-left:5%;
  padding-right: 5%;
  padding-top:5px;
  padding-bottom:5px;
  color:white;
}

.transp {
  background:black;
  position:absolute;
  z-index:0;
  width:100%;
  height:100%;
  opacity:0.90;
  filter:alpha(opacity=90);
  top:0;
  left:0;
  -moz-border-radius: 5px; 
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

#products b, #product_image b {
  color:white;
  font-size:20px;
  line-height:22px;
  position:relative;
  z-index:1;
  text-align:center;
  display:block;
}


/* 
 --------------------------------------
 ----- PRODUCT PAGE STYLING -----------
 -------------------------------------- 
*/
#product_links {
  float:left;
}

#product_image {
  position:relative;
  width:360px;
  display:block;
  float:left;
  margin-right: 10px;
  margin-left:5px;
}

#product_image img{
  width:100%;
  float:left;
}


/* 
 --------------------------------------
 ----- FREEWARE STYLING ---------------
 -------------------------------------- 
*/
.freeware img {
  float:left;
  margin-top:20px;
}

.freeware .info {
  font-weight:normal;
}

p.design_by {
  line-height:30px;
  display:block;
  float:left;
  margin-top:10px;
  margin-left:40px;
  font-weight:bold;
  background-color:#323232;
  padding:5px 10px;
  -moz-border-radius: 5px; 
  -webkit-border-radius: 5px;
  border-radius: 5px;
  color:white;
}

p.design_by a {
  color:white;
  font-weight:bold;
  display:block;
}

.clear {
  z-index:0;
  width: 0;
  height:0;
  clear:both;
  display:block;
}

p.testimonial {
  font-style:italic;
  width:100%;
  display:block;
  border-bottom:3px solid #333;
  padding-bottom: 15px;
}

p.testimonial.last {
  border:0;
}

p.testimonial em {
  display:inline;
  font-style:normal;
  background-color:black;
  margin-top: 5px;
  padding:4px 7px;
  -moz-border-radius: 5px; 
  -webkit-border-radius: 5px;
  border-radius: 5px;
  float:right;
}


/* 
 --------------------------------------
 ----- CONTACT PAGE STYLING -----------
 -------------------------------------- 
*/
#contact_form {
  margin-top:10px;
}

#contact_form form {
  margin-left:40px;
}

#contact_form form p{
  display:block;
  width:100%;
}

#contact_form p span {
  float:left;
  line-height: 26px;
  margin-left: 10px;
  font-style:italic;
}

#contact_form p input, #contact_form textarea{
  background-color:#323232;
  -moz-border-radius: 5px; 
  -webkit-border-radius: 5px;
  border-radius: 5px;
  color:white;
  border:1px solid #323232;
  
  font-size:16px;
  font-family:Arial, Helvetica, sans-serif;
  padding: 6px 7px;
  height:16px;
  width: 250px;
  
  float:left;
}
#contact_form p input:hover, #contact_form p input:focus, 
#contact_form textarea:hover, #contact_form textarea:focus {
  background-color:#666;
}

#contact_form textarea {
  height:150px;
}

#contact_form #submit {
  width:100px;
  height:32px;
}



/* 
 --------------------------------------
 ----- GENERAL ELEMENTS STYLING -------
 -------------------------------------- 
*/
/* Box Styling */
.box {
  background:url(images/news_rpt.png) 2px 0px repeat-y;
  width:645px;
  min-height: 166px;
  position:relative;
  float:left;
  padding-left:22px;
  padding-right:22px;
  padding-bottom: 30px;
  margin-left:-9px !important;
  margin-top:15px;
}

.box .top {
	background:url(images/news_top.png) no-repeat;
	width:100%;
	height:166px;
	position:absolute;
	top:-10px;
	left:2px;
}

.box .bottom {
	background:url(images/news_btm.png) 1px 0px no-repeat;
	width:100%;
	height:14px;
	bottom:-10px;
	left:1px;
	position:absolute;
}

.box h3 {
	background:url(images/news_h3.png) no-repeat;
	width:181px;
	height:44px;
	font-size:22px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	text-align:center;
	color:white;
	position:relative;
	z-index:1;
	margin-left:-26px;
	margin-top:20px;
	padding-top: 12px;
}

.box p, .box div {
	float:left;
	color:white;
	position:relative;
	z-index:10;
	font-size:16px;
	font-family:Arial, Helvetica, sans-serif;
	line-height:19px;
	margin-top:5px;
	margin-bottom:5px;
}

#about h3, .red h3 {
	background:url(images/about_h3.png) no-repeat;
}

/* Buttons  */
.button {
	display:block;
	background:url(images/button.png) no-repeat top left;
	position:relative;
	height:40px;
	width: 317px;
	line-height:40px;
	padding-left:10px;
	padding-right:0px;
	margin-top:10px;
	margin-bottom:5px;
	float:left;
	color:white;
	font-weight:bold;
	z-index:3;
}

.button .right {
	background:url(images/button.png) no-repeat top right;
	position:absolute;
	top:0;
	right:-25px;
	display:block;
	height:40px;
	width:25px;
}

.button .info {
	position:absolute;
	right:0px;
	background:url(images/info.png);
	line-height:26px;
	width:77px;
	text-align:center;
	margin-top: 7px;
	font-weight:bold;
}

.button:hover, .button:hover .right {
	background-image:url(images/button_hover.png);
}

.button:hover .info {
	background-image:url(images/info_hover.png);
}

/* Titles */
h2 {
	font-size:25px;
	font-weight:bold;
	color:white;
	margin-bottom:10px;
}

/* Footer */
#footer {
	padding-top:20px;
	padding-bottom:20px;
}