/*   Buttons
---------------------------------------------------------- */
a.btn:link,a.btn:visited{
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
border:1px #ccc solid; 
padding:9px 15px;
background: #ddd;
font-weight: bold;
background-image:url(images/btn.png);
text-decoration:none;
color:#555;
margin:8px 2px;display: inline-block;outline: none; text-shadow:1px 1px 1px #fff; -webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;
}
.csseffect{-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;}

a.btn:hover{ border:1px #444 solid;color:#fff; text-shadow:1px 1px 1px #000; background-color:#333}
a.btn:active{ background-color:#000}
.Social-Links{ padding-top:3px}
.Social-Links strong{ padding-right:10px; display:block; float:left; height:36px; font-weight:normal; line-height:36px; font-size:11px}
.Social-Links a{ margin-right:2px; -webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease; padding:10px 18px; line-height:36px;}
.Social-Links .icoFacebook{background:url(images/SocialMedia.png) no-repeat 0 0;}
.Social-Links .icoTwitter{background:url(images/SocialMedia.png) no-repeat -36px 0;}
.Social-Links .icoMySpace{background:url(images/SocialMedia.png) no-repeat -72px 0;}
.Social-Links .icoStumbleUpon{background:url(images/SocialMedia.png) no-repeat -108px 0;}
.Social-Links .icoDigg{background:url(images/SocialMedia.png) no-repeat -144px 0;}
.Social-Links .icoFlickr{background:url(images/SocialMedia.png) no-repeat -180px 0;}
.Social-Links .icoIN{background:url(images/SocialMedia.png) no-repeat -216px 0;}
.Social-Links .icoLinkedIn{background:url(images/SocialMedia.png) no-repeat -252px 0;}
.Social-Links .icoYouTube{background:url(images/SocialMedia.png) no-repeat -288px 0;}
.Social-Links .icoDelicious{background:url(images/SocialMedia.png) no-repeat -324px 0;}
.Social-Links .icoBlogger{background:url(images/SocialMedia.png) no-repeat -360px 0;}
.Social-Links .icoRSS{background:url(images/SocialMedia.png) no-repeat -396px 0;}
.Social-Links .icoEmail{background:url(images/SocialMedia.png) no-repeat -432px 0;}
.Social-Links .icoTumblr{background:url(images/SocialMedia.png) no-repeat -468px 0;}
.Social-Links .icoFourSquare{background:url(images/SocialMedia.png) no-repeat -504px 0;}
.Social-Links .icoReddit{background:url(images/SocialMedia.png) no-repeat -540px 0;}
.Social-Links .icoVimeo{background:url(images/SocialMedia.png) no-repeat -576px 0;}
.Social-Links .icoWordPress{background:url(images/SocialMedia.png) no-repeat -612px 0;}
.Social-Links .icoBebo{background:url(images/SocialMedia.png) no-repeat -648px 0;}
.Social-Links .icoTwitter2{background:url(images/SocialMedia.png) no-repeat -684px 0;}
.Social-Links .icodnnskin{background:url(images/SocialMedia.png) no-repeat -720px 0;}

/*hover style*/

.Social-Links .icoFacebook:hover{background:url(images/SocialMedia.png) no-repeat 0 -36px}
.Social-Links .icoTwitter:hover{background:url(images/SocialMedia.png) no-repeat -36px -36px}
.Social-Links .icoMySpace:hover{background:url(images/SocialMedia.png) no-repeat -72px -36px}
.Social-Links .icoStumbleUpon:hover{background:url(images/SocialMedia.png) no-repeat -108px -36px}
.Social-Links .icoDigg:hover{background:url(images/SocialMedia.png) no-repeat -144px -36px}
.Social-Links .icoFlickr:hover{background:url(images/SocialMedia.png) no-repeat -180px -36px}
.Social-Links .icoIN:hover{background:url(images/SocialMedia.png) no-repeat -216px -36px}
.Social-Links .icoLinkedIn:hover{background:url(images/SocialMedia.png) no-repeat -252px -36px}
.Social-Links .icoYouTube:hover{background:url(images/SocialMedia.png) no-repeat -288px -36px}
.Social-Links .icoDelicious:hover{background:url(images/SocialMedia.png) no-repeat -324px -36px}
.Social-Links .icoBlogger:hover{background:url(images/SocialMedia.png) no-repeat -360px -36px}
.Social-Links .icoRSS:hover{background:url(images/SocialMedia.png) no-repeat -396px -36px}
.Social-Links .icoEmail:hover{background:url(images/SocialMedia.png) no-repeat -432px -36px}
.Social-Links .icoTumblr:hover{background:url(images/SocialMedia.png) no-repeat -468px -36px}
.Social-Links .icoFourSquare:hover{background:url(images/SocialMedia.png) no-repeat -504px -36px}
.Social-Links .icoReddit:hover{background:url(images/SocialMedia.png) no-repeat -540px -36px}
.Social-Links .icoVimeo:hover{background:url(images/SocialMedia.png) no-repeat -576px -36px}
.Social-Links .icoWordPress:hover{background:url(images/SocialMedia.png) no-repeat -612px -36px}
.Social-Links .icoBebo:hover{background:url(images/SocialMedia.png) no-repeat -648px -36px}
.Social-Links .icoTwitter2:hover{background:url(images/SocialMedia.png) no-repeat -684px -36px}
.Social-Links .icodnnskin:hover{background:url(images/SocialMedia.png) no-repeat -720px -36px}

.hr1								{ clear: both;border-bottom:1px solid #efefef;margin:40px 0;	height:1px;}
.hr2								{ clear: both;	height:1px;	width:100%;	background: url(images/dotted.png) repeat-x;	margin:40px 0;	height:1px;}
.hr3								{ height:5px;	background: url(images/shadow.png) no-repeat center top;	width:100%;	margin:40px 0;}
.hr4								{ border-bottom:none;	margin:40px 0;	width:100%;	height:14px;	background: url(images/stripes.png);display: block;}
.space20							{ height:20px; clear:both}
.space30							{ height:30px; clear:both}
.space40							{ height:40px; clear:both}
.space50							{ height:50px; clear:both}

a.success:link,a.success:active,a.success:visited{background-color:#3dac67; color:#fff; text-shadow:1px 1px 1px #256625;border: 1px solid #3ea73e; border-bottom:1px #387038 solid}
a.success:hover{border: 1px solid #256625; background-color:#227943}
a.warning:link,a.warning:active,a.warning:visited{background-color:#f89f22; color:#fff; text-shadow:1px 1px 1px #f19005; border:1px #f89406 solid; border-bottom:1px #ad6704 solid;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;}
a.warning:hover{border: 1px solid #c4490c; background-color:#df5815}
a.danger:link,a.danger:active,a.danger:visited{background-color:#e43e1a; color:#fff; text-shadow:1px 1px 1px #bd1f06; border:1px #d7310c solid; border-bottom:1px #bb2908 solid}
a.danger:hover{border: 1px solid #bd1f06; background-color:#b5290b}
a.info:link,a.info:active,a.info:visited{background-color:#2a98cc; color:#fff; text-shadow:1px 1px 1px #0e557b; border:1px #238fc2 solid; border-bottom:1px #0e6c99 solid}
a.info:hover{border: 1px solid #0e557b; background-color:#157dae}


a.small:link,a.small:active,a.small:visited{ font-size:12px;}
a.medium:link,a.medium:active,a.medium:visited{ font-size:18px; line-height:26px; padding: 8px 20px}
a.large:link,a.large:active,a.large:visited{ font-size:20px; text-transform:uppercase; line-height:30px; padding: 10px 25px; margin:10px 5px}

.sign-in span{ background:url(images/i-sign.png) left center no-repeat; padding:2px 12px 2px 9px;}
.sign-out span{ background:url(images/i-sigout.png) left center no-repeat; padding:2px 12px 2px 9px;}
.site-map span{ background:url(images/i-sitemap.png) left center no-repeat; padding:2px 12px 2px 9px;}
.comment span{ background:url(images/i-comment.png) left center no-repeat; padding:2px 12px 2px 9px;}
.print span{ background:url(images/i-print.png) left center no-repeat; padding:2px 12px 2px 9px;}
.idea span{ background:url(images/i-ideas.png) left center no-repeat; padding:2px 12px 2px 9px;}
.mail span{ background:url(images/i-mail.png) left center no-repeat; padding:2px 12px 2px 9px;}
.download span{ background:url(images/i-down.png) left center no-repeat; padding:2px 12px 2px 9px;}
.setting span{ background:url(images/i-set.png) left center no-repeat; padding:2px 12px 2px 9px;}
.refesh span{ background:url(images/i-refesh.png) left center no-repeat; padding:2px 12px 2px 9px;}
.paypal span{ background:url(images/i-paypal.png) left center no-repeat; padding:2px 12px 2px 9px;}
.search span{ background:url(images/i-search.png) left center no-repeat; padding:2px 12px 2px 9px;}
.star span{ background:url(images/i-star.png) left center no-repeat; padding:2px 12px 2px 9px;}
.calendar span{ background:url(images/i-calendar.png) left center no-repeat; padding:2px 12px 2px 9px;}
.correct span{ background:url(images/i-correct.png) left center no-repeat; padding:2px 12px 2px 9px;}
.add span{ background:url(images/i-add.png) left center no-repeat; padding:2px 12px 2px 9px;}
.tel span{ background:url(images/i-tel.png) left center no-repeat; padding:2px 12px 2px 9px;}
.camera span{ background:url(images/i-camera.png) left center no-repeat; padding:2px 12px 2px 9px;}
.phone span{ background:url(images/i-phone.png) left center no-repeat; padding:2px 12px 2px 9px;}
.lock span{ background:url(images/i-lock.png) left center no-repeat; padding:2px 12px 2px 9px;}


/* blockquote Style */


blockquote.style1 					{ font: 14px/24px Arial, Helvetica, sans-serif;  margin: 5px;  }  
blockquote.style1 span 				{ display: block;  background-color: #f5f5f5; border: 1px solid #ddd;  padding: 10px;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px; font-style:italic}  
blockquote.style1 p 				{ background:url(images/bq.gif) 60px 0 no-repeat; margin:-1px 0 0 20px; padding-top:15px; text-indent:40px} 
blockquote.style2 					{ font: 14px/1.2em normal Tahoma, sans-serif;  padding: 16px 20px 10px 0;  margin: 5px;  background: url(images/openquote2.png) 0 0 no-repeat;  text-indent: 35px; }  
blockquote.style2 span 				{ display: block;  background: url(images/closequote2.png) bottom right no-repeat; }   
blockquote.style2 p 				{ font-size:12px} 
blockquote.style3 					{ font: 14px/20px italic Times, serif;padding-left: 70px;padding-top: 18px;padding-bottom: 18px;padding-right: 10px;margin: 5px;background: url(images/openquote3.png) 0 0 no-repeat #eee;text-indent: 23px;}   
blockquote.style4 					{ padding-left: 70px;padding-top: 5px;padding-bottom: 5px;margin: 5px;background: url(images/openquote4.png) top left no-repeat;text-indent: 23px;}  
blockquote.style4 span 				{ padding-right: 50px;display: block;background: url(images/closequote4.png) bottom right no-repeat;}  

/* Ul List Style*/

ul.elements-list li					{ height:30px}
ul.elements-list code				{ float:right; margin:0px; padding:1px 2px; font-family:Arial, Helvetica, sans-serif}
.list-wrapper .mlist ul				{ margin:0px; padding:0px}
.dlist dt							{ margin:0px; padding:5px 0; font-weight:bold}
.dlist dd							{ margin:0px; padding:0px;}
.ulist1								{ margin:0px; padding:0px;}
.ulist1 li							{ margin:0px; padding:5px 0; list-style:none; background:url(images/li.gif) 3px center no-repeat; padding-left:20px;}
.ulist2								{ margin:0px; padding:0px;}
.ulist2 li							{ margin:0px; padding:5px 0; list-style:none; background:url(images/ul2.gif) 3px center no-repeat; padding-left:20px;}
.ulist3								{ margin:0px; padding:0px;}
.ulist3 li							{ margin:0px; padding:0px; list-style:none;}
.ulist3 li a						{ margin:0px; padding:5px 0; background:url(images/ul3.png) right center no-repeat;display:block; -webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease; cursor:pointer}
.ulist3 li a:hover					{ background:url(images/ul3.png) left center no-repeat;display:block; padding-left:27px}
.ulist4								{ margin:0px; padding:0px;}
.ulist4 li							{ margin:0px; padding:8px 0; list-style:none; border-top:1px #eee solid}
.ulist4 li a						{ text-decoration:none; color:#666; cursor:pointer}
.ulist4 li a:hover					{ color:#000}
.ulist4 li:first-child				{ border-top:0px #ccc solid}


/* Table Style*/

.black_table{ border:1px black solid; border-right:none; overflow:hidden}
.black_table thead{ background:black}
.black_table thead th{ padding:5px; text-align:left; color:#fff;}
.black_table td{ border:1px black solid; border-bottom:none; border-left:none; padding:5px;}

.gray_table{ border:1px gray solid;}
.gray_table thead{ background:gray}
.gray_table thead th{ padding:5px; text-align:left; color:#fff;}
.gray_table td{ border-top:1px gray solid; padding:5px;}

.color_table{ border:1px #666 solid; border-right:none}
.color_table thead{ background:red}
.color_table thead th{ padding:5px; text-align:left; color:#fff;}
.color_table td{ border:1px #666 solid; border-bottom:none; border-left:none; padding:5px;}

.silver_table{ border:1px silver solid;}
.silver_table thead{ background:silver}
.silver_table thead th{ padding:5px; text-align:left;}
.silver_table td{ border-top:1px silver solid; border-bottom:none;padding:5px;}






/*layout*/
.span12 { width:100%;}
.span11 { width: 91.48936170212765%;}
.span10 {  width:82.97872340425532%;}
.span9 {  width:74.46808510638297%	;}
.span8 {  width: 65.95744680851064%; }
.span7 {  width: 57.44680851063829%;}
.span6 {  width:48.93617021276595%;}
.span5 {  width:40.42553191489362%;}
.span4 {  width:31.914893617021278%;}
.span3 {  width: 23.404255319148934%;}
.span2 {  width:  14.893617021276595%;}
.span1 { width: 6.382978723404255%;}
.layoutcontainer [class*="span"] + [class*="span"] {margin-left: 2.127659574468085%;}
h2.typography{ padding:15px 0; border-bottom:1px #ccc solid; margin-bottom:20px}
/*Grid Layout*/
.demo-grid .layoutcontainer div{ background:#eee; text-align:center; line-height:3em;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.hot{ background:#eee; color:#f00; padding:2px 6px;}
.demo-grid .layoutcontainer div:hover{ background:#ddd;}
.layoutcontainer .span1,.layoutcontainer .span2,.layoutcontainer .span3,.layoutcontainer .span4,.layoutcontainer .span5,.layoutcontainer .span6,.layoutcontainer .span7,.layoutcontainer .span8,.layoutcontainer .span9,.layoutcontainer .span9,.layoutcontainer .span10,.layoutcontainer .span11,.layoutcontainer .span12{ float:left}
.layoutcontainer:after{ display:block; content:''; clear:both}



@media screen and (max-width: 767px) {
.span12,.span11,.span10,.span9,.span8,.span7,.span6,.span5,.span4,.span3,.span2,.span1 { width: auto; padding:5px 0; float:none; clear:both}
.layoutcontainer .span1,.layoutcontainer .span2,.layoutcontainer .span3,.layoutcontainer .span4,.layoutcontainer .span5,.layoutcontainer .span6,.layoutcontainer .span7,.layoutcontainer .span8,.layoutcontainer .span9,.layoutcontainer .span9,.layoutcontainer .span10,.layoutcontainer .span11,.layoutcontainer .span12{ float: none}
.layoutcontainer [class*="span"] + [class*="span"] {margin-left:0px;}
}