@font-face {font-family: 'FlamencoRegular'; src: url('fonts/flamenco-regular.eot?') format('eot'), url('fonts/flamenco-regular.ttf') format('truetype');font-weight:400; }
@font-face {font-family: 'FlamencoLight'; src: url('fonts/flamenco-light.eot?') format('eot'), url('fonts/flamenco-light.ttf') format('truetype');;font-weight:200;}

body{color: #fff; font-family:Helvetica, Tahoma, Arial, sans-serif; font-size: 12px; background:url(images/body_bg.jpg) top center no-repeat #2b2047;}
p a:hover{ color:#727977;}

p, ul, a, h1, h2, h3, ul#portfolio_list h2 a:hover{ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.7);}
a:hover, a.active{ text-shadow: -1px -1px 1px rgba(0, 0, 0, 1);}

#content {margin: 0 40px 40px 40px;}

a:link, a:visited{ color: #00edbe; -webkit-transition-property:color; -webkit-transition-duration: .25s; -webkit-transition-timing-function: linear;}

body{ margin: 0 auto; width:800px;}
div.slider-wrapper{ margin-bottom: 40px;}
div#content{ position: relative; height: 1%; overflow: hidden;}
#footer{ margin: 0 50px; border-width:2px 0 0 0; line-height: 20px; padding: 40px 0; height: 1%; overflow: hidden;}

.grid_4{width: 220px; margin: 0 10px; float: left;}
.grid_6{width: 340px; margin: 0 10px; float: left;}

h1, #footer{-moz-border-image:url(images/border.png) 2 0 2 0 repeat stretch; -webkit-border-image:url(images/border.png) 2 0 2 0 repeat stretch; border-image:url(images/border.png) 2 0 2 0 repeat stretch;}

#header{background:url(images/header_bg.png) top center no-repeat; height: 1%; position: relative; text-align: center; overflow: hidden; margin: 0 0 40px 0;}
#logo{  margin: 40px 0 20px 0; display: inline-block;}
ul#nav{margin: 0 auto; display: -block; padding:0 10px; font-family:FlamencoRegular; font-size: 18px; text-transform:uppercase; width: 340px;}
ul#nav li{ display: inline;  }
ul#nav a{ line-height: 40px; display: inline-block; vertical-align:middle; text-decoration: none; margin: 0 10px 0 0; color: #fff;  }
ul#nav a:hover, ul#nav a.active{ background: url(images/menu_hover.png) repeat-x center 30px; color: #727977;}

h1.page_title{ font-size: 24px; font-family: FlamencoRegular; text-transform: uppercase; margin:0 10px 40px 10px; color: #00edbe;}
h1.page_title em{ clear: both; line-height: 20px; display: block; font-size: 12px; text-transform: none; color: #fff; font-family:Arial, sans-serif; font-style:normal; font-weight: normal;}
h1#introduction{ font-family: "HelveticaNeue-LightCondensed", "Helvetica Neue Light Condensed",FlamencoLight; font-stretch: extra-condensed; font-weight: 100; padding: 40px; line-height: 40px; font-size: 30px;  border-width:2px 0; letter-spacing: 1px; margin: 0 10px 40px 10px;}
h1#introduction strong{font-family: "HelveticaNeue-LightCondensed", "Helvetica Neue Light Condensed",FlamencoRegular; font-stretch: extra-condensed; font-weight: 300; color: #00edbe;}
h2{font-family: FlamencoLight; font-size: 24px; line-height: 40px;}
.grid_4 h2 a{ margin-bottom: 20px; padding: 0 0 0 70px; display: block;}
h2.color_title{color: #00edbe;}
h2#web_title a{ background: url(images/web_icon.png) no-repeat 20px 0px;}
h2#graphics_title a{ background: url(images/graphics_icon.png) no-repeat 20px 0px;}
h2#mural_title a{ background: url(images/mural_icon.png) no-repeat 20px 0px;}
h2#web_title a, h2#graphics_title a, h2#mural_title a{ text-decoration: none; color: #fff;}
h2#web_title a:hover, h2#graphics_title a:hover, h2#mural_title a:hover{ text-decoration: none; color: #727977;}
.grid_4 p{padding: 0 20px; line-height: 1.5em; word-break: loose;}
.grid_4 p strong{clear:both; display: block; margin-bottom: 20px; color:#00edbe; font-weight: normal;}
.grid_4 p a.button1{clear:both; display: block; margin-top: 20px;}

ul#portfolio_list{ height: 1%; overflow: hidden; padding-top:3px; margin-top: -3px;}
ul#portfolio_list img{ overflow: hidden;}
ul#portfolio_list li{ float:left; position: relative; line-height: 0; padding-bottom:20px; background: url(images/pf_shadow.png) no-repeat center bottom;}
ul#portfolio_list h2 a{ position: absolute; bottom: 25px; left: 5px; background: rgba(0, 0, 0, 0.7); width: 210px; text-align: center; padding: 0; margin: 0; font-size: 18px; border-top: 1px solid rgba(102, 102, 102, 0.5); color: rgba(255, 255, 255, 1);}
ul#portfolio_list a{text-decoration:none;}

div#content.portfolio_div{ margin-left: 50px; line-height:0;}
div#content.portfolio_div h1{padding-bottom:20px; margin:0; line-height:1;}
div#content.portfolio_div div#excerpt p{ line-height:1.5; margin-bottom: 40px; min-height: 60px;}
div#content.portfolio_div div#excerpt, div#content.portfolio_div h1{width: 460px; padding-right: 70px; -moz-border-image:url(images/border_vert.png) 0 2 0 0 repeat stretch; -webkit-border-image:url(images/border_vert.png) 0 2 0 0 repeat stretch; border-image:url(images/border_vert.png) 0 2 0 0 repeat stretch; border-width: 0 2px 0 0;}

ul#portfolio_list img, img.portfolio_img{ border: 5px solid rgba(0,237,190,0.5);}
ul#portfolio_list img.new_item{ border: none; position: absolute; right:-3px; top:-3px; z-index:50;}
ul.portfolio_img_list li{background: url(images/img_shadow.png) no-repeat center bottom; padding-bottom: 20px;}

p#paging{ display: block; width: 160px; line-height:20px; position: absolute; top: 0; right:0; margin:0 10px 0 0; text-align:center; color:#727977;}
p#paging a{ padding: 0 5px;}
p#paging a#backlink{ border-right: 1px solid #727977; border-left: 1px solid #727977; color: #fff;}

dl.category_list{ display: block; width: 160px; line-height:20px; position: absolute; top: 40px; right:0; margin-right:0 10px 0 0;}
dl.category_list a{ display: block; width: 40px; height: 40px; float: left; text-indent: 9999px; -webkit-transition-property:opacity; -webkit-transition-duration: .25s;-webkit-transition-timing-function: linear;  }
dl.category_list a:hover{ opacity:0.5;}
dl.category_list a[title="Graphics"]{ background: url(images/graphics_icon.png) no-repeat center bottom;}
dl.category_list a[title="Web"]{ background: url(images/web_icon.png) no-repeat center bottom;}
dl.category_list a[title="Murals"]{ background: url(images/mural_icon.png) no-repeat center bottom;}
dl.category_list a[title="Personal"]{ background: url(images/personal_icon.png) no-repeat center bottom;}

dl#pf_categories{top:0; right:10px; width: 220px;}
dl#pf_categories dt{ float: left; clear: none; line-height: 40px; display: block; padding: 0 5px 0 0;}

#copyright{ float: left;}
#socials_footer{float:right;}
#footer img{margin: 0 0 -7px 0;}
#footer img:hover{opacity:0.5;  -webkit-transition-property:opacity; -webkit-transition-duration: .25s;-webkit-transition-timing-function: linear;}

.zemContactForm{ }
.zemContactForm li label{ display: none;}
.zemContactForm input.zemText{}
.zemContactForm textarea.zemTextarea{  height: 100px;}
.zemContactForm input.zemText, .zemContactForm textarea.zemTextarea{ margin: 0 0 20px 0; line-height: 20px; width: 326px;background:rgba(53,44,78, 0.7); border: 2px solid #241a3e; padding: 5px; font-size: 12px; color: #fff;}
.zemContactForm input.zemSubmit{ clear: both; float: right; background: #00edbe; padding: 10px 0; width: 60px; border: 2px solid #00bf7f;cursor:pointer; -webkit-transition-property:background, border; -webkit-transition-duration: .25s; -webkit-transition-timing-function: linear; }
.zemContactForm input.zemSubmit:hover{ background: #00bf7f; border-color: #008659; }

div#about{ float: right; line-height: 1.5em;}
div#about h2{ padding: 0; margin: 0 ;}
div#about p{ padding: 0;}

ul.zemError{ line-height: 1.5em; margin: 0 0 20px 0;}