/* || BREAKPOINTS ||
    @media screen and (max-width: 39.9375em) {}                         || SMALL ONLY { 0 - 639px }         ||
    @media screen and (min-width: 40em) {}                              || MEDIUM AND UP { 640px ONWARDS }  ||
    @media screen and (min-width: 40em) and (max-width: 63.9375em) {}   || MEDIUM ONLY { 640px - 1023px }   ||
    @media screen and (min-width: 64em) {}                              || LARGE AND UP { 1024px ONWARDS }  ||
    @media screen and (min-width: 64em) and (max-width: 74.9375em) {}   || LARGE ONLY { 1024px - 1199px }   || */












 



/* || Foundation component overrides || */
body{
    font-size: 15px;
    font-weight: 500;
}


[type='text'],
[type='password'],
[type='date'],
[type='datetime'],
[type='datetime-local'],
[type='month'],
[type='week'],
[type='email'],
[type='number'],
[type='search'],
[type='tel'],
[type='time'],
[type='url'],
[type='color'],
[type='text']:focus,
[type='password']:focus,
[type='date']:focus,
[type='datetime']:focus,
[type='datetime-local']:focus,
[type='month']:focus,
[type='week']:focus,
[type='email']:focus,
[type='number']:focus,
[type='search']:focus,
[type='tel']:focus,
[type='time']:focus,
[type='url']:focus,
[type='color']:focus,
textarea,
textarea:focus,
select,
select:focus {
    font-weight:500;
    outline: none;
    box-shadow: none;
    font-size:1em;
}

[type=checkbox],
[type=radio] {
    position: relative;
    top: 0.1em;
}

button, 
.button {
    font-size:1em;
}

button:not(.button-group button), 
.button:not(.button-group button) {
    font-size:1em;
    border-radius:;
}

button:hover,
.button:hover,
button:focus,
.button:focus {
    transition: .4s;
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.26);
}

.form legend {
    font-weight: 500;
}

