/*!
Theme Name: SoundEars
**/

/*--------------------------------------------------------------
>>> MASTER.CSS TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 General
	1.1 Typography
	1.2 Section Titles
2.0 Header
	2.1 Navigation
3.0 Pages
	3.1 Homepage
	3.2 Services
	3.3 About
4.0 Footer
	4.1 Gallery
	4.2 Services
	4.3 Footer General
5.0	Gravity Forms
6.0 Blog
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 General
--------------------------------------------------------------*/

.custom-logo-link img {
	width:300px!important;
}
.no-results {
	min-height: 400px;
}
.col-full {
	max-width: 1220px;
	width: 100%;
	padding-left: 4%;
	padding-right: 4%;
	margin: 0 auto;
}
.col-wide {
	width: 100%;
	padding-left: 4%;
	padding-right: 4%;
	margin: 0 auto;
}

@media screen and (min-width: 1000px) {
	.col-full {
		padding-left: 4%;
		padding-right: 4%;
	}
}

.owl-carousel {
	z-index: 0!important;
}

/*--------------------------------------------------------------
1.1 Typography
--------------------------------------------------------------*/

/** Collapse-o-matic **/

.collapseomatic_excerpt,
.collapseomatic_content {
	margin-left: 0;
}

.collapseomatic {
    background-image: url('../images/down-arrow.svg') !important;
    background-position-y: 5px;
}
.colomat-close {
    background-image: url('../images/up-arrow.svg') !important;
    background-position-y: 5px;
}
.collapseomatic_content p:first-of-type {
	margin-top: 20px;
}

/** Blockquote **/

blockquote:before {
	color: #ccc;
	content: '“';
	font-size: 4rem;
	line-height: 0.1em;
	margin-right: 10px;
	vertical-align: -30px;
}
blockquote p {
	display: inline;
}
figure.quote {
	margin: 0;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 20px;
	margin-bottom: 50px;
}
figure.quote figcaption,
figure.quote blockquote {
	margin: 1em;
}

@media screen and (min-width: 769px) {

	figure.quote img {
		float: right;
		margin-left: 20px;
	}
}

/*--------------------------------------------------------------
2.0 Header
--------------------------------------------------------------*/

#masthead_home {
	border-bottom: 10px solid #eee;
	padding: 10px 4%;
	display: table;
	width: 100%;
	position: relative;
	z-index: 1;
}
#masthead {
	border-bottom: 10px solid #eee;
	padding: 10px 4%;
	display: table;
	width: 100%;
	position: relative;
	z-index: 1;
}
.site-branding {
	float: left;
	width: 45%;
}
.site-branding img,
.custom-logo-link {
	display: block;
}
a.head-tel {
	float: left;
	color: #006699;
	text-decoration: none;
}
a.head-tel:hover {
	color: #aa0e4a;
}
a.head-tel:before {
	content: "";
	display: inline-block;
	position: relative;
	top: 3px;
	width: 17px;
	height: 19px;
	background: url('../images/phone-icon.svg') no-repeat;
	background-position: center center;
}
.homeicon svg {
	position: relative;
	top: 3px;
	fill: #222;
}

@media screen and (min-width: 768px) {

	.site-branding {
		max-width: 280px;
		margin-top: 12px;
		float: left;
	}
	a.head-tel {
		float: right;
	}
	a.head-tel span {
		margin-left: 5px;
		font-size: 1.1rem;
		font-weight: 600;
	}
}

@media screen and (max-width: 768px) {

	a.head-tel span {
		display: none;
	}
	a.head-tel {
		margin: 13px 0 0 30%;
	}
	a.head-tel:before {
		position: relative;
		top: -2px;
		width: 25px;
		height: 25px;
		background: url('../images/phone-icon.svg') no-repeat;
		background-position: center center;
		background-size: 25px 25px;
	}
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
	.site-branding {
		width: 25%;
	}
	a.head-tel {
  		display: none;
	}
}

.slider-caption {
	border-left: 3px solid #159a61;
}

/*--------------------------------------------------------------
2.1 Navigation
--------------------------------------------------------------*/

.primary-navigation {
	float: right;
}
#menu-soundears-main-menu {
	display: inline-block;
	float: left;
}

@media screen and (min-width: 768px) {

	.soundears-primary-navigation {
		float: right;
	}
	.home-link span {
		display: none;
	}
}

/*--------------------------------------------------------------
3.0 Pages
--------------------------------------------------------------*/

