/*
Theme Name:         P and S
Theme URI:          http://pointandstare.com/
Description:        Point and Stare develop and design bespoke WordPress themes for everyone of a certain calibre - this is their main, home theme.
Version:            2.2
Author:             Lee Rickler
Author URI:         http://pointandstare.com
*/

/* -- RESET -- */
html, body, 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, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

article, aside, figure, footer, header, hgroup, nav, section { display: block }
img, object, embed { max-width: 100% }
html { overflow-y: scroll }
ul { list-style: none }
blockquote, q { quotes: none }

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

a {
    background: transparent;
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline
}

hr {
    border: 0;
    border-top: 1px solid #ccc;
    display: block;
    height: 1px;
    margin: 0;
    padding: 0
}

input, select { vertical-align: middle }

/* -- FIXISH -- */
@-ms-viewport { width: device-width }
@viewport { width: device-width }

.row { *zoom: 1 }

.row:before, .row:after {
  content: "";
  display: table
}

.row:after { clear: both }

.clearfix:before, .clearfix:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden
}

.clearfix:after { clear: both }
.clearfix { zoom: 1 }

/* GLOBAL */
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  margin: 0;
}

*,
*:after,
*::before { box-sizing: border-box }

h1 {
	font-size:160%;
	font-weight:normal;
}

.left, .alignleft { float: left }
.right, .alignright { float: right }

/* BORDERS */
div.home-random-project {
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px
}

/* BUTTONS */
span.button.pands, a.button.pands {
	-moz-border-top-left-radius: 16px;
	-webkit-border-top-left-radius: 16px;
	border-top-left-radius: 16px
}

input[type=submit].button, button.button { -webkit-appearance: none; }
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
		border: none;
}

