@charset "utf-8";
/* CSS Document */
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;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
body {
	background-color:#f0f0f0;
}
body a {
	text-decoration:none;
}
#header {
	height:130px;
	width:100%;
	background-image:url(images/wdd_02.gif);
	background-repeat:repeat-x;
}
#inheader {
	width:960px;
	height:95px;
	margin-left:auto;
	margin-right:auto;
	margin-top:0;
	margin-bottom:0;
}
#logo {
	width:450px;
	height:95px;
	padding-top:35px;
	padding-left:25px;
	float:left;
}
#topad {
	width:465px;
	height:95px;
	padding-top:35px;
	padding-right:20px;
	float:right;
}
@font-face {
	font-family: Museo500-Regular;
	src: url('Museo500-Regular.otf') format('opentype');
}
.menu { padding:10px 20px; width:920px; margin-left:auto; margin-right:auto; margin-top:0; margin-bottom:0;}
.menu ul { text-align: left; padding:0; margin:0; list-style:none; border:0; float:left;}
.menu ul li { float:left; margin:0; padding:0 5px 0 0; border:0;}
.menu ul li a { float:left; margin:0; padding:7px 12px; color:#f0f0f0; font:normal 14px Museo500-Regular, Arial, sans-serif; text-decoration:none; background:#3a3a3a;}
.menu ul li a:hover { color:#f0f0f0; background:#779ec2;}
.menu ul li a.active { color:#f0f0f0; background:#779ec2;}
.clr { clear:both; padding:0; margin:0;}
#container {
	width:960px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:0;
	margin-top:10px;
	border-top:1px solid #e4e3e3;
	overflow:hidden;
}
#content {
	width:660px;
	height:auto;
	float:left;
	border-right:1px solid #e4e3e3;
	margin-bottom:20px;
}
#sidebar {
	width:299px;
	height:auto;
	float:left;
	
}
#title {
	font:normal 22px Museo500-Regular, Arial, sans-serif;
	color:#3a3a3a;
	padding-left:20px;
	padding-top:20px;
	padding-bottom:15px;
}
#title h1 a {
	color:#3a3a3a;
	text-decoration:none;
}
#title h1 a:hover {
	color:#779ec2;
	text-decoration: none;
}
#post {
	padding-left:20px;
	padding-right:10px;
}
#post img {
	border:2px solid #d0dce7;
	margin-bottom:15px;
}
.des {
	width:104px;
	float:right;
}
.des p {
	padding-left:7px;
	padding-top:2px;
	padding-bottom:2px;
	border-top:1px solid #e4e3e3;
}
#post a {
	color:#779ec2;
}
#post a:hover {
	color:#3a3a3a;
	text-decoration:underline;
}
#reso a {
color:#3e5454;
margin-left:15px;
margin-bottom:5px;
}
#reso a:hover {
color:#779ec2;
}
#post p {
	font:normal 14px  Tahoma, Geneva, sans-serif;
	color:#3a3a3a;
	line-height:2em;
	font-size: 12px;
	letter-spacing:0.05em;
	text-align:justify;
}
#post h1 {
	font-size:24px;
	font-family:Tahoma, Geneva, sans-serif;
}
#post h2 {
color: #666;
	font-size:18px;
	font-family:Tahoma, Geneva, sans-serif;
	text-transform:capitalize;
	margin-bottom:5px;
