@charset "UTF-8";
/* CSS Document */
*{padding:0;
margin:0;
  
  }
#wrapper1{
  width:1150px;
  margin: 0 auto;
  /*margin-right: auto;*/
  /*border-radius:10px;*/
  position:relative;
  
  }
#wrapper2{
  width: 880px;float:left;padding: 41px 0 20px 30px;
  margin: 0 auto;
  /*position: absolute;*/
  /*margin-right: auto;*/
  /*border-radius:10px;*/
  }
body{
  /*background:url(grey/wool@2X.png);background-repeat:repeat; grey/wood.jpg*/
  }


.header{
  height:120px;/*Background:url(grey/head3.png);background-repeat:no-repeat;background-size:1150px;*//*padding:10px 0 0 0;*/
  }
  #logo { 
  width:250px;top:20px; left:50px;float :left;
  }
.topnav ul li{
   width: auto;
  display: inline;
  text-align: center;
  position: relative;
  top: 170px;
  left: 300px;
	
  }
  
.topnav ul {
    padding: 50px 0 10px 0 0;
  /*text-shadow: 3px 3px 3px black;*/
  }
.topnav ul li a {
  text-decoration: none;
  font: small-caps 20px Helvetica, sans-serif;
  color: #333;
  margin-left:50px;
  }
  .topnav2 ul li{
   width: auto;
  display: inline;
  text-align: center;
  position: relative;
  top:00px;
  left: 00px;
	
  }
  
.topnav2 ul {
    padding: 20px 0 0px 0 0;
  /*text-shadow: 3px 3px 3px black;*/
  }
.topnav2 ul li a {
  text-decoration: none;
  font:  18px Helvetica, sans-serif;
  color: #333;
  margin-left:20px;
  }  
.nav {
  width: 800px;padding-top:40px;
  
  }
.imageRow {
      margin:0 auto;width:830px;padding-bottom:30px;
  
  }
.graphic{
      padding:10px 0px 10px 10px; text-align:center;
  
  }
.graphic img{
      margin-right:20px;
      /*border-radius:5px;*/
      width:175px; max-height:700px;
      -webkit-box-shadow: 2px 2px 2px 2px #999;
  -moz-box-shadow: 2px 2px 2px 2px #999;
   box-shadow: 2px 2px 2px 2px #999;
  }
  .graphicbrand{
      padding:10px 0px 10px 10px; text-align:center;
  
  }
  
  .graphicVideo{ 
      padding:10px 0px 10px 10px; text-align:center; 
  
  }.gVideo{ 
      padding:0px 0px 10px 10px; text-align:center; Float:left; Height:420px; 
  
  }.gVideo iframe{ 
      padding:0px 0px 10px 20px; text-align:center; Float:left; 
  
  }
  
  /*.graphicVideo img{
      margin-right:20px;
      border-radius:5px;
      width:200px; max-height:700px;
      -webkit-box-shadow: 2px 2px 2px 2px #999;
  -moz-box-shadow: 2px 2px 2px 2px #999;
   box-shadow: 2px 2px 2px 2px #999;
  }*/
.graphicbrand img{
      margin-right:20px;
      /*border-radius:5px;*/
      width:200px; max-height:480px;
      -webkit-box-shadow: 2px 2px 2px 2px #999;
  -moz-box-shadow: 2px 2px 2px 2px #999;
   box-shadow: 2px 2px 2px 2px #999;
  }
    #graphicPosters{
      padding:10px 0px 10px 10px; text-align:center;
  
  }
#graphicPosters img{
      margin-right:20px;
      /*border-radius:5px;*/
      width:175px; max-height:700px;
      -webkit-box-shadow: 2px 2px 2px 2px #999;
  -moz-box-shadow: 2px 2px 2px 2px #999;
   box-shadow: 2px 2px 2px 2px #999;
  }
     #Posters{
      padding:10px 0px 10px 10px; text-align:center;
  
  }
