Edited "breakpoints," still breaking at default - code details included

We would like to adjust the menu’s collapse breakpoint from your default 767 down to 667
We’ve edited the breakpoints as follows in these files however the menu continues to break at the default breakpoint: 767

Any ideas of how to resolve this would be greatly appreciated !!

Testing webpage:
https://jbe.lpk.mybluehost.me/Working/working_template.php

Here is our css files loading sequence:

<!-- DURA MENU V1.0 -->

<link href="../allsites/navbars21/dura/css/dura-fullwidth.css" rel="stylesheet">
<link href="../allsites/navbars21/dura/css/dura-demo-content.css" rel="stylesheet">
<link href="../allsites/navbars21/dura/css/dura-main.css" rel="stylesheet">
<link href="../allsites/navbars21/dura/css/dura-responsive.css" rel="stylesheet">

Here are the adjusted breakpoints in their respective files:

*************** dura-main.css ******************
@media (max-width: 667px) {
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
color: #777;
}

@media (max-width: 667px) {
.navbar-inverse .navbar-nav .open .dropdown-menu {
background: #fff;
}

************ dura-responsive.css ************
/==================================================
= Bootstrap 3 Media Queries =
==================================================
/
.signin { min-height:200px;max-width:290px; padding-top:20px;margin-left:40px;overflow:scroll; }

/* MEDIA QUERY → EXTRA SMALL DEVICES /
@media(max-width:667px){
.absolute {
/
utility class, absolute positioning */
transition: none;
}

/* MEDIA QUERY → SMALL DEVICES /
@media(min-width:668px) and (max-width:991px){
.container {
/
override Bootstrap “.container” class properties /
max-width: 800px;
}
/
NAVIGATION - 2ND LEVEL */

************* dura-fullwidth.css ******************

/* MEDIA QUERY → SMALL DEVICES */
@media(min-width:668px) and (max-width:991px){

}