margin-top:20px;
}
#post h3 {
	font-size:16px;
	font-family:Tahoma, Geneva, sans-serif;
}
#post h4 {
	font-size:14px;
	font-family:Tahoma, Geneva, sans-serif;
}
#postsep {
	width:620px;
	height:11px;
	background-image:url(images/10.png);
	margin-top:15px;
	margin-bottom:15px;
}
#ads {
	width:260px;
	float:right;
	padding-top:20px;
	padding-right:20px;
}
#recent {
	width:297px;
	height:39px;
	background-image:url(images/wdd_17.gif);
	float:left;
	margin-top:15px;
	margin-bottom:15px;
}
#poplist {
	padding-left:20px;
	padding-right:20px;
}
#poplist li {
	margin-bottom:14px;
	border-bottom:1px solid #e4e3e3;
	font:normal 14px  Tahoma, Geneva, sans-serif;
	color:#3a3a3a;
	clear: both;
	line-height: 1.5em;
	font-size: 12px;
	overflow: hidden;
}
#poplist li a {
	text-decoration:none;
	color:#3e5454;
}
#poplist li img {
float: left;
				margin: 0 10px 10px 0;
				padding: 0px;
				border:2px solid #d0dce7;
				background-color: #F5F1DB;
				width: 50px;	
}
#poplist a:hover {
	color:#779ec2;
}
#sepfooter {
	height:17px;
	width:100%;
	background-image:url(images/wdd_20.gif);
	margin:0;
	background-repeat:repeat-x;
}
#cfooter {
	height:auto;
	width:100%;
	background-image:url(images/wdd_24.gif);
	background-repeat:repeat;
	margin:0;
	overflow:hidden;
}
#incfooter {
	width:960px;
	margin-left:auto;
	margin-right:auto;
}
#friends {
	width:200px;
	float:left;
	padding:20px;
}
#friends h2 {
	padding-bottom:10px;
	font-size:24px;
	color:#333;
	font-family:Museo500-Regular, Tahoma, sans-serif;
}
#friends a {
	text-decoration:none;
	color:#333;
	text-shadow: #CCC 0px 1px 1px;
	font-size:14px;
	font-family:Museo500-Regular, Tahoma, sans-serif;

}
#friends a:hover {
	text-decoration:underline;
}
#twitter {
	width:380px;
	float:left;
	padding:20px;
	color:#333;
	text-shadow: #CCC 0px 1px 1px;
	font-size:14px;
	font-family:Museo500-Regular, Tahoma, sans-serif;

}
#twitter h2 {
	padding-bottom:10px;
	font-size:24px;
	color:#333;
	font-family:Museo500-Regular, Tahoma, sans-serif;
}
#twitter a {
	text-decoration: underline;
	color:#333;
	text-shadow: #CCC 0px 1px 1px;
	font-size:14px;
	font-family:Museo500-Regular, Tahoma, sans-serif;

}
#twitter_update_list li {
	padding-bottom:10px;
}
#socialmedia {
	width:260px;
	float:left;
	padding:20px;
	color:#333;
	text-shadow: #CCC 0px 1px 1px;
	font-size:14px;
	font-family:Museo500-Regular, Tahoma, sans-serif;

}
#socialmedia h2 {
	padding-bottom:10px;
	font-size:24px;
	color:#333;
	font-family:Museo500-Regular, Tahoma, sans-serif;
}
#socialmedia a {
	text-decoration:none;
	color:#333;
	text-shadow: #CCC 0px 1px 1px;
	font-size:14px;
	font-family:Museo500-Regular, Tahoma, sans-serif;

}
#socialmedia a:hover {
	text-decoration:underline;
}
#socialmedia ul {
	margin-bottom:20px;
}
#endfooter {
	height:20px;
	width:100%;
	background-color:#000;
}
.commentlist li {
	margin: 0 0 18px 0;
	padding: 15px;
	background-color:#FFF;
	border:1px solid #e4e3e3;
	list-style:none;
	}
.commentlist li.bypostauthor {
	background:#e5e5e5 !important; 
	border:1px solid #c7c7c7 !important;
	}
	
.commentlist code {
	background:#e0e0e0;
	padding:3px;
	}
	
.avatar {
	width:60px;
	height:60px;
	margin: 3px 10px 0 0;
	float:left;
	padding:2px;
	border:1px solid #b9b9b9;
	background:#FFF;	
	}

#trackbacklist li {
	margin: 10px 0 10px 35px;
	}

