/**
Theme Name: Art Station
Theme URI: http://www.artstation.pt
Author: Virtualmente
Author URI: http://www.virtualmente.net
Version: 1
License: GNU General Public License
Description: Website para Art Station
*/

#lang_sel_list ul { width:300px !important; }
#lang_sel_list li { width:120px !important; }
#lang_sel_list { width:250px !important; }

html { padding: 20px; margin: 0px; background: #000;  overflow: hidden; }

body { padding: 0px; margin: 0; background: #000; line-height: 21px;  overflow: hidden;
font-size: 13px; font-weight: 400; font-family: 'PT Sans'; color: #fff; }

a {text-decoration: none; color: #26ADE4; }
a:hover {  }

h1, h2, h3, h4, h5, h6, h2 a , h1 a { font-weight: 100; font-family: 'Raleway';  }

h1 a, h1{font-size: 48px;   line-height: 48px; } 

h2 {font-size: 36px; line-height: 40px;}

h3 {font-size: 21px;}

h4 {font-size: 18px; }	

h5 {font-size: 13px; }
h6 {font-size: 9px; text-transform: uppercase;}

hr {border-top: 1px solid rgba(0,0,0,0.1); height: 0px; border-bottom: none; border-left: none; border-right: none; 
margin: 40px 0; width: 100%;}

ul, li, ol { list-style-type: none; margin: 0; padding: 0;}

img, iframe {border: none; outline: none;}

ul, menu, dir, h1, h2, h3, h4, h5, h6 {
-webkit-margin-before: 0;
-webkit-margin-after: 20px;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 0px;
margin: 0 0 20px 0;
} 
.back h3 {margin: 0;}
p { 
-webkit-margin-before: 0px;
-webkit-margin-after: 0px;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
margin: 0;
}
h4.heading, h3#reply-title {font-size: 11px; text-transform: uppercase;border-top: 1px solid rgba(0,0,0,0.1); padding-top: 30px; 
padding-bottom: 20px;  color: black;
-webkit-margin-after: 10px;}	
 
textarea {max-width: 100%; width: 100%; padding: 10px 0; } 
 label  {font-family: 'PT Sans'; font-size: 11px;}
 label  small { font-size: 11px;}
input, textarea {font-family: 'PT Sans'; border: none; background:  #ECEADB;} 
input { padding: 10px 20px;}
input#submit{ margin: 15px 0 0 0;}
input,textarea, button {margin: 5px 0;}
 
 
 
img.eye  {float: left; width: 15px; height: 15px; margin: 3px 5px 0 0; border: none; outline: none;}

.trans,  .flex-direction-nav,  .flex-direction-nav  p a, .port .item div.back  a, #access ul ul a:hover, #access li:hover > a,
#access ul ul li:hover > a, #about_me {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  opacity: 0.9;
} 


#canvas {
  width: 100%;  
  padding: 0;
  margin: 0;
  height: 100%;
}
.ccc #wrap {oveflow: hidden;}
#wrap {position: relative; padding:40px;   float: left;
}
#wrap2 {position: relative; padding:40px 40px 0px 40px;   float: left;
outline: 40px solid #000; 
outline-offset: -40px; color:#fff; width:95%;}
#wrap.noPadding { padding: 0px; outline: none;   width: 100%;}
#kinetic { padding:  0px 0px; overflow: hidden; min-height:640px;}

#primaryContent {
background: url(inc/img/bg.jpg) no-repeat bottom right transparent; overflow-x: hidden; overflow-y: scroll;
  width: 60%;
  height: 100%;
  float: left;
  padding: 0  0px 0 0;
  margin: 0;}
#primaryContent.primaryPort { background: #000;}


#primaryContent, .sidebar { overflow-x: hidden; overflow-y: scroll;}
#primaryContent.ccc {overflow: hidden;}

  /* =Header
-------------------------------------------------------------- */ 
 
#branding {
  position: relative; 
  float: left;
  width: 20%;
  height: 100%;
  padding: 0 ;     
  z-index:99999999999;
} 

#logo {
	float: left;
	padding:  20px 0 30px 0;
	margin: 0 0 -24px 0;
	width: 100%;
	text-align: center;
	border-bottom: 1px solid rgba(255,255,255,0.05);
}
#logo img {max-width: 100%; width: auto; outline: none; border: none; padding: 0; text-align: center;}
#logo span  {float: left; padding: 0 10%; width: 80%; color: rgba(255,255,255,0.25); font-size: 11px;}
p.desc { color: rgba(255,255,255,0.25); font-size: 11px; text-align: center;  margin:  0 0 10px 0; 
width: 80%; right: 0; padding: 0 10% 10px 10%; border-bottom: 1px solid rgba(255,255,255,0.05); }