.entry-header,
.page-header {
	margin: 20px 0;
}
.entry-header_single {
	margin: 20px 0 0 0;
}
.entry-content {
	padding-bottom: 0;
	margin-bottom: 35px;
}
@media screen and (min-width: 768px) {
	.entry-header,
	.page-header {
		margin: 50px 0 50px 0;
	}
	.entry-header_single {
		margin: 50px 0 0 0;
	}
	
	.entry-content {
		margin-bottom: 75px;
	}
	.side-rule {
		padding-left: 5%;
	    border-left: 1px solid #ccc;
	}
}
.home .entry-header {
	margin: 0 0;
}

/** Page Columns **/

.ds-2col-stacked,
.ds-2col {
	overflow: hidden;
}
#testing-gallery img {
	float: left;
	padding: 3px;
	margin-right: 10px;
	margin-bottom: 10px;
	width: 125px;
	height: auto;
	border: 1px solid #dddddd;
}
.node-container .field-name-field-container-images img {
    float: left;
    padding: 3px;
    margin-right: 10px;
    margin-bottom: 10px;
    width: 125px;
    height: auto;
    border: 1px solid #dddddd;
}

@media screen and (min-width: 768px) {
	.ds-2col-stacked .group-left,
	.ds-2col .group-left {
		float: left;
		width: 46%;
		margin-right: 2%;
	}
	.ds-2col-stacked .group-right,
	.ds-2col .group-right {
		float: left;
		width: 52%;
	}
}

/*--------------------------------------------------------------
3.1 Homepage
--------------------------------------------------------------*/

.hero_wrap {
	background-color: #eee;
	padding-bottom: 20px;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.hero_wrap img {
	display: block;
}
.hero_text {
	display: block;
	position: absolute;
	top: 5%;
	left: 0;
	width: 100%;
	transform: translate(0, -5%);
}
.hero_text h2 {
	text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
	color: #fff;
	padding: 10px 20px;
	margin-bottom: 0;
	font-size: 1.4rem;
	text-transform: uppercase;
	line-height: 1.0;
	display: table;
	width: 100%;
}
.hero_text p {
	text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
	color: #fff;
	padding: 10px 20px;
	font-size: 1.0rem;
	line-height: 1.0;
	display: table;
	text-align: center;
	margin: 0 auto 0 auto;
}
.hero_text .herobutton {
	display: table;
	text-align: center;
	margin: 10px auto 0 auto;
}

#welcome_block {
	background-color: #fff;
	max-width: 1220px;
	width: 100%;
	padding-top: 40px;
	padding-left: 4%;
	padding-bottom: 30px;
	padding-right: 4%;
	margin: 0 auto 0 auto;
	z-index: 2;
	position: relative;
	top: 0;
}

.home-content {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: normal;
	align-items: normal;
	align-content: normal;
	column-gap: 4%;
}
.home-content header {
	display: block;
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: 20%;
	align-self: auto;
	order: 0;
}
.home-content section {
	display: block;
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: 76%;
	align-self: auto;
	order: 0;
}
.home-content .welcome-header h1 {
	margin: 0 0 25px 0;
}
@media screen and (min-width: 768px) {
	.hero_wrap {
		padding-bottom: 0;
	}
	#welcome_block {
		top: -100px;
	}
	.hero_text {
		display: block;
		position: absolute;
		top: 30%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	
	.hero_text h2 {
		padding: 10px 20px;
		margin-bottom: 0;
		font-size: 2.5rem;
	}
	.hero_text p {
		padding: 10px 20px;
		font-size: 1.4rem;
		margin: 0 auto 20px auto;
	}
	.hero_text .herobutton {
		margin: 30px auto 0 auto;
	}
	.home-content {
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: normal;
		align-items: normal;
		align-content: normal;
	}
}

/** Symptons Block **/

.symptons_ticks:where(.wp-block-columns) {
	margin-bottom: 0;
}
@media screen and (max-width: 768px) {
	.symptons_ticks:where(.wp-block-columns.is-layout-flex) {
		gap: 0;
	}
}
.symptons_ticks ul {
	margin-bottom: 10px;
}
.symptons_ticks ul li {
	list-style: none;
	padding: 0;
	margin: 0 0 5px 24px;
}
.symptons_ticks ul li::before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 12px;
	margin-right: 10px;
	margin-left: -26px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' style='enable-background:new 0 0 16 12' viewBox='0 0 16 12'%3E%3Cpath d='M5.9 11.6.4 6.1l1.4-1.4 4.1 4.1L14.2.5l1.4 1.4-9.7 9.7z' style='fill:%23a51941'/%3E%3C/svg%3E");
}


