@font-face {
font-family: 'Averta Regular';
    src: url('fonts/Averta-Regular.woff') format('woff');
    src: local('Averta Regular'), local('Averta Regular'), 
         url(fonts/Averta-Regular.otf) format('opentype');
}

@font-face {
font-family: 'Averta Light';
    src: url('fonts/Averta-Light.woff') format('woff');
    src: local('Averta Light'), local('Averta Light'), 
         url(fonts/Averta-Light.otf) format('opentype');
}

@font-face {
font-family: 'Averta Bold';
    src: url('fonts/Averta-Bold.woff') format('woff');
    src: local('Averta Bold'), local('Averta Regular'), 
         url(fonts/Averta-Bold.otf) format('opentype');
}

@font-face {
  font-family: 'Cheddar';
    src:  url('fonts/CheddarGothicRough-Regular.woff') format('woff');
    src: local('Cheddar'), local('Cheddar'), 
         url(fonts/CheddarGothicRough-Regular.otf) format('opentype');
}

h1 {
    font-family: 'Cheddar', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
    font-size:47px;
    line-height:58px;
}

h2 {
    font-family: 'Cheddar', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
    font-size:36px;
    line-height:56px;
}

h3 {
    font-family: 'Averta Bold', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
    font-size:20px;
    line-height:30px;
}

h5 {
    font-family: 'Averta Bold', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
    font-size:20px;
    line-height:25px;
}

h6 {
    font-family: 'Averta Bold', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
    font-size:14px;
    line-height:20px;
}

h2 span, h3 span {
    color:#0a5788;
}

.heading h2 {
    max-width:800px;
    margin-left:auto;
    margin-right:auto;
}

.custom-text{
    margin-top:15px;
}

.custom-text h2 span{
    color:#B9BB17;
    font-size:50px;
}

.italic{font-style: italic}

.x-large{font-size:94px}

.btn {
    font-family: 'Averta Bold', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
}

.nav-item {
    font-family: 'Averta Bold', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
    letter-spacing:0px;
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,1);
    transition: color .15s ease-in-out,
        background-color .15s ease-in-out,
        border-color .15s ease-in-out,
        box-shadow .15s ease-in-out;
}

.navbar-dark .navbar-nav .nav-link:hover {
    color: rgba(255,255,255,1);
    background:#B9BB17;
    border-radius:4px;
}

.navbar-dark .navbar-toggler {
    color: rgba(255,255,255,.5);
    border-color: rgba(255,255,255,0);
}

@media (min-width: 768px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 1.75rem !important;
        padding-left: 1.75rem !important;
    }
}

body {
    font-family: 'Averta Light', Arial, sans-serif;
    font-weight:normal;
    font-style:normal;
    font-size:15px;
    line-height:20px;
}

p span {
    font-family: 'Averta Regular', Arial, sans-serif;
}

.mr-auto, .mx-auto{
    margin-left: auto!important;
    margin-right:0px !important;
}

.btn-primary, .btn-secondary{
    background:#B9BB17; 
    border:none;
}

.btn-primary:hover, .btn-secondary:hover{
    background:#000;
}

.btn-primary{
    letter-spacing: 0px;
    padding-left:20px;
    padding-right:20px;
}

.btn-secondary{
    letter-spacing: 0px;
    padding-left:20px;
    padding-right:20px;
}

.hero h1, .hero p{
    color:white!important;
    
}

.caption{
    margin-top:200px; 
    margin-bottom:200px;
    text-align:center;
}

.jumbotron{
    background-color:#0E5794
}

.thumb{
    width:100%;
    border-radius:4px;
    margin-bottom:1rem;
}

.blue-section{
    background:#0E5794;
    padding-top:4rem;
    padding-bottom:4rem;
}

.light{
    color:#FFF;
}

.top-padding-sm{padding-top:1rem}
.top-padding{padding-top:2rem}
.top-padding-lg{padding-top:8rem}
.bottom-padding-sm{padding-bottom:1rem}
.bottom-padding{padding-bottom:2rem}
.bottom-padding-lg{padding-bottom:8rem}

