/*------------------------------------------------------

CSS overview: 

	1. RESET
	3. MAIN CONTENT
	4. FULLWIDTH MEDIA
	7. SECTION TITLE
	8. FOOTER
	11. COLUMNS
	21. PORTFOLIO
	22. PORTFOLIO THUMBNAIL HOVER
	23. PORTFOLIO FILTERABLE NAVIGATION
	24. GALLERY
	25. CONTACT
	
---------------------------------------------------------*/

/*--------------------------------------------------
				      RESET
---------------------------------------------------*/
pre,code{
	font-family:"Times New Roman", Times, serif;
	white-space:pre;
	padding:20px;
	letter-spacing: 0.1em;
}
pre{
	padding:5px;
}
code{
	background:#f7f7f7;
	font-size:11px;
	color: #666666;
	padding: 3px;
	padding-left: 10px;
}
.clear {
    clear: both;
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}
.clearfix:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite,  del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {	margin:0px; 
	padding:0px; 
	border:0px; 
	border-collapse:separate; 
	border-spacing:0px;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	text-decoration:none;
}
html, body {
	height: 100%;
	width: 100%;
}
::-moz-selection{ color: #fff; background: #EC5B43; }
::selection { color: #fff; background: #EC5B43; }
body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 17px;
	color: #555;
	background-color: #fdfdfd;
}
h1,h2,h3,h4,h5,h6{
	margin-bottom: 10px;
	font-weight: bold;
	clear: both;
}
h1{
	font-size:20px;
	line-height: 24px;
}
h2{
	font-size:14px;
	line-height: 17px;
}
h3{
	font-size:18px;
	line-height: 22px;
}
h4{
	font-size:16px;
	line-height: 20px;	
}
h5{
	font-size:14px;
	line-height: 17px;
}
h6{
	font-size:12px;
	line-height: 16px;
}
ul, ol	{
	display: block;
	padding: 0px;
	margin: 0 0 14px 17px;
}
blockquote {
	font: italic 17px/1.25em Georgia, "Times New Roman", Times, serif;
	color: #aaa;
	background: url(../images/sprite.png) no-repeat scroll 0 -617px transparent;
	padding: 0 0 15px 55px;   
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
blockquote.left, blockquote.right {
	width: 60%;
}
blockquote.left {
	margin-right: 25px;
}
blockquote.right {
	float: right;
	margin-left: 25px;
}
blockquote small {
    font-size: 11px;
}
p {
	margin-bottom: 14px;
}
p:last-child {
	margin-bottom: 0;
}
em {
	font-style: italic;
}
strong, b {
	font-weight: bold;
}
input, textarea, select {
    -moz-box-sizing: border-box;
	box-sizing: border-box;
	-moz-border-radius: 1px;
	-webkit-border-radius:1px;
	border-radius:1px;
	-webkit-transition: all 0.2s ease-out 0s;   
	-moz-transition: all 0.2s ease-out 0s;
	-o-transition: all 0.2s ease-out 0s; 
	outline: medium none;
	font: normal 12px/1.3em Helvetica, Arial, sans-serif;
	color: #bbb;
	background-color: #f7f7f7;
	border: 1px solid #e5e5e5; 
	padding: 8px;
}
input:focus, textarea:focus, select:focus {
	border: 1px solid #8DC5C5;
	background-color: #fff;
	color: #676767;
	box-shadow:0 0 4px rgba(82,168,236,.5);
	-moz-box-shadow:0 0 4px rgba(82,168,236,.5);
	-webkit-box-shadow:0 0 4px rgba(82,168,236,.5);
}
input.submit, input.submit:focus, input.submit:active {
	cursor:pointer;
	text-align:center;
	font: bold 11px/1.3em Helvetica, Arial, sans-serif;
	text-transform: uppercase;
    color: #fff;
	text-decoration:none !important;
	background-color: #333;	
	padding: 7px;
	border: none;
	-moz-border-radius: 20px;
	-webkit-border-radius:20px;
	border-radius:20px;
}
input.submit:hover {
    color: #333;
}
a { 
	-webkit-transition:all 0.14s ease 0s; 
	-moz-transition:all 0.14s ease 0s; 
	-o-transition:all 0.14s ease 0s; 
	outline:none;
	color: #555;
}
a:hover {
	color: #999;
	text-decoration: none;
}
.title, .title a { 
	text-decoration: none;
}
.title a:hover {
}
.more-link {
	font: bold italic 12px/17px Helvetica,Arial,sans-serif;
}
.alignleft {
	float:left;
	margin: 5px 10px 0 0;
}
.alignright {
	float:right;
	margin: 5px 0 0 10px;
}
.aligncenter {
	display: block;
	margin: 10px auto 10px auto;
}
.text-align-right {
	text-align: right;
}
.text-align-left {
	text-align: left;
}
.text-align-center {
	text-align: center;
}
.right {
	float: right;
}
.left {
	float: left;
}
.divider {
	height: 40px;
	clear: both;
}
.divider-border {
	border-bottom: 1px solid #eee;
	float: left;
	width: 100%;
	margin: 0 0 40px 0;
	padding: 0 0 40px 0;
}
/*--------------------------------------------------
			MAIN CONTENT
---------------------------------------------------*/
#content-wrapper {
	margin: 0;
	padding: 0;
	width: 100%;
}
.content {
	margin: 0 2%;
	padding: 25px 0 0 0;
	border-top: 1px solid #eee;
}
#wrapper img, #wrapper iframe {
	max-width:100%;
}
#header-wrapper {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	padding: 5px 0 0;
	background-color: #fff;
	z-index: 100;
	border-bottom: 1px solid #eee;
}
.header {
	margin: 0 2%;
}
#logo, #logo a {
	float: left;
	margin: 0;
	padding: 0;
	line-height: 8px;
}
#share, #share a {
	float: right;
	margin: 20px 0;
	padding: 0;
	line-height: 8px;
}
/*--------------------------------------------------
		FULLWIDTH MEDIA
---------------------------------------------------*/
.fullwidth {
	margin-bottom: -1px;
}
.fullwidth.showreel {
	margin-bottom: -100px;
}
.fullwidth img, .fullwidth iframe {
	width: 100%;
    display: block;
    position: relative;
}
/*--------------------------------------------------
		  SECTION TITLE
---------------------------------------------------*/
.section-title {
	overflow: hidden;
	margin: 0 0 50px 0;
	padding: 0;
}
.section-title h1, .section-title h2, .section-title h3, .section-title h4, .section-title h5, .section-title h6 {
	margin: 0;
	display: inline;
}
.section-title h1 {
    font: bold 30px/1.2em Helvetica, Arial, sans-serif;
}
/*--------------------------------------------------
						 FOOTER
---------------------------------------------------*/
#footer-wrapper {
	font-size: 11px;
	float: left;
	width: 100%;
	margin: 10px 0 0 0;
	position: relative;
}
.footer {
	color: #777;
	border-top: 1px solid #eee;
	margin: 0 2%;
	padding: 30px 0;
	overflow: hidden;
}
.footer a, .footer-hidden-content a {
	font-weight: bold;
}
.footer a:hover, .footer-hidden-content a:hover {
	color: #999;
}
.footer ul, .footer-hidden-content ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.footer ul li, .footer-hidden-content ul li {
	float: left;
	width: 100%;
	margin-bottom:15px;
}
.footer .photostream img {
	height: 36px;
	width: 36px;
}
.footer-hidden {
	width: 100%;
	position: absolute;
	display: none;
	left: 0;
	z-index: 9999; 
	background-color: #fff;
	box-shadow: 0px -3px 3px -3px rgba(0, 0, 0, 0.23);
}
.footer-hidden-content {
	margin: 0 2%;
	padding: 45px 0;	
	overflow: hidden;
	font-size: 12px;
}
ul.latest-posts li span.date {
	color: #aaa;
	display: block;
	font-size: 0.9em;
	text-transform: uppercase;
}

