/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
.bsp-menu-logo { width: 70px; }
.sm-theme-main { margin: 0px; }

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {

    .bsp-menu-logo { width: 60px; }

    .sm-white a { font-size: .8rem; }
    .sm-white > li > a { padding: 35px 4px; }
    .sm-white > li > a span.sub-arrow { margin-top: -5.5px; }
    .sm-white > li > a.highlighted .sub-arrow { margin-top: -5px; }
    .sm-white > li > a:hover >span.sm-text::before { bottom: -10px; }

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .bsp-menu-logo { width: 85px; transition: all 0.3s ease;}

    .sm-white a { font-size: .85rem; }
    .sm-white > li > a { padding: 35px 10px; }
    .sm-white > li > a span.sub-arrow { margin-top: -5px; }
    .sm-white > li > a.highlighted .sub-arrow { margin-top: -5px; }
    .sm-white > li > a:hover >span.sm-text::before { bottom: -6px; }


}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .bsp-menu-logo { width: 90px; transition: all 0.3s ease;}

    .sm-white > li > a { font-size: .98rem; }
    .sm-white a { font-size: .98rem; }

}
/* Large devices (extra large desktops, 1200px and up) */
@media (min-width: 1400px) {
    #main-menu > li > a { padding: 35px 18px; }
	

}