/*!
Theme Name: ntma
Theme URI: https://ntma-njpa.com/
Author: Philadelphia Delaware Valley Chapter - NTMA
Author URI: https://threebears.com/
Description: NTMA of New Jersey, Philadelphia & NE Pennsylvania is the local chapter of the National Tooling and Machining Association. NJPA Chapter members are the leaders of manufacturing companies that believe in the future of tooling and machining in our region
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: ntma
Tags: NTMA Philadelphia & Delaware Valley, NTMA, Philadelphia Delaware Valley Chapter, ThreeBears, National Tooling & Machining Association, NTMA-NJPA
*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');
@import url('css/base.css');
@import url('css/all.css');
@import url('css/menu.css');
@import url('css/slider.css');
@import url('css/bootstrap.css');
body {
	color: #454545;
	font: 17px/26px 'Roboto', sans-serif;
	font-weight: normal;
	overflow-x: hidden;
}
.hides {
	opacity: 0;
}
.views {
	opacity: 1;
}
a {
	text-decoration: none;
	transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
}
a img {
	border: none;
}
img {
	max-width: 100%;
	height: auto;
}
h1, h2, h3, h4, h5, h6 {
	color: #015697;
	margin-top: 15px;
	margin-bottom: 20px;
	font-weight: 700;
}
h1 {
	font-size: 36px;
	line-height: 45px;
}
h2 {
	font-size: 32px;
	line-height: 45px;
}
h3 {
	font-size: 28px;
	line-height: 35px;
}
h4 {
	font-size: 24px;
	line-height: 32px;
}
h5 {
	font-size: 20px;
	line-height: 32px;
}
h6 {
	font-size: 18px;
	line-height: 28px;
}
header, footer, .content-wrapper, .ntmalogo-section {
	padding: 20px 0px;
}
header, footer {
	background-image: linear-gradient( 75deg, #015697 10%, #015697 50%, #3b77b3 100%);
}
header, footer, .sociallinks ul li a, .footer-col a, .footer-col .title h4, .pageheader .title h1 {
	color: #ffffff
}
.contactinfo ul, .sociallinks ul, .footer-col ul, .widget-area ul, .members ul, .membercontactinfo ul {
	list-style: none;
	padding: 0px;
	margin: 0px;
}
.event-menu ul {
	list-style: none;
}
.event-menu li {
	margin-top: 15px;
}
.event-menu a {
	color: #015697;
	text-decoration: underline;
}
.event-menu a:hover, .event-menu a:focus {
	color: #218BC4;
	text-decoration: none;
}
.logo a, .viewmore a {
	text-decoration: none;
}
.logo, .ntmalogo-section, .title, .viewmore {
	text-transform: uppercase;
}
.logo h1, .col-wrapper .col-wrap h3, .viewmore a {
	color: #ffffff;
}
.logo h1 {
	line-height: 36px;
	font-size: 32px;
	margin: 0px;
	font-weight: 900;
}
.logo strong {
	color: #eeeeee;
	font-size: 20px;
	letter-spacing: 0.2px;
}
.wrapper {
	background: #f6f6f6
}
.col-wrapper .col-wrap, .pageheader, .blog-col .blog-img {
	position: relative;
}
.col-wrapper .col-wrap, .widget-area section, strong.membercatgory, .contact-form {
	margin-bottom: 20px;
}
.col-wrapper .col-wrap h3, .viewmore, .copyright {
	text-align: center;
}
.col-wrapper .col-wrap h3, .pageheader .title {
	position: absolute;
	bottom: 5px;
}
.col-wrapper .col-wrap h3, .pageheader .title h1 {
	font-size: 42px;
	font-weight: 900;
	letter-spacing: 0.5px;
	text-shadow: 0px 0px 10px #000000;
	width: 100%;
}
.viewmore a {
	background: rgb(33,42,108);
	background: linear-gradient(15deg, rgba(33,42,108,1) 12%, rgba(255,255,255,1) 30%, rgba(105,108,170,1) 50%, rgba(255,255,255,1) 75%, rgba(56,90,119,1) 100%);
	display: block;
	padding: 10px 20px;
	font-size: 20px;
	line-height: 28px;
	border-radius: 30px;
	letter-spacing: 0.5px;
	margin-top: 5px;
	font-weight: 900;
	text-shadow: 0px 0px 10px #000000
}
.viewmore a:hover {
	/*background: rgb(1,86,151);
	background: linear-gradient(12deg, rgba(1,86,151,1) 12%, rgba(255,255,255,1) 30%, rgba(1,86,151,1) 50%, rgba(255,255,255,1) 75%, rgba(1,86,151,1) 100%);*/
	background: rgb(146,167,186);
