:root{
	--main-color: #000;
	--secondary-color: #fff;
	--col-gap: 10px;
	--row-gap: -10px;
	--container: 1260px;
	--box-padding: 20px;
  --header-height: 80px;
  --banner-height: 490px;
	--container-padding: 20px;

    --menu-space: 32px;
    --hero-height: 480px;
    --column-number: 3;
}

@media only screen and (max-width:48em){

	body{
		padding-top: 60px;
	}
	.hide-xs{
		display: none;
	}
	.banner-type-1 .row{
		bottom: -19px !important;
	}
}
@media only screen and (max-width:64em){
	.hide-sm{
		display: none;
	}
}
@media only screen and (max-width:75em){

}
@media only screen and (min-width:48em){
	.hide-xs-up{
		display: none;
	}
.hide-md-up{
		display: none !important;
	}
}
@media only screen and (min-width:75em){

}
/* media queries */
/*
@media screen and (min-width: 1401px), (max-width: 1400px){
  :root{
    --container: 1260px;
		--box-padding: 20px;
    --header-height: 80px;
    --banner-height: 490px;


    --menu-space: 32px;
    --hero-height: 480px;
    --column-number: 3;
  }
}
@media screen and (max-width: 1280px){
  :root{
    --container-gap: 160px;
    --container: calc(100% - var(--container-gap));
    --menu-space: 24px;
  }
}
@media screen and (max-width: 1024px){
  :root{
    --container-gap: 120px;
    --container: calc(100% - var(--container-gap));
    --menu-space: 16px;
    --column-number: 2;
  }
}
@media screen and (max-width: 960px){
  :root{
    --container-gap: 80px;
    --container: calc(100% - var(--container-gap));
  }
  .menu{
    display: none;
  }
}
@media screen and (max-width: 768px){
  :root{
    --container-gap: 48px;
    --container: calc(100% - var(--container-gap));
  }
}
@media screen and (max-width: 480px){
  :root{
    --container-gap: 24px;
    --container: calc(100% - var(--container-gap));
  }
}
@media screen and (max-width: 320px){
  :root{
    --container-gap: 16px;
    --container: calc(100% - var(--container-gap));
  }
}
*/