.top-padding-1{padding-top:1rem}
.top-padding-2{padding-top:2rem}
.top-padding-3{padding-top:3rem}
.top-padding-4{padding-top:4rem}
.top-padding-5{padding-top:5rem}
.top-padding-6{padding-top:6rem}
.bottom-padding-1{padding-bottom:1rem}
.bottom-padding-2{padding-bottom:2rem}
.bottom-padding-3{padding-bottom:3rem}
.bottom-padding-4{padding-bottom:4rem}
.bottom-padding-5{padding-bottom:5rem}
.bottom-padding-6{padding-bottom:6rem}

.icon{
    padding-bottom:2rem;
}

.center{
    margin:auto;
    text-align:center;
}

.main-logo-2{
    width:60px;
    height:60px;
    display:inline-block;
    background-image: url(../images/two-roots.png);
    background-repeat:no-repeat;
    background-position: top left;
    background-size: 60px 60px;
}

.main-logo-3{
    width:35px;
    height:35px;
    display:inline-block;
    background-image: url(../images/insignia-light.png);
    background-repeat:no-repeat;
    background-position: top left;
    background-size: 35px 35px;
}

.main-logo{
    max-width:60px;
    max-height:60px;
    display:inline-block;
}

.footer-logo{
    width:50px;
    height:50px;
    display:inline-block;
    margin-bottom:1.5rem;
}

.social ul{
    text-align: center;
    padding:0;
    margin:0;
    margin-bottom:20px;
}

.social ul li{
    list-style-type: none;
    display:inline-block;
    padding-left:10px;
    padding-right:10px;
}

.social ul li a{
    opacity: 0.5;
    filter: alpha(opacity=50);
    transition: all .2s ease-in;
}

.social ul li a:hover{
    opacity: 1;
    filter: alpha(opacity=100);
}

.jumbotron{
    border-radius:0;
}

.caption{
    position:absolute;
    top:0px;
    right:70px;
    z-index:1000;
}

.float-right{
    float:right;
}

.navbar-dark .navbar-toggler-icon {
    background-image: url("../images/burger.svg");
    width:18px;
}

.navbar-toggler, .navbar-toggler:active, .navbar-toggler:focus{
    outline:0;
}

.bg-dark{
    background-color:rgba(2,37,62,.5)!important;
}

.footer{
    background:#111;
    padding-top:2rem;
    padding-bottom:0rem;
    letter-spacing:0.5px;
    color:#777;
    font-size:12px;
}

.footer a{
    color:#777;
    transition: all .2s ease-in;
}

.footer a:hover{
    color:#FFF;
    text-decoration: none;
}