/*--------------------------------------------------
				      COLUMNS
---------------------------------------------------*/
.one, .one-half, .two-third, .one-third, .one-fourth { float:left; position:relative; margin-right:4%; }
.one { width: 100%; margin-right: 0; }
.one-half {	width: 48%; }
.two-third { width: 65.33%; }
.one-third  { width: 30.66%; }
.one-fourth { width: 22%; }
.last { margin-right: 0 !important; }

/*--------------------------------------------------
				PORTFOLIO
---------------------------------------------------*/
.portfolio-grid ul li a.hide {
	display: none;
}
.portfolio-grid  {
	display: block;
	list-style-type: none;
	width: 101%;
	float: left;
	margin: 0 0 0 -1%;
	padding: 0px;
}
.portfolio-grid ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.portfolio-grid ul li {
	float: left;
	padding: 0 0 1% 1%;
}
.item {
	position: relative;
   	overflow: hidden;   
}
.item  img hover{
	border:2px solid;  
}
.isotope {
    -moz-transition-property: height, width;
}
.isotope-hidden {
    z-index: 0 !important;
}
.isotope-item {
    z-index: 1;
}
@media screen and (min-width: 1821px) {
.portfolio-grid ul li { width: 15.665%; } /* catch-all for huge screen sizes */
}
@media screen and (max-width: 1820px) {
.portfolio-grid ul li { width: 18.995%; }
}
@media screen and (max-width: 1560px) {
.portfolio-grid ul li { width: 18.995%; }
}
@media screen and (max-width: 1300px) {
.portfolio-grid ul li { width: 23.995%; }
}
@media screen and (max-width: 1040px) {
.portfolio-grid ul li { width: 32.32%; }
}
@media screen and (max-width: 780px) {
.portfolio-grid ul li { width: 48.90%; }
}
@media screen and (max-width: 520px) {
.portfolio-grid ul li { width: 100%; padding: 0 0 20px 0; }
}
@media screen and (max-width: 260px) {
.portfolio-grid ul li { width: 100%; padding: 0 0 20px 0; }
}
.item-info {
	padding: 10px 0;
	text-align: center;
	height: 37px;
	max-height: 60px;
}
.item-info h3 {
	font-weight: normal;
}
.item-info h3, .item-info-overlay h3 {
	font-size: 14px;
	line-height: 17px;
	margin-bottom: 0;
	text-transform: uppercase;
}
.item-info h3.title a {
	color: #555;
}
.item-info-overlay h3.title a {
	color: #555;
}
.item-info-overlay h3.title a:hover {
	color: #999;
}
.item-info h4, .item-info-overlay h4 {
	font-size: 11px;
	font-weight: normal;
	line-height: 17px;
	text-transform: uppercase;
	margin-bottom: 0;
}
/*--------------------------------------------------
		    PORTFOLIO THUMBNAIL HOVER
---------------------------------------------------*/
.item-info-overlay {
	color: #555;
	font-size:11px;
}
.item-info-overlay {
	position:absolute;
	width:100%;
	height:100%;
	left: 0;
	top: 0;
	display: none;
    z-index: 99;
	background-color: #f7f7f7;
}
.item-info-overlay div {
	padding: 0 9% 9% 9%;
}
.item-info-overlay h3 {
	padding: 9% 9% 0 9%;
}	
.item-info-overlay p {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px dotted #bbb;
}	
.item-info-overlay a.preview, .item-info-overlay a.view {
	position: absolute;
	bottom: 0px;
	-webkit-transition-duration: 0s; 
	-moz-transition-duration: 0s; 
	-o-transition-duration: 0s; 
	text-indent: -9999px;
	height: 37px;
	width: 37px;
    z-index: 110;
}
.item-info-overlay a.view {
	background: url(../images/sprite.png) no-repeat scroll 11px 13px #333;
	right: 0px;
}
.item-info-overlay a.view:hover {
	background: url(../images/sprite.png) no-repeat scroll 11px -18px #333;
}
.item-info-overlay a.preview {
	background: url(../images/sprite.png) no-repeat scroll 12px -50px #333;
	right: 38px;
}
.item-info-overlay a.preview:hover {
	background: url(../images/sprite.png) no-repeat scroll 12px -83px #333;
}
/*--------------------------------------------------
			GALLERY
---------------------------------------------------*/
.gallery-item {
	float: left;
   	overflow: hidden;
   	position: relative;
}
.gallery-item img {
   	display: block;
   	position: relative;
	float: left;
}
.gallery-item h2 {
	font-size: 11px;
	font-weight: normal;
	margin: 0;
}
.gallery-item h3 {
   	font-size: 14px;
}
.gallery-item a.view {
	position: absolute;
	z-index: 110;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	text-indent: -999px;
}
.gallery-item .mask {
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	height: 80%;
	width: 80%;
	padding: 10%;
	text-align: center;
	text-transform: uppercase;
    color: #333;
}
.thumb .mask {
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(255,255,255, 0.85);
   -webkit-transition: all 0.25s ease;
   -moz-transition: all 0.25s ease;
   -o-transition: all 0.25s ease;
   -ms-transition: all 0.25s ease;
   transition: all 0.25s ease;
}
.thumb:hover .mask {
   filter: alpha(opacity=100);
   opacity: 1;
}	


