@import url('http://fonts.googleapis.com/css?family=Source+Sans+Pro');
.nav{
 height: 45px;
 background: url(../img/col1.jpg);
}
.flexy-menu {
 width: 100%;
 margin: 0;
 padding: 0;
 position: relative;
 float: left;
 list-style: none;
/* background: #f2f2f2*/
}

.flexy-menu li {
 display: inline;
 font-size: 15px;
/* font-weight:bold;*/
 margin: 0;
 padding: 0;
 float: left;
 line-height: 21px;
 position: relative
}

.flexy-menu>li>a {
 text-align:center;
 padding: 10px 30px;
 color: #333333;
 text-decoration: none;
 display: block;
 font-size: 16px;
 text-transform: uppercase;
 -webkit-transition: color .2s linear, background .2s linear;
 -moz-transition: color .2s linear, background .2s linear;
 -o-transition: color .2s linear, background .2s linear;
 transition: color .2s linear, background .2s linear
}

.flexy-menu li:hover>a,
.flexy-menu li.active a {
 background: #00479C;
 color: #fff
}

.flexy-menu li.right {
 float: right
}

.flexy-menu ul,
.flexy-menu ul li ul {
 list-style: none;
 margin: 1px 0 0 0;
 padding: 0;
 display: none;
 position: absolute;
 z-index: 99999;
 width: 150%;
 background: #00479C;
 color:#fff;
}

.flexy-menu ul {
 left: 0
}

.flexy-menu ul li ul {
 top: 0;
 left: 100%
}

.flexy-menu ul li {
 width:100%;
 clear: both;
 z-index: 99999;
 font-size: 12px
}

.flexy-menu ul li a {
 padding:10px 0px;
 width: 100%;
 color:#FFFFFF;
 font-size: 13px;
 text-align:center;
 text-decoration: none;
 display: inline-block;
 float: left;
 clear: both;
 z-index: 99999;
 box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 -webkit-transition: color .2s linear, background .2s linear;
 -moz-transition: color .2s linear, background .2s linear;
 -o-transition: color .2s linear, background .2s linear;
 transition: color .2s linear, background .2s linear
}
.flexy-menu ul li a:hover{
  background:#005BAC;
  color:#fff;
}

.flexy-menu i {
 line-height: 20px!important;
 margin-right: 6px;
 font-size: 18px;
 float: left
}

.flexy-menu>li.showhide {
 display: none;
 width: 100%;
 height: 50px;
 cursor: pointer;
 color: #dedede;
 border-bottom: solid 1px rgba(0, 0, 0, 0.1);
 background: #333
}

.flexy-menu>li.showhide span.title {
 margin: 16px 0 0 25px;
 float: left
}

.flexy-menu>li.showhide span.icon {
 margin: 17px 20px;
 float: right
}

.flexy-menu>li.showhide .icon em {
 margin-bottom: 3px;
 display: block;
 width: 20px;
 height: 2px;
 background: #ccc
}

.orange li:hover>a,
.orange li.active a {
 background: #00479C;
 color: #FFFFFF!important
}

.flexy-menu.vertical {
 width: 200px
}

.flexy-menu.vertical li {
 width: 100%
}

.flexy-menu.vertical li a {
 display: inline-block!important;
 width: 100%;
 padding: 18px 20px 16px;
 box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box
}

.flexy-menu.vertical ul li {
 width: 100%
}

.flexy-menu.vertical ul,
.flexy-menu.vertical ul li ul {
 width: 160px
}

.flexy-menu.vertical ul {
 top: 0;
 left: 100%
}

.flexy-menu.vertical ul li ul {
 top: 1px
}

.flexy-menu.vertical.right {
 float: right!important
}

.flexy-menu.vertical.right ul {
 left: -150px!important
}

@media only screen and (max-width:768px) {
 .flexy-menu.vertical {
  width: 100%
 }
 .flexy-menu li {
  display: block;
  width: 100%
 }
 .flexy-menu>li>a {
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 25px
 }
 .flexy-menu a {
  width: 100%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box
 }
 .flexy-menu ul,
 .flexy-menu ul li ul,
 .flexy-menu.vertical ul,
 .flexy-menu.vertical ul li ul {
  width: 100%;
  left: 0;
  border-left: 0;
  position: static;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box
 }
 .flexy-menu ul li {
  border-left: 0;
  border-right: 0
 }
 .flexy-menu ul li a,
 .flexy-menu.vertical ul li a {
  padding-top: 10px;
  padding-bottom: 10px
 }
 .flexy-menu ul>li>a {
  padding-left: 40px!important
 }
}