/*!
Theme Name: eCargo
Theme URI: https://them.es/starter
Author: Nate
Author URI: https://them.es/
Description: 
Version: 2.4.3
Requires at least: 5.0
Tested up to: 5.7
Requires PHP: 7.2
License: GPL version 2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0
Tags: custom-background, custom-colors, featured-images, flexible-header, microformats, post-formats, rtl-language-support, theme-options, translation-ready, accessibility-ready
Text Domain: ecargo
*/

/* Don't overwrite this file. Compile "/assets/main.(less|scss)" to "/assets/css/main.css" */


/* From http://codex.wordpress.org/CSS */
	   
@font-face {
	font-family: metropolis-font;
	src: url('fonts/Metropolis-Regular.otf');
  }
  
  @font-face {
	font-family: metropolis-font;
	src: url('fonts/Metropolis-Bold.otf');
	font-weight: bold;
  }
  
  .green{
	  color: #2C6031;
  }
  
  body{font-family: metropolis-font !important;
  color:#444 !important;}
  
  h4{
	  font-weight: bold !important;
  font-size: 22px !important;
  color: #2C6031;
  text-align: center;
  }
  
  h1{
	  font-weight: bold !important;
  font-size: 30px !important;
  color: #2C6031;
  }
  
  h7{
	  font-size: 20px;
	  font-weight: bold;
	  color: #2C6031;
  }
  .static h1,.static h2,.static h3,.static h4,.static h5.static h6{
	  padding-bottom: 20px;
  }
  .static.container{
	  padding:90px 20px 100px;
  }
  .wpforms-field-container{padding-top: 30px !important;}
  
  .second-row{
	  text-align: center ;
	  padding: 30px 0 0 0;
	  margin-bottom: 30px;
  }
  .second-row .red,.seventh-row .white{
	  margin-top: -1rem;
  }
  
  .second-row h4{padding: 40px 0 10px;}

  .second-row a:hover {
	text-decoration: none;
  }
  
  .top-cols a{
	  color: #2C6031;
  font-size: 13px;
  font-weight: bold;
  }
  .alignnone {
	  margin: 5px 20px 20px 0;
  }
  
  .aligncenter,
  div.aligncenter {
	  display: block;
	  margin: 5px auto 5px auto;
  }
  
  .alignright {
	  float: right;
	  margin: 5px 0 20px 20px;
  }
  
  .alignleft {
	  float: left;
	  margin: 5px 20px 20px 0;
  }
  
  a img.alignright {
	  float: right;
	  margin: 5px 0 20px 20px;
  }
  
  a img.alignnone {
	  margin: 5px 20px 20px 0;
  }
  
  a img.alignleft {
	  float: left;
	  margin: 5px 20px 20px 0;
  }
  
  a img.aligncenter {
	  display: block;
	  margin-left: auto;
	  margin-right: auto
  }
  
  .wp-caption {
	  max-width: 96%; /* Image does not overflow the content area */
	  padding: 5px 3px 10px;
	  text-align: center;
  }
  .wp-caption.alignnone {
	  margin: 5px 20px 20px 0;
  }
  .wp-caption.alignleft {
	  margin: 5px 20px 20px 0;
  }
  .wp-caption.alignright {
	  margin: 5px 0 20px 20px;
  }
  .wp-caption img {
	  border: 0 none;
	  height: auto;
	  margin: 0;
	  max-width: 98.5%;
	  padding: 0;
	  width: auto;
  }
  .wp-caption p.wp-caption-text {
	  font-size: 11px;
	  line-height: 17px;
	  margin: 0;
	  padding: 0 4px 5px;
  }
  
  .gallery-item {
	  display: inline-block;
	  text-align: left;
	  vertical-align: top;
	  width: 50%;
  }
  
  .gallery-item a,
  .gallery-item a:hover,
  .gallery-item a:focus {
	  -webkit-box-shadow: none;
	  box-shadow: none;
	  background: none;
	  display: inline-block;
	  max-width: 100%;
  }
  
  .gallery-item a img {
	  display: block;
	  -webkit-transition: -webkit-filter 0.2s ease-in;
	  transition: -webkit-filter 0.2s ease-in;
	  transition: filter 0.2s ease-in;
	  transition: filter 0.2s ease-in, -webkit-filter 0.2s ease-in;
	  -webkit-backface-visibility: hidden;
	  backface-visibility: hidden;
  }
  
  .gallery-item a:hover img,
  .gallery-item a:focus img {
	  -webkit-filter: opacity(60%);
	  filter: opacity(60%);
  }
  
  .gallery-caption {
	  display: block;
	  text-align: left;
	  padding: 0 10px 0 0;
	  margin-bottom: 0;
  }
  
  .gallery-columns-1 .gallery-item {
	  max-width: 100%;
  }
  
  .gallery-columns-2 .gallery-item {
	  max-width: 50%;
  }
  
  .gallery-columns-3 .gallery-item {
	  max-width: 33%;
  }
  
  .gallery-columns-4 .gallery-item {
	  max-width: 25%;
  }
  
  .gallery-columns-5 .gallery-item {
	  max-width: 20%;
  }
  
  .gallery-columns-6 .gallery-item {
	  max-width: 16.66%;
  }
  
  .gallery-columns-7 .gallery-item {
	  max-width: 14.28%;
  }
  
  .gallery-columns-8 .gallery-item {
	  max-width: 12.5%;
  }
  
  .gallery-columns-9 .gallery-item {
	  max-width: 11.11%;
  }
  
  .gallery-columns-6 .gallery-caption,
  .gallery-columns-7 .gallery-caption,
  .gallery-columns-8 .gallery-caption,
  .gallery-columns-9 .gallery-caption {
	  display: none;
  }
  
  .bypostauthor {
	  font-weight: bold;
  }
  
  /* Text meant only for screen readers. */
  .screen-reader-text {
	  clip: rect(1px, 1px, 1px, 1px);
	  position: absolute !important;
	  height: 1px;
	  width: 1px;
	  overflow: hidden;
  }
  
  .screen-reader-text:focus {
	  background-color: #f1f1f1;
	  border-radius: 3px;
	  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	  clip: auto !important;
	  color: #21759b;
	  display: block;
	  font-size: 14px;
	  font-size: 0.875rem;
	  font-weight: bold;
	  height: auto;
	  left: 5px;
	  line-height: normal;
	  padding: 15px 23px 14px;
	  text-decoration: none;
	  top: 5px;
	  width: auto;
	  z-index: 100000; /* Above WP toolbar. */
  }
  .wpforms-field-large,.wpforms-field-email-secondary,.wpforms-field-email-primary {
	  border-bottom: 1px solid #98C330 !important;
	  border-left:0 !important;
	  border-right:0 !important;
	  border-top: 0 !important;
  }
  
  #wpforms-22-field_16-container .wpforms-field-large,.wpforms-field-select .wpforms-field-large{
	  border-bottom: 0 !important;
  }
  
  .wpforms-field-textarea .wpforms-field-medium{
	  border: 1px solid #98C330 !important;
  
  }
  
  .choices__inner{
	  border:1px solid #98C330 !important;
  }
  
  
  
  #header-above-graphic{
	  background-color:#99be32;
	  padding-top: 50px;
  }
	  #header-graphic{
	  background-image: url('img/headback.png');
	  background-position: bottom center;
	  background-repeat: repeat-x;
	  padding-top: 30px;
	  background-size: 130%;
  }
  @media only screen and (min-width: 1280px) {
		#header-graphic{
			min-height: 560px;
		}
	  }
	  
  
  #header-above-graphic-page{
	  background-position: bottom center;
	  padding-top: 30px;
  }
  @media only screen and (max-width: 680px) {
			 #header-above-graphic,#header-above-graphic-page{
				 padding-top: 30px !important;
			 }
			 #header-above-graphic-page{background-color:#99be32;background-image: none !important;
			 }
			 .row .post-thumbnail img{
				 max-width: 80% !important;
				 margin-top: 20px;
			 }
			 .static.container{
				 padding: 40px 20px 40px !important;
			 }
			 .teamrow{
				 border-top: 1px solid #ccc;
			 }
			 .riderweek,.meetteam{display: none;}
			 .above-content {text-align: center;}
	  .entry-title,.blog h2{margin-top: 30px !important;}
			 .greenbutton{border-radius: 60px !important;}
			 .greenlozenge{
				 width: 50% !important;
				 border-radius: 30px !important;
			 }
			 .fifth-row{
				 padding: 50px 0 !important;
			 }
			 .sixth-row{
				 padding: 40px 0 70px 0 !important;
			 }
			 .navbar-collapse{
				 top: 0 !important;
			  right: -10px !important;
			  width: 250px !important;
			 }
	  }
  @media only screen and (max-width: 600px) {
		 #main .logo img{margin-top: -110px !important;max-width: 150px !important;padding-bottom: 10px;}
  }
  .logo img{max-width: 190px !important;z-index: 50;
  position: relative;}
  @media only screen and (min-width: 680px) {
	  #header-above-graphic-page{
		  min-height: 400px;
	  }
  .page .logo{
	  padding-top: 10px;
	  padding-bottom: 160px;
  }
  }
  .static h4{
	  text-align: left;
  } 
  h6{
	  font-weight: bold !important;
  font-size: 16px !important;
  color: #2C6031;
  text-align: left;
  }
  
  #main{margin-top:0 !important;}
  .ticks td img{max-width: 50px;}
  
	  BODY.home .container{
		  max-width: 960px !important;
	  }
	  .container{
		  max-width: 960px !important;
	  }
  .heroimg img{max-width:700px;}
  @media only screen and (max-width: 970px) {
	  .heroimg img{max-width:100% !important;}
	  .hero .leader{display:none !important;}
		 }
  @media only screen and (min-width: 1280px) {
	  .leader{padding-top: 100px !important;}
  }
  @media only screen and (min-width: 1600px) {
  .logo img{float: right;
	  margin-right:70px;
  }
  }
  .leader{
	  font-weight: bold;
	  font-size: 22px;
	  padding-top: 20px;
	  color: #2C6031;
	  line-height: 1.2;
	  padding-bottom: 60px;
  }
  
  .header-contact{
	  font-weight: bold;
	  color: #2C6031;
	  font-size: 13px;
	  width: 100%;
  text-align: right;
  padding-right: 28px;
  }
  
  
  .red{
	  text-align: center;
  color: #D83031;
  font-size: 18px;
  font-weight: bold;
  }
  
  span.red{
	  text-align: center;
  color: #D83031;
  font-size: 18px;
  }
  
  .white{
	  text-align: center;
  color: #fff;
  font-weight: bold;
  }
  
  .seventh-row .white{
	  font-size: 17px;
  }
  .lightgreen{color:#99be32;}
  .greenbutton{
	  display: block;
	  text-decoration: none;
	  font-size: 18px;
	  font-weight: bold;
	  color:#fff;
	  background-color: #2C6031;
	  border-radius: 80px;
	  border: 10px;
	  width: 100%;
	  max-width: 520px;
	  margin: 40px auto 80px auto;
	  padding: 15px;
	  box-shadow: 4px 13px 16px;
  }
  .greenbutton:hover {
	  text-decoration: none;
	  color: #fff;
	  box-shadow: none;
  }
  .leader .white{
	  color:#fff;
  }
  
  .quoteauthor{
	  font-size: 14px;
	  font-weight: normal;
  }
  
  .above-gradient .content,.two-rows{
	  column-count: 2;
	  column-gap: 80px;
  }
  
  .page .above-gradient {
	  padding: 0px 20px 100px !important;
  }
  
  .above-gradient strong{
	  color: #2C6031;
  }
  
  .above-gradient .span-columns,
  .span-columns {
  	margin-top: 40px;
  	column-span: all;
  }
  
  .greenquote{
	  font-weight: bold;
	  color: #2C6031;
	  margin: 0 auto;
	  text-align: center;
	  font-size: 24px;
	  line-height: 1.2;
	  padding: 50px 0 60px 0;
  }
  .third-row img{
	  width: 100%;
  }
  .third-row .col-md-6{
	  padding-right: 0 !important;
	  padding-left: 0 !important;
  }
  .third-row,.eighth-row{
		  background-image: url('img/map-back.jpg');
			  background-attachment: fixed;
  }
  .imgoval img{
	  max-height: 130px; 
	  min-height: 130px; 
	  border-radius: 100px;
  }
  .imgoval img.faded {
  	border: 4px solid #D83031;
  	opacity: 0.4;
  }
  .map{
	  background-image: url('img/map-back.jpg');
	  background-attachment: fixed;
  
  }
  
  .smalldarkgreenbutton{
	  background: #2F5F32 !important;
	  border: 0 !important;
	  border-radius: 17px !important;
	  padding: 5px 70px !important;
	  color: #fff !important;
	  font-size: 11px !important;
	  margin-top: 12px !important;
  }
  
  .smallgreenbutton{
	  background: #81BD41 ;
	  border: 0;
	  border-radius: 17px;
	  padding: 5px 70px;
	  color: #2C6031;
	  font-size: 11px;
	  margin-top: 12px;
  }
  .ticks tr{border-bottom: 1px solid #99CC33}
  .ticks td{padding: 8px 15px;}
  .ticks img{max-width: 35px !important;}
  .fourth-row{background-color: rgba(255, 255, 255, 0.7);}
  .fourth-row .red,.sixth-row .red,.fifth-row .red{
	  float: left;
	  padding-right: 5px;
  }
  .sixth-row ul, .fifth-row ul, .fourth-row ul{
	  padding: 0; 
	  margin: 0;
	  list-style: none;
  }
  .sixth-row li ,.fourth-row li{
	  padding-bottom:10px;
  }
  .fifth-row ul {
	  padding-left: 1em;
  }
  .fifth-row ul li::before {
	  content: "o"; 
	  color: rgb(207, 46, 46);
	  font-weight: bold;
	  display: inline-block;
	  width: 1em;
	  margin-left: -1em;
  }
  .fourth-row h4{
	  text-align: left;
	  max-width: 90%;
	  padding-bottom: 10px;
	  font-size: 24px !important;
  }
  .fourth-row {
	  padding:80px 0;
  }
  .sixth-row{
	  background-color: rgba(249, 247, 246, 0.8);
	  padding:80px 0 120px 0;
	  margin-top: 0;
  }
  .sixth-row h4{
	  padding: 50px 0;
  }
  .fifth-row .row{
	  border-bottom:1px solid #81BD41;
	  padding: 30px 0;
  }
  .fifth-row  .row:last-child{border:none;}
  .fifth-row {padding:100px 0;}
  .fifth-row{
	  background: rgb(255,255,255);
  background: linear-gradient(0deg, rgba(255,255,255,1) 85%, rgba(242,242,242,1) 98%);
  }
  .gradient {
	  background: rgb(255,255,255);
  background: linear-gradient(0deg, rgba(255,255,255,1) 98%, rgba(242,242,242,1) 100%);
  }
  .seventh-row{
	  background-color: #99be32;
	  padding:80px 0;
	  text-align: center;
	  margin-top: 100px;
  }
  .seventh-row h4{
	  padding-bottom: 40px;
  }
  .seventh-row h5{
	  color:#fff;
	  padding-bottom: 20px;
  }
  
  .eighth-row h3, .eighth-row h4{
	  font-size: 24px !important;
  }
  .seventh-row .greenbutton h5{
	  padding-bottom: 0;
  }
  
  .seventh-row .greenbutton{
	  display: block;
	  text-decoration: none;
	  color: #81BD41;
	  box-shadow: 4px 7px 6px #999;
  }
  .seventh-row h5{
	  color: #fff !important;
  }
  
  .seventh-row-buttons{
	  margin-bottom: -216px;
  }
  .eighth-row{
	  padding-top: 140px;
	  text-align: left;
  }
  .eighth-row h3,.eighth-row h4{
	  text-align: center;
	  padding-bottom: 30px;
  }
  .eighth-row a{
	  color:#2C6031;
  }
  .eighth-row a:hover {
	  color: #2C6031;
	  text-decoration: none;
  }
  .eighth-row h5{
	  color: #2C6031;
  }
  .eighth-row img{
	  margin: 20px 0;
	  height: auto;
  }
  .eighth-row .col-md-3{
	  border-left:1px solid #2C6031;
  }
  .eighth-row{
		  padding-bottom: 50px;
  }
  .seventh-row img{
	  max-width: 60px;
	  margin: 0 auto !important;
	  display: block;
	  padding-bottom: 15px;
  }
  h3{
	  font-weight: bold !important;
	  font-size: 30px !important;
	  color: #2C6031;
	  text-align: center;
	  padding: 0 0 40px 0;
  }
  h5{
	  font-weight: bold !important;
	  font-size: 20px !important;
	  color: #2C6031;
  }
  .hero .row{
	  max-width: 100%;
  }
  .footborder{
	  border-left: 1px solid #fff;
  }
  
  #footer{
	  padding-top: 40px;
	  font-size:14px;
	  background-color: #2F5F32 !important;
	  color:#fff;
  }
  #footer #menu-footer-menu {
	  margin: 0;
	  padding: 0;
	  list-style: none;
  }
  #footer #menu-footer-menu a {
	  color: #fff;
  }
  #footer #menu-footer-menu a:hover {
	color: #fff;
  }
  #footer p {
  	margin: 10px auto;
  }
  #footer .registered-info {
	font-size: 12px;
  }

  .navbar{
	  display: block !important;
  }
  .navbar-toggler{
	  text-align: right;
	  float: right; 
	  border:0 !important;
	  color:#fff!important;
  }
  .navbar-toggler-icon{
	padding: 20px !important;
  }
  .navbar-dark .navbar-toggler-icon{
	  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='32'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important;
  }
  nav#header .holder {
  	position: relative;
  }
  nav#header {
  	position: absolute;
	top: 30px;
	right: 10px;
  }
  .navbar-collapse{
	  float: right;
	  position: relative;
	  top: 60px;
	  opacity: 0.94;
	  right: -50px;
	  width: 300px;
	  text-align: right;
	  z-index: 200;
	  display: block;
	  background-color: #2F5F32;
	  padding: 20px;
	  border-radius: 15px;
  }
  
  #footer h5{
	  color:#fff;
  }
  
  @media only screen and (max-width: 600px) {
	  .two-rows,.above-gradient .content{
		  column-count: 1!important;column-gap: 0 !important;}
		  .entry-content{
			  column-count: 1!important;
		  }
	  
  
  }
  
  @media only screen and (max-width: 970px) {
		#header-graphic{
			background-color: #99be32 !important;
  background-image: none !important;
	  }
  }
  
  @media only screen and (min-width: 970px) {
  
	  .heroimg{
		  width: 100%;
		  max-width:700px !important;
		  margin-top: 30px;
	  }
  }
  .wp-block-separator.is-style-wide{
	  border-color: #98C330;
	  margin-bottom: 40px
  }
  .wp-block-group{
	  display: none;
  }
  
  img{
	  max-width: 100%;
  }
  
  /*static page */
  .white-bg{
	  background-color: #fff;
  }
  .green-bg{
	  background-color: #99be32;
	  padding: 100px 0 80px;
  }
  .green-bg h4{
	  padding-bottom:40px ;
	  font-size: 24px !important;
  }
  .green-bg .video iframe {
  	max-width: 100%;
  }
  .greenlink{
  text-align: center;
  padding-top: 40px;
  }
  .greenlink a{
  font-weight: bold !important;
  font-size: 24px !important;
  color: #2C6031;
  }
  .page-template-page-layout-one .greenbutton{
	  margin: 70px auto -140px auto;
	  box-shadow: 1px 6px 8px rgba(74, 73, 73, 0.52);
  }
  
  .page-template-page-layout-one strong{
	  color: #2C6031;
  }
  .page-template-page-layout-one h3{
	  text-align: left;
	  font-size: 26px !important;
	  padding-bottom: 0 !important;
  }
  .page-template-page-layout-one .quote {
  	margin-top: 40px;  	
  	font-size: 20px;  	
  }
  .teamrow .row{
	  padding-bottom: 30px;
  }
  .teamrow img{
	  border-radius: 100px;
	  margin-bottom: 20px;
	  padding: 10px;
  }
  .green-half{
		  background-image: url('https://e-cargobikes.com/wp-content/themes/ecargo/img/greenhalfback.png');
		  background-position: center;
		  background-repeat: no-repeat;
		  border-bottom: 100px solid #fff;
  }
  .riderweek{
	  padding-top: 0 !important;
	  padding-bottom: 0 !important;
  }
  .riderweek img{
	  border-radius: 200px;
	  min-height: 310px;
	  object-fit: cover;
  }
  .meetteam{
	  background-image: url('https://e-cargobikes.com/wp-content/themes/ecargo/img/row-back-l1.png');
	  background-position: center;
	  background-repeat: no-repeat;
	  color: #2C6031;
  }
  .riderweek .content{
	  padding: 40px 50px 0px;
  font-size: 14px;
  color: #2C6031;
  }
  .riderweek h3{
	  font-size: 23px !important;
  }
  .above-gradient .row{
	  padding: 0 20px !important;
  }
  .oval1 img{
	  border: 4px solid #81BD41;
  }
  .greenlozenge{
	  width: 33%;
  margin: 0 auto 15px auto;
  background-color: #99be32;
  border-radius: 50px;
  color: #fff;
  padding: 8px;
  font-size: 22px;
  text-align: center;
  font-weight: 800;
  }
  .breakingnews{
  text-align: center;
  padding-bottom: 10px;
  font-size: 22px !important;
  color: #2C6031;
  font-weight: bold;
  margin: 70px auto 60px auto;
  }
  .breakingnews a:hover {
	  text-decoration: none;
  }
  .text-splash{
	  font-weight: bold !important;
  font-size: 26px !important;
  color: #2C6031;
  margin-bottom: 20px;
  }
  .sub-lozenge{
	  font-size: 20px;
	  margin-top: 50px;
  }
  .sub-lozenge b,.sub-lozenge bold {
	  color: #2C6031;
  }  
  .above-content{
	  color: #2C6031;
  }
  .card-text::after {
    content: "";
	clear: both;
	display: table;
	}
  .card-body a,.card-body a:hover,.single a, .single a:hover{
	color: #2C6031;
  }
  .card-title{
	text-align: left;
  }
  .entry-meta{
	  border-bottom: 1px solid #81BD41;
  padding-bottom: 30px;
  }
  .entry-content,.meta{
	  font-size: 14px;
  }
  @media only screen and (min-width: 680px) {
	  .post-thumbnail img{
	  float: right;}
  }
  
  .post-thumbnail img{
	  max-width: 400px !important;
  margin-left: 40px !important;}
  .foot-archive ul{
	  list-style: none;
	  width:100%;
	  float: left;
	  padding: 10px 0 0;
	  margin: 0;
  }
  .foot-archive ul li{
	  float:left;
  }
  .foot-archive ul li a{
	  color:#2C6031;
	  border-right: 1px solid #2C6031;
	  padding-right: 5px;
	  margin-right: 5px;
  }
  .foot-archive{
	  margin-bottom: 40px;
	  float: left;
  }

  .next-post{
	text-align: right;
  	width: 100%;
  }
  .previous-post{
	  width: 20%;
  }
  .blog .white-bg{
	  padding: 60px 0;
  }
  #footer .social-icons {
  	margin-right 30px;
  	font-size: 1.6em;
  	color: #ffffff;
  }
  #footer .social-icons a {
  	margin-right: 5px;
  	color: #ffffff;
  }
  #footer .social-icons a:last-of-type {
  	margin-right: 0;
  }
  #footer .social-icons a {
    color: #ffffff;
  }