/* GENERAL */
html, body { 
  background: url('images/main-bg.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover
}

body {
	color: #333;
	font: 16px Helvetica, Arial, sans-serif;
	font-weight: normal;
	line-height: 1.2em
}

.row .four { width: 30.37% }
.row .eight { width: 65.2% }

div.container {
	display: block;
	margin: 72px auto 0;
	max-width: 960px
}

p {
	letter-spacing: 0.06em;
	line-height: 1.3em;
	margin-bottom: 10px;
}

h4 {
	font-size:76%;
	font-weight:normal
}

div.mobile-head, nav.mobile-navigation a {
  display: none;
  visibility: hidden;
}

a, a:hover {
	color: #d50f25;
	text-decoration: none
}

.block-grid {
	display: block;
	margin:0
}

.block-grid > li {
	display: block;
	float: left;
	height: auto
}

.block-grid.four-up > li {
	margin-left: 2%;
	width: 23%
}

.block-grid>li:first-child { margin-left: 20px }

ul, ol {
	letter-spacing: 0.06em;
	line-height: 1.5em;
	list-style: circle;
	margin-left: 30px
}

.column,
.columns {
	float: left;
	margin-left: 0;
	min-height: 1px;
	position: relative
}

.column:first-child,
.columns:first-child { margin-left: 0 }
[class*="column"] + [class*="column"]:last-child { float: right; }
[class*="column"] + [class*="column"].end { float: left; }

.aligncenter {
	display: block;
	margin: 0 auto
}

/* -- SOCIAL BAR -- */
div.social-bar {
	background: url('images/top-bg.png');
	padding: 6px 3px 3px; 
	text-align: right
}

div.social-bar i {
	color: #d7dfe3;
	padding-right: 6px
}

div.social-bar i:hover { color: #d50f25 }

/* TOP BAR */
.navbar-fixed-top {
	background: url('images/tb-bg.png');
	display: block;
	position: fixed;
	text-align: center;
	top: 0;
	width: 100%;
	z-index: 1030
}

div.top-bar { 
	display: block;
	font-size: 76%;
	margin: 3px auto;
	text-transform: uppercase
}

div.top-bar img {
	margin-right: 10px;
	vertical-align: middle
}

div.top-bar nav {
	display: block;
	max-width: 100%
}

div.top-bar ul li {
	display: inline;
	margin-right: 3px
}

div.top-bar ul li a {
	background: #d7dfe3;
	color: #333;
	font-weight: bold;
	padding: 6px;
	text-decoration: none
}

div.top-bar ul li a:hover, div.top-bar ul li.current-menu-item a, div.top-bar ul li.current-menu-parent a {
	background: #d50f25;
	color: #fff
}

div.top-bar ul li.nav-contact a {
	background: #d50f25;
	color: #fff;
	font-weight: bold;
	padding: 6px;
	text-decoration: none
}

div.top-bar ul li.pands-icon a { background:transparent }

div.top-bar ul li.home-nav {
	display: none;
	visibility: hidden
}

div.top-bar ul li:last-child a {
	background: #fff;
	color: #d50f25;
	font-size: 80%;
	padding: 3px 6px;
	white-space: nowrap;
}

/* MAIN CONTENT */
article {
	background: #fff;
	border-bottom: solid 3px #d50f25;
	display: block;
	margin: 0;
	padding: 16px 20px
}

h1.internal-title {
	font-size: 300%;
	font-style: italic;
	font-weight: bold;
	margin: 20px 0;
	padding: 20px 0;

	}

p.postmetadata {
	color: #999;
	font-size: 76%;
	font-style: italic
}

p.postmetadata a { color: #999 }

div.art-main {
	background: #fff;
	display: block;
	width: 100%
}

div.art-main img { margin-bottom: 20px }

ul.art-mob {
	background: #fff;
	display: block;
	margin: 0 auto;
	padding: 20px 10px;
	text-align: center
}

ul.art-mob li {
	display: inline-block;
	max-width: 32%
}

/* HOME CONTENT */
div.container.home-one {
	min-width: 100%;
	width: 100%;
}

div.twelve.columns.hp-one {
	padding: 14% 100px 0 100px;
	width: 100%;
}

div.hp-one-block {
	color: #fff;
	display: inline-block;
	font-family: 'Raleway', sans-serif;
	font-size: 260%;
	margin: 0 auto;
	max-width: 90%;
	opacity: 0.8;
	padding: 1%
}

div.hp-one-block p { margin-bottom: 0!important }
div.hp-one-block.left {	font-size: 160% }
div.hp-one-block.left img { margin-bottom: 20px }
div#gform_wrapper_8 { margin: 0!important }
div.hp-one-block.right li.gf_right_half, div.hp-one-block.right li#field_8_3 { padding-right: 0!important }

div#gform_wrapper_8 label {
	display: none;
	visibility: hidden
}

div#gform_wrapper_8 form { font-size: 76% }

div#gform_wrapper_8 input[type=submit] {
	background: #C3262E;
	border: none;
	color: #fff;
	float: right;
	margin-right: 0;
	padding: 1.6%;
	text-transform: uppercase
}

div#gform_wrapper_8 .gform_footer { margin: 0 }

span.home-desc, h1.title {
	color: #333;
	display: block;
	font-size: 220%;
	font-weight: bold;
	margin: 10px auto;
	text-align: center;
	padding: 10px;		
	width: 100%
	}

div.desc {
	display: block;
	font-style: italic;
	font-weight:bold;
	margin-top:10px;
	text-align: center
}

.hp-main {
	background: #fff;
	border-bottom: solid 6px #d50f25;
	font-size: 126%
}

.hp-main p { padding: 10px 20px }

ul.home-list {
	display: block;
	font-size: 140%;
	font-style: italic;
	list-style: disc;
	margin: 40px 0 40px 100px;
	width: 100%
}

ul.home-list li {
	font-size: 100%;
	font-weight: bold;
	margin-bottom: 15px
}

div.featured-post {
	display: block;
	padding: 0;
}

div.featured-post h2 {
	display: block;
	font-size: 120%;
	font-style: italic;
	font-weight: bold;
	padding: 10px
}

div.featured-post h3 {
	display: block;
	font-size: 90%;
	font-weight: bold;
	padding: 10px;
	padding-bottom: 0
}

div.featuredimg {
	display: block;
	margin-bottom: 20px;
	position: relative;
	z-index: 10
}

div.hpmoretitle {
	display: block;
	position: absolute;
	top: 50%;
	z-index: 666
}

div.featuredimg img {
    filter: brightness(50%);
    -webkit-filter: brightness(50%) blur(1.6px);
}

div.hpmoretitle h1 {
	color: #CFD8DC;
    font-size: 140%;
    font-weight: bold;
    line-height: 1.23em;
    padding: 0 20px;
}

div.hpmoretitle a {
	color: #fff;
	font-style: italic;
	text-decoration: none
}

div.post-nav {
	color: #fff;
	margin: 20px
}

div.post-nav a { color: #fff }

div.hp-sub-row {
	display: block;
	margin: 0 auto
}
div.hp-sub-element {
	border: solid 1px #e8e8e8;
	display: inline-block;
	height: 140px;
	margin: 1%;
	max-width: 31%;
	overflow: hidden
}

div.hp-sub-element:nth-child(3n) { margin-right: 0 }

div.hp-sub-element div.hp-title {
	font-size: 160%;
    font-weight: normal;
	padding: 10px;
	padding-top: 0
}

div.hp-sub-element a {
	font-size: 50%;
	font-weight: bold;
	line-height: 0.8em;
	text-decoration: none
}

/* RANDOM PROJECT */
div.random-project ul { list-style:none }

div.random-project {
	-webkit-border-radius: 16px;
	background:#fff;
	border-radius: 16px;
	display:block;
	width:280px;
	padding:10px;
	text-align: center
}

div.random-project img {
	border:solid 16px #e8e8e8;
	-webkit-border-radius:16px;
	-moz-border-radius:16px;
	border-radius:16px
}

div.random-project ul {
	margin-left:0
}

div.random-project ul {
	margin-left:0
}

li.smallscreen {
	display: none;
}

/* SECTION PANELS */
.block-grid.four-up>li.cat-art {
	margin-left: 1%
}

li.cat-art {
	background: #D982AE;
}

li.cat-art p, li.cat-dev p, li.cat-des p, li.info p {
	padding:10px
}

li.cat-dev {
	background:#00a1d6;
}

li.cat-des {
	background:#69972c;
	margin-right:0;
}

li.info {
	background:#e8e8e8;
	margin-right:0;
}

li.info:hover {
	color: #333;
}

li.cat-art:hover, li.cat-dev:hover, li.cat-des:hover {
	color: #fff;
}

span.home-block-title {
	background: #e7e3d8;
	border-bottom: solid 3px #fff;
    -webkit-box-shadow:  0px 0 6px 0px #333; 
    box-shadow:  0px 0 6px 0px #333;
	color: #333;
	display: block;
	font-size: 146%;
	padding: 6px;
	text-align: center;
	text-transform: uppercase;
}

a.button.pands, input#gform_submit_button_7 {
	background: #b8363d!important;
	border: none;
	bottom: 0;
	color: #fff;
	cursor: pointer;
	display: block;
	font-size: 126%;
	font-weight: normal;
	line-height: 1;
	margin: 0;
	padding: 10px;
	position: relative;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase
}

a.button.pands:hover, input#gform_submit_button_7 { background: #c8515e!important }

div#gform_confirmation_wrapper_7 {
	font-size: 120%;
	font-weight: bold
}

