/* This file contains generic styles used across FWIP supplemental tools */

form {
 margin: 0px;
}

.tool_wrapper {
 width: 1024px;
 height: 100%;
 padding: 0px;
 margin: auto;
 background-color: #FFFFFF;
 text-align: center;
}
 .tool_title {
  width: 100%;
  padding: 10px 0px;
  font-size: 30px;
  font-weight: bold;
  background-color: #A75823;
  color: #FFFFFF;
 }

/* Styles for the menu area */
 .tool_menu {
  display: block;
  padding: 10px;
  font-size: 18px;
  background-color: #448D6F;
  color: #FFFFFF;
 }
  .tool_menu_user {
   display: block;
  }
   .tool_menu_user_text {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 20px;
    background-color: #4B9778;
    color: #E5E5E5;
    font-size: 16px;
    text-align: center;
   }
    .tool_menu_user_text i {
     margin-right: 10px;
    }
  .tool_menu_spacer {
   display: block;
   padding: 5px;
  }
  .tool_menu_container {
   display: block;
   width: 100%;
   white-space: nowrap;
  }
   .tool_menu_block_full {
    display: block;
    vertical-align: top;
    white-space: normal;
   }
   .tool_menu_block_half {
    display: inline-block;
    width: 50%;
    vertical-align: top;
    white-space: normal;
   }
    .tool_menu_table {
     display: table;
     width: 100%;
    }
     .tool_menu_tr {
      display: table-row;
      background-color: #4B9778;
      color: #E5E5E5;
     }
     .tool_menu_td_name {
      display: table-cell;
      width: 50%;
      padding: 4px 8px;
      font-weight: bold;
      text-align: left;
     }
      .tool_menu_td_name i {
       margin-right: 10px;
      }
     .tool_menu_td_value {
      display: table-cell;
      padding: 4px 8px;
      text-align: left;
     }
      .tool_menu_td_value label {
       margin-right: 10px;
      }
      .tool_menu select, .tool_menu input {
       font-size: 16px;
      }
   .tool_menu_submit {
    margin: 10px auto 0px auto;
    font-size: 16px;
   }
   .tool_menu_error_panel {
    display: none;
    padding: 10px;
   }
    .tool_menu_error_msg {
     display: inline-block;
     padding: 5px 10px;
     background-color: #CC0000;
     border-radius: 12px;
     color: #FFFFFF;
     font-size: 14px;
     text-align: center;
    }
     .tool_menu_error_msg i {
      margin-right: 5px;
     }

/* Styles for the content area */
 .tool_content {
  padding: 10px;
  font-size: 16px;
  color: #000000;
 }
  .tool_content_info {
   display: block;
   margin: 10px;
   text-align: center;
  }
  .tool_content_controls {
   display: inline-block;
   margin: 20px;
   border: 3px solid #FFE15A;
  }
   .tool_content_controls_title {
    display: block;
    padding: 5px 10px;
    background-color: #FFE15A;
    font-size: 18px;
    font-weight: bold;
    text-align: left;
   }
    .tool_content_controls_title i {
     margin-right: 10px;
    }
   .tool_content_controls_content {
    display: block;
    padding: 5px 10px;
    background-color: #FFF9DA;
    text-align: left;
   }
    .tool_content_controls_content li {
     margin: 5px 0px;
    }
    .tool_content_controls_content i {
     margin: 0px 3px;
    }
  .tool_content_error {
   display: block;
   margin: 10px;
   color: #CC0000;
   text-align: center;
  }
   .tool_content_error i {
    margin-right: 5px;
   }
  .tool_content_title {
   display: block;
   margin: 10px;
   font-size: 20px;
   font-weight: bold;
   text-align: center;
  }

/* Define Adjective Rating colors */
.adjr_na {
 background-color: #D1D1D1;
 color: #000000;
}
.adjr_1 {
 background-color: #007F00;
 color: #FFFFFF;
}
.adjr_2 {
 background-color: #0000E9;
 color: #FFFFFF;
}
.adjr_3 {
 background-color: #FFFF00;
 color: #000000;
}
.adjr_4 {
 background-color: #FF6600;
 color: #FFFFFF;
}
.adjr_5 {
 background-color: #E40000;
 color: #FFFFFF;
}

/* Define Hazard Level colors */
.hazl_1 {
 background-color: #92D050;
}
.hazl_2 {
 background-color: #00B0F0;
}
.hazl_3 {
 background-color: #FFFF00;
}
.hazl_4 {
 background-color: #FFC000;
}
.hazl_5 {
 background-color: #FF0000;
}

 /* Set some mobile-specific styles */
 @media (max-width: 1279px) {
  .tool_menu_block_half {
   display: block;
   width: 100%;
  }
 }