/*!
Theme Name: LOOK
Theme URI: https://thoughtandfound.co/
Author: Thought & Found
Author URI: https://thoughtandfound.co/
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
Text Domain: look
*/

@media screen and (min-width: 0) {
/*–––––––––––––––––––––––––––––
GLOBALS
–––––––––––––––––––––––––––––*/
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

.desktop {
	display: none;
}

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

body {
	margin: 10px;
}

body, h1, h2, p, a {
	text-transform: uppercase;
	font-size: 11px;
	font-family: 'letter-gothic-std', 'letter-gothic', 'Letter Gothic', monospace;
	color: black;
	text-decoration: none;
	font-weight: normal;
	-webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

strong {
	font-weight: normal;
	text-decoration: underline;
}

a {
	text-decoration: none;
}

*:focus {
  outline: 0 ! important;
}

h1, h2 {
	margin-bottom: 0;
}

.el {
	opacity: 0;
}
	
.site-branding, div, nav, footer {
	transition: opacity linear 700ms;
}
/*–––––––––––––––––––––––––––––
HEADER
–––––––––––––––––––––––––––––*/
.h-col.smile img {
	width: 22px;
	position: fixed;
	left: 10px;
	top: 10px;
}

header#masthead {
	position: fixed;
  top: 0px;
  left: 9px;
	right: 9px;
  background: white;
	padding-top: 10px;
	padding-bottom: 20px;
}

#site-navigation {
	text-align: center;
	position: fixed;
	margin: auto;
	left: 0;
	right: 0;
	top: 164px;
	background: white;
	padding-bottom: 10px;
	}

#primary-menu {
	padding: 0;
	margin: auto;
	text-align: center;
}

#primary-menu li {
	list-style: none;
	display: inline-block;
	padding: 0 10px;
}

.filter-block li {
	list-style: none;
	padding: 0;
	margin: 0;
}

.current-menu-item a,
.current-cat a,
.current_page_parent a {
	text-decoration: underline;
}
/*–––––––––––––––––––––––––––––
FRONT PAGE
–––––––––––––––––––––––––––––*/
main {
	margin-top: 177px;
	padding-top: 35px;
}

.f-img:first-child {
	display: none;
}
/*–––––––––––––––––––––––––––––
DEFAULT PAGE
–––––––––––––––––––––––––––––*/
.main-txt p {
	text-transform: none;
	margin: 0;
	text-indent: 40px;
	text-align: left;
}

.client-block {
	margin-top: 40px;
	text-align: left;
	text-align: left;
}

.cl-list {
	padding-left: 40px;
}
/*–––––––––––––––––––––––––––––
INDEX
–––––––––––––––––––––––––––––*/
article {
	text-align: center;
	margin-bottom: 40px;
}

.filter-block {
	text-align: center;
	display: none;
}
/*–––––––––––––––––––––––––––––
SINGLE POST
–––––––––––––––––––––––––––––*/
.vis-container {
	font-size: 0;
	margin-left: -5px;
	margin-right: -5px;
}

.vis-container img {
	margin-bottom: 10px;
}

.i-inner {
	padding: 0 5px;
}

.i-wrap {
	display: inline-block;
}

.i-wrap.half {
	width: 50%;
}

.post-navigation {
  margin-left: -2px;
}

.hyphen {
	padding: 0 10px 0 7px;
}

.a-txt {
	max-width: 210px;
	margin: auto;
}
/*–––––––––––––––––––––––––––––
FOOTER
–––––––––––––––––––––––––––––*/
footer {
	font-size: 0;
	margin-top: 80px;
}

footer div {
	font-size: 11px;
}

footer .site-info {
	text-align: center;
	margin-bottom: 15px;
}

.ph-no {
	width: 50%;
	display: inline-block;
}

.ph-no.desktop {
	display: none;
}

.ph-no.au {
	text-align: right;
}

}

@media screen and (min-width: 568px) {
/*–––––––––––––––––––––––––––––
GLOBALS
–––––––––––––––––––––––––––––*/
.mobile {
	display: none;
}

.desktop {
	display: block;
}

main {
  margin-top: 121px;
	font-size: 0;
}
/*–––––––––––––––––––––––––––––
HEADER
–––––––––––––––––––––––––––––*/
.h-col {
	display: inline-block;
	vertical-align: top;
}

.h-col.smile {
	display: block;
	height: auto;
}

.h-col.smile img {
	height: auto;
}

.h-col.wel {
	float: right;
}

.h-col.xan {
  margin-left: 6%;
}

.h-col.wel, .h-col.xan {
	width: 47%;
}

.h-col img {
	height: auto;
}

#site-navigation {
	background: transparent;
}
/*–––––––––––––––––––––––––––––
FRONT PAGE
–––––––––––––––––––––––––––––*/
.f-img:first-child {
	display: inline-block;
}

.f-img:first-child {
	margin-right: 20%;
}

.f-img {
	display: inline-block;
	width: 40%;
}

.f-img:first-child .f-inner {
	padding-right: 5px;
}

