:root {
	--spacer: 1.5rem;
}
.banner{
/*	background-image: url('/sell/_images/why_files/Banner-header-1.jpg'); */
	height: 450px;
}
i.fa-green {
  color: var(--green-primary);
}
.bg-light-green {
	background-color: var(--green-light);
}
.bg-light{
	background-color: var(--grey-tetradic);
}
.py-2{
	padding-left: calc(var(--spacer) * .5);
	padding-right: calc(var(--spacer) * .5);
}
.pt-5{
	padding-top: calc(var(--spacer) * 3);
}
.pt-4{
	padding-top: calc(var(--spacer) * 1.5);
}
.pt-3{
	padding-top: calc(var(--spacer));
}
.pt-2{
	padding-top: calc(var(--spacer) * .5);
}
.pt-1{
	padding-top: calc(var(--spacer) * .25);
}
.pt-0{
	padding-top: calc(var(--spacer) * 0);
}
.p-5{
	padding: calc(var(--spacer) * 3);
}
.p-4{
	padding: calc(var(--spacer) * 1.5);
}
.p-3{
	padding: calc(var(--spacer));
}
.p-2{
	padding: calc(var(--spacer) * .5);
}
.p-1{
	padding: calc(var(--spacer) * .25);
}
.p-0{
	padding: calc(var(--spacer) * 0);
}
/*
.mb-2{
	margin-bottom: calc(var(--spacer) * .5);
}
.mb-3{
	margin-bottom: calc(var(--spacer));
}
*/
.mt-3{
	margin-top: calc(var(--spacer));
}
.mb-2 { margin-bottom: calc(var(--spacer) * .5) !important; }
.mb-3 { margin-bottom: calc(var(--spacer)) !important; }
.mb-4 { margin-bottom: calc(var(--spacer) * 1.5) !important; }
.my-2 { margin: 10px 0 !important; }
.my-3 { margin: 15px 0 !important; }
.my-4 { margin: 25px 0 !important; }
.my-5 { margin: calc(var(--spacer) * 3) 0 !important; }
.mx-5 { margin: 0 calc(var(--spacer) * 3) !important; }
.mx-5-5 { margin: 0 calc(var(--spacer) * 4) !important; }
.mt-3 { margin-top: 15px !important; }
.px-4 { 
	padding-left: calc(var(--spacer) * 1.5) !important; 
	padding-right: calc(var(--spacer) * 1.5) !important; 
}
.py-2 { padding: 10px 0 !important; }
.py-3 { padding: 15px 0 !important; }
.py-5 { padding: calc(var(--spacer) * 3) 0 !important; }
.pt-5 { padding-top: 30px!important; }

.my-auto {
  margin-top: auto;
  margin-bottom: auto;
}
.my-auto{
	display: block;
	margin: auto;
}
.hero-header{
	display: table-cell;
	height: 450px;
/*	width: 1000px;*/
	vertical-align: middle;
	text-align: center;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('/sell/_images/overview_files/sales-bg.jpg');
}

.hero-header p {
  color: var(--green-primary);
}
.banner-text {
/*
  max-width: 45%;
  margin: 0 auto;
*/
}

.img-devices {
  max-height: 440px;
  width: auto;
}

.img-responsive{
	max-height: 313px;
	max-width: 350px;
	
}
.reviews{
	display: block; 
	height: 200px;
}
@media screen and (min-width: 300px){
	.card-img-overlay{
		margin-top: 15%;
	}
	.reviews{
		display: block; 
		height: 390px;
	}
	.hero-header{
		padding-top: 10px;
		text-align: center;
	}
}
@media screen and (min-width: 600px){
	.card-img-overlay{
		margin-top: auto;
	}
	.ready-sign-up{
		margin-top: 0px;
	}
	.reviews{
		display: block; 
		height: 200px;
	}
	
}

@media screen and (max-width: 800px) {
	.img-responsive{
		max-width: 100%;
	}
}
@media (max-width: 767px) {

  .banner-text {
/*    max-width: 75%;*/
    margin: 0 auto;
  }
  .img-devices {
    max-height: 520px;
    width: auto;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
	.img-devices {
	  max-height: 560px;
	  width: auto;
	}
}

@media screen and (min-width: 992px) { 
	.img-devices {
	  max-height: 450px;
	  width: auto;
	}
	.banner-text {
/*	  max-width: 60%;*/
	  margin: 0 auto;
	}
	.hero-header{
		display: block;
		align-content: center;
	}
	.vcenter-md {
		display: table;
		width: 100%;
	}

	.vcenter-md > [class*="col-"] {
		display: table-cell;
		float: none;
		vertical-align: middle;
	}
}

@media (min-width: 1200px) {
	.img-devices {
	  max-height: 500px;
	  width: auto;
	}
}
.partner-logos img.partner-logo {
  max-width: 120px;
  margin: 10px auto;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.card-img-overlay{
	text-align: center;
}
/*
@media screen and (min-width: 770px){
	.card-img-overlay{
		margin-top: 15%;
	}
}
*/



.btn-green{
	background-color: var(--green-primary); 
	color: var(--white);
}
.btn-green:hover{
	background-color: var(--green-lighter); 
	color: var(--green-primary);
}

.step-number {
	display: inline-block;
	background: var(--green-primary);
	color: var(--white);
	border-radius: 50%;
	width: 28px;
	height: 28px;
	line-height: 28px;
	text-align: center;
	font-weight: bold;
	margin-right: 8px;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */

/*
 .btn-bolder {
  background: var(--green-primary);
  padding: 10px 20px;
  color: var(--white);
  font-size: 18px !important;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  display: block;
  border-radius: 4px;
  width: 260px;
}

.btn-grey {
  background: var(--grey-tetradic);
  padding: 10px 20px;
  color: var(--grey-secondary);
  font-size: 15px;
  border-radius: 4px;
  display: inline-block;
}

.btn-grey:hover {
 color: var(--grey-secondary);
  background: var(--grey-tertiary);
}

.btn-grey-outline {
  background: transparent;
  padding: 10px 20px;
  color: var(--grey-secondary);
  font-size: 15px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  display: block;
  border-radius: 4px;
  border: 1px solid var(--grey-secondary);
  width: 220px;
}

.btn-green {
  background: var(--green-primary);
  padding: 10px 20px;
  color: var(--white);
  font-size: 15px;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  display: block;
  border-radius: 4px;
  width: 220px;
}

.btn-bolder:hover,
.btn-bolder:focus,
.btn-green:hover,
.btn-green:focus {
  background: var(--green-darker);
  color: var(--white);
}

 Alignment modifiers 
.btn-left {
  margin-left: 0;
  margin-right: auto;
}

.btn-center {
  margin-left: auto;
  margin-right: auto;
}*/