#trackbacklist cite {
	font-style:normal
	}
			
cite.fn {
	font-family: Arial, Helvetica, sans-serif;
	font-size:15px;
	letter-spacing:1px;
	display:block;
	padding-top:3px;
	font-style:normal;
	}	

.says {
	display:none;
	} 
.comment-date a, .comment-date a:visited {
	color:#868686;
	font-size:12px;
	text-decoration:none
	}

.commentmetadata a:hover, .commentmetadata a:active  {
	text-decoration:underline;
	color:#333;
	}
	#aboutauthor {
	margin: 0 0 18px 0;
	padding: 15px;
	background:#F2F2F2;
	border:1px dashed #DDDDDD;
	list-style:none;
}
.Nav {
	font-size: 11px;
	float: left;
	margin: 10px 0px 20px 0px;
}
.Nav a {
	padding: 0.4em 0.5em;
	color: #666;
	background-color: #CCC;
	font-size: 11px;
	border: 1px solid #5A5A5A;
}
.Nav a.on, .Nav a:hover {
	color: #FFF;
	background: #779ec2;
	border: 1px solid  #779ec2;
}
.readmore img {
	border:none;
	float:right;
}
#cd {
	width:600px;
	height:auto;
}
#codes {
	width:300px;
	height:auto;
	float:left;
}
#demo {
	width:250px;
	height:auto;
	float:right;
}
 #border-radius {
	 background-color:#F00;
          width: 200px;
          height: 150px;
	      -webkit-border-radius: 10px;
	      -moz-border-radius: 10px;
	      border-radius: 10px;
         }
#clr {
clear:both;
}
#box-shadow {
	background-color:#F00;
          width: 200px;
          height: 150px;
	-webkit-box-shadow: #333 5px 5px 10px;
	-moz-box-shadow: #333 5px 5px 5px;
	box-shadow: #333 5px 50px 5px;
}
#text-shadow {
	font-size:24px;
	color:#C00;
text-shadow: #333 3px 3px 3px;
}
#text-stroke {
font-size:24px;
-webkit-text-fill-color: #000;
-webkit-text-stroke-color: #C00;
-webkit-text-stroke-width: 1px;
}
#linear-gradient {
width: 200px;
height: 150px;
background-image: -moz-linear-gradient(top, #F00, #F60);
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #F60),color-stop(1, #F00));
}
#radial-gradient {
width: 200px;
height: 150px;
background-image: -moz-radial-gradient(center 45deg, circle closest-corner, #F60 10%, #F00 70%);
background-image: -webkit-gradient(radial, center center, 10, center center, 90, from(#F60), to(#F00));
}
#rotate {
width: 200px;
height: 150px;
background-color:#f00;
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
}
#reflection {
font-size:24px;
color: #f00;
-webkit-box-reflect: below -5px -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(100, 100, 100, 0.4)));
}
#resizing {
width: 200px;
height: 100px;
border:1px solid red;
overflow: hidden;
resize: both;
}
#outline {
width: 200px;
height: 150px;
background-color:#F00;
outline: solid 1px #f00;
outline-offset: 5px;
}




#loading{
	margin-top:20px;
	float:left;
	width:95px;
	height:32px;
	background-color:#779ec2;
	margin-left:30px;
	-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.coloumns{
	background-color:#fff;
	border:1px solid #fff;
	float:left;
	height:30px;
	margin-left:5px;
	width:8px;
	-webkit-animation-name: animation;
 	-webkit-animation-duration: 3s;
 	-webkit-animation-iteration-count: infinite;
 	-webkit-animation-direction: linear;
	opacity:0;
	-webkit-transform:scale(0.7);
	}
#coloumn1{
 	-webkit-animation-delay: .3s;
 }
#coloumn2{
 	-webkit-animation-delay: .4s;
}
#coloumn3{
 	-webkit-animation-delay: .5s;
}
#coloumn4{
 	-webkit-animation-delay: .6s;
 }
