div[role="banner"]{
	background-color: #00529b;
}
div[role="desktop-banner"]{
  display: none !important;
}
div[role="mobile-banner"]{
  display: block !important;

}
div[role="mobile-banner"] img{
  height: 74px;

}
div[role="navbar"]{
  background-color: #f8f9fa!important;
}
.breadcrumb-item a, h3 a{
  color: #00529b !important;
}
a {
  color: #00529b !important;
}
body{
  color: #333;
	background-color: #ffffff;
}
p{
  line-height: 1.5;
}
.btn-primary{
  background-color: #de7b1e !important;
  border-color: #de7b1e !important;
}
.btn-light{
  background-color: #eee !important;
  border-color: #eee !important;
}
.btn-light:hover{
  background-color: #f8f9fa !important;
  border-color: #f8f9fa !important;
}
.font-xsmall{
  font-size: x-small;
}
.bg-forecastyellow{
  background-color: #d2cfba;
}
.bg-lightyellow{
  background-color: #F0EFE8;
}
.bg-blue{
  background-color: #00529b;
}
.bg-orange{
	background-color: #de7b1e;
}
.bg-green{
  background-color: #6EC8BF;
}
.bg-lightgreen{
  background-color: #D4ECEE;
}
.bg-lightorange{
  background-color: #EC8025;
}
.bg-lightgrey{
  background-color: #EC8025 !important;
}
.bg-lightblue{
  /*background-color: #5984b7;*/
  background-color: #6C9AC3;
}
.text-light-blue{
  color: #6b99c2;
}
.text-orange{
  color: #de7b1e !important;
}
.text-orange:hover{
  color: #d04d0E;
}
.text-blue a{
  color: #00529b !important;
}
.text-blue a.active{
  background-color: #00529b !important;
  color: #ffffff !important;
}
.text-black a{
  color: #333 !important;
}
.text-white a{
  color: #ffffff !important;
}
.height-110{
  height: 110px !important;
}
.height-370{
  height: 370px !important;
}
.font-size-6{
  font-size: 6rem;
}
.font-size-5{
  font-size: 5rem;
}
.font-size-4{
  font-size: 4rem;
}
.font-size-3{
  font-size: 3rem;
}
.font-size-2{
  font-size: 2rem;
}
.font-size-1-half{
font-size: 1.5rem;
}
.font-size-1{
  font-size: 1rem;
}
.font-size-half{
  font-size: 0.8rem;
}
.text-uf-blue{
  color: #0021a5;
}
.text-blue{
  color: #00529b;
}
.text-purple{
  color: #6A2A60;
}
#wrapper {
    /*display: -webkit-box;*/
    /*display: -ms-flexbox;*/
    display: flex;
}

#wrapper #content-wrapper {
  /*overflow-x: hidden;*/
  width: 100%;
  
}

.dropdown-menu {
    margin-top: 0;
}
.dropdown-menu .dropdown-toggle::after {
    vertical-align: middle;
    border-left: 4px solid;
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
}
.dropdown-menu .dropdown .dropdown-menu {
    left: 100%;
    top: 0%;
    margin:0 20px;
    border-width: 0;
}
.dropdown-menu li a{
  text-align: left !important;
}
.dropdown-menu > li a:hover,
.dropdown-menu > li.show {
  background: #ffffff;
  color: #fd7e14;
}
.dropdown-menu > li.show > a{
  color: #fd7e14;
}

/*.navbar .dropdown-menu a{
  color: #292929 !important;
}
.navbar .nav-link {
  color: #292929 !important;
}*/

#navbarNav a {
  font-size: 125%;
  color: #0B5793 !important;
  font-weight: 500;
}
.dropdown-item {
  font-size: 80% !important;
}
#navbarNav  a:hover{
  /*background-color: #ffffff !important;*/
  color: #fd7e14 !important;
}
.sidebar a{
  color: #ffffff !important;
}
.sidebar {
  width: 100px !important;
  background-color: #0B5793;
  min-height: calc(100vh - 56px);
  margin-top: 0.25rem;

}

.sidebar .nav-item:last-child {
  margin-bottom: 1rem;
}

.sidebar .nav-item .nav-link {
  text-align: center;
  padding: 0.75rem 1rem;
  width: 90px;
}

.sidebar .nav-item .nav-link span {
  /*font-size: 1.5rem;*/
  display: block;
}

.sidebar .nav-item .dropdown-menu {
  position: absolute !important;
  -webkit-transform: none !important;
  transform: none !important;
  left: calc(90px + 0.5rem) !important;
  margin: 0;
}

.sidebar .nav-item .dropdown-menu.dropup {
  bottom: 0;
  top: auto !important;
}

.sidebar .nav-item.dropdown .dropdown-toggle::after {
  display: none;
}

.sidebar .nav-item .nav-link {
  color: rgba(255, 255, 255);
}

.sidebar .nav-item .nav-link:active, .sidebar .nav-item .nav-link:focus, .sidebar .nav-item .nav-link:hover {
  color: rgba(255, 255, 255, 0.75);
}
.sidebar .nav-item.highlight{
  background: #eeeeee !important;
}
.sidebar .nav-item.highlight .nav-link{
  color: #00529b !important;
  
}
/*.sidebar .nav-item.highlight*/

.sidebar.toggled {
  width: 0 !important;
  overflow: hidden;
}

