/*@import url(http://fonts.googleapis.com/css?family=Raleway:400,200);*/

/* P A G E   T O P   H O R I Z   M E N U  */
#horiz-menu-frame {
    position: relative;
    float: right;
    display: block;    
    width: 60%;
}

#home-hzmenu {
    position:relative;
    float:right;
    border: 0px;
    margin:0; /* 5px 0 0 0;*/
    padding: 0px;
    font-family: verdana, geneva, arial, helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #8e8e8e;
    width: 100%; /* 500px; */
    /*display: block;*/
    min-height: 40px;
}
#home-hzmenu > ul {
  margin-top: 6px !important;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
#home-hzmenu > ul > li {
    border: 0px;
    padding: 14px 0;
}
#home-hzmenu > ul > li > a {
    /*text-transform: uppercase;*/
    color: #000000;
}
#home-hzmenu > ul > li > a:hover {
    background: #ffffff;
    color: #676767;
}
#home-hzmenu ul {
    height: 27px;
    list-style: none;
    margin: 0;
    padding: 0;    
}
#home-hzmenu > ul > li{
    padding: 0px 5px;
    background: #ffffff;
    border-top: 5px #ffffff solid;
}
#home-hzmenu > ul > li:hover {
    background: #ffffff;
    border-top: 5px #336699 solid;
}
#home-hzmenu > ul > li:active > ul {
  /*display: block;*/
}
#home-hzmenu > ul > li:hover > ul {
  /*display: none;*/
}
#home-hzmenu ul ul {
  /*border-top: 6px solid #000000;*/
  border-top: 6px solid #cdcdcd;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;  
}
#home-hzmenu ul ul a {
  line-height:150%;
}
#home-hzmenu ul ul ul {
  left: 100%;
  top: 0;
}
#home-hzmenu li {
  float: right;
  border:1px #ececec solid;
  background: #CDCDCD; /*#414141;/ */ 
}
#home-hzmenu li a {
  color: #ffffff; /*#ececec;*/
  display: block;
  font-weight: bold;
  line-height: 30px;
  padding: 0px 5px;
  text-align: center;
  text-decoration: none;
}
#home-hzmenu li a:hover {
  color: #ffffff;
  text-decoration: none;
}
#home-hzmenu li:hover {
  background: #949494;
}
#home-hzmenu li ul {
  background: #cdcdcd; /* #e0e0e0;*/
  border-left: 2px solid #cdcdcd;
  border-right: 2px solid #cdcdcd;
  border-bottom: 2px solid #cdcdcd;
  display: none;
  height: auto;
  /*filter: alpha(opacity=95);*/
  /*opacity: 0.95;*/
  position: absolute;
  width: 200px;
  z-index: 200;
  /*top:1em;
  left:0;*/
  box-shadow: 6px 6px 5px gray;
    -moz-box-shadow: 6px 5px 5px gray;
    -webkit-box-shadow: 6px 6px 5px gray;
}
.drpdn-menu-align-rt{
    right:20px;
}
#home-hzmenu li:hover > ul {
  display: block;
}
#home-hzmenu li li {
  display: block;
  float: none;
  padding: 8px 0px;
  position: relative;
  width: 200px;
}
#home-hzmenu li ul a {
  display: block;
  font-size: 12px;
  font-style: normal;
  padding: 0px 10px 0px 15px;
  text-align: left;
}
#home-hzmenu li ul a:hover {
  background: #949494;
  /*color: #000000;*/
  opacity: 1.0;
  filter: alpha(opacity=100);
}
#home-hzmenu p {
  clear: left;
}
#home-hzmenu .active > a {
  background: #000000;
  -webkit-box-shadow: 0 -4px 0 #000000, 0 -5px 0 #141414, 0 -6px 0 #000000;
  -moz-box-shadow: 0 -4px 0 #000000, 0 -5px 0 #141414, 0 -6px 0 #000000;
  box-shadow: 0 -4px 0 #000000, 0 -5px 0 #141414, 0 -6px 0 #000000;
  color: #ffffff;
}
#home-hzmenu .active > a:hover {
  color: white;
}


/* P A G E   T O P   V E R T I C A L (ACCORDION)   M E N U  */


#vert-menu-mobile-frame {
    display: none;
    position: relative;
    float: right;
    border: 0 solid black;
    min-height: 44px;
    min-width: 44px;
    /*margin:0 20px 0 0;    */
}
.vert-menu-mobile {
    position: absolute;
    z-index: 200;
    top:50px;
    left:-400px;
    border: 1px solid #dddddd;
    width:440px;/*100%;*/
    background-color: #ffffff;
    display: none;
}