/*--------------------------------------------------------------
3.2 Services
--------------------------------------------------------------*/

.panel1 {
	padding: 20px 2% 0 2%;
	background-color: #f5f5f5;
}

/*--------------------------------------------------------------
3.3 Contact
--------------------------------------------------------------*/

.fc_contact_form #gform_fields_1 p {
	display: none;
}
.fc_contact_form .gform_footer input {
	align-self: flex-start!important;
}


/*--------------------------------------------------------------
4.0 Footer
--------------------------------------------------------------*/

/*--------------------------------------------------------------
4.1 Gallery
--------------------------------------------------------------*/

.home section.fcgallery {
	background-color: #f5f5f5;
	padding: 60px 30px;
}
.home section.fcgallery>div {
	max-width: 1220px;
	width: 100%;
	margin: 0 auto;
}

/*--------------------------------------------------------------
4.2 Services
--------------------------------------------------------------*/

.home section.services {
	background-color: #eee;
	padding: 80px 30px 60px 30px;
}
.home section.services>div {
	max-width: 1220px;
	width: 100%;
	margin: 0 auto;
}
.home section.services .service_blk {
	background-color: #fff;
}
.home section.services .service_blk img {
	display: block;
}
.home section.services .service_blk h2 {
	margin-bottom: 0;
}
.home section.services figure {
	margin: 0;
}
.home section.services .service_blk h2 a{
	display: inline-block;
	width: 100%;
	padding: 15px;
	text-decoration: none;
	line-height: 1.7;
}
.home section.services .service_blk h2 a::after{
	content: "";
	display: inline-block;
	float: right;
	width: 10%;
	background-color: #aa0e4a;
	padding: 10px;
	background-image: url('../images/right-arrow-white.svg');
	background-position: center center;
	background-size: 12px 17px;
	background-repeat: no-repeat;
	height: 40px;
	width: 40px;
}
.home section.services .service_blk h2 a:hover:after{
	background-color: #006699;
}
.home section.services h2.cta_title {
	color: #006699;
	margin-top: 60px;
}
.cta_button a {
	background-color: #aa0e4a;
	color: #fff;
	border-radius: 0;
}

/*--------------------------------------------------------------
4.3 Footer General
--------------------------------------------------------------*/

.site-footer {
	background-color: #ddd;
	padding-top: 40px;
}
.site-footer h3 {
	color: #555;
}
.site-footer a {
	text-decoration: none;
	color: #555;
}
.site-footer a:hover {
	text-decoration: underline;
}

.footer-nav {
	overflow: hidden;
	margin-bottom: 30px;
}
.footer-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.footer-nav li {
	margin-bottom: 5px;
}
.site-footer ul.menu li a,
.site-footer {
	color: #555;
}
.site-footer ul.menu li a:hover {
	text-decoration: underline;
}
.menu-footer-container li {
	float: left;
	margin-right: 4%;
	padding-left: 4%;
	border-left: 1px solid #999;
}
.footer1wrp,
.footer2wrp {
	padding-bottom: 30px;	
}
.footer3wrp {
	padding-top: 20px;
}

@media screen and (min-width: 768px) {
	.menu-footer-container li {
		float: none;
		margin-right: 0;
		padding-left: 0;
		border-left: none;
	}
}

@media screen and (min-width: 768px) {

	.footer1wrp,
	.footer2wrp,
	.footer3wrp {
		width: 30.333%;
		float: left;
		padding-left: 3%;
		padding-top: 0;
		padding-bottom: 0;
		border-left: 1px solid rgba(255, 255, 255, 0.1);
	}
	.footer-nav li {
		padding-right: 5%;
	}
}

/** Footer Comms **/

p.footer_comms a {
	color: #fff;
	font-weight: bold;
}

/** Footer Social **/

.social_follow figure,
.social_follow p {
	margin: 0;
}
.social_follow p {
	line-height: 2.0;
}
.social_footer_ico {
	max-width: 40px;
}

/** Site Info **/

.site-info {
	background-color: #ccc;
	padding: 20px 5%;
}
.site-info p {
	margin: 0 0 10px 0;
}
.site-info {
	font-size: 0.8rem;
	text-align: center;
}
.site-info a,
.site-info a:visited,
.site-info a:hover,
.site-info p,
.site-info {
	color: #555;
	text-decoration: none;
}