/*---------------iPad landscape---------------*/
@media only screen and (min-width : 768px) and (max-width : 1040px) {
.google-map { height: 300px; }
.error .left, .error .right { padding-top: 120px; padding-bottom: 120px; }
.error h1 { font-size:122px; }
}

/*---------------iPad portrait---------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.header, .content, .footer, .footer-content, .footer-hidden-content { margin: 0 4%; }
.header .social-bookmarks { display:none; }
.google-map { height: 300px; }
.error .left, .error .right { padding-top: 250px; padding-bottom: 250px; }
.error h1 { font-size:122px; }
.portfolio-grid { }
.portfolio-grid ul li { height: auto; }
.one, .one-half, .two-third, .one-third, .one-fourth { float:left; position:relative; width: 100%; margin-right: 0; margin-bottom: 25px; }
.footer .one, .footer .one-half, .footer .one-third, .footer .one-fouth { text-align: center; margin-bottom: 3px; }
.footer-hidden-content .one, .footer-hidden-content .one-half, .footer-hidden-content .two-third, .footer-hidden-content .one-third, .footer-hidden-content .one-fourth {  margin-bottom: 50px; }
.form {	border-bottom: 1px solid #eee;	padding: 0 0 25px 0; float: left; }
}

/*---------------iPhone landscape---------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
body { -webkit-text-size-adjust: none; }
.header, .content, .footer, .footer-content, .footer-hidden-content { margin: 0 5%; }
.header .social-bookmarks, #back-top a { display:none; }
#share, #share a { display:none; }
#primary-menu select { display:block; }
#primary-menu { margin: 7px 0 0 0; float: right; }
#primary-menu ul { display:none; }
.google-map { height: 150px; }
.error .left, .error .right { padding-top: 70px; padding-bottom: 70px; }
.error h1 { font-size:52px; margin-left: 0; }
.error h2 {	font-size:14px; line-height: 17px; }
.portfolio-grid  { margin: 0; }
.portfolio-grid ul li{ height: auto; }
.filterable { float: left;	width:100%; margin: 15px 0 0 0; }
.filterable ul { float: left; }
.one, .one-half, .two-third, .one-third, .one-fourth { float:left; position:relative; width: 100%; margin-right: 0; margin-bottom: 25px; }
.footer .one, .footer .one-half, .footer .one-third, .footer .one-fouth { text-align: center; margin-bottom: 3px; }
.footer-hidden-content .one, .footer-hidden-content .one-half, .footer-hidden-content .two-third, .footer-hidden-content .one-third, .footer-hidden-content .one-fourth {  margin-bottom: 50px; }
.form {	border-bottom: 1px solid #eee;	padding: 0 0 25px 0; float: left; }
}

/*---------------iPhone portrait---------------*/
@media only screen and (min-width: 320px) and (max-width: 479px) {
.header, .content, .footer, .footer-content, .footer-hidden-content { margin: 0 5%; }
.header .social-bookmarks, #back-top a { display:none; }
#logo, #logo a {text-align: center;}
#share, #share a { display:none; }
#primary-menu select { display:block; width: 100%; }
#primary-menu { margin: 0; width: 100%; }
#primary-menu ul { display:none; }
blockquote.left, blockquote.right {	width: 100%; }
.google-map { height: 150px; }
.error .left, .error .right { padding-top: 70px; padding-bottom: 70px; }
.error h1 { font-size:52px; margin-left: 0; }
.error h2 {	font-size:14px; line-height: 17px; }
.portfolio-grid  { margin: 0; }
.portfolio-grid ul li{ height: auto; }
.filterable { float: left;	width:100%; margin: 15px 0 0 0; }
.filterable ul { float: left; }
.one, .one-half, .two-third, .one-third, .one-fourth { float:left; position:relative; width: 100%; margin-right: 0; margin-bottom: 25px; }
.footer .one, .footer .one-half, .footer .one-third, .footer .one-fouth { text-align: center; margin-bottom: 3px; }
.footer-hidden-content .one, .footer-hidden-content .one-half, .footer-hidden-content .two-third, .footer-hidden-content .one-third, .footer-hidden-content .one-fourth {  margin-bottom: 50px; }
.form {	border-bottom: 1px solid #eee;	padding: 0 0 25px 0; float: left; }
}