/* 
    Document   : portfolio
    Created on : 26/10/2011, 12:05:57
    Author     : Danilo
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

@font-face {
    font-family: 'FranklinGothicCondensed';
    src: url('../fontes/franklin_gothic_condensed-webfont.eot');
    src: url('../fontes/franklin_gothic_condensed-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fontes/franklin_gothic_condensed-webfont.woff') format('woff'),
         url('../fontes/franklin_gothic_condensed-webfont.ttf') format('truetype'),
         url('../fontes/franklin_gothic_condensed-webfont.svg#FranklinGothicCondensed') format('svg');
    font-weight: normal;
    font-style: normal;
}

#slider {

	/* You MUST specify the width and height */
	width:332px;
	height:222px;
	position:relative;		
        margin: 15px 0 0 0;
}

#mask-gallery {	
	overflow:hidden;
        width: 332px !important;
}

#gallery {	
	/* Clear the list style */
	list-style:none;
	margin:0;
	padding:0;	
	z-index:0;	
	/* width = total items multiply with #mask gallery width */
	width:900px;
	overflow:hidden;
}

	#gallery li {
		/* float left, so that the items are arrangged horizontally */
		float:left;
	}
        
        #gallery li img {border: 1px solid #23753E;}


#mask-excerpt {
	
	/* Set the position */
	position:absolute;	
	top:0;
	right:-220px;
	z-index:500px;
	
	/* width should be lesser than #slider width */
	width:214px !important;
        height: 222px;
        background:url(../imagens/background-texto-portfolio.png) no-repeat center top;
	overflow:hidden;	
	

}
	
#excerpt {
	
	/* Clear the list style */
	list-style:none;
	margin:0;
	padding:0;
	
	/* Set the position */
	z-index:10;
	position:absolute;
	top:0;
	left:0;
	
	/* Set the style */
	width:214px;        	
	overflow:hidden;
	font-family:arial;
	font-size:10px;
	color:#fff;	
}

        #excerpt li {padding: 7px; float: left;}

	#excerpt li h1 {font:bold 15px arial; color: #666666;}
        #excerpt li p {float:left; font: 12px arial; color: #666666; padding: 8px 0 0 0; line-height: 100%;}
        #excerpt li p.ultimop {font: 10px arial; color: #666666;}
        #excerpt li a.btnVerProjeto {width: 193px; height: 30px; float: left; margin: 8px 0 0 0; border: 1px solid #174D28; background-color: #174D28; font: 25px 'FranklinGothicCondensed'; color:#fff; text-align: center; padding: 2px 0 0 0; text-transform: uppercase; text-decoration: none; *padding: 5px 0 0 0; padding: /*\**/5px 0 0 0\9; *height: 27px; height: /*\**/27px\9;}	
            #excerpt li a.btnVerProjeto:hover {width: 193px; height: 30px; float: left; margin: 8px 0 0 0; background-color: #fff; font: 25px 'FranklinGothicCondensed'; color:#174D28; text-align: center; padding: 2px 0 0 0; text-transform: uppercase; text-decoration: none; border: 1px solid #174D28; *padding: 5px 0 0 0; padding: /*\**/5px 0 0 0\9; *height: 27px; height: /*\**/27px\9;}


.clear {
	clear:both;	
}

#buttons {float:left; margin: 10px 0 0 0;}
    #buttons a {height: 16px; float: left; margin: 0 5px 0 0; padding: 2px 0 0 0; text-decoration: none; text-align: center; font: 10px arial; color: #fff;}
    #buttons a#btn-prev, #buttons a#btn-next {width:50px; background-color: #23753E; border: 1px solid #23753E;}
    #buttons a#btn-pause, #buttons a#btn-play {width:50px; background-color: #174D28; border: 1px solid #174D28;}
    #buttons a#btn-play {width:60px;}
    
    /*hover*/
    #buttons a#btn-pause:hover, #buttons a#btn-play:hover {color: #174D28; border: 1px solid #174D28; background-color:#fff;}
    #buttons a#btn-prev:hover, #buttons a#btn-next:hover {color: #23753E; border: 1px solid #23753E; background-color:#fff;}
    
.addthis_toolbox {float: left; margin: 8px 0 0 0; width: 190px;}