/* SERVSTY.CSS - SERVICES PAGE STYLE SHEET  - - - - - - - - - - - - - - - - - */

.gallerycontainer{
position: fixed;
top:80px;
margin-left:5%;				/* left margin for triggers 5% */
margin-right:20%;			/* right margin for triggers 20% */
text-align: left;
background: white;			/* supposed to fix fadeOut Errors 20% */
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{			/* image border */
border: 1px solid black;
}

.thumbnail span{			/*CSS for enlarged image*/
}

.thumbnail span img{			/*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

/* .thumbnail:hover span,  */
.thumbnail span{			/*CSS for dashed-box hover zone*/
position: fixed;
/* visibility: visible; */
top: 15%;
left:4%;
right:4%;
bottom:15%;
z-index: 1;

padding: 5px;
border: 0px dashed gray;
color: black;
text-decoration: none;
}


.ftb {
position:fixed;
margin-left:0%;
font-size:2em;
color: rgb(255, 255, 240);
z-index: 100;
}

#tg1 {position:fixed; top:3em; margin-left:0%; }	/* for target placement */
#tg2 {position:fixed; top:5em; margin-left:0%; }	/* for target placement */
#tg3 {position:fixed; top:7em; margin-left:0%; }	/* for target placement */
#tg4 {position:fixed; top:9em; margin-left:0%; }	/* for target placement */

h3 {					/* text-box text placement */
margin-left:10%;
margin-right:9%;
font-weight: normal;
color: rgb(255, 255, 240);
position: absolute;
bottom: 0;
}

/*  NUTSUPDATE4 IMAGEHOVER AND FADE-IN STYLES  - - - - - - - - - - - - - - - - - */

.img {
	border: 1px solid #000099; /* 575757 */
	margin-left: 12px;
}


#latest_work {
	width: 570px;
	margin-top: 20px;
}

#content {
	width: 570px;
	margin: auto;
}

#latest_work_title {
	font-size: 18px;
}


#images {
	width: 80%;				/* image background border */
	border: 5px solid rgba(0,0,0,0.1);
	border-left: 35px solid rgba(0,0,0,0.1);
	border-right: 35px solid rgba(0,0,0,0.1);
	position: fixed;
	background: rgba(0,0,0,0.2);
	padding: 5px 20px;
	margin-left:0%;			/* image centering */
	margin-right: auto;		/* image centering */
	height: 50%;			/* image height */
}

.text{					/* defines text box */
	position:fixed;
	top:67%;
	bottom:10%;
	width: 70%;
	border: 1px;			/* solid #363636 while working */
		/* #2d2d2d while working */
        background: rgba(0,0,0,0.5);
	padding-top: 0em;
	padding-bottom: 0.5em;
	padding-right: 0.5em;
	padding-left: 0.5em;
	overflow: hidden;
	text-decoration: none;
}

.12imtx {display:none; }


#444{					/* #div not used, can be deleted */

	width: 552px;
	border: 1px solid #363636;
	background-color: #2d2d2d;
	margin-top: 7px;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-right: 8px;
	padding-left: 8px;
}

/*  ANIMATE TEXT OPACITY  - - - - - - - - - - - - - - - - - - - - - - - - - */

   /*p { position:relative; width:400px; height:90px; } */ 

    /*.fader {
    position:fixed;
    padding-top:25px;  
    top:0px;
    left:0px;
    /*display:none;*/
    /*} */

    /* .spa { display:none; }  */