#Posters img{
      margin-right:20px;
      /*border-radius:5px;*/
      width:175px; max-height:700px;
      -webkit-box-shadow: 2px 2px 2px 2px #999;
  -moz-box-shadow: 2px 2px 2px 2px #999;
   box-shadow: 2px 2px 2px 2px #999;
  }
       #graphiclayout{
      padding:10px 0px 10px 10px; text-align:center;
  
  }
#graphiclayout img{
      margin-right:20px;
      /*border-radius:5px;*/
      width:175px; max-height:700px;
      -webkit-box-shadow: 2px 2px 2px 2px #999;
  -moz-box-shadow: 2px 2px 2px 2px #999;
   box-shadow: 2px 2px 2px 2px #999;
  }
.fine{
      padding:20px;
  
  }
.fine img{
      margin-right:40px;
      /*border-radius:5px;*/
      width:220px;
      -webkit-box-shadow: 2px 2px 2px 2px #999;
  -moz-box-shadow: 2px 2px 2px 2px #999;
   box-shadow: 2px 2px 2px 2px #999;
  }
  #accordion {
    background:#000;
    width: 800px;
    border:1px solid #333;
    -background:#666;
    margin: 0 auto;
  border-radius:10px;
  padding:10px;
  margin-top:60px;
  -webkit-box-shadow: 5px 5px 5px 5px #090808;
  -moz-box-shadow: 5px 5px 5px 5px #090808;
   box-shadow: 5px 5px 5px 5px #090808;
}
#accordian2{
  
  width:800px;
  margin: 0 auto;}
/* accordion header */
#accordion h2 {
    background:#666 ;
    line-height: 36px;
    margin:0;
    padding:5px 25px;
    font-weight:normal;
    border:1px solid #fff;
    border-bottom:1px solid #ddd;
    cursor:pointer;text-align:left;
  font: 100 2em Helvetica, sans-serif;
  color: #333;
}
/* currently active header */
#accordion h2.current {
    cursor:default;
    background-color:#f60;
}
/* currently active header */

#accordion2 .pane {
    border:1px solid #fff;
    border-width:0 2px;
    display:none;
    height:750px;
    padding:15px;
    width:750px;
  
}
/* accordion pane */
#accordion .pane {
    border:1px solid #fff;
    border-width:0 2px;
    display:none;
    height:300px;
    padding:15px;
    color:#fff;
    font-size:12px;
  
}

/* a title inside pane */
#accordion .pane h3 {
    font-weight:normal;
    margin:0;
    font-size:16px;
    color:#999;
}
#accordion .pane img {
  width:300px;height:300px;
  }
#accordion .pane .web img {
  width:573px;height:300px;
  }

  /*.accordionButton1,.accordionButton2,.accordionButton3,.accordionButton4 {  
  width: 700px;
  float: left;
  _float: none; 
  background: #F93;
  border-bottom: 1px solid #FFFFFF;
  cursor: pointer;
  height:150px;
  }*/ /* Float works in all browsers but IE6 */
.accordionButton1{
  /*background:url(fine-art/menu1.jpg);background-repeat:no-repeat;background-size:700px;*/
  }
.accordionButton2{
  /*background:url(fine-art/menu2.jpg);background-repeat:no-repeat;background-size:700px;*/
  }
.accordionButton3{
  /*background:url(fine-art/menu3.jpg);background-repeat:no-repeat;background-size:700px;*/
  }
.accordionButton4{
  /*background:url(fine-art/menu4.jpg);background-repeat:no-repeat;background-size:700px;*/
  }
/*.accordionButton1 h2,.accordionButton2 h2,.accordionButton3 h2 {
  text-align:left;
  padding:50px;
  font: 100 2em Helvetica, sans-serif;
  color: #333;
}*/  
/*.accordionContent {
  width: 700px;
  border-radius:  0px 0px 10px 10px;
  text-align: left;
  float: left;
  _float: none;*/ /* Float works in all browsers but IE6 */
  /*background: #000;
  }*/
  .accordionContent img{
  /*width: 700px;*/
  
  text-align: left;
  /*float: left;
  _float: none;*/ /* Float works in all browsers but IE6 */
  background: #000;
  }