/* PROJECTS PANEL */
div.project_name a {
	color: #333;
	font-size:80%
}

/* SINGLE PAGE */
.twelve.columns.internal p {
	display: block;
	font-size: 126%;
	padding-bottom: 10px;
	width: 100%
}

.twelve.columns.internal p img {
	display: block;
	text-align: right
}

div.single-thumb {
	display:inline;
	margin-bottom:20px;
	max-width:100%
}

span.single-socials {
	display: block;
	font-style: italic;
	font-weight: 700;
	margin: 10px auto;
	text-align: right;
	width: 100%
}

p.wp-books a img.alignleft {
	float: left;
	margin-bottom: 16px;
	margin-right: 16px
}

div.single-thumb ul {
	list-style:none
}

div.single-thumb a img.single-social, div.single-thumb a.linkedin_share_button img {
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border: none;
	border-radius: 0;
}

div.main-image {
	display: block;
	padding: 0;
	position: relative;
	z-index: 9
}

div.internal-title h1, div.main-image h2 {
	display: block;
	font-size: 128%;
	font-style: italic;
	font-weight: bold;
	padding: 16px
}

div.internal-title {
	color: #fff;
	display: block;
	font-size: 200%;
	line-height: 1.26em;
	margin: 10px 20px
}

div.internal-title a {
	color: #fff;
	text-decoration: none
}