/*--------------------------------------------------------------
6.0 Blog
--------------------------------------------------------------*/

.container_news {
	padding: 50px 0;
}

.ps-post-thumb{
	margin-bottom: 50px;
}
.pad-bottom {
	padding-bottom: 50px;
}
.news-archive {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-content: space-around;
	align-items: left;
	margin-bottom: 50px;
}
.post-thumbnail {
    order: 0;
    flex: 0 1 auto;
    align-self: auto;
    flex-basis: 100%;
}
.post-thumbnail a {
	display: block;
	width: 100%;
	float: left;
	margin-bottom: 20px;
}
.post-thumbnail img {
	display: block;
	width: 100%;
	height: auto;
}
.news-summary {
    order: 0;
    flex: 0 1 auto;
    align-self: auto;
	padding-right: 5%;
}

@media screen and (min-width: 768px) {
	.news-archive {
		flex-direction: row;
		margin-bottom: 50px;
		align-items: center;
	}
	.post-thumbnail {
		flex-basis: 30%;
	}
	.news-summary {
		flex-basis: 70%;
		padding-left: 5%;
	}
}


/** Latest projects / blog **/

ul.jpc_posts  {
	max-width: 1780px;
	list-style: none;
	margin: 0 auto;
	padding: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-content: stretch;
	grid-gap: 2%;
	margin-bottom: 20px;
}
ul.jpc_posts>li {
	background-color: #f5f5f5;
	margin-bottom: 20px;
	padding-bottom: 10px;
	order: 0;
	flex: 0 1 auto;
	align-self: auto;
	flex-basis: 49%;
}
.thumb_wrap{
	position: relative;
}
ul.jpc_posts>li a {
	text-decoration: none;
	color: #333;
}
.post-thumbnail img {
	display: block;
}
ul.post_tags {
	display: block;
	clear: both;
	list-style: none;
	padding: 0;
	margin: 0 0 20px 5%;
  	overflow: hidden;
}
ul.post_tags li {
  display: inline-block;
  float: left;
  margin-right: 1px;
  margin-bottom: 1px;
}
ul.post_tags li a {
  font-size: 0.9rem;
  line-height: 1.0;
  background-color: rgba(0, 0, 0, 0.5);
	color: #fff;
	text-transform: uppercase;
	display: block;
	padding: 1px 3px;
}
ul.jpc_posts h3 {
	font-size: 1.4rem;
	line-height: 1.2;
	font-size: 1rem;
}
ul.jpc_posts p.archive_date {
	font-weight: bold;
	padding: 0 0 15px 0;
	font-size: 0.8rem;
	margin: 0;
}
ul.jpc_posts p {
	font-size: 0.9rem;
	line-height: 1.3;
	font-size: .8rem;
}
ul.jpc_posts button {
	font-size: .8rem;
}
ul.jpc_posts h3,
ul.jpc_posts p,
ul.jpc_posts button {
	margin: 0 5px 10px 10px;
}
.home ul.jpc_posts>li:nth-child(3) {
	display: none;
}
.tag_commas:last-child {
  display: none;
}

.entry-meta {
	padding: 20px 0;
	font-size: 0.8rem;
}
.entry-meta a {
	color:#222;
	text-decoration: none;
	font-weight: 500;	
}
@media screen and (min-width: 768px) {
	.home ul.jpc_posts>li:nth-child(4) {
		display: block;
	}
	ul.jpc_posts  {
		grid-gap: 1.3%;
		margin-bottom: 10px;
	}
	ul.jpc_posts>li {
		flex-basis: 24%
	}
	ul.post_tags {
		margin: 0 0 20px 5%;
	}
	ul.post_tags li a {
		font-size: 1rem;
		line-height: 1.7;
		padding: 2px 5px;
	}
	ul.jpc_posts h3 {
		font-size: 1.8rem;
	}
	ul.jpc_posts p {
		font-size: 1.0rem;
		line-height: 1.7;
	}
	ul.jpc_posts button {
		font-size: 1rem;
	}
		ul.jpc_posts h3,
	ul.jpc_posts p,
	ul.jpc_posts button {
		margin: 0 5px 20px 0;
	}
}

.content_archive_tags {
  list-style: none;
  margin: 0;
  padding: 0;
}
.content_archive_tags li a {
  list-style: none;
  margin: 0;
  padding: 0;
}