.f-img:nth-child(2) .f-inner {
	padding-left: 5px;
}
/*–––––––––––––––––––––––––––––
DEFAULT PAGE
–––––––––––––––––––––––––––––*/
body.page-template-default .entry-content {
	font-size: 0;
	text-align: left;
}
	
main {
   padding-top: 0;	
}

.main-txt, .client-block {
	width: 40%;
	display: inline-block;
	vertical-align: top;
	font-size: 11px;
}

.main-txt {
	margin-right: 20%;
}

.client-block {
	margin-top: 0;
}
/*–––––––––––––––––––––––––––––
INDEX
–––––––––––––––––––––––––––––*/
.filter-block {
	display: block;
	position: fixed;
	top: 128px;
	left: 0;
	right: 0;
	margin: auto;
	width: 19%;
}

article {
	font-size: 11px;
}

body.blog article, body.archive article {
	width: 40%;
	display: inline-block;
	vertical-align: top;
}

body.blog article:nth-child(2n + 1), body.archive article:nth-child(2n) {
	width: 40%;
	margin-left: 20%;
}
/*–––––––––––––––––––––––––––––
SINGLE POST
–––––––––––––––––––––––––––––*/
.i-wrap {
	width: 40%;
	vertical-align: top;
}

.i-wrap.half {
	width: 20%;
}

.two-wrap > .i-wrap.full:nth-child(2n),
.four-wrap > .i-wrap.half:nth-child(4n - 1) {
		margin-left: 20%;
}

body.single-post .entry-content {
	position: fixed;
	left: 0;
	right: 0;
	top: 128px;
	width: 18%;
	margin: auto;
}
/*–––––––––––––––––––––––––––––
FOOTER
–––––––––––––––––––––––––––––*/
.ph-no.desktop {
	display: inline-block;
}

.ph-no {
	width: 30%;
	margin-bottom: 0;
}

footer .site-info {
	display: inline-block;
	width: 40%;
	margin-bottom: 0;
}

}

@media screen and (min-width: 768px) {
/*–––––––––––––––––––––––––––––
GLOBALS
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
HEADER
–––––––––––––––––––––––––––––*/
#site-navigation {
	position: fixed;
	left: 0;
	right: 0;
	top: 89px;
	margin-top: auto;
}

.h-col.smile img {
	width: 27px;
}
/*–––––––––––––––––––––––––––––
FRONT PAGE
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
DEFAULT PAGE
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
INDEX
–––––––––––––––––––––––––––––*/
body.blog main, body.archive main {
	margin-left: -5px;
	margin-right: -5px;
}

body.blog article, body.blog article:nth-child(2n + 1),
body.archive article, body.archive article:nth-child(2n) {
	width: 20%;
	margin: auto;
	margin-bottom: 60px;
}

body.blog article:nth-child(4n - 1),
body.archive article:nth-child(4n - 2) {
	margin-right: 20%;
}

body.blog article img,
body.archive article img {
	display: block;
	width: 100%;
}

.a-inner {
	padding: 0 5px;
}

/*–––––––––––––––––––––––––––––
SINGLE POST
–––––––––––––––––––––––––––––*/
/*–––––––––––––––––––––––––––––
FOOTER
–––––––––––––––––––––––––––––*/
.site-info {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 10px;
	margin: auto;
}

.ph-no {
	width: 50%;
}

}

@media screen and (min-width: 1024px) {
/*–––––––––––––––––––––––––––––
GLOBALS
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
HEADER
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
FRONT PAGE
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
DEFAULT PAGE
–––––––––––––––––––––––––––––*/
.main-txt {
/* 	column-count: 2;
	column-gap: 10px; */
}
/*–––––––––––––––––––––––––––––
INDEX
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
SINGLE POST
–––––––––––––––––––––––––––––*/
}

@media screen and (min-width: 1025px) {
/*–––––––––––––––––––––––––––––
GLOBALS
–––––––––––––––––––––––––––––*/
body {
	margin: 15px;
}
/*–––––––––––––––––––––––––––––
HEADER
–––––––––––––––––––––––––––––*/
header#masthead {
	padding-top: 15px;
}

.h-col.smile img {
	top: 15px;
	left: 15px;
}
/*–––––––––––––––––––––––––––––
FRONT PAGE
–––––––––––––––––––––––––––––*/
.f-img:first-child .f-inner {
	padding-right: 10px;
}

.f-img:nth-child(2) .f-inner {
	padding-left: 10px;
}
/*–––––––––––––––––––––––––––––
DEFAULT PAGE
–––––––––––––––––––––––––––––*/

/*–––––––––––––––––––––––––––––
INDEX
–––––––––––––––––––––––––––––*/
body.blog main, body.archive main {
	margin-left: -7.5px;
	margin-right: -7.5px;
}

.a-inner {
	padding: 0 7.5px;
}
/*–––––––––––––––––––––––––––––
SINGLE POST
–––––––––––––––––––––––––––––*/
.vis-container {
	margin-left: -7.5px;
	margin-right: -7.5px;
}

.vis-container img {
	margin-bottom: 15px;
}

.i-inner {
  padding: 0 7.5px;
}

/*–––––––––––––––––––––––––––––
FOOTER
–––––––––––––––––––––––––––––*/
.site-info {
	bottom: 15px;
}
}
