/*@ start overwrite*/
#header-wrapper { 
    background: url("../img/bg-top-pattern.png") repeat-x scroll 0 0 transparent;    
}
/*@ end overwrite */

section#examples-wrapper {
    height: auto;
    padding: 40px 0 0 25px;
    position: relative;
    width: 955px;
}

section#examples-wrapper .columns-wrapper{
	clear:both;
	height:auto;	
}

section#examples-wrapper .left-column{
	width:580px;
	height:auto;
	float:left;
	padding:10px 35px 0 4px;
}
	
section#examples-wrapper h1{
	background: url(../img/title-examples.png) no-repeat;
	width:900px;	
	height:43px;
	text-indent: -9999px;
	padding-bottom:24px;
}

section#examples-wrapper p{
	color:#1a5d87;		
	font-size:17px;
	font-weight:normal;		
}

section#examples-wrapper p span{
	color:#f3f8fb;		
	display:block;
}

ul#categories{
	list-style:none;	
	margin:0px;
	padding:30px 0 35px 0px;
	float:left;
	/*border:1px solid red;*/	
}
ul#categories li{ 
	width:162px;
	/*height:200px;*/
	float:left;
	padding:0 20px 0 0;	
}

ul#categories li .graph-wrapper{
	position:relative;
	height:150px;
	/*border:1px solid red;*/
}

ul#categories li a{
	text-decoration:none;
	text-align:center;
}

ul#categories li a span{	
	font-size:18px;
	color:#ffffff;
	display:block;		
}

/*** corporate **/
ul#categories li.corporate .graphic{		
	background: url(../img/corporate-graphic.png);
	width:143px;
	height:129px;
	position:absolute;
	top:0px;
	left:16px;	
}

ul#categories li.corporate .drop{
	background: url(../img/corporate-drop.png);
	width:79px;
	height:55px;
	position:absolute;
	top:18px;
	left:45px;	
}

ul#categories li.corporate a{
	background: url(../img/btn-categories.png) no-repeat;
	width:166px;
	height:70px;	
	display:block;	
}

ul#categories li.corporate a:hover{
	background-position: 0 -80px;	
}

ul#categories li.corporate a span{	
	padding:20px;
}


/*** ecommerce **/
ul#categories li.ecommerce .graphic{		
	background: url(../img/ecommerce-graphic.png) no-repeat;
	width:134px;
	height:126px;
	position:absolute;
	top:0px;
	left:16px;	
}
ul#categories li.ecommerce .drop{
	background: url(../img/ecommerce-drop.png);
	width:50px;
	height:66px;
	position:absolute;
	top:0px;
	left:13px;	
}
ul#categories li.ecommerce a{
	background: url(../img/btn-categories.png) no-repeat;
	width:166px;
	height:70px;	
	display:block;	
}

ul#categories li.ecommerce a:hover{
	background-position: 0 -80px;	
}
ul#categories li.ecommerce a span{	
	padding:20px;
}

/*** interactive **/
ul#categories li.interactive .graphic{		
	background: url(../img/interactive-graphic.png);
	width:126px;
	height:129px;
	position:absolute;
	top:-7px;
	left:16px;	
}
ul#categories li.interactive .drop{
	background: url(../img/interactive-drop.png);
	width:103px;
	height:95px;
	position:absolute;
	top:40px;
	left:15px;	
}
ul#categories li.interactive a{
	background: url(../img/btn-categories.png) no-repeat;
	width:166px;
	height:70px;	
	display:block;	
}

ul#categories li.interactive a:hover{
	background-position: 0 -80px;	
}
ul#categories li.interactive a span{	
	padding:20px 0 0 0;
}

/*** virtual ***/
ul#categories li.virtual{
	padding:57px 20px 0 0;
}
ul#categories li.virtual .graphic{		
	background: url(../img/flash-graphic.png);
	width:86px;
	height:135px;
	position:absolute;
	top:-11px;
	left:43px;
	z-index: 2;	
}
ul#categories li.virtual .drop{
	background: url(../img/flash-drop.png);
	width:92px;
	height:73px;
	position:absolute;
	top:57px;
	left:45px;	
}
ul#categories li.virtual a{
	background: url(../img/btn-categories.png) no-repeat;
	width:166px;
	height:70px;	
	display:block;	
}