.vert-menu-mobile-btn{
    /*display: none;*/
    position:relative;
    float:right;
    width:100%;
    margin-top: 0px;
    cursor: pointer;
    user-select: none;
    z-index: 200;
}
#vert-menu-mobile-toggle:checked ~ .vert-menu-mobile {
    display: block;
}
#vert-menu-mobile-toggle {
  position: absolute;
  left: -9999px;
}


/* the accordion itself */
#main-vtmenu,
#main-vtmenu ul,
#main-vtmenu ul li,
#main-vtmenu ul li a {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    line-height: 1;
    display: block;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#main-vtmenu {
    width:99%;
    font-family: geneva, arial, helvetica, sans-serif;
    /*position: relative;*/
    /*float: left;*/
    margin: 0;
    position: absolute;
    z-index: 500;
}
#main-vtmenu ul ul {
    display: none;
}
#main-vtmenu > ul > li.active > ul {
    display: block;
}
.align-right {
    float: right;
}
#main-vtmenu > ul > li > a {
    padding: 10px 6.25%;
    cursor: pointer;
    z-index: 20002;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    color: #000000;
    background:#ffffff;
    -webkit-transition: color .2s ease;
    -o-transition: color .2s ease;
    transition: color .2s ease;
    border: 1px solid #cdcdcd; /*#cdcdcd;*/
}
#main-vtmenu > ul > li > a:hover {
    color: #ffffff;
    background:darkblue;
    border: 1px solid darkblue;
}
#main-vtmenu ul > li.has-sub > a:after {
    position: absolute;
    right: 20px;
    top: 5px; /* 19px; */
    z-index: 20005;
    display: block;
    height: 0px; /* 10px; */
    width: 0px; /* 2px; */
    background: #ffffff;
    /*content: "X";*/
    -webkit-transition: all 0.1s ease-out;
    -moz-transition: all 0.1s ease-out;
    -ms-transition: all 0.1s ease-out;
    -o-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}
#main-vtmenu ul > li.has-sub > a:before {
  position: absolute;
  right:20px;
  top: 5px;
  display: block;
  width: 0px; /* 10px */
  height: 0px; /* 2px */
  background: #ffffff;
  font-size: 26px;
  content: "+";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#main-vtmenu ul > li.has-sub.open > a:after,
#main-vtmenu ul > li.has-sub.open > a:before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* Sub menus */
#main-vtmenu ul ul li a {
  padding: 14px 12.5%;
  cursor: pointer;
  z-index: 20002;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  color: #000000;
  background: #dedede;
  -webkit-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
}
#main-vtmenu ul ul ul li a {
  color: #000000;
  background: #aaaaaa;
  padding-left: 18.75%;
}
#main-vtmenu ul ul ul ul li a {
  font-weight: normal;
  color: #dddddd;
  background: #777777;
  padding-left: 25%;
}
#main-vtmenu ul ul li a:hover {
  color: #ffffff;
}
#main-vtmenu ul ul ul li a:hover {
  color: #ffffff;
}
#main-vtmenu ul ul ul ul li a:hover {
  color: #ffffff;
}

/*     */
#main-vtmenu ul ul > li.has-sub > a:after {
  top: 16px;
  right: 26px;
  background:#ffffff;
}
#main-vtmenu ul ul > li.has-sub > a:before {
  top: 20px;
  background:#ffffff;
}

/* this may not be necessary here  */
#main-vtmenu .detailz a {
    color:black;
    font-family: Times New Roman;
    font-style: oblique;
    font-size: 14px;
    padding: 10px 0 10px 18.75%;
    /*border: 1px solid grey;*/
}
#main-vtmenu .detailz a:hover {
    color:white;
}


/* Media Queries */

@media screen and (max-width: 768px) {
    #home-hzmenu {
        display: none;  
    }
    #horiz-menu-frame {
        display: none;
    }
    
    
    #vert-menu-mobile-frame {
        display: block;
    }
    .vert-menu-mobile-btn{
        display: block;
    }
    #vert-menu-mobile-toggle {
        display: block;
    }
}

@media screen and (max-width: 600px) {
    #home-hzmenu {
        display: none;  
    }
    #horiz-menu-frame {
        display: none;
    }
    
    #vert-menu-mobile-frame {
        display: block;
    }
    .vert-menu-mobile-btn{
        display: block;
    }
    #vert-menu-mobile-toggle {
        display: block;
    }
    
    #home-hzmenu {
        font-family: Arial;
        font-size:12px;
    }
    #home-hzmenu > ul > li {
        padding: 0px 2px;
    }
    
    #main-vtmenu > ul > li > a {       
        font-size: 20px;        
    }
    #main-vtmenu ul ul li a {
        font-size: 20px; 
    }
    
}

@media screen and (max-width: 480px) {
    #home-hzmenu {
        font-size:12px;   
    }
    
}

@media screen and (max-width: 470px) {
/*  General  */ 
    .vert-menu-mobile {    
        left:-240px;
        width:260px;/*100%;*/
    }
    
}
