/*
Theme Name: Clarity Communications
Author: ZOO Advertising
Author URI: http://www.zooadvertising.com.au/
Description: Clarity Communications Custom WP Theme
Version: 1.0
Tags: responsive, bootstrap
*/
@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }
/* Base
======================================================= */
body { background-color: #222221; background-image: url(img/bg-teaser-2.jpg); background-repeat: no-repeat; background-attachment: fixed; background-size: cover; }

img { max-width: 100%; height: auto; }

.sr-only { color: #fff; }

p { margin-bottom: 18px; }

/*	ANIMATIONS
============================================================ */
@-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); }
  100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } }
@keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); }
  100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } }
.fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; }

@-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); }
  100% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } }
@keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
  100% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } }
.fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; }

/*	Forms & Buttons
============================================================ */
.btn { font-family: "Montserrat", sans-serif; }

.btn-follow { font-size: 16px; font-size: 1.6rem; line-height: 16px; border-radius: 20px; background-color: transparent; padding: 10px 22px; color: #f1f1f1; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.btn-follow:hover, .btn-follow:focus { background-color: #f1f1f1; color: #222221; }

.btn-close { width: 44px; height: 44px; display: block; font-size: 42px; font-size: 4.2rem; line-height: 42px; color: #fff; }
.btn-close:focus, .btn-close:hover { color: #5cb4e2; }

.btn-default { background-color: transparent; border: 2px solid #fff; color: #fff; border-radius: 0; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.btn-default:hover, .btn-default:focus { border-color: #fff; background-color: #fff; color: #222221; }

.wpcf7 br { display: none; }
.wpcf7 .form-control { margin-bottom: 30px; border-radius: 0; border: none; background-color: rgba(255, 255, 255, 0.95); }

.navbar-toggle .sr-only { color: #fff; }

div.wpcf7-validation-errors { border: none !important; }

/* General
======================================================= */
.wrapper:before, .wrapper:after { content: " "; display: table; }
.wrapper:after { clear: both; }

.main { padding: 40px 0; }
.main.about-us { background-color: #5cb4e2; background-color: rgba(92, 180, 226, 0.9); color: #000; }
.main.about-us .size-full { border: 5px solid #f4f4f4; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25); box-shadow: 0 0 3px rgba(0, 0, 0, 0.25); }

.content-wrap:before, .content-wrap:after { content: " "; display: table; }
.content-wrap:after { clear: both; }

.bg-main { background-color: rgba(34, 34, 33, 0.9); color: #f1f1f1; }
.bg-main a { color: #f1f1f1; }

.js .tinynav { display: none; }

#wpadminbar { z-index: 500 !important; }

.section-title { margin: 0 0 30px; font-size: 50px; font-size: 5rem; line-height: 100%; font-weight: 300; text-transform: uppercase; }

.bg-lightgray { background-color: #5cb4e2; background-color: rgba(92, 180, 226, 0.9); }

.wpcf7-form-control-wrap { position: relative; display: block; }
.wpcf7-form-control-wrap .wpcf7-not-valid-tip { font-size: 11px; font-size: 1.1rem; position: absolute; display: block; left: 0; right: 0; top: 32px; font-family: "Montserrat", sans-serif; }

.wpcf7-response-output { padding: 15px; border: 1px solid #fff; font-family: "Montserrat", sans-serif; }

/*	Header
============================================================ */
.header { margin: 0; font-family: "Montserrat", sans-serif; -webkit-transition: background 0.3s ease; -o-transition: background 0.3s ease; transition: background 0.3s ease; }
.header.fixed-menu { background-color: rgba(34, 34, 33, 0.95); -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.25); box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.25); }
.header .logo { padding: 0; height: auto; margin-top: 10px; }

.header-actions { position: relative; margin-bottom: 0; margin-left: 20px; }

.navbar-nav { font-size: 16px; font-size: 1.6rem; }
.navbar-nav > li > a { text-transform: uppercase; letter-spacing: 1.5px; font-weight: 300; position: relative; }

.social-link { position: relative; top: 4px; width: 24px; height: 24px; display: block; background-repeat: no-repeat; background-position: center top; background-size: 24px auto; }
.social-link:hover, .social-link:focus { background-position: center -25px; }
.social-link.fb { background-image: url(img/icon-facebook.svg); }
.social-link.tw { background-image: url(img/icon-twitter.svg); }

/*	Footer
============================================================ */
.footer { background-color: #222221; background-color: rgba(34, 34, 33, 0.9); color: #f1f1f1; }
.footer .entry-content { font-family: "Montserrat", sans-serif; font-weight: 300; }
.footer .entry-content strong { font-weight: 300; text-transform: uppercase; color: #adadad; display: inline-block; margin-left: 20px; margin-right: 10px; font-size: 90%; }

.credits { font-family: "Montserrat", sans-serif; font-size: 13px; padding: 15px 0; background-color: #222221; color: #f1f1f1; -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.55); box-shadow: 0 0 6px rgba(0, 0, 0, 0.55); }

/* Wordpress Core
======================================================= */
.alignnone { margin: 5px 20px 20px 0; }

.aligncenter { display: block; margin: 5px auto 5px auto; }

.alignright { float: right; margin: 5px 0 20px 20px; }

.alignleft { float: left; margin: 5px 20px 20px 0; }

.aligncenter { display: block; margin: 5px auto 5px auto; }

a img.alignright { float: right; margin: 5px 0 20px 20px; }

a img.alignnone { margin: 5px 20px 20px 0; }

a img.alignleft { float: left; margin: 5px 20px 20px 0; }

a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }

.wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%; padding: 5px 3px 10px; text-align: center; }
.wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; }
.wp-caption wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; }

.wp-caption.alignnone { margin: 5px 20px 20px 0; }

.wp-caption.alignleft { margin: 5px 20px 20px 0; }

.wp-caption.alignright { margin: 5px 0 20px 20px; }

/*	Teaser
============================================================ */
.teaser { -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25); box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25); overflow: hidden; position: relative; }
.teaser .intro-title { font-size: 70px; font-size: 7rem; line-height: 100%; position: absolute; font-family: "Montserrat", sans-serif; left: 0; right: 0; top: 50%; margin-top: -30px; font-weight: 900; color: #fff; text-align: center; }
.teaser .intro-title span { font-size: 30px; font-size: 3rem; font-weight: 400; font-style: italic; display: block; }

/*	Page Content
============================================================ */
.page-title { font-size: 50px; font-size: 5rem; margin: 10px 0 40px; }

#services-list.main { position: relative; }
#services-list.main .section-title { text-align: center; margin-bottom: 60px; }

.ajax-loading { position: fixed; top: 0; right: 0; bottom: 0; left: 0; color: #fff; }
.ajax-loading span { top: 50%; left: 50%; }

.ajax-content { background-color: rgba(34, 34, 33, 0.85); position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2000; max-height: 100%; overflow-y: auto; }
.ajax-content.slider { background-color: #000; position: relative; }
.ajax-content.bgsingle-ap { background-color: transparent; background-image: url(img/bg-single-ap.jpg); background-position: center bottom; background-repeat: no-repeat; background-size: cover; }
.ajax-content .tabs-left { color: #222221; }

.tabs-left { padding: 30px; background-color: #f8f8f8; overflow: auto; }
.tabs-left .nav-tabs { font-size: 16px; font-size: 1.6rem; line-height: 16px; }
.tabs-left .nav-tabs > li { font-family: "Montserrat", sans-serif; font-weight: 300; float: none; margin-right: 30px; position: relative; border: none; }
.tabs-left .nav-tabs > li > a { display: block; padding: 5px 10px; }
.tabs-left .nav-tabs .active:after { content: "\e072"; position: absolute; top: 12px; right: -30px; font-size: 22px; display: inline-block; font-family: 'Glyphicons Halflings'; font-style: normal; }
.tabs-left .entry-title { margin-top: 0; }

.divider { height: 120px; -webkit-box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.55); box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.55); position: relative; }
.divider .section-title { font-weight: 900; text-transform: none; position: absolute; left: 0; right: 0; top: 50%; margin-top: -15px; color: #f4f4f4; }

.category-item { text-align: center; margin-bottom: 30px; }
.category-item .image img { width: 200px; }
.category-item .title { margin: 0; font-weight: 300; text-transform: uppercase; }
.category-item a:hover, .category-item a:focus { text-decoration: none; color: #5cb4e2; }

#services-list { background-color: rgba(122, 184, 173, 0.85); }

.divider-2 { background-image: url(img/bg-teaser.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }

/* MEDIA QUERIES
======================================================= */
@media (max-width: 767px) { #wpadminbar { position: fixed !important; }
  .logged-in .header { top: 46px; }
  .header .logo { margin: 10px 0 10px 15px !important; }
  .header .logo img { width: 136px !important; }
  .header .navbar-toggle { margin-top: 15px; }
  .teaser { height: 320px !important; min-height: 320px !important; }
  .teaser .intro-title { font-size: 30px; font-size: 3rem; }
  .teaser .intro-title span { font-size: 16px; font-size: 1.6rem; }
  .section-title { font-size: 32px; font-size: 3.2rem; } }
@media (min-width: 768px) { body { font-size: 16px; font-size: 1.6rem; line-height: 24px; }
  .logged-in .header { top: 32px; }
  .header .logo { margin-bottom: 10px; }
  .main { padding: 60px 0; }
  .navbar-nav { padding-top: 17px; }
  .divider { height: 450px; }
  .about-us .image { padding-right: 60px; }
  .category-item { margin-bottom: 50px; } }
@media (max-width: 991px) { .js .tinynav { display: block; margin-bottom: 20px; }
  .header .logo { margin-bottom: 10px; }
  .header .logo img { width: 180px; } }
@media (min-width: 992px) { .main { padding: 100px 0 120px; }
  .navbar-nav { padding-top: 35px; }
  .header-actions { padding-top: 41px; } }