.modal-content{background:#333}


/*-----Parallax------*/
.parallax { 
  /* The image used */
  background-image: url("../images/parallax-image.jpg");
  /* Set a specific height */
  height: 450px; 
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.black{color:#111}
.nw-green{color:#8fc942}
.nw-light-green{color:#348674}

/*-----Hero------*/
.hero { 
  /* The image used */
  background-image: url("../images/hero-bg.jpg");
  /* Set a specific height */
  height: 600px; 
  /* Create the parallax scrolling effect */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.modal-content.light {
    background: white;
}

.green-section{
    background:#B9BB17;
    padding-top:1.5rem;
    padding-bottom:1rem;
}

.gray-section{
    background:#f9f9f9;
    padding-top:1.5rem;
    padding-bottom:1rem;
}

.gray-section h1{
    max-width:880px;
    margin:auto;
}

.gray-section h2{
    max-width:680px;
    margin:auto;
}

.extra-padding{ 
    padding-right:25px;
    padding-left:25px;
}

.disp-logo-1{
    width:100px; 
    padding:30px 0px 30px 0px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.disp-logo-2{
    width:100px;
    padding:30px 0px 30px 0px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.disp-logo-3{
    width:100px;
    padding:30px 0px 30px 0px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.disp-logo-4{
    width:100px;
    padding:30px 0px 30px 0px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.disp-logo-5{
    width:100px;
    padding:30px 0px 30px 0px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.disp-logo-6{
    width:100px;
    padding:30px 0px 30px 0px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

/*-----Load more button------*/
.eapps-instagram-feed-posts-grid-load-more {
    font-family: 'Averta Bold', Arial, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 1rem!important;
    position: relative;
    width: 180px!important;
    height: 35px!important;
    border-radius: 4px;
    border: none;
    background: #B9BB17!important;
    color: #fff;
    text-align: center;
    outline: none;
    cursor: pointer;
    margin: auto;
    margin-top: -52px !important;
    margin-bottom: 15px !important;
    transition: opacity 0.5s ease, visibility 0.5s ease, background 0.2s ease;
    opacity: 0;
    visibility: hidden;
    z-index:1000;
    padding-left: 10px!important;
    padding-right: 10px!important;
}

.insta {
    width: 100% !important;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
    overflow: hidden;
}

.shrink-logo{
    max-width:30px;
    max-height:30px;
}

.bg-darker{ background-color:rgba(2,37,62,.5)!important;}

/*-----Sub------*/
.hero.sub { 
  /* The image used */
  background-image: url("../images/sub-image-1.jpg");
  /* Set a specific height */
  height: 294px; 
  /* Create the parallax scrolling effect */
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

.sub .caption{
    position:absolute;
    top:0px;
    right:70px;
    z-index:1000;
    margin-top:100px; 
    margin-bottom:200px;
    margin-left:0px;
    text-align:left;
    left:0px;
    position:relative;
}

.sub .caption h1{
    line-height:58px;
    color:white;
    font-family: 'Cheddar', Arial, sans-serif;
    font-size:47px;
    font-weight:normal;
    padding-bottom:0px;
    transform: rotate(-9deg) skew(-15deg);
}

/*-----Sub------*/
.hero.sub.storelocator{ 
  /* The image used */
  background-image: url("../images/sub-image-2.jpg")!important;
}

/*-----Sub------*/
.hero.sub.products{ 
  /* The image used */
  background-image: url("../images/sub-image-1.jpg")!important;
}

/*-----Sub------*/
.hero.sub.ourstory{ 
  /* The image used */
  background-image: url("../images/sub-image-3.jpg")!important;
}

/*-----Sub------*/
.hero.sub.contact{ 
  /* The image used */
  background-image: url("../images/sub-image-5.jpg")!important;
}


.band .btn-secondary, .band .btn-disabled{
    display:block;
    width:170px;
    margin:auto;
}

.product{
    /*width:400px;*/
    width:100%;
    border-radius:0px;
    margin-top:1rem;
    margin-bottom:2.5rem;
}

.product-desc h2 {
    transform: rotate(-9deg) skew(-15deg);
    margin-bottom:70px;
    font-size:60px;
}

.bg-color{
    background:#C7E9D2;
}

.bg-gray{
    background:#F5F5F5;
}

.bg-sonder{
    background:#004974;
}

.bg-enough-said{
    background:#7f2d29;
    background-image: url(../images/border-nw.png);
    background-repeat:no-repeat;
    background-position: bottom;
    background-size: 300px 25px;
    background-repeat: repeat-x;
}

.bg-new-west{
    background:#21584e;
    background-image: url(../images/border-ti.png);
    background-repeat:no-repeat;
    background-position: bottom;
    background-size: 300px 25px;
    background-repeat: repeat-x;
}

.bg-tropical-infamy{
    background:#af632b;
    background-image: url(../images/border-rcg.png);
    background-repeat:no-repeat;
    background-position: bottom;
    background-size: 300px 25px;
    background-repeat: repeat-x;
}

.bg-rcg{
    background:#4c3528;
    background-image: url(../images/border-s.png);
    background-repeat:no-repeat;
    background-position: bottom;
    background-size: 300px 25px;
    background-repeat: repeat-x;
}

.parallax.about{ 
  /* The image used */
  background-image: url("../images/parallax-image.jpg")!important;
}

.parallax.about h3{ line-height:24px; font-size:22px }

.media-dark h3{color:#FFF}
.media-dark {background:#111}
.media-dark img {filter: invert(1) brightness(50%)}

.max-para{
    max-width:750px; 
    margin-left: auto; 
    margin-right: auto
}

#inside-technology .row p {max-width:300px}
#best-of .row p {max-width:300px; margin-left:auto; margin-right:auto}

/*.media-dark img {filter: invert(1) brightness(100%) sepia(100%) saturate(10000%);}*/

/*.grayscale {*/
    /*-webkit-filter: grayscale(100%);*/
    /*filter: grayscale(100%);*/
/*}*/