/*   

Theme Name: Scribbletribe

Theme URI: http://www.scribbletribe.com

Description: UFO themed madness

Author: Phil Hambley

Author URI: http://www.scribbletribe.com

Version: 1.0

Tags: UFO Madness, Scribbletribe

*/



/* Import Fonts */



@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:400,300);

@import url(https://fonts.googleapis.com/css?family=Yesteryear);



/* CSS Resets */



html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;vertical-align: baseline;background: transparent;}

ol, ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, blockquote:after,

q:before, q:after {content: '';content: none;}

:focus {outline: 0;}

ins {text-decoration: none;}

del {text-decoration: line-through;}

table {border-collapse: collapse;border-spacing: 0;}

a img {border: none;}



/* Flexible Grid */



.container {padding: 0;}

.row {width: 100%;max-width: 1140px;min-width: 720px;margin: 0 auto;position: relative;overflow: hidden;}

.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {margin-right: 3.09090%;float: left;min-height: 1px;}

.row .onecol {width: 5.5%;}

.row .twocol {width: 14.09091%;}

.row .threecol {width: 22.68182%;}

.row .fourcol {width: 31.27273%;}

.row .fivecol {width: 39.86364%;}

.row .sixcol {width: 48.45455%;}

.row .sevencol {width: 57.04545%;}

.row .eightcol {width: 65.63636%;}

.row .ninecol {width: 74.22727%;}

.row .tencol {width: 82.81818%;}

.row .elevencol {width: 91.40909%;}

.row .twelvecol {width: 100%;float: left;}

.last {margin-right: 0px;}

img, object, embed {max-width: 100%;}

img {height: auto;}



/* Main Body Styling */