ul#categories li.virtual a:hover{
	background-position: 0 -80px;	
}
ul#categories li.virtual a span{	
	padding:7px 0 0 7px;
	width:151px;
}

/*** brand ***/
ul#categories li.brand{
	padding:57px 20px 0 0;
}
ul#categories li.brand .graphic{		
	background: url(../img/brand-graphic.png) no-repeat;
	width:146px;
	height:127px;
	position:absolute;
	top:0px;
	left:10px;	
}
ul#categories li.brand .drop{
	background: url(../img/brand-drop.png) no-repeat;
	width:145px;
	height:63px;
	position:absolute;
	top:53px;
	left:11px;	
}
ul#categories li.brand a{
	background: url(../img/btn-categories.png) no-repeat;
	width:166px;
	height:70px;	
	display:block;	
}

ul#categories li.brand a:hover{
	background-position: 0 -80px;	
}
ul#categories li.brand a span{	
	padding:7px 0 0 8px;
	width:148px;
}

/** Videos **/ 
ul#categories li.videos{
	padding:57px 20px 0 0;
}
ul#categories li.videos .graphic{		
	background: url(../img/videos-graphic.png) no-repeat;
	width:146px;
	height:133px;
	position:absolute;
	top: -9px;
	left:10px;	
}
ul#categories li.videos .drop{
	background: url(../img/brand-drop.png) no-repeat;
	width:145px;
	height:63px;
	position:absolute;
	top:53px;
	left:11px;	
}
ul#categories li.videos a{
	background: url(../img/btn-categories.png) no-repeat;
	width:166px;
	height:70px;	
	display:block;	
}

ul#categories li.videos a:hover{
	background-position: 0 -80px;	
}
ul#categories li.videos a span{	
	padding:7px 0 0 8px;
	width:148px;
}

/*** social **/

ul#categories li.social{
	padding:57px 20px 0 0;
}

ul#categories li.social .graphic{		
	background: url(../img/Socialicon.png);
	width:143px;
	height:145px;
	position:absolute;
	top:0px;
	left:16px;	
}

ul#categories li.social .drop{
	background: url(../img/corporate-drop.png);
	width:79px;
	height:55px;
	position:absolute;
	top:18px;
	left:45px;	
}

ul#categories li.social a{
	background: url(../img/btn-categories.png) no-repeat;
	width:166px;
	height:70px;	
	display:block;	
}

ul#categories li.social a:hover{
	background-position: 0 -80px;	
}

ul#categories li.social a span{	
	padding:20px;
}


/** **/

section#examples-wrapper .right-column{
	background: url(../img/bg-companies.png) no-repeat;
	width:292px;
	height:545px;
	float:left;
	padding:60px 0 0 0;
	
}
section#examples-wrapper .right-column .logos-left{float:left; width:100px;padding:0 0px 0 46px;}
section#examples-wrapper .right-column .logos-right{float:left;width:100px;}
	
section#examples-wrapper .right-column a{
	display:block;	
	text-indent:-9999px;
	background-repeat:no-repeat !important;
	/*padding:0 0 25px 0;*/
	margin:auto;
	cursor:default;	
}
section#examples-wrapper .right-column a.sony{
	background:url(../img/logo-sony.png);
	width:70px;
	height:16px;
	
}
section#examples-wrapper .right-column a.overstock{
	background:url(../img/logo-overstock.png);
	width:105px;
	height:28px;
}
section#examples-wrapper .right-column a.toys{
	background:url(../img/logo-toys.png);
	width:74px;
	height:40px;
	padding:0 0 24px 0;
}
section#examples-wrapper .right-column a.gap{
	background:url(../img/logo-gap.png);
	width:60px;
	height:40px;
	padding:0 0 31px 0;
}
section#examples-wrapper .right-column a.nokia{
	background:url(../img/logo-nokia.png);
	width:74px;
	height:16px;
	padding:0 0 53px 0;
}
section#examples-wrapper .right-column a.marriot{
	background:url(../img/logo-marriot.png);
	width:84px;
	height:32px;
	padding:0 0 35px 0;
}
section#examples-wrapper .right-column a.unknow{
	background:url(../img/logo-unknow.png);
	width:43px;
	height:40px;
	padding:0 0 37px 0;
}
section#examples-wrapper .right-column a.nascar{
	background:url(../img/logo-nascar.png);
	width:92px;
	height:20px;
	padding:0 0 39px 0;
}
section#examples-wrapper .right-column a.atyt{
	background:url(../img/logo-atyt.png);
	width:25px;
	height:40px;
	padding:0 0 23px 0;
}
section#examples-wrapper .right-column a.kelloggs{
	background:url(../img/logo-kelloggs.png);
	width:60px;
	height:30px;
	padding:0 0 35px 0;
}
section#examples-wrapper .right-column a.google{
	background:url(../img/logo-google.png);
	width:60px;
	height:22px;
	padding:0 0 36px 0;
}
section#examples-wrapper .right-column a.atmel{
	background:url(../img/logo-atmel.png);
	width:60px;
	height:30px;
	padding:0 0 40px 0;
}
section#examples-wrapper .right-column a.cocacola{
	background:url(../img/logo-cocacola.png);
	width:60px;
	height:24px;
	padding:0 0 43px 0;
}
section#examples-wrapper .right-column a.toyota{
	background:url(../img/logo-toyota.png);
	width:60px;
	height:46px;
	padding:0 0 26px 0;
}
section#examples-wrapper .right-column a.universal{
	background:url(../img/logo-universal.png);
	width:65px;
	height:40px;
	padding:0 0 23px 0;
}
section#examples-wrapper .right-column a.ge{
	background:url(../img/logo-ge.png);
	width:36px;
	height:40px;
	padding:0 0 14px 0;
	
}