/***********************************************************************************************************************
 EXTRA STYLES ADDED FOR MOUSEOVER / ACTIVE EVENTS
************************************************************************************************************************/

.on {
  font-color: #990000;
  color: #F60;
  }
  
.over {
  background: #CCCCCC;
  }
.intro{
  font: 100 44px "Helvetica Neue";
  color: #333;
  font-size:3em;padding-left:20px; 
  
  }

/*.pagetitle{
  font: 100 44px "Helvetica Neue";
  color: #666;
  font-size:2em;    border-top: thin none #666;
  border-right: thin none #999;
  border-bottom: thin solid #F60;
  border-left: thin none #999; 
  }*/
  .pagetitle1{
  font: 100 44px "Helvetica Neue";
  color: #ff8400;
  font-size:2em;    border-top: thin none #FFF;
  border-right: thin none #999;
  border-bottom: thin solid #CCC;
  border-left: thin none #999;
  box-shadow: 0px 0px 1px 0px #fff; 
  
  
   
  }
 .pagetitle4{
  font: 200 44px "Helvetica Neue";
  color: #333;
  font-size:1.5em;text-align:center; 
   
  } 
h3  {
  font: 36px "Helvetica Neue";
  color: #333;  
  }
h4  {
  font: 30px "Helvetica Neue";
  color: #333;  
  }
.statement{
  width:450px;float:left;
  }
.skills{
  width:350px;
  height:400px;float:left;padding:0px 0 0 30px;
  }
.statement h4,.skills h3  {
  font: 100 24px "Helvetica Neue";
  color: #333;  
  }
.skills h4,.webtext h4 {
  font: 100 20px "Helvetica Neue";
  color: #333;  
  }
.webtext h2, .skills h2, .contact h4{font: 100 24px "Helvetica Neue";
  color: #333;text-decoration:none;  }
 .skills  a{font: 100 20px "Helvetica Neue";
  color: #999;text-decoration:none;  }
p   {
	font: 16px "Helvetica Neue";
	color: #333;
	letter-spacing: 1px;
	word-spacing: 3px;
  }
  #logo2 { 
     width: 370px;
  position: absolute;
  top: -145px;
  left: -150px;
  float: right;
  }
  #logo2 img{ 
    width: 380px;
  
  }
.title{
  width: 230px;
  float: right;height:700px;
  position:relative;
  /*top:-120px;background:url(grey/side-50.png);*/
  background-repeat:no-repeat;
  background-size:250px;
  text-decoration:none;
  text-align: right;
}
.title .bold {
  /*text-shadow: 3px 3px 3px black;*/
  color: #FF6600;
  font: 500 2.9em "Helvetica Neue";
}
.title .bold2 {
  /*text-shadow: 3px 3px 3px black;*/
  color: #333;
  font: 500 2.05em "Helvetica Neue";
}
.title h1{
  padding-right: 10px;
  color: #F60;
  text-transform: uppercase;
  /*text-shadow: 1px 1px 2px black;*/
  font: 200 1.8em "Helvetica Neue";
  }
.title h2{
	font: 200 1.8em "Helvetica Neue";
	padding: 0px 10px 0 0;
	color: #333;	/*text-shadow: 3px 3px 3px grey;*/
  }
  .name{
  position: absolute;
  top: -115px;
  left: -109px;  }
	.name1{
  position:absolute;top:0px;left:60px;
    padding: 40px 20px10px 5px;  }
  .name1 h3{
	font: 200 1.5em "Helvetica Neue";
	padding: 0px 10px 0 0;
	color: #333;	/*text-shadow: 3px 3px 3px grey;*/
  }
  .name1 h4{
	font: 200 1.40em "Helvetica Neue";
	padding: 0px 10px 0 0;
	color: #333;	/*text-shadow: 3px 3px 3px grey;*/
  }