/* =Menu
-------------------------------------------------------------- */

#access { 
	display: block;
	float: left;
	margin-top: 25px;
	width: 100%;
	height: 100%;
}
#access ul {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%; 
}
#access li {
	float: left; 
	margin: 0;
	padding: 0;
	width: 100%; 
	text-align: center;
} 
#access  ul  a {
	 font-size: 13px; text-transform: uppercase;
	float: left;  
	color: #fafafa;
	display: block;
	line-height: 20px;
	padding: 5px 0; 
	width: 100%;   
	margin: 0 0 0 0; 
-webkit-transition: all 250ms ease-in;
-moz-transition: all 250ms ease-in;
-ms-transition: all 250ms ease-in;
-o-transition: all 250ms ease-in;
transition: all 250ms ease-in;}   
#access  ul  li.feature a {
	color: #D31900;   
}
#access ul li a:hover {color: #fff; background: #26ADE4; 
	padding: 15px 0; }

#access ul ul {  
	position: absolute; 
	right: 100%;   
	height: 0px; overflow: hidden;
	z-index: 999999999999999999999; 
-webkit-transition: all 250ms ease-in;
-moz-transition: all 250ms ease-in;
-ms-transition: all 250ms ease-in;
-o-transition: all 250ms ease-in;
transition: all 250ms ease-in;}   
#access ul ul a {   
	background: #26ADE4; 
	padding: 15px 0; 
	border-bottom: 1px solid rgba(255,255,255,0.1);}
#access ul ul ul  {  
}
#access li:hover > a,
#access ul ul li:hover > a  {   
	background: #26ADE4;  
	padding: 15px 0;
	height: 100%;
	right: 100%; 
}     
#access ul ul a:hover, #access ul ul li:hover > a {  
	 
}
#access ul ul:hover { 
	overflow: visible;
}
#access ul li:hover > ul { 
	height: 100%;
}
#access ul ul li a:hover > ul { 
	height: 100%;  
}
#access .current-menu-item a {font-weight: bold;}

#premios span { display:none; }
#premios { display:none; position: absolute; width: 100%; bottom: 105px; right:  0px; text-align: center; 
	padding-top: 0px; width: 100%; background:url(http://www.artstation.pt/wp/wp-content/uploads/2012/12/premios.jpg) no-repeat center bottom transparent; height:188px; z-index:-50;}

/* social icons */
#social {position: absolute; width: 100%; bottom: 0px; right:  0px; text-align: center; 
	padding-top: 0px; width: 100%; }
#social a {  padding: 0; margin: 0; width: 30px; 
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";
  filter: alpha(opacity=25);
  -moz-opacity: 0.25;
  -khtml-opacity: 0.25;
  opacity: 0.25;
} 
#social a  img {  width: 40px; height: 40px; margin: 0  ; }

 



/* sidebarS */ 
.sidebar {float: right; width: 20%; background: #000; 
padding: 0px;  }
.sidebar_wrap {float: left; padding: 40px;} 
.sidebar .widget  {position: relative;float: left; height: auto; width: 100%;
padding-bottom: 0px; margin-bottom: 40px; border-bottom: 1px solid rgba(0,0,0,0.1);} 
.sidebar .widget:last-child {border-bottom: none;}
.sidebar .widget h4 {font-size: 13px;   color: black; text-transform: uppercase; padding-bottom: 0px; margin-bottom: 10px;
font-weight: 100;} 
.sidebar .widget a {color: rgba(0,0,0,0.75); } 
/* widgets */
.widget #searchform {height: 60px; margin-bottom: 8px;} 
form#searchform input {float: left; background: #ECEADB url('inc/img/icons/black/search.png') no-repeat right center;
padding: 10px 0;  width: 100%; margin: 0 0 40px 0;}
 
.sidebar .widget .tagcloud   {float: left; margin: 0 0 20px 0;}
.sidebar .widget .tagcloud a {float: left; margin: 0 5px 5px 0;  background: #ECEADB; padding: 5px 10px; color: white; 
font-size: 11px !important; }
.sidebar .widget .tagcloud a:hover { color: white;}
.sidebar .widget .textwidget {float: left; padding: 0 0 20px 0;}