body {margin: 0;padding: 0;background: #f5f5f5;font-family: 'Roboto Condensed', sans-serif;color: #777;letter-spacing: 0px;font-size: 1.0em;}

.container {position: relative;padding: 20px;}

.container-header {position: relative;padding: 0 20px;}

section.intro {color: #fff;background: #777;}

section.white {color: #777;background: #f5f5f5;}

.header {position: fixed;z-index: 1000;width: 100%;height: 80px;top: 0;box-shadow: 0 0 10px #ccc;background: #fff;background: rgba(255,255,255,0.9);}

.header-shim {height: 80px;}

.divider-top {background: url('images/divider-top.png') repeat-x 0 0;top: 0;left: 0;height: 60px;position: relative;width: 100%;z-index: 100;}

.divider-bottom {background: url('images/divider-bottom.png') repeat-x center 0;top: 0;left: 0;height: 60px;position: relative;width: 100%;z-index: 100;}

.logo h1 {margin-top: 12px;}

#cookies {border-radius: 10px;padding: 10px 20px;background: #858585;}

.glasses {width: 282px;margin: 0 auto 10px auto;}



/* Text Styles */



a {color: #fb9e25; text-decoration: none;-webkit-transition: color 0.5s linear;-moz-transition: color 0.5s linear;-ms-transition: color 0.5s linear;-o-transition: color 0.5s linear;transition: color 0.5s linear;}

a:hover {color: #ffc477;}

p {margin-bottom: 1.5em;font-size: 1.4em;font-weight: 300;}

h1, h2, h3, h4, h5, h6 {font-weight: 300;}

h2.title {font-size: 42px;line-height: 42px;margin-top: 20px;text-align: center;text-transform: uppercase;}

h2.title:before, h2.title:after {content:'\2605';color: #ccc;font-size: 0.6em;vertical-align: top;padding: 0 10px;}

h2.entry-title {display: inline-block;font-size: 1.4em;text-transform: uppercase;border-bottom: 1px dashed #fff;padding-bottom: 5px;margin-bottom: 10px;}

h2.meet-title {color: #777;}   

h2.meet {width: 100%;font-size: 1.3em;font-weight: 300;margin-bottom: 10px;text-transform: uppercase;border-bottom: 1px solid #ccc;}

h2.work-title {margin-bottom: 20px; font-size: 1.6em;border-bottom: 1px solid #ccc;}

h2.work {display: inline-block; border-bottom: 1px dashed #ccc;margin-bottom: 20px;}

h3.boxes {background: url("images/divider.png") no-repeat scroll center center rgba(0, 0, 0, 0);font-size: 24px;line-height: 24px;margin: 24px 0;text-align: center;text-transform: uppercase;}

h3.blog {font-size: 1.4em;text-transform: uppercase;margin-bottom: 1.0em;border-bottom: 1px dashed #ccc;display: inline-block;}

h3.name {font-size: 0.8em;text-transform: uppercase;border-top: 1px dashed #ccc;padding: 5px 0 10px 0;margin-top: 30px;}

h3.other-work, h3.testimonial {text-align: center; font-size: 1.4em;text-transform: uppercase;border-bottom: 1px solid #ccc;margin: 0 30px 10px 30px;}

h3.comments-title {margin-bottom: 40px; font-size: 1.6em;border-bottom: 1px solid #ccc;}

h3.comments-form-title {margin-bottom: 20px; font-size: 1.6em;border-bottom: 1px solid #ccc;}

h3.widget-title {font-size: 1.4em;text-transform: uppercase;border-bottom: 1px solid #ccc;margin: 0 10px 20px 10px;padding-bottom: 5px;}

h3.privacy {display: inline-block; border-bottom: 1px dashed #ccc;margin-bottom: 20px; font-size: 1.6em;}

h3.share {font-family: 'Yesteryear', cursive;letter-spacing: 2px;color: #fff;font-size: 2.0em;padding: 5px 20px 10px 0;}

h3.caption-blog {padding: 0;margin-bottom: 30px;color: #fff;font-size: 1.0em;text-transform: uppercase;}   

h3.caption {color: #fff;font-size: 1.0em;text-transform: uppercase;} 

h3.boring-title {margin-bottom: 20px; font-size: 1.6em;border-bottom: 1px solid #ccc;} 

h3.zero {text-transform: uppercase;border-bottom: 1px dashed #ccc;margin-bottom: 20px;display: inline-block;}

h4.label {padding-bottom: 5px;}



.center {text-align: center;}

.required {color: red;}

.small {font-size: 0.7em;}

.pipe {margin: 0 10px;}

.orange {color: #fb9e25;}

.green {color: #a6e22e;}



/* Main Navigation */



.nav-wrap-navigation {height: 46px;width: 460px; margin: 15px auto 0 auto;} 

#menu-nav {height: 46px;float: left;padding: 0;list-style: none;}

#menu-nav li {float: left; margin: 0;font-weight: 300;}

#menu-nav li a {display: block;padding: 10px 15px;text-decoration: none;font-size: 1.1em;}

#menu-nav li.current_page_item a, #menu-nav li.current_page_parent a, #menu-nav li.current-page-ancestor a {cursor: default;color: #777;}	



/* Circle Divider */



.hover-circles {display: block;margin: 30px auto 40px auto;width: 512px;height: 22px;}

.hover-circles li {width: 20px;height: 20px;border: 1px solid #ccc;float: left;margin: 0 5px;border-radius: 50px;-webkit-transition: background 0.5s ease; -moz-transition: background 0.5s ease; -o-transition: background 0.5s ease; transition: background 0.5s ease;}

.hover-circles li:hover {background: #fb9e25;}



/* Social Meedja */



#social-top {height: 35px;float: right;margin-top: 20px;}	

#twitter, #facebook, #rss {float: right;margin-left: 15px;padding: 5px;border-radius: 50px;height: 25px; width: 25px;background: #899092; border: none; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}

#twitter:hover, #facebook:hover, #rss:hover {background: #fb9e25; cursor: pointer;}



/* Banner & Controls */



.controls {position: absolute;z-index: 1030;background: #fff;box-shadow: 0 0 5px #777;left: 47%;width: 45px;height:55px;border-radius: 0 0 50px 50px;padding: 5px;}

#paint {margin: 10px auto 0 auto;padding: 5px;border-radius: 50px;height: 35px; width: 35px;background: #777; border: none; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}

#paint:hover {background: #fb9e25; cursor: pointer;}



#stagewrapper {width: 100%;height: 300px;margin: 80px auto 0 auto;position: relative;z-index: 1;overflow: hidden;}    		

#stagecurtain {width: 100%;height: 300px;margin: 0 auto;position: absolute;z-index: 1000;background: #f5f5f5;}

.stage {width: 100%;height: 300px;}

#sky {background: url(images/banner/sky1.png) 0 0 repeat-x;position: absolute;z-index: 0;display: none;}

#sky1 {background: url(images/banner/sky.png) 0 0 repeat-x;position: absolute;z-index: -1;display: none;}

#planet {background: url(images/banner/planet.png) 0 0 no-repeat;left: 0;top: 0;position: absolute;z-index: 0;display: none;} 

#cloud {background: url(images/banner/cloud.png) 0 0 repeat-x;position: absolute;z-index: -1;}

#moon {background: url(images/banner/moonstars.png) 0 0 repeat-x;position: absolute;top: 0;left: 0;z-index: 0;}

#moonsketch {background: url(images/banner/moonsketch.png) 0 0 repeat-x;position: absolute;top: 0;left: 0;z-index: 1001;}    

#backsketch {background: url(images/banner/backsketch.png) 0 0 repeat-x;position: absolute;z-index: 1005;}    

#back {background: url(images/banner/back.png) 0 0 repeat-x;position: absolute;z-index: 5;}

#front {background: url(images/banner/front.png) 0 0 repeat-x;position: absolute;z-index: 9;}

#frontsketch {background: url(images/banner/frontsketch.png) 0 0 repeat-x;position: absolute;z-index: 1009;}    

#ufo {background: url(images/banner/ufo.png) 0 0 no-repeat;left: 200px;top: 170px;position: absolute;height: 120px;width: 180px;z-index: 1010;}    

#ufocow {background: url(images/banner/ufocow.png) 0 0 no-repeat;height: 200px;left: 165px;position: absolute;top: 30px;width: 100px;z-index: 7;}

#logoplanetwrap {width: 1100px;margin: 0 auto;height: 300px;} 

#logoplanet {position: absolute;height: 300px;width: 1100px;z-index: 1005;display: none;background: url(images/banner/logoplanet.png) 0 0 no-repeat;}   



/* Roll-over boxes */



.imageinfo-wrapper {overflow: hidden;display: block;float: left;width: 31.27273%;margin-right: 3.09090%;margin-bottom: 20px;}

.imageinfo-wrapper:nth-child(3n) {margin-right: 0;}    	  	

.imageinfo {color: #777;position: relative;text-align: center;cursor: default;float: left;width: 100%;} 

.overlay {width: 100%;height: 98.4%;position: absolute;top: 0;left: 0;opacity: 0;background: #fff;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;-ms-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}

.imageinfo h4 {display: inline-block;text-transform: uppercase;color: #fff;text-align: center;position: relative;font-size: 1.2em;padding: 5px 0;width: 100%;margin: 0;background: #899092;border-bottom: 0px;-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} 

.imageinfo p {font-size: 1.2em;position: relative;padding: 20px;margin: 0;text-align: center;color: #777;-webkit-transform: translateY(50px);-moz-transform: translateY(50px);-o-transform: translateY(50px);-ms-transform: translateY(50px);transform: translateY(50px);opacity: 0;-webkit-transition: all 0.4s linear;-moz-transition: all 0.4s linear;-o-transition: all 0.4s linear;-ms-transition: all 0.4s linear;transition: all 0.4s linear;}

.imageinfo:hover .overlay {opacity: 1;}

.imageinfo:hover h4, .imageinfo:hover p {opacity: 1;-webkit-transform: translateY(0px);-moz-transform: translateY(0px);-o-transform: translateY(0px);-ms-transform: translateY(0px);transform: translateY(0px);-webkit-transition-delay: 0.2s;-moz-transition-delay: 0.2s;-o-transition-delay: 0.2s;-ms-transition-delay: 0.2s;transition-delay: 0.2s;} 

.overlay a.more {font-family: 'Yesteryear', cursive;font-size: 1.4em;}



h3.projects {margin-bottom: 20px;text-align: center;}

.work-dropdown {margin-bottom: 30px;padding: 5px 10px;font-family: 'Roboto Condensed', sans-serif;font-size: 1.0em;}



p.view-all {width: 155px; margin: 15px auto 10px auto;}

a.view-all {background: #fb9e25 url(images/icons/demo.png) 10px 5px no-repeat;text-indent: 25px;font-family: 'Yesteryear', cursive;border-radius:10px;display:inline-block;cursor:pointer;color: #fff;font-size: 1.1em;padding:5px 20px;text-decoration:none;-webkit-transition: background 0.5s ease; -moz-transition: background 0.5s ease; -o-transition: background 0.5s ease; transition: background 0.5s ease;}

a.view-all:hover {background: #ffc477 url(images/icons/demo.png) 10px 5px no-repeat;}



/* Our Work */



#livelink {background: url(images/social/web.png) 0 0 no-repeat;padding: 10px 0 0 60px;height: 50px;}

#back-index {background: url(images/social/back.png) 0 0 no-repeat;margin: 20px 0;padding: 10px 0 0 60px;height: 50px;}

#menu-work-wrapper {margin-top: 20px;padding: 20px 0;list-style: none;background: #858585;border-radius: 10px;}

#menu-work li {margin: 0 20px;}

#menu-work li a {display: block;padding: 10px;text-decoration: none;font-weight: 300;font-size: 1.1em;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}

#menu-work li.current_page_item a, #menu-work li.current_page_parent a, #menu-work li.current-page-ancestor a {background: #777;cursor: default;color: #fff;border-radius: 10px;}   

#testimonial-wrapper {border-radius: 10px;background: #858585; padding: 20px 0;}

.quotesection {background: url(images/social/quote.png) 30px 5px no-repeat;padding: 0 30px;}

.quotetext {padding: 0 40px;background: url(images/social/quote-close.png) right 5px no-repeat;}



/* Search Box & Results */



.search-popout {position: fixed;z-index: 1050;margin-top: 50px;}

.search-field {background: #fff url('images/icons/search-icon.png') 10px center no-repeat;box-shadow: 0 0 5px #777;border-radius: 0 100px 100px 0;font-size: 14px;height: 50px;border: none;cursor: pointer;padding-left: 60px;width: 0;color: #777;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;transition: all 0.5s ease;-webkit-appearance: none;-webkit-appearance:textfield;-webkit-box-sizing:content-box;}

.search-field:hover {background: #fff url('images/icons/search-icon-focus.png') 10px center no-repeat;}

.search-field:focus {background: #fff url('images/icons/search-icon-focus.png') 10px center no-repeat;border: none;cursor: text;outline: 0 none;width: 130px;padding-right: 20px;color: #777;}

::-webkit-input-placeholder, :-moz-placeholder, ::-moz-placeholder,:-ms-input-placeholder {color: #fff;}

input::-webkit-search-decoration, input::-webkit-search-cancel-button {display: none;}

input {outline: none;}



.search-list p {margin-bottom: 0;}

.search-excerpt {font-weight: 300;padding: 0;color: #fff;border-bottom: 1px solid #ccc;}

.result {padding: 0px 5px; color: #fb9e25;}

.page-numbers {padding: 0 5px;border-radius: 10px;margin-top: 20px;}

.page-numbers.dots {border: none;cursor: default;}

div span.current {background: #777; color: #fff; cursor: default;}

.sidebar-text:after {content: 'on the right';}



/* Fresh Menu */

	

#menu-fresh {padding: 20px 30px;list-style: none;margin-bottom: 20px;font-size: 1.2em;border-radius: 10px;background: #858585;}

#menu-fresh li {font-weight:300;margin-bottom: 10px;}

#menu-fresh ul li {margin: 10px 0 0 10px;font-size: 0.8em;}



/* Meet the Tribe */



#meetwrap-phil, #meetwrap-caz, #meetwrap-rach, #meetwrap-mystery {float: left;width: 100%;}

.meetbox-top {background: #fff;padding: 10px 20px;border-radius: 10px;}	

.meetbox {padding: 20px;margin: 20px 0 40px 0;border-radius: 10px;background: #858585;}

.meetbox-mystery {padding: 0 20px;}

.meetbox-mystery-top {border: 2px solid #ccc;padding: 10px 20px;border-radius: 10px;} 		

.meet {float: left;list-style: none;margin: 0;}

.meet li {list-style: none;font-family: 'Yesteryear', cursive;margin-left: 30px;padding: 23px 0 0 90px;font-size: 1.8em;}

li.meetphil {background: url(images/social/phil.png) no-repeat;height: 80px;}

li.meetcaroline {background: url(images/social/caroline.png) no-repeat;height: 80px;}	

li.meetrach {background: url(images/social/rach.png) no-repeat;height: 80px;}

li.meet-mystery {background: url(images/social/mystery.png) no-repeat;height: 80px;}	

.team-pic {float: left;margin: 8px 0 0 10px;padding: 0;background: url(images/social/vertbar.png) no-repeat 10px 38px;}

.mystery-pic {float: left;margin: 8px 0 0 10px;padding: 0;background: url(images/social/vertbar-grey.png) no-repeat 10px 38px;}

	

/* Contact the Tribe */



li.phil {background: url(images/social/phil.png) no-repeat;font-size: 1.8em;padding: 25px 0 0 100px;height: 80px;font-family: 'Yesteryear', cursive;}

li.caroline {background: url(images/social/caroline.png) no-repeat;font-size: 1.8em;padding: 25px 0 0 100px;height: 80px;font-family: 'Yesteryear', cursive;}			

li.options {padding: 5px 0;margin-bottom: 20px;border-top: 1px dashed #fff;border-bottom: 1px dashed #fff;}

li.mail, li.twit, li.phone {font-size: 1.4em;font-weight: 300;margin-top: 15px;padding: 2px 0 0 50px;height: 40px;}	

li.mail	{background: url(images/social/mail.png) no-repeat;}

li.twit {background: url(images/social/twit.png) no-repeat;}	

li.phone {background: url(images/social/phone.png) no-repeat;}	



/* Contact Form 7 */



.wpcf7-form {margin-top: 8px;}

.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea {font-family: 'Roboto Condensed', sans-serif;color: #777;font-weight: 300;-webkit-appearance: none;border-radius: 0;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;background: #fff;font-size: 16px;width: 100%;padding: 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border: 1px solid #ccc;}

.wpcf7 input[type="text"]:hover, .wpcf7 input[type="email"]:hover, .wpcf7 textarea:hover, .wpcf7 input[type="text"]:focus, .wpcf7 input[type="email"]:focus, .wpcf7 textarea:focus {background: #f5f5f5;}

.wpcf7-response-output {color: red;font-weight: 300;} 

span.wpcf7-not-valid-tip {display: block;color: red;font-size: 16px;padding: 10px 0;position: relative;}

.wpcf7-mail-sent-ok {color: green;} 

.wpcf7 img.ajax-loader {border: none;vertical-align: middle;margin-left: 10px;} 

.wpcf7 input[type="submit"], .form-submit #submit {font-family: 'Yesteryear', cursive;border:none;outline: none;background: #fb9e25;border-radius:10px;display:inline-block;cursor:pointer;color: #fff;font-size: 1.1em;padding:5px 20px;text-decoration:none;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;-webkit-appearance: none;}

.wpcf7 input[type="submit"]:hover, .form-submit #submit:hover {background: #ffc477;}

p.contact {margin-bottom: 1.0em;}

p.textarea {margin-bottom: 0.8em;}



/* Select Custom Dropdown for Crossbrowser Compatability */



.dropcontainer {position:relative;font-size: 16px;color: #777;} 

.trigger {color: #777;padding: 10px;font-size: 16px;width: 50%;background: #fff url(images/icons/select-arrow-open.png) 98% center no-repeat;display:block;border: 1px solid #ccc;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}

.trigger:hover {color: #777;background: #f5f5f5 url(images/icons/select-arrow-open-hover.png) 98% center no-repeat;}

.activetrigger {color: #777;padding: 10px;font-size: 16px;width: 50%;background: #f5f5f5 url(images/icons/select-arrow-close.png) 98% center no-repeat;display:block;border: 1px solid #ccc;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}

.activetrigger:hover {background: #f5f5f5 url(images/icons/select-arrow-close-hover.png) 98% center no-repeat;color: #777;}

.activetrigger:active {background: #f5f5f5 url(images/icons/select-arrow-close.png) 98% center no-repeat;color: #777;}

.dropcontainer ul {font-size: 16px;border: 1px solid #ccc;border-top: none;background: #fff;list-style-type: none;padding: 10px;margin: 0;width: 50%;z-index: 100;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}

.dropcontainer ul li {padding: 5px;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}

.dropcontainer ul li:hover {background: #f5f5f5;outline: none;}

.dropcontainer ul li:first-child {display: none;}

.dropcontainer ul li:last-child {border-bottom: none;}

.dropdownhidden {display: none;}

.dropdownvisible {height: auto;}



/* Back to the top */



#back-top {position: fixed;bottom: 42px;right: 40px;z-index: 1000;}

#back-top span {width: 33px;height: 33px;display: block;padding: 5px;border: 1px solid #ccc;background: #899092 url(images/icons/up-arrow.png) no-repeat center center;-webkit-border-radius: 50px;-moz-border-radius: 50px;border-radius: 50px;-webkit-transition: 1s;-moz-transition: 1s;transition: 1s;}

#back-top a:hover span {background-color: #fb9e25;}



/* Footer */



footer {background: #777;color: #fff;padding: 20px 20px 0 20px;font-weight: 300;}   

footer h4 {text-align: center;text-transform: uppercase;margin-bottom: 20px;}

.footer-last {background: #777; color: #fff;font-weight: 300;padding-top: 20px;}

#menu-footer li {float: left;display: block;padding: 0 10px 5px 10px;font-size: 1.0em;line-height: 20px;border-left: 1px solid #ccc;}

#menu-footer li:first-child {border-left: none;padding-left: 0;}

#menu-footer li.current_page_item a, #menu-footer li.current_page_parent a, #menu-footer li.current-page-ancestor a {cursor: default;color: #fff;}

.footer-nav {padding: 10px 20px;margin: 0;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;}

.scribblelogo {float: left; font-family: 'Yesteryear', cursive;font-size: 1.9em;color: #fff;}

.scribblelogo a:link, .scribblelogo a:visited {color: #fff;}

.copyright {padding: 20px 20px 10px 20px;font-size: 0.7em;}

p.design {float: left;}

p.privacy {float: right;}



/* Footer - Twitter Feed */



#twitter-feed {font-size: 0.7em;}

.twitter-article {margin-bottom: 20px;min-height: 50px;}

.twitter-text {display: block; margin-left: 60px;}

.twitter-pic img {border-radius: 50px; float: left; margin-right: 15px;}



/* Footer - Connect */



#connect {overflow: hidden;margin: 20px auto;width: 232px;}

#connect-top {display: block;overflow: hidden;margin-bottom: 20px;}

#twitter-footer, #facebook-footer, #rss-footer, #digg, 

#stumble, #linked, #twitter-share, #facebook-share, #google-share {float: left;margin: 0 10px;padding: 5px;border: 1px solid #ccc;border-radius: 50px;height: 45px; width: 45px;background: #899092; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}

#twitter-footer:hover, #facebook-footer:hover, #rss-footer:hover,

#digg:hover, #stumble:hover, #linked:hover, #twitter-share:hover, #facebook-share:hover, #google-share:hover {background: #fb9e25;cursor: pointer;}



/* Footer - Recent Articles */



#latest a {font-size: 1.0em;}

.footer-excerpt {font-size: 16px;margin: 0 0 20px 70px;}  

.footer-excerpt p {font-size: 16px;}    



/* Blog specific Styling */



.nomargin img {margin: 5px 0 10px 0 !important;}

.metadata {float: left;width: 100%;margin-bottom: 20px;}     

.metacomment {width: 110px;background: url(images/greybar.png) no-repeat 65px 32px; height: 60px;float: left;}

.author-cat {margin-top: 12px;padding: 10px; width: auto; float: left;border-radius: 10px;background: #858585;text-transform: uppercase;font-size: 0.8em;font-weight: 300;}

.avatar {width: 60px;height: 60px;float: left;margin-right: 20px;}

.avatar img {border-radius: 60px;padding: 2px;border: 1px solid #ccc;}

.avatar-frame {border: 1px solid #ccc; padding: 2px;float: left;}

.avatar-frame, .avatar-frame img {width: 60px;height: 60px;-webkit-border-radius: 50%;border-radius: 50%;}

.standfirst {margin-bottom: 10px;display: block;}

.standfirst p {margin-bottom: 0;}

.standfirst img, .entry-content img, .entry-content-work img {margin-top: 0px;width: 97.5%;overflow: hidden;border-radius: 10px;padding: 10px;border-radius: 10px;background: #858585;}    

.entry-content img {margin: 20px 0 10px 0;}

.entry-content-work img {margin-top: 5px;}     

.post-wrapper {overflow: hidden;}

.commentwrap {margin: 30px 0;}

.commentlist li {padding: 10px 20px;margin: 0 0 20px 110px;border: 1px solid #ccc;font-size: 0.8em;border-radius: 10px;list-style: none;background: #fff; position: relative;z-index: 100;}

.commentlist cite {display: block;font-style: normal;padding: 5px 10px;border-radius: 10px;text-transform: uppercase;font-weight: 300;background: #f5f5f5;display: inline-block;}

.commentlist .author_comment {background: #f6ece0;margin: 0 0 20px 100px;}

.number-wrap {padding: 10px 0;}

.page-numbers {padding: 6px 12px;border-radius: 50px;border: 1px solid #ccc;margin-right: 10px;}

div span.current {background: #777;color: #fff;border: none;}

div span.current:hover {background: #777;color: #fff;cursor: default;}

.postdate {padding-right: 15px;float: left;background: url(images/social/cal.png) no-repeat;width: 60px;height: 60px;text-align: center;font-weight: 300;}

.postdatefooter {float: left;margin: 0;padding-right: 10px;background: url(images/social/cal-footer.png) no-repeat;width: 60px;height: 60px;text-align: center;}	

.postmonth {color: #fff;font-size: 0.8em;line-height: 0.3em;text-transform: uppercase;font-weight: 300;padding-top: 15px;}

.postday {color: #fff;padding-top: 11px;font-weight: 300;}

a.more-link {margin-top: 20px;font-family: 'Yesteryear', cursive;background: #fb9e25;border-radius:10px;display:inline-block;cursor:pointer;color: #fff;font-size: 1.1em;padding:5px 20px;text-decoration:none;-webkit-transition: background 0.5s ease; -moz-transition: background 0.5s ease; -o-transition: background 0.5s ease; transition: background 0.5s ease;}

a.more-link:hover {background: #ffc477;}

p.demo {float: left;margin-right: 20px;}

a.demo {background: #fb9e25 url(images/icons/demo.png) 10px 5px no-repeat;text-indent: 25px;font-family: 'Yesteryear', cursive;border-radius:10px;display:inline-block;cursor:pointer;color: #fff;font-size: 1.1em;padding:5px 20px;text-decoration:none;-webkit-transition: background 0.5s ease; -moz-transition: background 0.5s ease; -o-transition: background 0.5s ease; transition: background 0.5s ease;}

a.demo:hover {background: #ffc477 url(images/icons/demo.png) 10px 5px no-repeat;}

a.download {background: #fb9e25 url(images/icons/download.png) 8px 5px no-repeat;text-indent: 25px;font-family: 'Yesteryear', cursive;border-radius:10px;display:inline-block;cursor:pointer;color: #fff;font-size: 1.1em;padding:5px 20px;text-decoration:none;-webkit-transition: background 0.5s ease; -moz-transition: background 0.5s ease; -o-transition: background 0.5s ease; transition: background 0.5s ease;}

a.download:hover {background: #ffc477 url(images/icons/download.png) 8px 5px no-repeat;}

#nextprevtitle {width: 100%;margin-bottom: 10px;height: 20px;font-size: 0.6em;color: #fff;text-transform: uppercase;border-bottom: 1px solid #fff;}	

#nextprevlink {width: 100%;margin-bottom: 60px;font-size: 0.8em;}			

#nextprevtitle p.left, #nextprevlink p.left {float: left;width: 48%;text-align: left;}	

#nextprevtitle p.right, #nextprevlink p.right {float: right;width: 48%;text-align: right;}

.share-container {width: 100%;margin: 20px 0;padding: 10px 0;background: #858585;border-radius: 10px;overflow: hidden;}

#share-text {width: 49%;height: 50px;padding: 0;float: left;text-align: right;border-right: 1px dashed #ccc;}

#share-buttons {width: 49%;margin: 0;padding: 0;float: right;}		

#share-buttons img {padding: 0;margin-top: 0px;border-radius: 0px;background: none;border: none;}

.entry-content blockquote {border-radius: 10px;background: #858585;margin-bottom: 20px;}

.entry-content blockquote p {padding: 20px;margin-bottom: 0;background: url(images/social/quote.png) no-repeat 20px 25px;position: relative;text-indent: 40px;color: #fff;}

#formwrap {width: 48%;float: left;}

#formtextwrap {width: 48%;float: right;} 

.form-input input[type="text"], .form-textarea textarea {font-family: 'Roboto Condensed', sans-serif;color: #777;font-weight: 300;-webkit-appearance: none;border-radius: 0;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;background: #fff;font-size: 16px;width: 100%;padding: 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border: 1px solid #ccc;}

.form-input input[type="text"]:hover, .form-input input[type="text"]:focus, .form-textarea textarea:hover, .form-textarea textarea:focus {background: #f5f5f5;outline:none;}

.form-label {margin-top: 10px;font-weight: 300;}

.form-submit {margin-top: 20px;font-weight: 300;}



/* Widget Areas */



.widget-area {background: #858585; border-radius: 10px;padding: 20px;}

.widget-area ul {list-style: none;}

.widget-area ul ul {padding: 0 10px;}	

#categories-4 li {list-style: none;text-transform: uppercase;font-weight: 300;margin-bottom: 5px;}



/* Mobile Grid Styles */



@media handheld, only screen and (max-width: 780px) {

body {font-size: 16px;-webkit-text-size-adjust: none;}

.row, body, .container {width: 100%;min-width: 0;margin-left: 0px;margin-right: 0px;padding-left: 0px;padding-right: 0px;}

.row .onecol, .row .twocol, .row .threecol, .row .fourcol, .row .fivecol, .row .sixcol, .row .sevencol, .row .eightcol, .row .ninecol, .row .tencol, .row .elevencol, .row .twelvecol {width: auto;float: none;margin-left: 0px;margin-right: 0px;padding-left: 20px;padding-right: 20px;}

}



/* 1360px and below */



@media (max-width: 1360px) {

#back-top, #back-top span {display: none;}

}



/* 1150px and below */



@media (max-width: 1150px) {

.imageinfo h4 {font-size: 1.2em;} 

.imageinfo p {font-size: 1.0em;padding: 20px;}

.imageinfo .overlay a.more {font-size: 1.3em;}

h2.title:before, h2.title:after {display: none;}

}



/* 1050px and below */



@media (max-width: 1150px) {

.imageinfo h4 {font-size: 1.0em;} 

.imageinfo p {font-size: 0.9em;padding: 15px 15px 5px 15px;}

.imageinfo .overlay a.more {font-size: 1.2em;}

}



/* 1023px and below */



@media (max-width: 1023px) {

.nav-wrap-navigation {width: 362px;height: 30px;margin: 22px auto 0 auto;}

#menu-nav li a {padding: 5px 10px;font-size: 1.0em;}

}



/* 780px and below */



@media (max-width: 780px) {

#stagewrapper, .controls, .header-shim {display: none;}

.logo h1 {margin-bottom: 4px;}

h2.title {font-size: 36px;line-height: 36px;}

.header {height: 260px;background: url(images/banner/mobile-back.png) center top no-repeat; position: relative;box-shadow: none;}

.nav-wrap-navigation {float: left;margin: 0;}

#menu-nav li:first-child a {padding-left: 0;}

#social-top {margin-top: 0;}	

.search-popout {position: relative;z-index: 1050;margin-top: 50px;}

.hover-circles {margin: 20px auto 10px auto;width: 353px;}

.hover-circles li {width: 10px;height: 10px;}

.footer-first {border-bottom: 1px dashed #ccc;margin-bottom: 20px;}

.footer-second {width: 100%;border-bottom: 1px dashed #ccc;padding-bottom: 20px;margin-bottom: 20px;}

.imageinfo h4 {font-size: 1.1em;} 

.imageinfo p {font-size: 1.0em;padding: 15px;}

.imageinfo .overlay a.more {font-size: 1.3em;}

.imageinfo-wrapper {width: 48.45455%;margin-right: 3.09090%;}

.imageinfo-wrapper:nth-child(3n) {margin-right: 3.09090%;} 

.imageinfo-wrapper:nth-child(2n) {margin-right: 0%;} 

.sidebar-text:after {content: 'below';}

.meetbox-mystery {clear: both;}

#meetwrap-mystery {margin-bottom: 20px; clear: both;}

h3.boring-title {padding-top: 20px;} 

#nextprevlink {margin-bottom: 100px;}	

}



/* 620px and below */



@media (max-width: 620px) {

.nav-wrap-navigation {width: 100%;}

#social-top {float: left;margin-top: 10px;}

#twitter {margin-left: 0;}

.intro p, .white p {font-size: 1.2em;}

p.design {width: 100%;margin-bottom: 0.8em;}

p.privacy {float: left;}

.imageinfo h4 {font-size: 1.2em;} 

.imageinfo p {font-size: 1.0em;padding: 15px;}

.imageinfo .overlay a.more {font-size: 1.3em;}

.imageinfo-wrapper {width: 100%;margin-right: 0%;}

.imageinfo-wrapper:nth-child(3n) {margin-right: 0%;} 

.imageinfo-wrapper:nth-child(2n) {margin-right: 0%;} 

.overlay {max-width: 400px;text-align: center;}	

.imageinfo, h3.projects {text-align: left;}

.standfirst img, .entry-content img, .entry-content-work img {padding: 5px;}

#formwrap, #formtextwrap {width: 100%;float: none;}

#share-text {width: 45%;}

h3.share {font-family: inherit;font-size: 1.2em;letter-spacing: 0px;text-transform: uppercase;padding: 10px 20px;}

#share-buttons {float: left;margin-left: 10px;}

#twitter-share, #facebook-share, #google-share {margin: 0 10px;}

}



/* 560px and below */



@media (max-width: 560px) {

#twitter-share, #facebook-share, #google-share {margin: 0 5px;height: 35px; width: 35px;}

#share-buttons {float: left;margin-left: 5px;}

}



/* 540px and below */



@media (max-width: 540px) {

.imageinfo h4 {font-size: 1.2em;} 

.imageinfo p {font-size: 1.0em;padding: 15px 15px 5px 15px;}

.imageinfo .overlay a.more {font-size: 1.2em;}

h3.boxes {background: none; border-bottom: 1px dashed #ccc;padding-bottom: 10px;}	

}



/* 455px and below */



@media (max-width: 455px) {

.header {height: 360px;background: url(images/banner/mobile-back-455.png) center top no-repeat;}

h2.title {font-size: 30px;line-height: 30px;}

.nav-wrap-navigation {float: none;}

#menu-nav {height: auto;}

#menu-nav li {width: 100%;}

#menu-nav li a {padding-left: 0;}

.search-popout {margin-top: 40px;}

.hover-circles {margin: 15px auto 0 auto;width: 273px;}

.hover-circles li {width: 5px;height: 5px;}	

#menu-footer li {width: 100%;padding: 5px 0;border-left: none;}

.trigger, .activetrigger, .dropcontainer ul {width: 100%;}

h2.meet-title {font-size: 1.2em;} 

li.mail, li.twit, li.phone {font-size: 1.1em;font-weight: 300;margin-top: 15px;padding: 4px 0 0 45px;}	

h3.share {font-size: 1.0em;padding: 5px 10px 10px 10px;}

#share-text {width: 25%;}

#share-buttons {width: 65%;}

}



/* 440px and below */



@media (max-width: 440px) {

.imageinfo h4 {font-size: 1.2em;} 

.imageinfo p {font-size: 1.2em;padding: 20px;}

.imageinfo .overlay a.more {font-size: 1.4em;}

.imageinfo, h3.projects {text-align: center;}	

}



/* 380px and below */



@media (max-width: 380px) {

.imageinfo h4 {font-size: 1.1em;} 

.imageinfo p {font-size: 1.0em;padding: 15px 15px 5px 15px;}

.imageinfo .overlay a.more {font-size: 1.1em;}

#share-text {display: none;}

#share-buttons {width: 100%;}	

}



/* 340px and below */



@media (max-width: 340px) {

li.mail, li.twit, li.phone {font-size: 1.0em;padding: 4px 0 0 45px;}