.title .active {
  color: #F60;
  }
.topnav .active {
  color: #F60;
  }
.sidenav{
  font: 16px "Helvetica Neue";position:absolute;top:200px;left:60px;
  /*text-shadow: 3px 3px 3px black;*/
  }

.title  ul {text-decoration: none;color: #CCC;
  }
 ul li{text-decoration:none;padding-top:50px;text-align:right;
  }
.sidenav   ul li a {
  text-decoration: none;
  color:#333;
  }
  
.sidenav   ul li{
  text-decoration: none;
  color:#FFF;ƒwra
  
  }

.name a {
  
  text-decoration:none;}
.footer{
      
      height: 80px;
  
  }
.foot2{
          
      margin:0 auto;
      height: 20px;width:1200px;color:#333;text-align:center;padding:30px;font:100 12px "Helvetica Neue";
  }
.clear{ clear:both;}
.info {
  width:600px;
  border-top: thin none #CCC;
  border-right: thin none #CCC;
  border-bottom: thin none #999;
  border-left: thin none #CCC;
  /*padding:0 0 20px 0;*/
  font-color:#333;
  }
.c-form{
  padding:20px 0 20px 0;
  }
.contact{
  width:800px;padding:0px 0 40px 0;
  border-top: thin none #CCC;
  border-right: thin none #999;
  border-bottom: thin solid #CCC;
  border-left: thin none #999;
  }
.contact a{
  text-decoration:none;color:#333;
  }


.about-pics{
  padding:20px 0px 20px 0px;
  width:800px;
   }
.placeholder {
  font: 200 36px "Helvetica Neue";
  color: #CCC;padding:20px 0 20px 0;
  }
/*.pic1{
  position:absolute;left:50px;top:190px;
  }
.pic2{
  position:absolute;left:240px;top:120px;
  }
.pic3{
  position:absolute;left:420px;top:170px;
  }
.pic4{
  position:absolute;left:570px;top:120px;
  }
  .pic1 img, .pic2 img, .pic3 img, .pic4 img{
    -webkit-box-shadow: 5px 5px 5px 5px #090808;
  -moz-box-shadow: 5px 5px 5px 5px #090808;
   box-shadow: 5px 5px 5px 5px #090808;
    }
.pic1:hover{
  z-index:9999;-moz-transition:  opacity 0.5s ease-out; 
       -o-transition: opacity 0.5s ease-out; 
  -webkit-transition: opacity 0.5s ease-out; 
      -ms-transition: opacity 0.5s ease-out;
  }  
  .pic2:hover{
  z-index:9999;-moz-transition:  opacity 0.5s ease-out; 
       -o-transition: opacity 0.5s ease-out; 
  -webkit-transition: opacity 0.5s ease-out; 
      -ms-transition: opacity 0.5s ease-out;
  }  
  .pic3:hover{
  z-index:9999;-moz-transition:  opacity 0.5s ease-out; 
       -o-transition: opacity 0.5s ease-out; 
  -webkit-transition: opacity 0.5s ease-out; 
      -ms-transition: opacity 0.5s ease-out;
  }  
  .pic4:hover{
  z-index:9999;-moz-transition:  opacity 0.5s ease-out; 
       -o-transition: opacity 0.5s ease-out; 
  -webkit-transition: opacity 0.5s ease-out; 
      -ms-transition: opacity 0.5s ease-out;
  }*/  
/**********************
SLIDE SHOW INDEX
*********************/