/*
PORTFOLIO */

a.prettyphoto {float: left; width: 100%; overflow: hidden;}
 
.port   {float: left; width: 100%; margin: 0; padding: 0;}
.port .item {position: relative; float: left; color: white;  text-align: center; overflow: hidden; margin: 0; padding: 0;
height:220px;}  
.port .item div.back { overflow: hidden;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -moz-opacity:0;
  -khtml-opacity: 0;
  opacity: 0; 
-webkit-transition: all 250ms ease-in;
-moz-transition: all 250ms ease-in;
-ms-transition: all 250ms ease-in;
-o-transition: all 250ms ease-in;
transition: all 250ms ease-in;}   
.port .item:hover > div.back, .port .item.page_nav div.back {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;}	   

.port iframe {width: 100%; height: 100%;}

.port .item div  {position: absolute;  top: 0;  left: 0; width: 100%; height: 100%;  background: #26ADE4;  }   
.port .item div.back   {width: 80%; padding: 0 10%; text-align: center;} 
.port .item div.back  h3 { color: white; 
-webkit-margin-before: 0;
-webkit-margin-after: 0px;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 0px;} 
.port .item div.back  a  { color: white; font-size: 11px; width: auto; 
background: url('inc/img/icons/white/eye_small.png') no-repeat 0 1px; padding: 0 0 0 20px;} 

.port .item div.back  img { padding: 50% 0 10px 0; margin: -60px 0 0 0;} 
.port .item.page_nav div.back  img {float: none; padding: 0; margin:   0;} 


#port2 .item {width: 50%; }
#port3 .item {width: 33%; } 

.port .item div.front img {width: auto; min-width: 100%;  height: auto; min-height: 100%; display: block;}
.port .item div.front   {overflow: hidden; background-image: url('inc/img/loading.gif');
background-repeat: no-repeat; background-position: 20px 20px;}
  

/* next prev */
.port .item.page_nav  div { }  
.port .item.page_nav div.back  a  {  background:none; width: 60px; height: 60px;  
padding: 0; margin:   0; } 
.port .item.page_nav div.back a img { padding: 50% 0 0 0; margin: -30px 0 0 0; }   
 



/* SLIDER */

.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {margin: 0; padding: 0; height: 100%; width: 100%; overflow: hidden;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;  background-image: url('inc/img/loading.gif');
background-repeat: no-repeat; background-position: center center;}
Avoids image jumping */
.flexslider .slides img { width: auto; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {margin: 0 0 0px; position: relative;  zoom: 1; cursor: auto;}
.flex-viewport {max-height: 100%; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.loading .flex-viewport {max-height: 100%;}
.flexslider .slides {zoom: 1; height: 100%; max-height: 100%;}
 


/* Direction Nav */ 
.flex-direction-nav   {position: absolute; bottom: 60px; left: 60px; background:  #26ADE4;  padding: 20px 10px; cursor: arrow; }
.flex-direction-nav a {float: left; margin: 0  0px 0 0;  cursor: pointer;  }
.flex-direction-nav  p {float: left; padding: 5px 20px 0 20px ; color: white; width: auto; font-family: 'Raleway';
font-size: 21px; margin:  5px 0 0 15px;  border-left: 1px solid rgba(255,255,255,0.1); }
.flex-direction-nav  p a {float: left;   font-size: 11px; color: white; margin: 0px 0 10px 0; font-family: 'PT Sans';
background: none; text-indent: 0; padding: 0 10px 0 0;}
.flex-direction-nav  p a:hover, .port .item div.back  a:hover, #social a:hover {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;}	
.flex-direction-nav li {float: left;}
.flex-direction-nav .flex-next, .flex-direction-nav .flex-prev  { width: 60px; height: 60px; padding: 0; margin: 0;} 
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: 40px; text-align: center; display: none;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); 
cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; 
border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}




/* single */
.featured {position: relative; float: left; width: 100%; overflow: hidden; margin: 0 0 40px 0; }
.featured iframe  {width: 100%;  height: 75%;} 
.featured img {width: 100%; height: auto; }

.post {float: left; padding: 0 0 20px 0; margin: 0; width: 100%;}
.postWrapper {padding: 40px;}
.postMeta {font-size: 11px;}
h1.postTitle {padding-bottom: 30px; float: left; width: 100%;}
h1.postTitle  small {font-size: 21px;}

/* details */ 

/*comments */
input#submit {background:  #26ADE4; color: white; cursor: pointer; padding: 15px 30px; }
#commentlist  { margin: 0 0 20px 0; }
#commentlist li {background: #fafafa; margin: 0 0 10px 0; padding: 20px 20px 10px 20px;}
#commentlist li span{font-size: 13px;}
#commentlist li p{padding:  5px 0;}
.form-submit {margin-top: 10px;}
  .logged-in-as {margin-bottom: 10px;}
#commentform input {margin-left: 20px;}
#commentform input#submit {margin-left: 0px;}


/* theme switcher */  
.imga { display: inline-block; margin: 0 20px 20px 0;} 





/* blog */
.exp {position: relative; float: left; padding: 30px 40px 40px 40px;}
.exp h2 {margin-bottom: 40px; float: left; padding:  10px 20px 0 0px;}
.exp h1 {margin-bottom:  0px; float: left; padding:  10px 20px 0 0px;}
.blog_item   {height: 100%; max-height: 100%; float: left;}
.blog_item .featuredb {float: left; width: 100%; overflow: hidden; height: 75%;}
.blog_item .featuredb img  {width: auto; min-width: 100%;  height: auto; min-height: 100%;}
.blog_item .imgs {position: absolute; top: -80px; left:  0px; width: auto; padding: 20px 10px  0px 35px; background: #000;}
.blog_item .imgs h2 { }
.blog_item .imgs img {float: left; margin: 0 20px 0 0; }
a.more_l {color: white; padding: 10px 20px;  background:#26ADE4; float: left; margin: 10px 0 0 0; font-size: 13px;} 
 
.blog .left_nav img, .blog .right_nav img {padding: 10px; margin: 0 40px 0px 40px;}
.blog .left_nav{float: right;}
 .blog .right_nav {float: left;}
 
.meta { width: 100%; padding: 30px 0 10px 0;}
.meta p {text-transform: uppercase; font-size: 9px;} 

.archive_title { }
.archive_title  span { }

 .blog  li.page_navigation {float: left; width: 100%; padding: 0 0 40px 0; height: 80px;} 



/* about me */
#wrap.noPadding.about_me { cursor: default; overflow: hidden;}
#wrap.noPadding.about_me iframe { width: auto; min-width: 100%; height: auto; min-height: 100%;}
#about_me {position: absolute; bottom: 60px; left: 60px; padding: 40px 40px 0 40px; width: 50%; color: white;}
#about_me h3 {float: left; width: 100%; color: white;}


/* contact */
#commentsText { height: 120px; width: 100%;}
#map_canvas {position: absolute; top: 0; left: 0; width: 100%; min-width: 100%; height: 100%;}
.contactform {float: left; width:100%; margin: 10px 0 0 0;	} 
.contactform li{position: relative; float: left; width: 100%; margin: 0 ; padding: 0 ;}  
.contactform li label {float: left; width: 50%;}
.contactform li input {float: left; width: 45%; margin: 10px 5% 10px 0; padding: 10px  0; color: black;}
.contactform li textarea#commentsText {float: left; width: 95%; color: black; }
.contactform li  input#c_send{font-size: 13px; width: auto; color: white; padding: 10px 20px; cursor: pointer; 
margin-bottom: 40px;} 
label.error { position: absolute; text-align: right;  right: 5%; top: -20px; z-index: -1;} 
label.error[for=contactName] { right: 55%;} 


a.win_close img  {float: right; width: 20px; height: 20px; cursor: pointer;}
 


 
/**
  theme requirements as per 
  http://codex.wordpress.org/CSS
*/
.aligncenter,
div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: left;
}

.alignright {
   float: right;
}
.wp-caption  {}
.wp-caption-text {}
.sticky {}
.gallery-caption {}
.bypostauthor {}




ul.slides li div {display: block; width: 100%; height: 100%; }


.hide {display: none;}
.flexslider .slides img.hide {display: none;}







/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */

.jspContainer 
{
	overflow: hidden;
	position: relative; 
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0px;
	width: 20px;
	height: 100%;
	background: none;
}

.jspHorizontalBar
{	display: none;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 16px;
	background: red;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap
{
	display: none;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: rgba(0,0,0,0.025);
	position: relative;
}

.jspDrag
{
	background: #ECEADB ;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}