.footer{

    width: 100%;
    padding: 1rem 0;
    margin-top:  1.5rem;
    /*background-color: #0021a5;*/
    background-color: #00529b;
    text-align: left;
    font-size: 1rem;
}
.footer a{
    font-weight: 500;
    color: #fafafa;

}
.footer a:hover{
    color: #a9a9a9;
    cursor: pointer;
}
.footer p{
    margin-bottom: 0;
}
.footer-links{
    padding-left: 0px;
    margin-bottom: 0.5rem;
}
.footer-links li{
    display: inline-block;

    padding-right: 0.4rem;
    padding-left: 0.4rem;
    border-right:  1px solid #a9a9a9;
    color: #fafafa;
}
.footer-links li:last-child{
    border-right: 0px !important;
}

.border-varies{
  border-top: 1px solid #dee2e6!important;
}
/*// Extra small devices (portrait phones, less than 576px)
// No media query since this is the default in Bootstrap

// Small devices (landscape phones, 576px and up)*/
#sticky-footer{
  text-align: center;
}

/*#sticky-footer li:not(.ng-hide):nth-last-of-type(1):first-child {
    width: 100% !important;
}
#sticky-footer li:not(.ng-hide):nth-last-of-type(2):first-child,
#sticky-footer li:not(.ng-hide):nth-last-of-type(2):first-child ~ li:not(.ng-hide){
    width: 50% !important;
}
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(3),
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(3) ~ li:not(.ng-hide){
    width: 33.3% !important;
}
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(4),
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(4) ~ li:not(.ng-hide) {
    width: 25% !important;
}
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(5),
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(5) ~ li:not(.ng-hide){
    width: 20% !important;
}
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(6),
#sticky-footer li:not(.ng-hide):first-child:nth-last-of-type(6) ~ li:not(.ng-hide) {
    width: 16.6% !important;
}*/
#sticky-footer .nav-item .nav-link{
  /*width: 40px !important;*/
  padding: 0 5px !important;
  font-size: 50% !important;
}
#sticky-footer .nav-item .nav-link span{
  /*width: 40px !important;*/
  word-wrap: break-word;
}
@media (max-width: 576px) {
	#map-container{
    display: none;
  }
}
@media (min-width: 374px) {

  #sticky-footer .nav-item .nav-link{
    font-size: 80% !important;
  }
  #graphic_forecast, #NWSforecast,#cropTables{
    width: 400px !important;
  }
}
@media (min-width: 576px) {
  #graphic_forecast, #NWSforecast,#cropTables{
    width: 500px !important;
  }

  div[role="desktop-banner"]{
    display: block !important;
  }
  div[role="mobile-banner"]{
    display: none !important;
  }
  img[alt="FAWN Logo"]{
    height: 70px !important;
  }
  /*img[alt="FAWN Logo"]{
    height: 30px !important;
  }*/
  img[alt="UF IFAS Logo"]{
    height: 35px !important;

  }

  .height-100{
        height: 100px;
    }
    .height-70{
        height: 70px;
    }
}
@media (min-width: 768px) {
  .dropdown-menu .dropdown .dropdown-menu {
        margin:0;
        border-width: 1px;
    }
  #navbarNav>ul{
    width: 80%;
    margin-left: 100px;
    margin-right: 100px;
  }
  
  #graphic_forecast, #NWSforecast,#cropTables{
    width: 600px !important;
  }


}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {


  .sidebar {
    width: 300px !important;
  }
  .sidebar .nav-item .nav-link {
    display: block;
    width: 100%;
    text-align: center;
    padding: 1rem;
    width: 250px;
  }
  .sidebar .nav-item .nav-link span {
    font-size: 1.1rem;
    display: inline;
  }
  .sidebar .nav-item .dropdown-menu {
    position: static !important;
    margin: 0 1rem;
    top: 0;
  }
  .sidebar .nav-item.dropdown .dropdown-toggle::after {
    display: inline-block;
  }
  .sidebar.toggled {
    overflow: visible;
    width: 90px !important;
  }
  .sidebar.toggled .nav-item:last-child {
    margin-bottom: 1rem;
  }
  .sidebar.toggled .nav-item .nav-link {
    text-align: center;
    padding: 0.75rem 1rem;
    width: 90px;
  }
  .sidebar.toggled .nav-item .nav-link span {
    font-size: 0.65rem;
    display: block;
  }
  .sidebar.toggled .nav-item .dropdown-menu {
    position: absolute !important;
    -webkit-transform: none !important;
    transform: none !important;
    left: calc(90px + 0.5rem) !important;
    margin: 0;
  }
  .sidebar.toggled .nav-item .dropdown-menu.dropup {
    bottom: 0;
    top: auto !important;
  }
  .sidebar.toggled .nav-item.dropdown .dropdown-toggle::after {
    display: none;
  }

  .border-varies{
    border-right: 1px solid #dee2e6!important;
  }
  .border-lg-right{
    border-right: 1px solid #dee2e6!important;
  }
  .nav-link{
    text-align: left !important;
  }
  .nav-link i{
    padding-right: 1px;
  }
  #graphic_forecast, #NWSforecast,#cropTables{
    width: 700px !important;
  }
}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
  .ml-xl-6, .mx-xl-6 {
    margin-left: 5rem !important;
  }
  .ml-xl-7, .mx-xl-7 {
    margin-left: 6rem !important;
  }
  .ml-xl-7, .mx-xl-8 {
    margin-left: 7rem !important;
  }
  .ml-xl-7, .mx-xl-9 {
    margin-left: 8rem !important;
  }
  .ml-xl-10, .mx-xl-10 {
    margin-left: 9rem !important;
  }
  #forecast-row h6{
    font-size: 100%
  }
  #graphic_forecast, #NWSforecast,#cropTables{
    width: 800px !important;
  }
}

/*@media(min-width: 1440px){
  #station_photos{
    margin-left: -80px !important;
  }
}

@media (min-width: 2000px){

  #station_photos{
    margin-left: -110px !important;
  }
}*/