.tech-slideshow {
    height: 300px;
    position: relative;
    overflow: hidden;
}
.tech-slideshow > div {
    height: 300px;
    width: 3000px;
/*    background: url(http://cl.ly/9BJG/collage.jpg);
*/    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    
    -moz-transition:  opacity 0.5s ease-out; 
       -o-transition: opacity 0.5s ease-out; 
  -webkit-transition: opacity 0.5s ease-out; 
      -ms-transition: opacity 0.5s ease-out; 

    -webkit-animation: moveSlideshow 30s linear infinite;
    -moz-animation:    moveSlideshow 30s linear infinite;
    
}
.web-sites{
  width:850px;padding-top:20px;
  
  /*background-image:url(web%20/mac2.png);
  background-repeat:no-repeat;*/
  
  
  }

  .webpic{
  width:520px;
  float:left;padding-bottom:20px;
    }
  .webtext{
  width:290px;  
  float:left;padding: 0 20px;
    }
@-webkit-keyframes moveSlideshow {
    0% { left: 0; }
    100% { left: -1684px; }
}
@-moz-keyframes moveSlideshow {
    0% { left: 0; }
    100% { left: -1684px; }
}
.scrollup{
    width:40px;
    height:40px;
    opacity:0.3;
    position:fixed;
    bottom:50px;
    right:100px;
    display:none;
    text-indent:-9999px;
    background: url('images/icon_top.png') no-repeat;
}
.grid {
	padding: 20px 10px 20px 0px;
	max-width: 900px;
	margin: 0 auto;
	list-style: none;
	text-align: center;
}

.grid li {
	display: inline-block;
	width: 350px;
	margin: 15px 65px 5px 0px;
	padding: 0px;
	text-align: left;
	position: relative;
}

.grid figure {
	margin: 0;
	position: relative;
}

.grid figure img {
	max-width: 400px;
	display: block;
	position: relative;
}

.grid figcaption {
	position: absolute;
	top: 0;
	left: 0;
	/*padding: 20px;*/
	/*background: url(../../stephentsmyth.com/greenpin-card2.png);*/
	background-size:355px;
  background-repeat: no-repeat;
  
	color: #ed4e6e;
	/*box-shadow:#ccc 2px 2px 2px 2px;*/
}
.homegraphic {
	position: absolute;
	top: 0;
	left: 0;
	width:346px;
	/*height:300px;*/
	padding: 0px;
	background: url(homeimg/graphicgaze.jpg);
	/*background-size:100%;*/
  background-repeat: no-repeat;
  /*-webkit-box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);
-moz-box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);
box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);*/
  
  
	/*box-shadow:#ccc 2px 2px 2px 2px;*/
}
.homeweb {
	position: absolute;
	top: 0;
	left: 0;
	width:344px;
	/*height:300px;*/
	padding: 0px;
	background: url(homeimg/webback.png);
	/*background-size:100%;*/
  background-repeat: no-repeat;
  
	/*box-shadow:#ccc 1px 1px 1px 1px;*/
	/*-webkit-box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);
-moz-box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);
box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);*/
}
.homefine {
	position: absolute;
	top: 0;
	left: 0;
	width:346px;
	/*height:298px;*/
	padding: 0px;
	background: url(homeimg/fineback.png);
	/*background-size:100%;*/
  background-repeat: no-repeat;
  /*-webkit-box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);
-moz-box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);
box-shadow: inset 0px 0px 18px 4px rgba(0,0,0,0.57);*/
  
  
	/*box-shadow:#ccc 2px 2px 2px 2px;*/
}
.grid figcaption h3 {
	margin: 0;
	padding: 0;
	color: black;
	font:200 2.3em "Helvetica Neue";
	/*text-shadow: 3px 3px 3px grey;*/
	text-align:center;
}



/*.grid figcaption a {
	text-align: center;
	padding: 5px 10px;
	border-radius: 2px;
	display: inline-block;
	background: #ed4e6e;
	color: #fff;
}*/

/* Individual Caption Styles */

