/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
/* Cromison #df0a34   black #313131  */    
body {
  font-family: 'sk-modernistregular';
  color: #313131;
  font-size:16px;
  line-height:1.4;
}


a {
  color: #313131;
  text-decoration: none;
}

a:hover {
  color: #df0a34;
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'sk-modernistregular';
  font-weight: 500;
}
.btn-primary {
  background-color: #df0a34;
  border-color:  #df0a34;
  padding:0.25rem 2.5rem;
  border-radius:0 !important;
}
.btn-primary:hover {
  background-color: #a4a2a2;
  border-color:  #a4a2a2;
}
.bg-grey{
  background-color: #4d4f4e;
}
h1 {
	font-size:2.5rem;
}
h2 {
	font-size:1.5rem;
}
h3 {
	font-size:1.25rem;
}
h4 {
	font-size:18px;
}
h5 {
	font-size:18px;
}
h6 {
	font-size:16px;
}

html {
    font-size: 100%;
  }
.fs-48{
	 font-size:3rem;
 }
.fw-600{
	font-weight:600;
}

.form-group input, .form-group textarea{
	padding:10px 15px;
	width: 100%;
	box-shadow: none;
    font-size: 14px;
    border-radius: 4px;display: block;
    font-weight: 400;
    line-height: 1.5;background-clip: padding-box;border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
	margin-bottom:25px;
	}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{ /* Chrome/Opera/Safari */
  font-size:13px;
}
input::-moz-placeholder, textarea::-moz-placeholder{ /* Firefox 19+ */
  font-size:13px;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder { /* IE 10+ */
  font-size:13px
}
input:-moz-placeholder,  textarea:-moz-placeholder{ /* Firefox 18- */
  font-size:13px;
}
.bg-green{background:#2ab999;}
.bg-cromison{background:#df0a34;}
.our-locations .location-item{ -moz-box-shadow: 0px 0px 4px 3px rgba(231, 231, 231, 0.5);
    -webkit-box-shadow: 0px 0px 4px 3px rgba(231, 231, 231, 0.5);
    box-shadow: 0px 0px 4px 3px rgba(231, 231, 231, 0.5);}
.location-item{padding:0.65rem;}
.location-item p{font-size:14px;line-height:1.2;}
.map iframe{width:100% !important;}
.breadcrumb-item+.breadcrumb-item::before{content:">" !important;}
.fs-30{font-size:1.9rem;}
.success{font-weight:bold;padding:0.25rem;color:#3fc0a2;}




@media only screen and (max-width: 1024px) {
  html {
    font-size: 82.5%;
  }
}
@media only screen and (max-width: 991px) {
  html {
    font-size: 77.5%;
  }
  .our-locations h2 > br{display:none;}
}
@media only screen and (max-width: 767px) {
  html {
    font-size: 62.5%;
  }
  /* equal height  */
  .eq, .eq-1, .eq-2, .eq-3, .eq-4, .eq-5{
    height:auto;
  }
}

@media only screen and (min-width: 992px) {
/*.product-bg{background:url('../img/product-bg.jpg');background-size:cover;background-position:center center;background-repeat:no-repeat;}*/

.product-bg{
    position: relative;
    background: hsla(300, 100%, 90%, 0.1);
    overflow: hidden;
    &::before {
        background-image: url(../img/product-bg.jpg);
        background-size: cover;
        background-size: cover !important;
        -webkit-background-size: cover !important;
        background-repeat: repeat repeat !important;
        background-attachment: scroll !important;//"fixed" is the desired effect, but mobile browsers find it too "expensive" and disabled it, so use "scroll"
        background-position: 30% 50%;
        @media(min-width: $screen-sm-min){
            background-attachment: fixed !important;
            background-position: 30% 20%;
            will-change: transform;
        }//768
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0.1;
    }
}
  