span.error,
span.errorMargin {
    color: #cc4b37;
    font-size: 0.8em;
    font-weight: 500;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{
    font-weight:300;
}
@media print, screen and (min-width: 40em){
    h1, .h1 {
        font-size: 4em;
    }
}

label, 
.label {
    font-size: 1em;
    font-weight: 400;
}

/* || Custom defined || */
.alternate-font-family {
    font-family: 'Josefin Sans', sans-serif;;
}
.fa-linkedin:before {
    content: "\f08c";
    color: #bb7509;
}
/* || HEADER || */
header {
    background-color: #FFFFFF;
    color:#545454;
}

header .is-stuck{
    background: #FFFFFF;
    border-bottom: 1px solid #e6e6e6;
    box-shadow: 0 4px 12px 0 #e6e6e6;
}

header a:not(.button) {
    color: #545454;
}

header a:not(.button):hover,
header a:not(.button):active,
header a:not(.button):focus {
    color: #545454;
}

header .icon, 
header i {
    color: #545454;
}

header a:not(.button):hover .icon,
header a:not(.button):hover i,
header i:hover{
    color: #545454;
}

.text-logo {
    word-wrap: break-word;
    font-size: 2.6em;
    text-transform: capitalize;
}

header .cta .icon {
    padding-right: 5px;
    color: #545454
}

header .border-bottom, 
header hr {
    border-bottom:1px solid #DADADA;
}

header .border-top {
    border-top:1px solid #DADADA;
}



.ecommerce-style2 .cart, .cart {
    position:relative;
}

header a:hover i.fas {
    color:#545454
}

.ecommerce-style2 .ps-cart-text-container, .ps-cart-text-container {
    color:#FFFFFF;
    background:#545454;
    height: 22px;
    width: 23px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
    border-radius: 50% 50% 50% 50%;
    display: inline-block;
    font-size: 10px;
    position: absolute;
    left: 31px;
    top: -1px;
    font-weight: bold;
}

header a:hover .ps-cart-text-container {
    background:#545454;
}

.sticky-container,
.nav-bg, 
.top-bar, 
.top-bar ul,
.top-bar ul.menu {
    z-index: 100;
}

.nav-bg, 
.top-bar, 
.top-bar ul,
.top-bar ul.menu {
    
        background-color: #FFFFFF;
    
}



header .ps-cart-text-container {
    color:#FFFFFF;
    background:#545454;
    height: 22px;
    width: 23px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
    border-radius: 50% 50% 50% 50%;
    display: inline-block;
}

header a:hover .ps-cart-text-container {
    background:#545454;
}

/* || MENU || */
header .dropdown.menu li a:not(.button) {
    width: 100%;
}

header ul.dropdown.menu li a:not(.button) {
     color: #545454;
}

header ul.dropdown.menu li.active > a:not(.button),
header ul.dropdown.menu li > a:not(.button):hover,
header ul.dropdown.menu li > a:not(.button):active,
header ul.dropdown.menu li > a:not(.button):focus{
    color: #545454;
    background-color: transparent;
   
}

header .dropdown.menu li ul.submenu {
     background: #545454;
     border:1px solid #545454;
   
}

header .dropdown.menu li ul.submenu li a:not(.button) {
    color: #545454;
    background: #FFF;
    padding: 10px 0;
    margin: 0 auto;
    border-bottom: 1px solid;
    box-shadow: 2px 4px 5px 1px #0000006e;
}

header .dropdown.menu li ul.submenu li a:not(.button):hover,
header .dropdown.menu li ul.submenu li.active a:not(.button) {
    color: #545454;
    background:#FFF;;
}

header .dropdown.menu li ul.submenu li.is-active > a  {
    background:transparent;
}

header .dropdown.menu > li.is-active > a {
    color: #545454;
    background:transparent;
}

header .dropdown.menu > li.is-dropdown-submenu-parent > a::after {
    border-color: #545454 transparent transparent;
}

header .dropdown.menu > li.is-dropdown-submenu-parent.active > a::after,
header .dropdown.menu > li.is-dropdown-submenu-parent > a:hover::after {
    border-color: #545454 transparent transparent;
}

.is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after {
    border-color: transparent transparent transparent transparent;
}

.is-dropdown-submenu .is-dropdown-submenu-parent.opens-left.active > a::after,
.is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a:hover::after {
    border-color: transparent transparent transparent transparent;
}

.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after {
    border-color: transparent transparent transparent transparent;
}

.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right.active > a::after,
.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a:hover::after {
    border-color: transparent transparent transparent transparent
}

/* || HOMEPAGE || */
.featured-section {
    background-color: transparent;
    color: #FFFFFF;
}
.featured-section a { 
    color: #FFFFFF;
}
.featured-section a:hover,
.featured-section a:active,
.featured-section a:focus { 
    color: #E1E1E1;
}


.featured-section h1, .featured-section .h1,
.featured-section h2, .featured-section .h2,
.featured-section h3, .featured-section .h3,
.featured-section h4, .featured-section .h4,
.featured-section h5, .featured-section .h5,
.featured-section h6, .featured-section .h6 {
    color: #FFFFFF;
}


/* || FOOTER || */
footer {
    background-color: #545454;
    color: #FFFFFF;
}

footer a:not(.button) {
    color: #FFFFFF;
}

footer a:not(.button):hover,
footer a:not(.button):active,
footer a:not(.button):focus {
    color: #FFFFFF;
}

.social-media-icons a {
    font-size: 3em;
    color: #FFFFFF;
}

footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6{
     color: #FFFFFF;
}

footer .featured-section {
    background-color: transparent;
    color: #FFFFFF;
}
footer .featured-section a { 
    color: #FFFFFF;
}
footer .featured-section a:hover,
footer .featured-section a:active,
footer .featured-section a:focus { 
    color: #E1E1E1;
}

footer .featured-section h1, footer  .featured-section .h1,
footer .featured-section h2, footer .featured-section .h2,
footer .featured-section h3, footer .featured-section .h3,
footer .featured-section h4, footer .featured-section .h4,
footer .featured-section h5, footer .featured-section .h5,
footer .featured-section h6, footer .featured-section .h6 {
    color: #FFFFFF;
}

footer .border-bottom, 
footer hr {
    border-bottom:1px solid #767676;
}



/* || OFFCANVAS - SIDENAV || */
.off-canvas-content.is-open-right.has-transition-push{
    -webkit-transform: translateX(-60%);
    -ms-transform: translateX(-60%);
    transform: translateX(-60%);
}

.is-open.position-right {
    width: 60%;
}

@media screen and (min-width:  64em) {
    .off-canvas-content.is-open-right.has-transition-push{
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
        transform: translateX(0%);
    }
    
    .is-open.position-right {
        width: 0%;
    }
    
    .js-off-canvas-overlay.is-overlay-fixed {
        display: none !important;
    }
}

aside.sidenav .featured-section {
    background-color:#FFFFFF;
    color:#545454;
}

aside.sidenav .featured-section i {
    color:#545454;
}



aside.sidenav .menu.simple {
    background:transparent;
    color: #545454;
}

aside.sidenav .menu.simple a {
    color: #545454;
}



aside.sidenav .ps-cart-text-container {
    color:#FFFFFF;
    background:#545454;
    height: 22px;
    width: 23px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
    border-radius: 50% 50% 50% 50%;
    display: inline-block;
    margin-left: 5px;
}

aside.sidenav a:hover .ps-cart-text-container {
    background:#545454;
}

aside.sidenav .is-accordion-submenu {
    margin-left: 0;
}

aside.sidenav .menu.accordion-menu li {
    border-bottom: 1px solid #545454;
}

aside.sidenav .menu.accordion-menu li:last-child {
    border-bottom: 0px solid;
}

aside.sidenav .menu.accordion-menu li a {
    background:transparent;
    color: #545454;
    text-transform: uppercase;
}

aside.sidenav .menu.accordion-menu .active > a {
    background:transparent;
    color: #545454;
}

aside.sidenav .menu.accordion-menu li.has-submenu a::after {
    border-color: #545454 transparent transparent !important;
}

aside.sidenav .menu.accordion-menu > li.has-submenu.active > a::after {
    border-color: #545454 transparent transparent !important;
}

@media screen and (max-width: 63.9375em) {
  footer .border-bottom-small {
      border-bottom:1px solid #767676;
    }

    header .border-top-small  {
        border-top:1px solid #DADADA;
    }

    header .sticky {
        top:0 !important;
    }
}




@media screen and (min-width: 64em) and (max-width: 74.9375em) {
    ul#mainNav {
    padding-top: 25px;
    padding-right: 45px;
}
header .dropdown.menu li a:not(.button) {
        margin: 0 13px !important;
    font-size: 13px !important;
}

    }
    