/* Caption Style 1 */
/*.cs-style-1 figcaption {
	height: 100%;
	width: 100%;
	opacity: 0;
	text-align: center;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
}

.no-touch .cs-style-1 figure:hover figcaption,
.cs-style-1 figure.cs-hover figcaption {
	opacity: 1;
	-webkit-transform: translate(15px, 15px);
	-moz-transform: translate(15px, 15px);
	-ms-transform: translate(15px, 15px);
	transform: translate(15px, 15px);
}

.cs-style-1 figcaption h3 {
	margin-top: 70px;
}

.cs-style-1 figcaption span {
	display: block;
}

.cs-style-1 figcaption a {
	margin-top: 30px;
}

/* Caption Style 2 */
/*.cs-style-2 figure img {
	z-index: 10;
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
}

.no-touch .cs-style-2 figure:hover img,
.cs-style-2 figure.cs-hover img {
	-webkit-transform: translateY(-90px);
	-moz-transform: translateY(-90px);
	-ms-transform: translateY(-90px);
	transform: translateY(-90px);
}

.cs-style-2 figcaption {
	height: 90px;
	width: 100%;
	top: auto;
	bottom: 0;
}

.cs-style-2 figcaption a {
	position: absolute;
	right: 20px;
	top: 30px;
}*//**/

/* Caption Style 3 */
/*.cs-style-3 figure {
	overflow: hidden;
}

.cs-style-3 figure img {
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
}

.no-touch .cs-style-3 figure:hover img,
.cs-style-3 figure.cs-hover img {
	-webkit-transform: translateY(-50px);
	-moz-transform: translateY(-50px);
	-ms-transform: translateY(-50px);
	transform: translateY(-50px);
}

.cs-style-3 figcaption {
	height: 100px;
	width: 100%;
	top: auto;
	bottom: 0;
	opacity: 0;
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
	transition: transform 0.4s, opacity 0.1s 0.3s;
}

.no-touch .cs-style-3 figure:hover figcaption,
.cs-style-3 figure.cs-hover figcaption {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform: translateY(0px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s;
	transition: transform 0.4s, opacity 0.1s;
}

.cs-style-3 figcaption a {
	position: absolute;
	bottom: 20px;
	right: 20px;
}*/

/* Caption Style 4 */
/*.cs-style-4 li {
	-webkit-perspective: 1700px;
	-moz-perspective: 1700px;
	perspective: 1700px;
	-webkit-perspective-origin: 0 50%;
	-moz-perspective-origin: 0 50%;
	perspective-origin: 0 50%;
}

.cs-style-4 figure {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.cs-style-4 figure > div {
	overflow: hidden;
}

.cs-style-4 figure img {
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
}

.no-touch .cs-style-4 figure:hover img,
.cs-style-4 figure.cs-hover img {
	-webkit-transform: translateX(25%);
	-moz-transform: translateX(25%);
	-ms-transform: translateX(25%);
	transform: translateX(25%);
}

.cs-style-4 figcaption {
	height: 100%;
	width: 50%;
	opacity: 0;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transform: rotateY(-90deg);
	-moz-transform: rotateY(-90deg);
	transform: rotateY(-90deg);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
	transition: transform 0.4s, opacity 0.1s 0.3s;
}

.no-touch .cs-style-4 figure:hover figcaption,
.cs-style-4 figure.cs-hover figcaption {
	opacity: 1;
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	transform: rotateY(0deg);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s;
	transition: transform 0.4s, opacity 0.1s;
}

.cs-style-4 figcaption a {
	position: absolute;
	bottom: 20px;
	right: 20px;
}*/

/* Caption Style 5 */
/*.cs-style-5 figure img {
	z-index: 10;
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
}

.no-touch .cs-style-5 figure:hover img,
.cs-style-5 figure.cs-hover img {
	-webkit-transform: scale(0.4);
	-moz-transform: scale(0.4);
	-ms-transform: scale(0.4);
	transform: scale(0.4);
}

.cs-style-5 figcaption {
	height: 100%;
	width: 100%;
	opacity: 0;
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
	-ms-transform: scale(0.7);
	transform: scale(0.7);
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	-moz-transition: -moz-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

.no-touch .cs-style-5 figure:hover figcaption,
.cs-style-5 figure.cs-hover figcaption {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

.cs-style-5 figure a {
	position: absolute;
	bottom: 20px;
	right: 20px;
}*/