background: linear-gradient(13deg, rgba(146,167,186,1) 12%, rgba(255,255,255,1) 30%, rgba(146,167,186,1) 50%, rgba(251,253,255,1) 75%, rgba(112,134,158,1) 100%);
	color: #ffffff !important
}
.featuredimage, .footer-col, .footer-col .title h4, .memberlogo {
	margin: 15px 0px;
}
.ntmalogo-section .title h4, .footer-col .title h3, .members h4, .memberspecialty h4, .membercontactinfo h4 {
	margin: 10px 0px;
}
.footer-col ul li, .widget-area ul li, .membercontactinfo ul li {
	padding: 2px 0px;
}
.footer-menu ul li ul {
	display: none;
}
.sociallinks ul li {
	margin: 8px 3px 0px 0px;
}
.main-wrapper {
	padding: 50px 0px;
}
.sociallinks ul li {
	font-size: 32px;
	display: inline-block;
}
.contact-form, .memberslits, .members {
	margin-top: 25px;
}
.contact-form, .membercontactinfo {
	background: #f6f6f6;
	padding: 25px;
}
.contact-form textarea {
	height: 165px;
}
.contact-form label span {
	color: red
}
.pageheader {
	background: #000;
	background-image: url(images/banner-img2.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-size: cover;
	padding-bottom: 25%;
}
.wp-block-embed-youtube .wp-block-embed__wrapper, .wp-video {
	width: 100% !important;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0px !important;
	position: relative
}
.wp-block-embed-youtube .wp-block-embed__wrapper iframe, .wp-video video {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100% !important;
	height: 100% !important;
}
.membertable .membertabledetail .membertableheading{
	background: #ededed;
}
.membertable .membertabledetail .membertableheading, .membertable .membertabledetail .membertablecontent{
	padding: 15px;
}
.membertable .membertabledetail .membertableheading h5{
	margin: 0px;
	text-transform: uppercase;
	line-height: 25px;
	color: #454545
}
.membertable .membertabledetail .membertablecontent:nth-child(even){
	background: #f1f1f1
}
.membertable .membertabledetail .membertablecontent h6{
	margin: 0px;
	font-size: 20px;
}
.membertable .membertabledetail .membertablecontent span{
	display: block;
}
.membersearchform .btn{
	height: 50px !important;
	width: 100%;
}
.membersearchform .form-control{
	height: 50px !important;
	padding: 12px 8px;
}
.membersearchform input[type='search']{
	width: 100%;
	box-sizing: border-box;
}
strong.membercatgory{
	font-size: 20px;
	border-bottom: 1px solid #f1f1f1;
	display: block;
	padding-bottom: 10px;
	text-transform: uppercase;
}

/* custom-pagination
----------------------------- */

.custom-pagination {
	width: 100%;
	float: left;
	text-align: center;
	font-weight: 500
}
.custom-pagination span, .custom-pagination a {
	display: inline-block;
	padding: 3px 10px;
	text-decoration:none
}
.custom-pagination a {
	background-color: #121212;
	color: #ffffff;
	border: 1px solid #121212;
}
.custom-pagination a:hover {
	background-color: #015697;
	color: #ffffff;
}
.custom-pagination span.page-num {
	margin-right: 10px;
	padding: 0;
}
.custom-pagination span.dots {
	padding: 0;
	color: gainsboro;
}
.custom-pagination span.current {
	background-color: #015697;
	color: #ffffff;
}
/* Blog 
=================================================== */
.blog-wrapper .blog-col .blog-date {
	position: absolute;
	left: 0px;
	bottom: 0px;
	background: #f1f1f1;
	padding: 5px 15px;
	font-size: 16px;
	color: #121212;
	text-transform: uppercase;
	font-weight: 700;
}
.blog-col .blog-img {
	margin-top: 0px
}
.widget-area section {
	padding: 10px 15px;
	border: 1px solid #f1f1f1;
}
.widget-area section select {
	padding: 10px 15px;
	border: 1px solid #f1f1f1;
	width: 100%;
	margin-bottom: 10px;
}
#comments ol {
	list-style: none
}
#comments {
	padding-top: 15px;
	width: 100%;
	float: left;
}
#comments h2 {
	font-size: 28px;
}
ol.comment-list li .comment-body {
	background: none repeat scroll 0 0 #ffffff;
	padding: 15px;
	border: 1px solid #f1f1f1;
}
#comments footer.comment-meta {
	padding: 0px;
	background: none;
}
#comments footer {
	color: #454545
}
.comment-metadata a, .entry-meta a:hover, .entry-footer a:hover, ol.comment-list li .comment-body .reply a:hover, nav.navigation .nav-links a:hover, ol.comment-list li .comment-body .reply a, .widget-area aside ul li a:hover, nav.navigation .nav-links a:hover, .entry-meta a:hover, .blog-col h3 a:hover, .says a {
	color: #015697;
}
.reply {
	text-align: right !important;
	text-transform: uppercase
}
.comment-content {
	margin: 10px 0px
}
#respond {
	margin-top: 10px;
	float: left;
	width: 100%
}
#respond input, #respond textarea {
	width: 100%;
	padding: 6px 0px;
	text-indent: 10px;
	border: 1px solid #f1f1f1;
}
#respond input[type='checkbox'] {
	margin-right: 5px;
}
#respond input[type='checkbox'], #respond .comment-form-cookies-consent label {
	display: inline-block;
	width: auto !important;
}
#respond .comment-form-cookies-consent {
	margin-top: 15px;
}
#respond input[type='submit'] {
	background: #121212;
	width: auto;
	padding: 12px 15px;
	color: #ffffff;
	font-weight: 700;
	text-indent: 0px;
	border: none;
	margin: 10px 0px;
	font-size: 18px;
	text-transform: uppercase;
}
#respond input[type='submit']:hover {
	background: #015697;
	color: #fff
}
.comment-author .avatar {
	float: left;
	height: 24px;
	margin-right: 0.8em;
	width: 24px;
}
.widget h2.widget-title {
	font-size: 20px;
	line-height: 30px;
	margin: 10px 0px;
}
.widget-area section ul li {
	padding: 8px 0px;
	list-style: none;
	border-bottom: 1px solid #f1f1f1;
	line-height: 25px;
}
.widget-area section ul li:last-child {
	border: none;
}
.widget-area section#search-2 {
	padding: 0px;
	border: none;
}
.widget-area label.screen-reader-text {
	display: none;
}
.entry-content input {
	padding: 3px 10px;
	border: 1px solid #f1f1f1;
}
.entry-content input[type='submit'] {
	background: #015697;
	line-height: 25px;
	border: none;
	color: #fff;
}
#content h3.screen-reader-text {
	line-height: 35px;
	padding: 8px 0px;
}
.tagcloud a {
	background-color: #f1f1f1;
	border-radius: 0 2px 2px 0;
	display: inline-block;
	margin: 5px 4px 5px 10px;
	padding: 2px 10px;
	position: relative;
	text-transform: uppercase;
	color: #585858;
	font-weight: 700;
	letter-spacing: 0.3px;
	transition-duration: 0s
}
.tagcloud a:hover {
	background-color: #39b449;
	color: #fff;
	transition-duration: 0s;
	text-decoration: none;
}
.tagcloud a:before {
	border-bottom: 15px solid transparent;
	border-right: 10px solid #f1f1f1;
	border-top: 15px solid transparent;
	content: "";
	height: 0;
	left: -10px;
	position: absolute;
	top: 0;
	width: 0;
}
.tagcloud a:hover:before {
	border-right-color: #39b449;
	transition-duration: 0s;
}
.tagcloud a:after {
	background-color: #585858;
	border-radius: 50%;
	content: "";
	height: 6px;
	left: -2px;
	position: absolute;
	top: 12px;
	width: 6px;
}
.tagcloud a:hover:after {
	background-color: #fff
}
nav.post-navigation {
	text-align: left;
	letter-spacing: 0px;
}
nav.post-navigation h2.screen-reader-text {
	position: relative !important;
	overflow: visible !important;
	float: left !important;
	width: 100% !important;
	font-size: 25px;
	line-height: 30px;
	height: auto !important;
	margin-bottom: 10px;
}
nav.navigation .nav-links a {
	display: inline-block;
	border: 1px solid #f1f1f1;
	padding: 10px 15px;
	font-weight: 600;
}
nav.navigation .nav-links .nav-previous {
	float: left;
}
nav.navigation .nav-links .nav-next {
	float: right;
}
nav.navigation .nav-links .nav-previous a::before {
	content: "\f060";
	font-family: "Font Awesome 5 Free";
	margin-right: 8px;
	font-size: 15px;
}
nav.navigation .nav-links .nav-next a::after {
	content: "\f061";
	font-family: "Font Awesome 5 Free";
	margin-left: 8px;
	font-size: 15px;
}
.entry-meta {
	clear: both;
	margin-bottom: 15px;
}
.entry-meta a, .entry-footer a {
	color: #585858;
	font-weight: 500
}
.entry-meta > span, .entry-footer span {
	margin-right: 15px;
	line-height: 30px;
	display: inline-block;
}
.entry-meta > span:last-child {
	margin-right: 0;
}
.featured-post:before {
	content: "\f408";
	margin-right: 2px;
	font-family: "Font Awesome 5 Free";
}
.entry-meta .posted-on a:before, .entry-footer .posted-on a:before {
	content: "\f073";
	font-family: "Font Awesome 5 Free";
	margin-right: 6px
}
.comments-link a:before {
	content: "\f086";
	font-family: "Font Awesome 5 Free";
	margin-right: 6px;
	position: relative;
	top: -1px;
}
.entry-meta .author a:before {
	content: "\f007";
	position: relative;
	font-family: "Font Awesome 5 Free";
	top: -1px;
	margin-right: 4px
}
.categories-links a:first-child:before, .entry-footer .cat-links a:first-child:before {
	content: "\f07c";
	font-family: "Font Awesome 5 Free";
	margin-right: 6px
}
.tags-links a:first-child:before, .entry-footer .tags-links a:first-child:before {
	content: "\f02e";
	position: relative;
	font-family: "Font Awesome 5 Free";
	top: 0px;
	margin-right: 6px
}
.edit-link a:before, .blog-meta .edit-link a:before {
	content: "\f044 ";
	font-family: "Font Awesome 5 Free";
	position: relative;
	top: -1px;
	margin-right: 6px
}
.says {
	margin-left: 3px
}
span.edit-link {
	margin-left: 5px
}
.reply a {
	background: #121212;
	padding: 6px 12px;
	font-weight: 700;
	color: #ffffff !important;
}
.reply a:hover {
	background: #015697;
	text-decoration: none;
	color: #fff !important
}
.widget-area #search-2 {
	padding: 0px;
	border: none;
}
.search-box {
	padding: 8px 15px;
	border: 1px solid #f1f1f1;
	width:100%;
	color: #585858;
}
.search-box input, .search-box button {
	border: none;
	float: left;
	padding: 8px 0px;
	background: none;
	width: 80%;
}
.search-box input[type='submit'], .search-box button[type='submit'] {
	width: 25px;
	float: right;
	background: url(images/search-icon.png) no-repeat 0% 50%;
	text-indent: -9999px
}
.blog-col .viewmore a {
	margin: 5px 0px !important;
	float: right;
	padding: 4px 15px;
	font-size: 15px;
    line-height: 24px;
}
.search-results .blog-col .viewmore a {
    float: left;
}
 @media all and (max-width: 1200px) {
body {
	font-size: 16px;
	line-height: 24px;
}
#cssmenu .menu-header-menu-container>ul>li>a {
	margin-right: 15px;
}
.ntmalogo-section .title h4 {
	font-size: 20px;
	line-height: 25px;
	margin: 0px;
}
.col-wrapper .col-wrap h3 {
	font-size: 32px;
}
.contact-form, .content-wrapper .viewmore {
	margin-top: 20px;
}
.logo{
    width: 75%
}	 
}
 @media all and (max-width: 992px) {
.ntmalogo-section .title h4 {
	font-size: 18px;
	line-height: 22px;
	margin: 0px;
}
.col-wrapper .col-wrap h3 {
	font-size: 26px;
	line-height: 45px;
	margin: 10px 0px;
}
.content-wrapper h3 {
	font-size: 24px;
	line-height: 30px;
}
.pageheader {
	padding-bottom: 27.5%;
}
.pageheader .title h1 {
	font-size: 36px;
	margin: 10px 0px;
}
.membercontactinfo{
	margin-top: 20px;
	padding: 15px;
}
}
 @media all and (max-width: 767px) {
.logo {
	width: 400px;
}
.logo h1 {
	line-height: 28px;
	font-size: 24px;
	letter-spacing: 0.2px;
}
.logo strong {
	font-size: 15px;
	letter-spacing: 0.2px;
}
.col-wrapper .col-wrap {
	position: relative;
	margin: 20px 0px;
}
.col-wrapper .col-wrap h3 {
	font-size: 36px;
}
.content-wrapper .viewmore, .ntmalogo-section .ntma-logo {
	margin-top: 0px;
	margin-bottom: 20px;
}
.ntmalogo-section .title h4 {
	font-size: 20px;
	line-height: 25px;
	margin: 0px;
}
.membertable {
	overflow-x:scroll;
	overflow-y:hidden
}
.membertable .membertabledetail {
	width:825px
}
.membertable .membertabledetail .col-sm-4{
	flex: 0 0 33.333333%;
    max-width: 33.333333%;	 
}
}
 @media all and (max-width: 575px) {
.logo {
	width: 100%;
	text-align: center;
	margin-bottom: 15px;
}
.logo h1 {
	line-height: 32px;
	font-size: 26px;
	letter-spacing: 0px;
}
.logo strong {
	font-size: 18px;
	letter-spacing: 0px;
}
#cssmenu .menu-header-menu-container {
	margin-top: 15px;
}
#cssmenu .menu-header-menu-container #menu-button, #cssmenu .menu-header-menu-container .menu-opened {
	top: 0px !important;
	width: 100%;
	position: relative;
}
.content-wrapper h1, .col-wrapper .col-wrap h3 {
	font-size: 30px;
	line-height: 40px;
}
.pageheader {
	padding-bottom: 32%;
}
.pageheader .title h1 {
	font-size: 32px;
}
.contact-form {
	padding: 15px;
}
.blog-wrapper .blog-col .blog-date {
	font-size: 15px;
	padding: 3px 10px;
	bottom: 0px;
}
.pageheader .title h1 {
    font-size: 26px;
    line-height: 30px;
}
}
 @media all and (max-width: 400px) {
.logo h1 {
	line-height: 30px;
	font-size: 24px;
}
.logo strong {
	font-size: 18px;
	line-height: 26px;
}
}
 @media all and (max-width: 380px) {
/*.logo h1, .logo strong {
	font-size: 22px;
	line-height: 28px;
}*/
.logo h1 {
	line-height: 25px;
	font-size: 20px;
}
.logo strong {
	font-size: 18px;
	line-height: 22px;
}	 
.pageheader {
	padding-bottom: 35%;
}
.pageheader .title h1 {
	font-size: 24px;
	line-height: 28px;
}
}