/*
Theme Name: sara-shuter
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sara-shuter
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

sara-shuter is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
    ## Posts and pages
	## Asides
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
@charset "utf-8";
/* CSS Document */

/* Table of Contents
-----------------------------------------------------------------------------
	1. Clean Base
	2. Base Typography
	3. Images
	4. Links
	5. Forms
	6. Tables
	7. Framework 
*/

/* 1. Clean Base
------------------------------------------------------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, 
legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, a, nav, section, summary, time, mark, audio, video 
{margin:0 auto; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration:none; list-style:none; outline:none; -webkit-font-smoothing: subpixel-antialiased; -webkit-tap-highlight-color:rgba(0,0,0,0);}
	
html,body { -webkit-text-size-adjust:none; -webkit-font-smoothing: antialiased;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display: block;}
img{border:none;}

input[type="text"], input[type="submit"], input[type="button"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], textarea {-webkit-appearance: none; outline: none;}
textarea:focus, input:focus, a, div, img { outline: none; }
 
.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
.cf { zoom: 1; }
.clear { clear: both; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block;}

/* 2. Base Typography
------------------------------------------------------------------------------*/
body{ color:#666666; font-size:14px; font-family: 'Open Sans',Arial, Helvetica, sans-serif; font-weight:400; line-height:22px;}

h1, h2, h3, h4, h5, h6{ margin-bottom:20px; font-weight:normal;}
h1{ font-size:36px; line-height:38px;}
h2{ font-size:34px; line-height:38px;}
h3{ font-size:32px; line-height:38px;}
h4{ font-size:28px; line-height:38px;}
h5{ font-size:26px; line-height:38px;}
h6{ font-size:23px; line-height:38px;}

p{ color:#666666; font-size:14px; font-weight:400; line-height:22px; margin-bottom:20px;}

ul{ margin:20px 20px; padding:0;}
ul li{ font-size:14px;  color:#666666; font-weight:400; line-height:20px; padding:0 0 5px 0; list-style:outside circle;}

ol{ margin:20px 20px; padding:0;}
ol li{ font-size:14px;  color:#666666; font-weight:400; line-height:20px; padding:0 0 5px 0; list-style: decimal; margin-left:20px;}

blockquote{ display:block; text-align:left; margin-bottom:20px; position:relative; background:#f5f5f5; padding:20px 20px 10px 20px; border-left:5px solid #06afce;}
blockquote p{ font-size:14px; font-weight:400; line-height:20px; margin-bottom:15px; position:relative; font-style:italic;}

hr {border:0 #000 solid; border-top-width:1px; clear:both; height:0;}

/* 3. Images
------------------------------------------------------------------------------*/
img{border:none; border-style: none;}

/* 4. Link
------------------------------------------------------------------------------*/
a{color:#06afce; font-weight:700;}
a:hover{color:#ff7801; text-decoration: none;}
a:active, a.current {color: #ff7801;}
a:focus {outline: none;}

/* 5. Forms
------------------------------------------------------------------------------*/
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"]{ border:1px solid #e8e8e8; padding:0 16px; color:#666666; font-size:12px; height:34px; background:#f1f1f1;}
textarea{ border:1px solid #e8e8e8; padding:5px 15px; color:#666666; font-size:12px; height:188px; resize:none;  font-family: 'Open Sans',Arial, Helvetica, sans-serif; line-height:16px; background:#f1f1f1;}

input[type="submit"], input[type="button"], input[type="reset"]{ background:#666; cursor:pointer; color:#fff; border:none; height:30px; line-height:28px; display:block; font-size:15px;}
input[type="submit"]:hover, input[type="button"]:hover{ background:#666; color:#fff;}

/* 6. Tables
------------------------------------------------------------------------------*/
table{border-spacing: 0; border-collapse: collapse;}
td{text-align: left; font-weight: normal;}

/* 7. Layout Framework
------------------------------------------------------------------------------*/
/* main container */
#wrapper{ width:100%; min-height:100%;}
#content-area{width:100%; height:auto; padding:0 0 75px 0;}
.container{ max-width:925px;}

/* header */
header{ width:100%; height:157px; margin:0 0 65px 0;}
.logo{float:left; margin:112px 0 0 0;}
.logo img{width:100%; height:auto; display:block;}

/* nav */
.mobile-nav{display:none;}
nav{ float:right; height:auto; margin:127px 0 0 0;}
nav ul{margin:0;}
nav ul li{float:left; list-style:none; text-transform:uppercase; color:#666666; font-weight:600; margin:0 24px 0 0; letter-spacing:0.10em;}
nav ul li:last-child{margin:0;}
nav ul li a{color:#666666; font-weight:600;}
nav ul li a:hover, nav .current-menu-item a{color:#ff7801;}

/* client block */
.bottom-client-block{width:100%; height:auto; background:#f5f5f5; padding:28px 0 35px 0; display:block;}
.bottom-client-block .logo-block{display:block; clear:both; text-align:center;}
.bottom-client-block h2{font-size:36px; line-height:55px; font-weight:300; margin-bottom:25px;}
.bottom-client-block h2 a{font-weight:300;}
.bottom-client-block figure{margin:0 5px 12px 5px; float:left;}
.bottom-client-block img{border:1px solid #cccccc; width:100%; height:auto; display:block;}

/* footer */
.scroll{position:absolute; top:-30px; left:50%; z-index:999999; background:url(images/arrow-top.png) no-repeat center center; width:60px; height:39px; background-size:cover; margin: 0 0 0 -30px; transition:0.2s;}
.scroll:hover{background:url(images/arrow-hover-top.png) no-repeat center center; top:-35px;}

footer{ width:100%; height:auto; background:#000000; color:#f5f5f5; padding:45px 0 50px 0; clear:both; display:block; position:relative;}
.footer-top{width:100%; height:auto; margin:0 0 10px 0;}
.footer-left{float:left;}
.footer-left span{font-weight:300; font-size:36px; line-height:46px; display:block;}
.footer-left span a{color:#f5f5f5; font-weight:300;}
.footer-left span a:hover{color:#ff7801;}
.footer-left span strong{font-weight:600;}
.footer-right{float:right; max-width:260px; width:100%;}
.footer-right .title{font-size:36px; line-height:41px; font-weight:300; margin:0 0 14px 0;}
.footer-right p{color:#f5f5f5; margin:0 0 20px 0; letter-spacing:0.03em;}
.footer-right a{text-transform:uppercase; font-size:15px; font-weight:700; line-height:33px; padding:0 12px; background:#06afce; color:#f5f5f5; height:33px; display:inline-block; letter-spacing:0.10em;}
.footer-right a:hover{background:#ff7801;}
.copyright{clear:both; color:#f5f5f5; font-size:12px; line-height:15px; display:block; width:100%; text-align:left;}
.copyright a{color:#f5f5f5; font-weight:400;}
.copyright a:hover{text-decoration:underline;}

/*--------- home page ------------*/
/* text slider */
.text-slider{ clear:both; display:block; margin-bottom:65px;}
.text-slider .bx-wrapper .bx-viewport{ float:left; max-width:680px;}
.text-slider ul.bxslider {margin:0; padding:0;}
.text-slider ul.bxslider li{ font-size:36px; line-height:55px; font-weight:300;}

.text-slider .bx-wrapper .bx-pager, .text-slider .bx-wrapper .bx-controls-auto{ top:0; right:40px; bottom:auto; float:right; width:14px;}
.text-slider .bx-wrapper .bx-pager.bx-default-pager a{ width:12px; height:12px; border-radius:13px; margin:0; background:#fff; border:1px solid #717171; transition: all 0.2s ease 0s; -webkit-transition: all 0.2s ease 0s;}
.text-slider .bx-wrapper .bx-pager.bx-default-pager a:hover, .text-slider .bx-wrapper .bx-pager.bx-default-pager a.active{ background:#ff7801;  border:1px solid #ff7801;}
.text-slider .bx-wrapper .bx-pager .bx-pager-item, .text-slider .bx-wrapper .bx-controls-auto .bx-controls-auto-item{ margin-bottom:20px;}

/* gallery */
.work-gallery{ display:block;}
.work-gallery .work-filters{ margin:0 0 50px 5px; padding:0;}
.work-gallery .work-filters li{list-style:none; float:left; text-transform:uppercase; color:#999999; font-weight:600; letter-spacing:0.10em; margin:0 25px 0 0;}
.work-gallery .work-filters li a{color:#999999; font-weight:600;}
.work-gallery .work-filters li a.selected, .work-gallery .work-filters li a:hover{ color:#ff7801;}

.work-gallery .work-block{display:block; width:100%; clear:both;}
.work-gallery .work-block .block{ display:block; margin:0 4px 4px 0; float:left; position:relative; overflow:hidden;}
.work-gallery .work-block .block img{display:block; width:100%; height:auto; transition: all 0.45s ease-in-out 0s;}
.work-gallery .work-block .block .overlay{opacity:0; transition: all 0.45s ease-in-out 0s; background:rgba(0,0,0,0.7); position:absolute; top:0; left:0; z-index:1; width:100%; height:100%;}
.work-gallery .work-block .block:hover img{filter: grayscale(100%) opacity(0.5); transform: scale(1.2) rotate(5deg); }
.work-gallery .work-block .block:hover .overlay{opacity:1;}
.work-gallery .work-block .block .overlay .title{display:table; height:100%; width:100%;}
.work-gallery .work-block .block .overlay .title span{color:#fff; font-size:19px; font-weight:400; text-align:center; display:table-cell; vertical-align:middle; padding:0 50px; transition: all 0.3s ease 0s;}
.work-gallery .work-block .block .overlay .title span a{color:#fff; font-weight:400;}

 /* heading */
.text-caption{width:100%; height:auto; margin:0 0 57px 0;}
.text-caption h1{font-weight:300; line-height:55px; float:left; margin:0;}

/*--------- contact page ------------*/
.contact-detail{display:block; clear:both; margin:0 0 60px 0;} 
.contact-detail .address-block{float:right; margin:0 75px 0 0;}
.contact-detail .address-block address{font-size:15px; line-height:22px; font-family:'Source Sans Pro',Arial, Helvetica, sans-serif; font-style:normal; font-weight:400; letter-spacing:0.03em;}
.contact-detail .address-block address strong{font-weight:600; font-size:19px;}
.contact-detail .address-block address a{font-family:'Source Sans Pro',Arial, Helvetica, sans-serif; font-size:15px; font-weight:400; letter-spacing:0.03em; line-height:22px;}

.contact-detail .contact-form{float:left; max-width:575px; width:100%;}
.contact-detail .contact-form .block{display:block; float:left;  margin:0 30px 30px 0; width:272px;}
.contact-detail .contact-form .send-msg-btn{color:#ffffff; font-size:15px; line-height:22px; padding:5px 11px; font-family:'Source Sans Pro',Arial, Helvetica, sans-serif; font-weight:700; background:#06afce; text-transform:uppercase; height:auto; letter-spacing:0.10em; float:left; border-radius:0;}
.contact-detail .contact-form .send-msg-btn:hover{background:#ff7801;}
.contact-detail .contact-form .block label{display:block; margin:0 0 13px 0; font-weight:600; text-transform:uppercase; color:#999999; letter-spacing:0.10em;}
.contact-detail .contact-form .block textarea{width:545px; border-radius:0; resize:vertical;}
.contact-detail .contact-form .block input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"]{width:240px; border-radius:0;}
.contact-detail .contact-form .block.last{margin:0 0 30px 0 !important;}
.contact-detail .contact-form .block.full-width{display:block; clear:both; width:100%;}

/*--------- about page ------------*/
.about-director{display:block;}
.about-director .director-info{float:left; max-width:292px; width:100%; margin:0 20px 0 0; font-family:'Source Sans Pro',Arial, Helvetica, sans-serif;}
.about-director .director-info .image-caption{margin:0 0 30px 0;}
.about-director .director-info .image-caption img{display:block; width:100%; height:auto;}
.about-director .director-info .title{font-weight:700; font-size:19px; line-height:22px; width:100%; float:left; margin:0 0 30px 0; letter-spacing:0.03em;}
.about-director .director-info .title span{display:block; width:100%;}
.about-director .director-info p{font-size:15px; line-height:22px; letter-spacing:0.03em; float:left;}
.about-director .director-info a span{font-size:15px; font-weight:400; font-family:'Source Sans Pro',Arial, Helvetica, sans-serif; line-height:48px; float:left; margin:0 0 0 10px;}
.about-director .director-info a figure{float:left;}
.about-director .director-info a figure img{display:block; width:100%; height:auto;}

/*--------- clients page ------------*/
.clients{width:100%; padding:30px 0 30px 0; margin:0;  min-height:85px; border-top:1px solid #c1c3c5;}
.clients .clients-block{display:block; width:100%; display:table;}
.clients .clients-block .text-caption{width:610px; margin:0; display:table-cell; vertical-align:middle;}
.clients .clients-block .text-caption .title{font-size:16px; line-height:22px; font-weight:600; letter-spacing:0.03em;}
.clients .clients-block .text-caption p{font-size:14px; letter-spacing:0.03em; margin:0;}
.clients .clients-block .img-caption figure{max-width:230px;}
.clients .clients-block .img-caption{display:table-cell; vertical-align:middle;}
.clients .clients-block .img-caption img{display:block; width:100%; height:auto;}
.clients.last{border-bottom:1px solid #c1c3c5;}

/*--------- work page ------------*/
.work-top-block{width:100%; margin:0 0 70px 0;  height:auto; float:left;}
.work-top-block h1{float:left; font-weight:300; line-height:55px; float:left; margin:0;}
.work-top-block .img-block{float:right; margin-top:13px;}
.work-top-block .img-block a{margin:0 22px 0 0; display:inline-block;}
.work-top-block .img-block .menu-icon{background:url(images/menu-icon.png) no-repeat center center; height:31px; width:32px;}
.work-top-block .img-block .menu-icon:hover{background:url(images/hover-menu-icon.png) no-repeat center center;}
.work-top-block .img-block .prev-icon{background:url(images/prev-arrow-icon.png) no-repeat center center; height:35px; width:20px;}
.work-top-block .img-block .prev-icon:hover{background:url(images/hover-prev-arrow-icon.png) no-repeat center center;}
.work-top-block .img-block .next-icon{background:url(images/next-arrow-icon.png) no-repeat center center; height:35px; width:20px;}
.work-top-block .img-block .next-icon:hover{background:url(images/hover-next-arrow-icon.png) no-repeat center center;}
.work-top-block .img-block a.last{margin:0;}

.work-bottom-block{display:block; width:100%; clear:both;}
.work-bottom-block .slider-img-caption{float:left; width:615px; }
.work-bottom-block .slider-img-caption img{width:100%; height:auto; display:block;}
.pagination-block{display:block;}
.pagination-block ul{margin:0; padding:0;}
.pagination-block ul li{float:left; color:#666666; font-size:13px; font-family:'Source Sans Pro',Arial, Helvetica, sans-serif; margin:0 7px 0 0; width:23px; height:23px; list-style:none; text-align:center; line-height:23px; padding:0;}
.pagination-block ul li a{color:#666666; font-weight:normal; display:block; border:1px solid #666666;}
.pagination-block ul li a:hover, .pagination-block .active{color:#ff7801; border:1px solid #ff7801;}
.work-bottom-block .slider-text-caption{float:right; max-width:265px; width:100%; margin:0 25px 0 0;}
.work-bottom-block .slider-text-caption .title{font-size:19px; line-height:22px; letter-spacing:0.03em; font-weight:600; margin:0 0 25px 0;}
.work-bottom-block .slider-text-caption p{font-size:13px; letter-spacing:0.03em;}
.work-bottom-block .video-caption{float:left;}
.work-bottom-block .text-caption{float:right; max-width:265px; width:100%; margin:0 25px 0 0;}
.work-bottom-block .text-caption .title{font-size:19px; line-height:22px; letter-spacing:0.03em; font-weight:600; margin:0 0 25px 0;}
.work-bottom-block .text-caption p{font-size:13px; letter-spacing:0.03em;}
ul.slidesjs-pagination{margin:0}
.slidesjs-pagination li{display:none;}


div.wpcf7 {
    margin: -21px 0 0;
    padding: 0;
}
.contact-detail .wpcf7-not-valid, .newsletter .wpcf7-not-valid{
	border : 1px solid red!important;
	background:#FEE0E0!important;	
}

.contact-detail .wpcf7-not-valid-tip, .newsletter .wpcf7-not-valid-tip{
	display:none;
}

div.wpcf7-validation-errors{
	border:none;
	color:red;
	float: left;
    width: 100%;
}

div.wpcf7-mail-sent-ok{
	color : #398f14;
	border:none;
	float: left;
    width: 100%;
}

.infinite-pagination{position:relative;}

.loadmore {
   border-bottom: 1px solid #ccc;
    height: 11px;
    position: absolute;
    width: 100%;
	margin: 0 0 0 -50%;
	left:50%;
}
.more-posts::before {
    border-top: 1px solid #ccc;    
    height: 1px;
    left: 0;    
    position: absolute;
    top: -20px;
    width: 100%;
    z-index: 0;
}
p.more-posts {
    margin-top: 50px;
    text-align: center;
}

.more-posts a {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #ccc;
    display: inline-block;
    font-size: 12px;
    letter-spacing: 2px;
    line-height: 8px;
    margin: -74px 3px 20px;
    padding: 18px 24px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    color:#666666;
}
.more-posts a:hover {
	background: #666666 none repeat scroll 0 0;
	color:#fff;
}


.isotope-item {z-index: 2;}
.isotope-hidden.isotope-item { pointer-events: none; z-index: 1;}
.isotope,.isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s;}
.isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width;         transition-property: height, width;}
.isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity;       -o-transition-property: -o-transform, opacity; transition-property:transform, opacity;}
.isotope.no-transition,.isotope.no-transition .isotope-item,.isotope .isotope-item.no-transition {-webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s;  -o-transition-duration: 0s; transition-duration: 0s;}
.isotope.infinite-scrolling {-webkit-transition: none; -moz-transition: none; -ms-transition: none;-o-transition: none;transition: none;}