/*-----------------------------------------------------------------------------

Screen Stylesheet

version:   	1.0
date:      	20/06/13
author:		collaborative by design
email:     	info@collaborativebydesign.com.au
website:   	http://www.collaborativebydesign.com.au
-----------------------------------------------------------------------------*/


html, body {
				padding: 0;
				margin: 0;
			}
			body, div, p {
				font-family: Arial, Helvetica, Verdana;
				color: #333;
			}
			body {
				background-image:url(../images/sheet_a.png); 
			}
			h1 {
				font-size: 60px;
			}
			a, a:link, a:active, a:visited {
				color: black;
				text-decoration: underline;
			}
			a:hover {
				color: #9E1F63;
			}
			#intro {
				width: 580px;
				margin: 0 auto;
			}
			

			.wrapper {
				width:770px; 
				min-width:300px; 
				overflow:hidden;
				padding:0px 20px;margin:0px auto 50px;
				box-sizing:border-box;
				-moz-box-sizing:border-box;
				-webkit-box-sizing:border-box;
				z-index:10; position: relative;
			}
			.wrapper.whitebg {	
				padding:20px; padding-top:0px;
				background:#fff;
				-webkit-box-shadow: 0px 0px 5px 1px rgba(100,100,100,0.1);
				-moz-box-shadow: 0px 0px 5px 1px rgba(100,100,100,0.1);
				box-shadow: 0px 0px 5px 1px rgba(100,100,100,0.1);
				overflow:visible
			}
			.caroufredsel_wrapper {
				width: 750px !important;
				left: -15px !important;
				height: 100% !important;
				margin: 13px 0px 13px 22px !important;
			}
			.overflowholder {	
				overflow: hidden;
				position: relative;
				width: 100%; 
				z-index:2}
			.overflowholder ul 	{	
				width:100000px; 
				position: absolute;	
				top: 0px; 
				left: 0px; }

			.overflowholder ul li {	
				float: left !important;
				-webkit-transition: all 0.25s ease;
				-moz-transition: all 0.25s ease-in-out;
				-o-transition: all 0.25s ease-in-out;
				-ms-transition: all 0.25s ease-in-out;
				transition: all 0.25s ease-in-out;
				position:relative;
				background-image:none !important;
				padding: 0 !important;
				margin: 0 25px 0 0 !important;
			}
			.mediaholder { 	
				position:relative; 
				box-sizing:border-box;
				-moz-box-sizing:border-box;
				-webkit-box-sizing:border-box; 
				background:transparent; 
				background-color:#fff;
				border:1px solid #cecece;
				border-radius:0px;
				-moz-border-radius:0px;
				-webkit-border-radius:0px;
				padding:4px;
			}
			.mediaholder_innerwrap	{	
				position:relative; 
				overflow:hidden; 
				width:100%; 
				box-sizing:border-box; 
				-moz-box-sizing:border-box; 
				-webkit-box-sizing:border-box;
			}
			.mediaholder img {	
				width:100%; 
				position:relative; 
				margin:0 0 7px 0 !important;
				
			}


			.hovercover {		
				width:100%;
				height:100%; 
				position:absolute; 
				top:0px; 
				left:0px; 
				background-color:#52bde9;
				background-color:rgba(82,189,233,0.85);
				-webkit-transition: all 0.2s ease-out;
				-moz-transition: all 0.2s ease-out;
				-o-transition: all 0.2s ease-out;
				-ms-transition: all 0.2s ease-out;
				-moz-opacity:0; filter:alpha(opacity=0); opacity:0;
				-webkit-transform: translateZ(10);
				-webkit-backface-visibility: hidden;
				-webkit-perspective: 1000;
				background:rgba(0,0,0,0.5);
			}

			li:hover .hovercover {		
				-moz-opacity:0.85; 
				filter:alpha(opacity=85); 
				opacity:0.85;  
			}
			
		.projects-title,
		.projects-title a,
		.projects-title a:visited,
		.projects-title a:hover	{	
			text-decoration: none;
			font-weight:400 !important;
			font-size: 16px;
			font-weight: normal;
			color: #999;
			text-shadow: #fff 1px 1px 1px;
			margin: 0px;
			width: 100%;
			text-decoration: none !important;
			text-transform:none !important;
		}

		.projects-desc {
			font-family: Arial, sans-serif;
			font-size: 12px;
			line-height: 20px;
			text-shadow: #fff 1px 1px 1px;
			color: #777777;
		}

		.sb-retro-skin  .showbiz-navigation i							{	text-shadow:0px 1px 0px rgba(0,0,0,0.4); font-size:20px;}

		li:hover .mediaholder img {	 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
			                                                        filter: gray; /* IE6-9 */
			                                                        -webkit-filter: grayscale(100%);
			                                                    }

			.list_carousel {
				background-color: #ccc;
				margin: 0 0 30px 60px;
				width: 360px;
			}
			.list_carousel ul, li {
				list-style: none outside none;
    			margin: 0;
    			padding: 0;
    			margin-right: 15px;
			}
			.list_carousel ul {
				margin: 0;
				padding: 0;
				list-style: none;
				display: block;
			}
			.list_carousel li {
				font-size: 40px;
				color: #999;
				text-align: center;
				background-color: #eee;
				border: 5px solid #999;
				width: 50px;
				height: 50px;
				padding: 0;
				margin: 6px;
				display: block;
				float: left;
			}
			.list_carousel.responsive {
				width: auto;
				margin-left: 0;
			}
			.clearfix {
				float: none;
				clear: both;
			}
			<!--.prev {
				float: left;
				margin-left: 10px;
			}
			.next {
				float: right;
				margin-right: 10px;
			}
			-->
			a.prev, a.next {
	    		background: url(../images/miscellaneous_sprite.png) no-repeat transparent;
	    		width: 45px;
	    		height: 50px;
	    		display: block;
	    		position: absolute;
	    		top: 160px;
			}
			a.prev {            left: -37px;
	                    background-position: 0 0;

			text-decoration: none; }

			a.prev:hover {      background-position: 0 -50px; }
			a.next {            right: -37px;	                    background-position: -50px 0;
text-decoration: none; }
			a.next:hover {      background-position: -50px -50px; }	 
			a.prev span, a.next span {
	    		display: none;
			}
			.pager {
				float: left;
				width: 300px;
				text-align: center;
			}
			.pager a {
				margin: 0 5px;
				text-decoration: none;
			}
			.pager a.selected {
				text-decoration: underline;
			}
			.timer {
				background-color: #999;
				height: 6px;
				width: 0px;
			}
			
			.divide5			{	width:100%;height:5px;}
			.divide10			{	width:100%;height:10px;}
			.divide15			{	width:100%;height:15px;}
			.divide20			{	width:100%;height:20px;}
			.divide30			{	width:100%;height:30px;}
				
				
			.galllink {
				width: 180px;
				height:150px;
			}
			
			.galllink a {
				display: none;
			}
			
			.galllink a:hover {
				display: block;
			}