


.wiggle {
  display:block;
  margin:0 auto;
  /* width:150px;
  height:150px; */

}

.wiggle:hover {
  -webkit-animation:none;
}

.short-animate {
  -webkit-transition:.5s ease-in-out;
  -moz-transition:.5s ease-in-out;
  -ms-transition:.5s ease-in-out;
  -o-transition:.5s ease-in-out;
  transition:.5s ease-in-out;
}

.long-animate {
  -webkit-transition: .5s .5s ease-in-out;
  -moz-transition: .5s .5s ease-in-out;
  -ms-transition: .5s .5s ease-in-out;
  -o-transition:.5s .5s ease-in-out;
  transition:.5s .5s ease-in-out;
}


.lightbox {
  position:fixed;
  /*top:-100%;*/
  bottom:100%;
  left:0;
  right:0;
  background:#f8f8f8;
  z-index:99501;
  opacity:0;
}

.lightbox img {
position:absolute;
  margin:auto;
  top:0;
  left:0;
  right:0;
  bottom:0;
  max-width:0%;
  max-height:0%;
}

#lightbox-controls {
  position:fixed;
  height:70px;
  width:70px;
  top:-70px;
  right:0;
  z-index:99502;
  background:rgba(0,0,0,.1);
}

#close-lightbox {
  display:block;
  position:absolute;
  overflow:hidden;
  height:50px;
  width:50px;
  text-indent:-5000px;
  right:10px;
  top:10px;
  -webkit-transform:rotate(45deg);
  -moz-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  -o-transform:rotate(45deg);
  transform:rotate(45deg);
}

#close-lightbox:before {
	content:'';
  display:block;
  position:absolute;
  height:0px;
  width:3px;
  left:24px;
  top:0;
  background:white;
  border-radius:2px;
  -webkit-transition: .5s .5s ease-in-out;
  -moz-transition: .5s .5s ease-in-out;
  -ms-transition: .5s .5s ease-in-out;
  -o-transition:.5s .5s ease-in-out;
  transition:.5s .5s ease-in-out;
}

#close-lightbox:after {
	content:'';
  display:block;
  position:absolute;
  width:0px;
  height:3px;
  top:24px;
  left:0;
  background:white;
  border-radius:2px;
  -webkit-transition: .5s 1s ease-in-out;
  -moz-transition: .5s 1s ease-in-out;
  -ms-transition: .5s 1s ease-in-out;
  -o-transition:.5s 1s ease-in-out;
  transition:.5s 1s ease-in-out;
}

.lightbox:target {
  top:0%;
  bottom:0%;
  opacity:1;
}

.lightbox:target img {
  max-width:100%;
  max-height:100%;
	margin: 60px auto 0 auto;
    padding: 0;
}

.lightbox:target ~ #lightbox-controls {
  top:60px;
}

.lightbox:target ~ #lightbox-controls #close-lightbox:after {
  width:50px;
}

.lightbox:target ~ #lightbox-controls #close-lightbox:before {
  height:50px;
}



.projectDetails {padding:6px 0 12px 0;min-height:80px;}
	.projectDetails a, 
	.projectDetails a:link,
	.projectDetails a:visited,
	.projectDetails a:hover,
.projectDetails a:active
{color:#00a5db;}



span.caption  {display:inline-block;}
	span.caption:hover,
	span.caption strong:hover{text-decoration: none;}

span.doc  {display:inline;}


span.caption a,
span.caption a.external {color:#00a5db; display:inline;}


a.external span{
	position: absolute;
	left: -5000px;
	width: 4000px;}

a.external:link{
	background: url(../images/external-icon.gif) no-repeat 100% 0;
	padding: 0 20px 0 0;} 


a.external:visited {
	color: purple;
	background: url(../images/external-icon.gif) no-repeat 100% -100px;
	padding: 0 20px 0 0;} 
	
a.external:hover {
	color: red;
	background: url(../images/external-icon.gif) no-repeat 100% -200px;
	padding: 0 20px 0 0;} 

p.backTop, .backTop {
    clear: both;
    margin: 18px auto;
	padding: 48px 0 24px 0;
    text-transform: uppercase;
	text-align:center;}

		
p.backTop a,
p.backTop a:link,
p.backTop a:visited,
p.backTop a:active {
  background-color:#f9f9f9;
	padding:12px;
	width:44px;
	height:44px;
	text-decoration:none;
    color: #00A5DB;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    text-transform: uppercase;
}


p.backTop a:hover {
   background-color:#eee;
	text-decoration:none;
   
}