#coloumn5{
 	-webkit-animation-delay: .7s;
}
#coloumn6{
 	-webkit-animation-delay: .8s;
}
@-webkit-keyframes animation{
	0%{opacity:0;}
	50%{opacity:1;}
	100%{opacity:0;}
}
#loading1{
	margin-top:20px;
	float:left;
	margin-left:30px;
}
.coloumns1{
	background-color:#39F;
	border:1px solid #00F;
	float:left;
	height:30px;
	margin-left:5px;
	width:8px;
	-webkit-animation-name: animation1;
 	-webkit-animation-duration: 2s;
 	-webkit-animation-iteration-count: infinite;
 	-webkit-animation-direction: linear;
	opacity:0.2;
	-webkit-transform:scale(0.6);
	}
#coloumn11{
 	-webkit-animation-delay: .3s;
 }
#coloumn22{
 	-webkit-animation-delay: .4s;
}
#coloumn33{
 	-webkit-animation-delay: .5s;
}
#coloumn44{
 	-webkit-animation-delay: .6s;
 }
#coloumn55{
 	-webkit-animation-delay: .7s;
}
#coloumn66{
 	-webkit-animation-delay: .8s;
}
@-webkit-keyframes animation1{
	0%{-webkit-transform: scale(.9);opacity:1;}
	100%{-webkit-transform: scale(.2);opacity:0.1;}
}
#loading2{
	margin-top:23px;
	float:left;
	margin-left:30px;
}
.coloumns2{
	-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
	background-color:#39F;
	float:left;
	height:20px;
	margin-left:5px;
	width:20px;
	-webkit-animation-name: animation2;
 	-webkit-animation-duration: 2s;
 	-webkit-animation-iteration-count: infinite;
 	-webkit-animation-direction: linear;
	opacity:0;
	}
#coloumn111{
 	-webkit-animation-delay: .1s;
 }
#coloumn222{
 	-webkit-animation-delay: .3s;
}
#coloumn333{
 	-webkit-animation-delay: .5s;
}
#coloumn444{
 	-webkit-animation-delay: .7s;
 }
@-webkit-keyframes animation2{
	0%{opacity:0;}
	50%{opacity:1;}
	100%{opacity:0;}
}


.images{
	-webkit-transform:scale(0.6);
	-moz-transform:scale(0.6);
	-o-transform:scale(0.6);
	float:left;
	margin-left:-20px;
	margin-right:-20px;
	margin-top:-20px;
	-webkit-transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-o-transition-duration: 0.5s;
	}

.images:hover{
	-webkit-transform:scale(0.8);
	-webkit-box-shadow:0px 0px 30px #999;
	-moz-transform:scale(0.8);
	-moz-box-shadow:0px 0px 30px #ccc;	
	-o-transform:scale(0.8);
	-o-box-shadow:0px 0px 30px #ccc;
}	 
.images .layer{
	width: 100%;
	background-color: rgb(0, 0, 0);
	position: absolute;
	height: 100%; 
	opacity:0.6;
	cursor:pointer;
	-webkit-transition-duration: 0.8s;
	-moz-transition-duration: 0.5s;
	-o-transition-duration:0.5s;
}
#image1:hover .layer{
	width:0%;	
}
#image2:hover .layer{
	
		height:0%;
	z-index:10;
}
#image4:hover .layer{
	margin-left:150px;
	margin-top:150px;
	height:0%;
	width:0%;
}
#image3:hover .layer {
height:0%;	
	margin-top:150px;
}

#image5:hover .layer{
	margin-left:150px;
	margin-top:150px;
	height:0%;
	width:0%;
	-webkit-transform: rotateY(360deg);
}
#image6:hover .layer{
	margin-left:150px;
	margin-top:150px;
	height:0%;
	width:0%;
	-webkit-transform: rotateX(360deg);
}