/* TESTIMONIALS */
div.testimonials p {
	font-size: 80%;
	font-style: italic;
}

div.testimonials a, div.testimonials strong {
	font-size: 86%;
	font-weight:normal;
	margin-left: 10px
}

/* CATEGORY PAGES */
div.cat-block {
	border-bottom: solid 6px #d50f25;
	display: block;
	margin-bottom: 10px;
	max-width: 100%;
}

div.cat-block p { margin: 30px auto }

h2.articles {
	display: block;
	font-size: 220%;
	font-weight: bold;
	line-height: 1.3em;
	margin: 10px auto;
	text-align: center;
	width: 100%
	}

h2.articles a, a.moretag {
	color: #d50f25;
	text-decoration: none
}

nav.cat {
	display: block;
	font-size: 66%;
	line-height: 1.2em;
	margin: 16px 0;
	width: 100%
}

nav.cat span {
	display: inline-block;
	width: 49.9%
}

nav.cat span.right {
	text-align: right
}

a.fbook-mess-button {
	background: #448aff;
	color: #fff;
	display: block;
	font-size: 50%;
	padding: 6px;
	width: 180px
}

div.hp-one-block a.fbook-mess-button {
	font-size: 30%;
	padding: 0 0 0 10px;
	width: 190px
}

a.fbook-mess-button img {
	display: inline-block!important;
	float: left;
	height: 16px;
	margin: 6px;
	margin-bottom: 0;
	width: 16px
}


p > a.fbook-mess-button {
	display: block;
	margin: 20px auto 0 auto;
	text-align: center;
	width: 100%
}

div.hp-one-block a.fbook-mess-button img {
	float: none;
	margin: 0; 
	margin-right: 6px
}

/* -- SITEMAP -- */
.sitemap.left, .sitemap.right {
	display: inline-block;
	list-style: none;
	max-width: 47%
}

ul.sitemap.left, ul.sitemap.right { margin-left: 0 }

/* FOOTER */
span.authorship {
	display: block;
	font-size: 76%;
	padding-right: 20px;
	text-align: right;
	width: 100%
}

footer.fixed {
	bottom: 0;
	position: fixed;
	z-index: 666
}

footer {
	background: #fff;
	display: block;
	font-size: 80%;
	max-width: 100%;
	min-width: 100%;
	padding: 6px;
	text-align: center
}

/* PRINT */
@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}

div#hangout-block {
	float: right!important;
	position: relative!important;
}


p a.tweet-it { font-size: inherit }

a.tweet-it {
	background: #f5f5f5;
	font-size: 126%;
	text-decoration: none
}

a.tweet-it::after{
	color: #55acee;
	content: "\f301";
	display: inline-block;
	font-family:dashicons;
	font-size: 86%
}