/*   
Theme Name:		leethompson.me
Theme URI: 
Description: 	More To The Picture child theme
Version: 		1.1
Template: 		moretothepicture
@author   		moretothepicture
@license 		https://www.opensource.org/licenses/gpl-license.php GPL v2.0 (or later)
@link    	 	https://www.moretothepicture.com
License: 		GNU General Public License v2.0
License URI: 	https://www.gnu.org/licenses/gpl-2.0.html
*/

	@keyframes bounce {
	  from {
		transform: translateY(0px);
	  }
	  to {
		transform: translateY(-15px);
	  }
	}
	@-webkit-keyframes bounce {
	  from {
		transform: translateY(0px);
	  }
	  to {
		transform: translateY(-15px);
	  }
	}
	
	* {font-family: 'Inter', sans-serif;}
	body {color: #333; background: #fefefe; font-size: 17px; line-height: 27px; font-weight: 400;}
	a:link, a:visited {color: #333;}
	a:hover, a:active, .is-active a {color: #cb464a;}
	.page_2 a {color: #fff;}
	body.plain .page_2 a {color: #333;}
	body.plain .page_2 a:hover {color: #cb464a;}

	svg {display: block; width: 100%; height: 100%;}
	.header_icon {background: #f2f2f2; border-radius: 3px; text-align: center; margin-left: 14px; width: 36px; height: 36px;}
	.header_icon a {margin: 0 !important;}
	.header_icon svg, #small_menu_icon svg {display: block !important; width: 20px; height: 20px; margin: 8px auto !important;}
	.header_icon path, .header_icon circle {fill: #394548;}
	.header_icon a:hover path, .header_icon a:hover circle {fill: #394548;}	
	#small_menu_icon path {fill: #394548;}
	#small_menu_icon:hover path  {fill: #394548;}	
	
	.wrap_inner {margin-top: 130px;}
	
	.twelveislands {background: green;}
	.twelveislands .entry-content p {font-family: 'Berkshire Swash'; font-size: 100px; line-height: 100px; color: #fff; letter-spacing: 0; text-align: center;}
	.twelveislands .entry-content p + p{font-size: 30px; line-height: 30px; text-align: center;}
	
	#header {padding: 20px 0; height: 100px; position: fixed; top: 0; left: 0; right: 0; background: #fefefe; overflow: hidden; z-index: 999999;}
	body.admin-bar #header{top: 32px;}
	.m2tp_logo svg {width: 60px; height: 60px; fill: #333;}
	.inner_wrap {max-width: 1200px; margin: 0 auto; position: relative; padding: 0 20px;}

	#nav {text-align: right; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
	#nav ul.primary_menu {max-width: 880px; font-size: 0;}
	#nav ul.primary_menu li {vertical-align: middle; display: inline-block; position: relative; font-size: 15px;}
	#nav ul.primary_menu li.spacer {width: 10px;}
	#nav ul.primary_menu li:hover {z-index: 99999;}
	#nav ul.primary_menu a {margin: 0 0 0 20px; padding: 0 0 5px; text-transform: uppercase; font-size: 15px; border-bottom: 3px solid transparent; font-weight: 600;}
	#nav ul.primary_menu a:hover, #nav ul.primary_menu li.current_page_item > a, #nav ul.primary_menu li.current_page_parent > a, #nav ul.primary_menu li.current-menu-ancestor > a, #nav ul.primary_menu li.current-menu-item > a {border-bottom: 3px solid #cb464a; color: #cb464a;}
	#nav ul.sub-menu {position: absolute; border-radius: 5px; text-align: center; padding: 14px 10px 1px; left: -108px; margin: 0; top: 25px; background-color: #394548; width: 300px; z-index: 999; display: none;}
	#nav li.policy-menu-item ul.sub-menu {width: 600px; left: -240px; text-align: left;}
	#nav ul.sub-menu li {display: block; padding: 0 0 14px; margin: 0;}
	#nav li.policy-menu-item  ul.sub-menu li	{float: left;}
	#nav li.policy-menu-item ul.sub-menu li {width: 50%;}
	#nav ul.sub-menu a {font-size: 14px; color: #fff; border-bottom: 3px solid transparent; padding: 0; margin: 0;}
	#nav ul.sub-menu li.current-page-ancestor  > a , #nav ul.sub-menu a:hover, #nav ul.sub-menu li.current_page_item > a, #nav ul.sub-menu li.current_page_parent > a, #nav ul.sub-menu li.current-menu-ancestor > a {border-bottom: 3px solid #fff;}
	#nav li:hover > ul.sub-menu {display: block;}	
	
	#nav ul.primary_menu li.header_donate a, #wrap input.wpcf7-submit {line-height: 36px; padding: 0 10px; margin-left: 14px; color: #fff; background: #394548; display: block; border: none !important; border-radius: 3px; text-transform: uppercase; font-size: 15px; }
	#nav ul.primary_menu li.header_donate a, #wrap input.wpcf7-submit:hover {background: #333;}
	#nav ul.primary_menu li.header_donate a:hover {background: #394548;}
	#nav li.menu-item-261 ul.sub-menu {width: 200px;}
	
	#small_menu_icon svg {width: 30px; height: 30px;}
	#small_menu_button {position: absolute; right: 20px; top: 50%; transform: translate(0, -50%);}
	#small_menu_page_title_text {display: none;}
	
	ul.small_menu {display: none; z-index: 99999999; position: fixed; top: 0; left: 0; right: 0; height: auto; padding: 20px 0; text-align: center; margin: 0 auto; background: #fff;}
	ul.small_menu ul.sub-menu {display: block; opacity: 0; height: 0; position: static; overflow: hidden; padding: 0; margin: 0 auto; width: 100%;}
	ul.small_menu ul.show_sub.sub-menu {height: auto; opacity: 1; padding: 0 14px 5px 0;}
	ul.small_menu li {padding-right: 40px; list-style-type: none;}
	ul.small_menu li ul li {padding-right: 0;}
	ul.small_menu li ul > li.menu-item-has-children{padding-right: 40px;}
	ul.small_menu li a {display: block; padding: 10px; text-align: center; background: none; width: 100%; text-transform: uppercase; color: #5c5a5f; font-weight: 600; font-size: 16px; letter-spacing: 1px;}
	ul.small_menu > li:last-of-type a {padding: 10px;}
	
	.wpcf7-submit {margin: 0;}
	div.wpcf7 input, div.wpcf7 textarea {max-width: 100%; text-align: left; font-size: 13px;}
	div.wpcf7 input::placeholder {color: #676767;}
	.wpcf7-form-control-wrap {display: inline-block; vertical-align: top; max-width: 100%; width: 100%; margin: 0 0 20px; padding: 0 20px 0 0; border: none; position: relative;}
	div.wpcf7-response-output {padding: 10px 5px; color: #fff; clear: both; font-size: 14px;border: none; margin: 0 20px 20px 0; text-align: center; background: #7d9f5e;}
	div.wpcf7-validation-errors{background: #ff0000;}
	.wpcf7 .wpcf7-not-valid {border: 1px solid #fff;}
	.wpcf7 p {overflow: hidden;}
	span.wpcf7-not-valid-tip {position: absolute; right: 24px; bottom: 2px; text-align: right; font-size: 11px; color: #FF4D4D;}
	.wpcf7-form-control-wrap {display: block;}	
	.wpcf7-display-none, .screen-reader-response {display: none;}
	.wpcf7-form input, .wpcf7-form textarea {border: 1px solid #394548; background: #fefefe;}
	
	body.plain #header {display: none !important;}
	body.plain #wrap {max-width: 910px; padding: 40px 20px; margin: 0 auto;}
	body.plain .wrap_inner {margin: 0 !important;}
	#block_a .date {font-size: 12px;}
	
	#block_a{padding: 100px 0;}
	#block_c {padding: 0 0 100px;}

	.page_down {display: block; height: 50px; cursor: pointer; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
	.page_down_1 {position: absolute; left: 50%; width: 20px; height: 20px; margin: 0 0 0 -10px; border: 4px solid #333; animation: 'bounce 1s 4'; border-width: 0 4px 4px 0; -moz-transform: rotate(45deg) translateZ(1px); -ms-transform: rotate(45deg) translateZ(1px); -webkit-transform: rotate(45deg) translateZ(1px); transform: rotate(45deg) translateZ(1px);}
	.page_down_1::before {content: ''; position: absolute; left: 50%; top: 10px; width: 16px; height: 16px; margin: -12px 0 0 -10px; border: 4px solid #333; border-width: 0 4px 4px 0; animation: 'bounce 1s 4'}	
	
	li {list-style-type: disc;}
	ul {margin-left: 14px;}
	
	.title {font-size: 20px; margin: 30px 0 5px;}
	.main_logo {border-radius: 50%; max-width: 120px;}
	.contact {font-weight: 600;}
	#block_1 {text-align: center;}
	
	.ad_wrap {text-align: right; margin-bottom: 20px;}
	.letter_wrap {max-width: 768px; margin: 0 auto; padding: 30px; line-height: 23px;}
	p, .dear_x {margin: 20px 0;}
	
	.invoice_paid {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 300px; height: 300px; margin: auto; background: url('lib/img/paid_stamp.png') no-repeat 0 0;}
	.post-nav {display: none;}
	.single-invoice ul, .single-invoice p {margin: 0 0 14px;}
	
	h1.entry-title, h1.page-title {margin: 0 0 14px; text-align: center; font-size: 51px; line-height: 61px; letter-spacing: -1px; font-weight: 800;}
	
	h3 {font-size: 21px; font-weight: 600;}
	
	.entry-meta {display: none;}
	
	.page_view.page_1 {display: none;}
	
/* portfolio */	
	#our_portfolio_inner {font-size: 0;}
	.portfolio {width: 33.333%; display: inline-block; font-size: 16px;}
	body.home .portfolio.hentry {max-width: 100%; padding: 0;}
	.portfolio_inner {position: relative; padding-top: 100%; text-align: center;}
	.portfolio_title{font-weight: 600; font-size: 24px; text-transform: uppercase; color: #fff; text-shadow: 1px 1px 1px rgb(34, 34, 34); margin: 0 0 10px;}
	.portfolio_tagline {font-size: 17px; margin: 0;}
	.portfolio_text_wrap, .portfolio_img, .hover_opacity, .map_wrap{position: absolute; top: 0; bottom: 0; left: 0; right: 0; border-radius: 50%;}
	.hover_opacity {background-color: rgba(34, 34, 34, .35);}
	.hover_opacity.brand_removed {background-color: rgba(34, 34, 34, 0)}
	.portfolio:hover .hover_opacity  {background-color: rgba(34, 34, 34, .85);}
	.portfolio_text_wrap {display: flex; align-items: center;}
	.portfolio_text {margin: auto; padding: 20px; max-width: 498px;}
	
	.archive_text {font-size: 20px;}
	
	h2.archive_title  {text-align: center; margin-bottom: 30px;}
	
	.portnav {padding-top: 50px;}
	.portnav .hover_opacity {background: rgba(34,34,34,.2);}
	.port_nav:hover .hover_opacity {background: rgba(34,34,34,.9);}
	.portnav .portfolio_inner {padding-top: 25%; background: #444; min-height: 180px;}
	.portnav .port_nav {width: 50%; display: inline-block; vertical-align: top;}
	.portnav .poostnav_bg {position: relative;}
	.portnav .portfolio_text {max-width: 100%; width: 100%;}
	.portnav .portfolio_title {margin: 0;}
	.portnav .portfolio_nav_txt {font-weight: 800; font-size: 16px; text-transform: uppercase; color: #fff; text-shadow: 1px 1px 1px rgb(34, 34, 34);}
	.port_nav.postnav_next .portfolio_text_wrap {text-align: right;}
	.port_nav.postnav_prev .portfolio_text_wrap {text-align: left;}
	
	body.single-portfolio .portfolio {display: block; width: auto;}
	body.single-portfolio .entry-meta {display: none;}
	#port_slideshow {margin: 50px 0; padding: 30px 30px 79px; background: #f0f0f0; overflow: hidden;}
	
	.port_contact  h3{margin: 0 0 20px;}
	.port_contact {padding: 30px 20px;}
	
	#cookie_policy_inner {color: #333;}
	#cookie_policy_inner a {color: #fff; background: #333; display: inline-block; vertical-align: middle; margin: 0 10px; padding: 0 20px;}
	#cookie_policy_inner a:hover {color: #394548;}	
	
/* CV */ 

	body.page-template-template-cv {font-weight: 600;}
	
/* WOO */

	body.woocomm, body.woocomm #header  {background: #7f54b3;}
	body.woocomm #content {color: #fff; text-align: center;}
	body.woocomm a:link, body.woocomm a:visited {color: #fff;}
		 
	body.woocomm #nav ul.primary_menu a:hover, 
	body.woocomm #nav ul.primary_menu li.current_page_item > a, 
	body.woocomm #nav ul.primary_menu li.current_page_parent > a, 
	body.woocomm #nav ul.primary_menu li.current-menu-ancestor > a, 
	body.woocomm #nav ul.primary_menu li.current-menu-item > a {border-color: #fff; color: #fff;}
	body.woocomm .m2tp_logo svg {fill: #fff;}
	body.woocomm #small_menu_icon path {fill: #fff;}
	body.woocomm ul.small_menu {background: #333;}
	
	.breadcrumbs {font-size: 12px;}
	
	#case_loop {margin-top: 72px;}
	#case_loop .slide_wrap{display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; margin: 0 -25px;}
	.page_gallery {float: left; padding: 0 25px 50px; width: 33.3333%; text-align: center;}
	.page_gallery > .case_link {border: 2px solid #fff; background-color: #fff; -webkit-box-shadow: 0 0 40px rgba(255,255,255,.9); box-shadow: 0 0 40px rgba(255,255,255,.9); display: block; height: 100%; -webkit-transition: -webkit-box-shadow 0.5s; transition: -webkit-box-shadow 0.5s; -o-transition: box-shadow 0.5s; transition: box-shadow 0.5s; transition: box-shadow 0.5s,-webkit-box-shadow 0.5s; position: relative;}
	.img_block {padding-top: 100%; position: relative;}
	.overlay {transition: opacity .5s; opacity: .5; background-color: #000;}
	.case_link:hover .overlay{opacity: 1}
	.team .img_block:hover .overlay{opacity: 0}
	.case_hover {padding: 25px 25px 65px; line-height: 25px; color: #333;}
	.team .case_hover {padding: 25px;}
	.more_info {margin: 20px; position: absolute; bottom: 0; left: 0; right: 0; color: #333; font-weight: 800; letter-spacing: 6px; font-size: 20px;}
	.img_block h2 {text-align: center; position: absolute; top: 50%; left: 0; right: 0; transform: translate(0, -50%); color: #fff; font-size: 36px; letter-spacing: -1px; line-height: 36px;}

	@media only screen and (max-width: 1160px){
		.page_gallery {width: 50%;}
	}	
	
	@media only screen and (max-width: 767px){
		#wrap ul.primary_menu {display: none;}
		#wrap #small_menu_button{display: block;}
		body.no-js #wrap #small_menu_button {display: none;}
		body.no-js ul.small_menu {display: block; position: static;}
		.contact {margin: 0 0 14px; text-align: center;}
		h1.entry-title, h1.page-title {font-size: 32px; line-height: 40px;}
		#block_a{padding: 0 0 50px;}
		
		.page_gallery {width: 100%;}
	}