/* Caption Style 6 */
.cs-style-6 figure img {
	z-index: 10;
	-webkit-transition: -webkit-transform 0.7s;opacity: 40%;
	-moz-transition: -moz-transform 0.7s;opacity: 40%;
	transition: transform 0.7s;opacity: 100%;
	width:350px;
	text-align:center;
}

/*.no-touch .cs-style-6 figure:hover img,
.cs-style-6 figure.cs-hover img {
	-webkit-transform: translateY(-50px) scale(0.5);
	-moz-transform: translateY(-50px) scale(0.5);
	-ms-transform: translateY(-50px) scale(0.5);
	transform: translateY(-50px) scale(0.5);
}*/
.no-touch .cs-style-6 figure:hover img,
.cs-style-6 figure.cs-hover img {
	/*-webkit-transform: translateY(-120px) scale(0.25);
	-moz-transform: translateY(-120px) scale(0.25);
	-ms-transform: translateY(-120px) scale(0.25);
	transform: translateY(-120px) scale(0.25);*/
}
.cs-style-6 figcaption {
	height: 100%;
	width: 100%;
}

/*.cs-style-6 figcaption h3 {
	margin-top: 60%;
}

.cs-style-6 figcaption a {
	position: absolute;
	bottom: 40px;
	right: 40px;
}*/

/* Caption Style 7 */
/*.cs-style-7 li:first-child { z-index: 6; }
.cs-style-7 li:nth-child(2) { z-index: 5; }
.cs-style-7 li:nth-child(3) { z-index: 4; }
.cs-style-7 li:nth-child(4) { z-index: 3; }
.cs-style-7 li:nth-child(5) { z-index: 2; }
.cs-style-7 li:nth-child(6) { z-index: 1; }

.cs-style-7 figure img {
	z-index: 10;
}

.cs-style-7 figcaption {
	height: 100%;
	width: 100%;
	opacity: 0;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: opacity 0.3s, height 0.3s, box-shadow 0.3s;
	-moz-transition: opacity 0.3s, height 0.3s, box-shadow 0.3s;
	transition: opacity 0.3s, height 0.3s, box-shadow 0.3s;
	box-shadow: 0 0 0 0px #2c3f52;
}

.no-touch .cs-style-7 figure:hover figcaption,
.cs-style-7 figure.cs-hover figcaption {
	opacity: 1;
	height: 130%;
	box-shadow: 0 0 0 10px #2c3f52;
}

.cs-style-7 figcaption h3 {
	margin-top: 86%;
}

.cs-style-7 figcaption h3,
.cs-style-7 figcaption span,
.cs-style-7 figcaption a {
	opacity: 0;
	-webkit-transition: opacity 0s;
	-moz-transition: opacity 0s;
	transition: opacity 0s;
}

.cs-style-7 figcaption a {
	position: absolute;
	bottom: 20px;
	right: 20px;
}

.no-touch .cs-style-7 figure:hover figcaption h3,
.no-touch .cs-style-7 figure:hover figcaption span,
.no-touch .cs-style-7 figure:hover figcaption a,
.cs-style-7 figure.cs-hover figcaption h3,
.cs-style-7 figure.cs-hover figcaption span,
.cs-style-7 figure.cs-hover figcaption a {
	-webkit-transition: opacity 0.3s 0.2s;
	-moz-transition: opacity 0.3s 0.2s;
	transition: opacity 0.3s 0.2s;
	opacity: 1;
}*/

@media screen and (max-width: 31.5em) {
	.grid {
		padding: 10px 0px 10px 10px;
	}
	.grid li {
		width: 100%;
		min-width: 300px;
	}
}