#awards-wrapper{
	background: url(../img/bg-examples-awards.png) no-repeat;
	width:920px;
	height:500px;	
	clear:both;		
}
#awards-content{
	padding:53px 0 0 38px	
}
#awards-content h2{
	background: url(../img/title-awards.png);
	width:126px;
	height:35px;
	text-indent:-9999px;	
	margin:0px 0 10px 0;
}
#awards-content p.awardtext{
	font-size:17px;
	color:#ffffff;	
}

#awards-content ul{
	margin:0;
	list-style:none;	
	padding:10px 0 0 0;
	height: 45px;
}
#awards-content ul.first_line{
	height: 45px;
}
#awards-content ul.second_line{
	height: 85px;
	padding:0px;
}
#awards-content ul.third_line{
	height: 115px;
}
#awards-content ul.first_line li{
	float:left;
	width:179px;
	height:40px;
	text-indent:-9999px;	
}
#awards-content ul.second_line li{
	float:left;
	height:75px;
	text-indent:-9999px;	
}
#awards-content ul.third_line li{
	float:left;
	height:110px;
	text-indent:-9999px;	
}
#awards-content ul li{

}
#awards-content ul li.cssawards{background: url(../img/logo-cssawards.png) no-repeat;width:184px;}
#awards-content ul li.thebestdesigns{background: url(../img/logo-thebestdesigns.png) no-repeat;width:204px;}
#awards-content ul li.csselite{background: url(../img/logo-csselite.png) no-repeat;width:169px;}
#awards-content ul li.cssremix{background: url(../img/logo-cssremix.png) no-repeat 0 7px;width:145px;}
#awards-content ul li.creattica{background: url(../img/logo-creattica.png) no-repeat 0 2px;}

#awards-content ul li.business_journal{background: url(../img/logo-business_journal.png) no-repeat 0 2px;width:163px;margin: 10px 0px 0px 20px;}
#awards-content ul li.ingrams{background: url(../img/logo-ingrams.png) no-repeat 0 2px;width:186px;margin: 10px 0px 0px 0px;}
#awards-content ul li.best{background: url(../img/logo-best.png) no-repeat 0 2px;width:115px;margin: 10px 0px 0px 0px;}
#awards-content ul li.dependable{background: url(../img/logo-dependable.png) no-repeat 0 2px;width:254px;margin: 0px 0px 0px 0px;}
#awards-content ul li.best_search{background: url(../img/logo-best_search.png) no-repeat 0 2px;width:90px;}

#awards-content ul li.flash{background: url(../img/logo-flash.png) no-repeat 0 2px;width:179px;margin: 0px 0px 0px 86px;}
#awards-content ul li.ecommerce{background: url(../img/logo-ecommerce.png) no-repeat 0 2px;width:179px;}
#awards-content ul li.web_development{background: url(../img/logo-web_development.png) no-repeat 0 2px;width:179px;}
#awards-content ul li.web_strategy{background: url(../img/logo-web_strategy.png) no-repeat 0 2px;width:179px;}