/*Mobile Media QUery*/
@media screen and ( max-width: 63.9375em ) { 
    
    .home-blog-btn {
    float: left!important;
}
    
.main-slider-home .banner-figcaption-home {
    position: relative!important;
    top: 0!important;
    left: 0!important;
    right: 0!important;
    width: 50%!important;
    text-align: center!important;
    font-weight: bold!important;
    color: white!important;
    transform: unset!important;
   margin: 0 auto!important;
}

.banner-description-home .banner-title {
    font-family: 'Josefin Sans', sans-serif!important;
    font-size: 32px!important;
    font-weight: 40!important;
    color: #595454!important;
    text-transform: uppercase!important;
    padding: 0 0 0!important;
    margin: 0!important;
}

.banner-description-home .banner-subtitle {
    font-size: 27px!important;
    font-weight: 400!important;
    color: #bb7509!important;
    text-transform: uppercase;
    padding: 0 0 22px!important;
    margin: 0 auto!important;
    line-height: 41px!important;
}
    
.banner-description-home .button{
    margin: 0 auto!important;
}   

.main-slider .banner-figcaption {
    position: relative!important;
    top: 0!important;
    left: 0!important;
    width: 96%!important;
    text-align: left!important;
    font-weight: bold!important;
    color: white!important;
    transform: unset!important;
    margin: 0 auto!important;
    right: 0!important;
}

.banner-description .banner-title {
color: #545454!important;
width: 100%!important;
font-size: 30px!important;
}

.banner-description .banner-subtitle {
    font-size: 29px!important;
    font-weight: 600!important;
    color: #bb7509!important;
    text-transform: uppercase!important;
    padding: 0 0 0!important;
    display: block!important;
}


.main-slider .banner-figcaption-2 {
    position: relative!important;
    top: 34px!important;
    left: 0!important;
    right: 0!important;
    width: 100%!important;
    text-align: center!important;
    /* font-weight: bold!important; */
    color: #595454!important;
    transform: unset!important;
    margin: 0 auto!important;
}

.banner-figcaption-2 h1 {
color: #595454!important;
}

#footer [type='text'] {
    width: 50%!important;
    margin: 0 auto!important;
    margin-bottom: 20px!important;
}
    
}