/*

Tutoralzine Demo 
Original tutorial: Making Our Own Twitter Timeline
Tutorial URL: http://tutorialzine.com/2009/09/making-our-own-twitter-timeline/

You are free to use the following demo code for any purpose you see fit.

*/


/* Page styles */

body,h1,h2,h3,p,quote,small,form,input,ul,li,ol{
	margin:0px;
	padding:0px;
}

body{
	margin-top:5px;
	color:#51555C;
}


/* Form & timeline styles */

#twitter-container{
	-moz-border-radius:12px;
	-khtml-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius:12px;
	
	border:6px solid #f5f5f5;
		margin:5px 5px 5px 5px;
	padding:4px;
	/*width:700px; */
	
	font-size:11px;
	font-family:'Lucida Grande',sans-serif;
	color:#333333;
}

label{
	font-size:20px;
		font-family:'Lucida Grande',sans-serif;
text-align:left;
	font-weight:bold;
}

.counter{
	color:#CCCCCC;
	float:right;
	font-family:Georgia,serif;
	font-size:20px;
	font-weight:bold;
	height:24px;
	overflow:hidden;
	margin:0px 20px 0px 0px;
}

textarea{
	width:280px;
	height:80px;
	margin:5px 0 5px 0;
	
	border:1px solid #AAAAAA;
	padding: 4px 2px;
		
	font-family:'Lucida Grande',sans-serif;
	overflow:auto;
	font-size:14px;
}

.clear{
	clear:both;
}

.submitButton{
	color:#666666;
	font-size:14px;
	height:32px;
	width:115px;
	
	-moz-border-radius:6px;
	-khtml-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius:6px;
	
	border:1px solid #cccccc;
	background:url(/images/button_bg.gif) repeat-x #f5f5f5;
	
	cursor:pointer;
	float:right;
}


.submitButton2{
	color:#666666;
	font-size:14px;
	height:32px;
	width:115px;
	
	-moz-border-radius:6px;
	-khtml-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius:6px;
	
	border:1px solid #cccccc;
	background:url(/images/button_bg.gif) repeat-x #f5f5f5;
	
	cursor:pointer;
	float:right;
}

.submitButton2:hover{
	background-position:bottom;
	border-color:#dddddd;
	color:#333333;
}


.submitButton:hover{
	background-position:bottom;
	border-color:#dddddd;
	color:#333333;
}

.inact,.inact:hover{
	background:#f5f5f5;
	border:1px solid #eeeeee;
	color:#aaaaaa;
	cursor:auto;
}

.latest{
	color: #666666;
}

ul.statuses{
	margin:10px 0;

}

ul.statuses li {
	position:relative;
	border-bottom:1px dashed #D2DADA;
	padding:10px 0px 10px 10px;
	list-style:none;
	font-size:14px;
}

ul.statuses li:first-child{
	border-top:1px dashed #D2DADA;
}

ul.statuses li:hover {
	background-color:#F7F7F7;
}

h3.timeline{
	margin-top:20px;
	color:#999999;
	font-size:20px;
	font-weight:normal;
}

div.tweetTxt{
	float:left;
	width:330px;
	overflow:hidden;
}



.avatar2{
	
	margin-right:5px;
	margin-bottom:5px;
	border:1px solid #220000;
}

.avatar3{
	float:left;
	margin-right:5px;
	margin-bottom:5px;
	border:1px solid #220000;
}

div.date{
	line-height:18px;
	font-size:12px;
	color:#999999;
}

div.footertweet{
	float:right;
	font-size:12px;
	color:#999999;
}

li a, li a:visited {
	color:#007bc4;
	text-decoration:none;
	outline:none;
}

li a:hover{
	text-decoration:underline;
}


.button {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 6px 12px;
   -webkit-border-radius: 11px;
   -moz-border-radius: 11px;
   border-radius: 11px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: #ffffff;
   font-size: 13px;
   font-family: Arial;
   text-decoration: none;
   vertical-align: middle;
   }
   
    .button:link {
  
   color: #ffffff;
   }
   
   .button:visited {
  
   color: #ffffff;
   }
   
.button:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ffffff;
   }
  
.button:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }
   
 
 
 .button2 {
   border-top: 1px solid #e62e2e;
   background: #e69696;
   background: -webkit-gradient(linear, left top, left bottom, from(#d41b1b), to(#e69696));
   background: -webkit-linear-gradient(top, #d41b1b, #e69696);
   background: -moz-linear-gradient(top, #d41b1b, #e69696);
   background: -ms-linear-gradient(top, #d41b1b, #e69696);
   background: -o-linear-gradient(top, #d41b1b, #e69696);
   padding: 6px 12px;
   -webkit-border-radius: 11px;
   -moz-border-radius: 11px;
   border-radius: 11px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: #b81eb8;
   font-size: 13px;
   font-family: Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
   
   .button2:link {
  
   color: #ffffff;
   }
   
   .button2:visited {
  
   color: #ffffff;
   }
   
.button2:hover {
   border-top-color: #782828;
   background: #782828;
   color: #ffffff;
   }
.button2:active {
   border-top-color: #5c1b1b;
   background: #5c1b1b;
   }