/************* Variables ********************/
/* ======== Generic Variable ============== */
/* ======== Button Varibles =============== */
/*======== Search Button Variables ==========*/
/*======== Membership Package Variables ==========*/
/* End Variables */
/************** Mixins ***************/
/* Gives box shadow to all browsers except IE, right now no variables declared
so you're kind of stuck with the options listed below. */
/* Gives text shadow to all browsers except IE*/
/* Gives linear gradient background with no stops on all browsers,
just one color at the top going to another color at the bottom,
assuming bottom color is the darker color the background color is
set for older browsers that can't handle it. */
/* Transitions */
/* End Mixins */
/* Breakpoints */
/*route row list result*/
/* .mmf_route_list_container{border-bottom:2px solid #888888;} */
.mmf_route_list_container {
  margin-top: 25px;
}

.mmf_route_list_container input {
  border: 0;
}

.mmf_route_list_container h3 {
  margin-bottom: 5px;
}

.route_row {
  border-bottom: 1px dotted #999999;
  height: 80px;
}

.route_row.first {
  border-top: 2px solid #888888;
}

.route_row .left_check {
  height: 100%;
  width: 20px;
  float: left;
  background: #DBE6E9;
  text-align: center;
  border-right: 1px solid #CCC;
}

.route_row .left_check input {
  vertical-align: middle;
  text-align: center;
  margin: 35px auto 0 auto;
}

.route_row .map {
  float: left;
  margin: 4px;
  border: 1px solid #CCC;
  width: 75px;
  height: 75px;
  text-align: center;
  font-size: 10px;
  background: transparent url("//d2i3r43q6ffvz8.cloudfront.net/prod/public/images/route/map_loading_faded_75.778f38d3bab2.png") no-repeat 0 0;
}

.route_row .distance_difficulty {
  float: left;
  padding-top: 5px;
  width: 65px;
}

.route_row .mileage_container {
  height: 50px;
  margin: 8px 0;
}

.route_row .mileage_container .value {
  display: block;
  font-weight: bold;
  color: #333333;
  font-size: 16px;
  text-align: center;
  padding-top: 10px;
}

.route_row .mileage_container .unit {
  display: block;
  color: #999999;
  font-size: 11px;
  text-align: center;
}

.route_row .right_container {
  margin-left: 180px;
  position: relative;
}

.route_row .right_container .title_container {
  padding-top: 22px;
  margin-left: 10px;
  height: 25px;
  word-wrap: break-word;
}

.route_row .right_container .title_container a.title {
  font-weight: bold;
  font-size: 14px;
}

.route_row .right_container .title_container a.location {
  font-size: 12px;
  color: #666666;
}

.route_row .right_container .title_container a:hover.location {
  text-decoration: underline;
}

.route_row .right_container .elevation {
  float: right;
}

.route_row .right_container .route_location {
  font-size: 12px;
  font-weight: normal;
  color: #999;
  display: block;
}

.route_row .right_container .route_actions {
  font-size: 10px;
  color: #CCC;
}

.right_container .mmf_action_bar {
  margin-top: 0;
  clear: right;
  border-bottom: 0;
  height: 27px;
}

.right_container .mmf_action_bar .mmf_badge {
  float: left;
  margin-left: 5px;
}

.right_container .mmf_action_bar .mmf_badge_num {
  float: left;
  font-size: 10px;
  font-weight: bold;
}

.right_container .mmf_action_bar .mmf_vert_sep {
  margin-right: 5px;
}

.right_container .mmf_list_expand {
  float: left;
  cursor: pointer;
  margin-top: 5px;
}

/*browse - route list*/
.mmf_route_list_container.route_browse .route_row {
  border-top: 0;
  border-bottom: 2px solid #888888;
}

.mmf_route_list_container.route_browse .route_row .right_container {
  margin-left: 150px;
}

.mmf_route_list_container.route_browse .route_row .right_container .title_container {
  padding-bottom: 3px;
}

.mmf_route_list_container.route_browse .mmf_action_bar {
  clear: none;
}

.mmf_route_list_container .box_top {
  border-bottom: 2px solid #888888;
}

/*Utility - route list*/
.route_row .right_container .mmf_myroute_actions {
  float: right;
  padding-top: 15px;
}

.route_row .right_container .mmf_myroute_actions .mmf_add_to_list {
  font-weight: bold;
  font-size: 12px;
  float: left;
  margin-right: 5px;
  cursor: pointer;
}

.route_row .right_container .mmf_myroute_actions input {
  float: left;
  margin-left: 15px;
}

.route_row .right_container .mmf_myroute_actions .mmf_list_expand {
  margin: 2px 0 0 15px;
}

.route_row .right_container .privacy_icon {
  float: left;
  margin: 20px 5px 0 0;
}

.utility .route_row .right_container .title_container {
  margin: 0 100px 0 25px;
  height: 35px;
}

.utility .route_row .right_container .btm_links {
  margin-left: 25px;
  font-size: 12px;
}

.utility .route_row .right_container .btm_links ul li {
  display: inline;
  padding: 0 10px;
  border-left: 1px solid #AAAAAA;
}

.utility .route_row .right_container .btm_links ul li.first {
  padding-left: 0;
  border: 0;
}

.utility .route_row .right_container .btm_links ul li .delete_link {
  color: #FF0000;
}

/*route brief*/
.brief .right_container {
  margin-left: 117px;
}

.brief .route_row .right_container .title_container a.title {
  font-size: 12px;
}

.brief .route_row .right_container .elevation {
  float: none;
  margin: 3px 0;
}

.brief .route_row {
  height: auto;
}

.brief .route_row .map {
  margin: 7px 3px 3px 3px;
  border: 1px solid #CCC;
  width: 50px;
  height: 50px;
  overflow: hidden;
}

/*expand content*/
.route_row_expand {
  display: none;
}

.route_row_expand .description {
  border-top: 1px solid #888888;
  border-bottom: 1px dotted #888888;
  color: #333333;
  font-size: 12px;
}

.route_row_expand .description p {
  margin: 7px 0;
}

.route_row_expand .elevation_details {
  background: url("//d2i3r43q6ffvz8.cloudfront.net/prod/public/images/route/elev_grad_bg.b78d49232ca9.jpg") repeat-x;
  padding: 10px;
}

.route_row_expand .elevation_details .stat {
  float: left;
  margin-right: 15px;
}

.route_row_expand .elevation_details .stat strong span {
  font-weight: normal;
}

.route_row_expand .elevation_details .stat .label {
  color: #999;
}

#climbs {
  padding: 2px 4px;
  min-height: 400px;
}

.route_elevation_chart {
  min-height: 250px;
  position: relative;
}

.route_climb_information {
  font-size: 12px;
  line-height: 1.5;
  position: relative;
}

.route_climb_thumb {
  float: left;
  margin: 0 5px 0 0;
}

.route_climb_full {
  position: absolute;
  top: 0;
  left: 0;
}

.elevation_details .mmf_climb_item {
  display: inline-block;
  margin-top: 3px;
}

.elevation_details .mmf_climb_img.mmf_cat1 {
  background: url("//d2i3r43q6ffvz8.cloudfront.net/prod/public/images/route/mrkr_climb_1.ce8b7e14537c.png") no-repeat;
}

.elevation_details .mmf_climb_img.mmf_cat3 {
  background: url("//d2i3r43q6ffvz8.cloudfront.net/prod/public/images/route/mrkr_climb_3.fd05446532b9.png") no-repeat;
}

.elevation_details .mmf_climb_img.mmf_cat4 {
  background: url("//d2i3r43q6ffvz8.cloudfront.net/prod/public/images/route/mrkr_climb_4.e32b8b3625c6.png") no-repeat;
}

.elevation_details .mmf_climb_amount {
  display: block;
  font-size: 13px;
  margin-top: -6px;
}

.elevation_details a.mmf_right_link {
  padding-top: 7px;
}

.mmf_climb_description {
  font-size: 13px;
  margin: 3px 0;
}

#export_elevation {
  position: absolute;
  right: 6px;
  top: 1px;
}

/* .route_row .distance_difficulty .mmf_difficulty_container.mmf_medium { display: none; } */
/*Styles that should be in route details already*/
.mmf_title_block .mmf_left_container {
  border: 2px solid #CCCCCC;
  float: left;
  height: 40px;
  width: 60px;
  background: #333333 url("//d2i3r43q6ffvz8.cloudfront.net/prod/public/images/core/template/mmf_miles_bg.7699685dcb7c.png") repeat-x;
  padding: 5px 20px;
  border: medium solid #E0E0E0;
}

.mmf_title_block .mmf_left_container p {
  color: #FFFFFF;
  font-size: 12px;
  margin: 0;
  font-family: Helvetica;
  text-align: center;
}

.mmf_title_block .mmf_left_container span {
  font-family: Helvetica;
  font-size: 22px;
  text-shadow: #333 1px 1px 1px;
}

.mmf_title_block .mmf_right_container {
  float: left;
}

.mmf_title_block h2 {
  float: left;
  color: #424040;
  font-size: 18px;
  margin: 10px 0 0 10px;
  width: 400px;
}

.mmf_title_block .mmf_specs {
  margin-top: 5px;
}

.mmf_title_block .mmf_specs p {
  font-size: 12px;
  font-weight: normal;
  color: #666;
  margin: 0;
}

.mmf_title_block .mmf_specs p a {
  font-weight: bold;
}

.mmf_description p {
  color: #333333;
  line-height: 1.4;
}

.mmf_description p span {
  color: #a6a6a6;
  font-size: 11px;
}

.route_detail_info {
  border-top: 3px solid #336699;
  padding-top: 10px;
}

.route_detail_info .per_complete_container {
  float: right;
  padding-right: 10px;
}

.route_detail_info p {
  margin: 0;
  color: #a6a6a6;
  font-size: 12px;
}

.route_detail_info p strong {
  color: #000000;
}

.route_detail_info p a {
  font-weight: bold;
}

.route_detail_info .route_user_img {
  float: left;
  width: 50px;
  height: 50px;
  margin-right: 10px;
  background-color: #e7e7e7;
}

.route_detail_info .route_user_info {
  float: left;
}

.map_per_bar {
  border: 1px solid #aaaaaa;
  width: 120px;
  height: 15px;
  background: #e7e7e7;
  padding: 2px;
}

.map_per_bar .map_per_done {
  background-color: #287ab5;
  height: 100%;
}

.map_per_bar .map_per_done .map_per_text {
  color: #FFFFFF;
  font-weight: bold;
  padding: 2px 0 0 10px;
}

.mmf_badges_bar .mmf_icon {
  display: block;
  background-color: #e7e7e7;
  border: 0;
  float: left;
  width: 28px;
  height: 28px;
  margin-left: 5px;
}

.mmf_embed {
  float: left;
  background-color: #F0F0F0;
  padding: 10px 0 0;
  width: 100%;
  border: 1px solid #DBDBDB;
}

.mmf_embed span {
  width: 80px;
  margin-right: 10px;
  padding-top: 3px;
  text-align: right;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: bold;
  color: #555555;
  display: block;
  float: left;
}

.mmf_embed input {
  float: left;
  width: 170px;
  height: 12px;
  border: 0;
  background-color: #FFFFFF;
  margin-bottom: 10px;
}

.mmf_embed .mmf_customize_btn {
  display: block;
  background: transparent url("//d2i3r43q6ffvz8.cloudfront.net/prod/public/images/route/icon_customize.326a801c3ba8.png") no-repeat;
  width: 18px;
  height: 18px;
  float: left;
  margin: 2px 0 0 5px;
}

.mmf_action_pallete {
  float: left;
  width: 100%;
  margin-bottom: 10px;
}

.mmf_action_pallete .mmf_badges_bar {
  background-color: #F0F0F0;
  border: 1px solid #DBDBDB;
  padding: 5px 0;
  margin: 0;
}

.mmf_action_pallete .mmf_badges_bar .mmf_badge {
  float: left;
  margin-left: 10px;
}

.mmf_action_pallete .mmf_badges_bar .mmf_badge .mmf_badge_num {
  float: left;
  font-size: 10px;
  font-weight: bold;
}

.mmf_action_pallete .mmf_badges_bar a.mmf_right_link {
  margin-top: 5px;
}

.mmf_action_pallete .mmf_grid_50 .mmf_grid_content {
  padding: 5px 0;
  margin: 0;
}

.mmf_action_pallete .mmf_grid_50 .mmf_grid_content input {
  float: left;
  margin-left: 35px;
}

.mmf_action_pallete .mmf_grid_50 .mmf_grid_content span {
  color: #FFFFFF;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 12px;
  margin-left: 5px;
  margin-top: 3px;
  float: left;
}

.mmf_action_pallete .mmf_grid_50 .mmf_grid_content.mmf_done {
  background-color: #94c40f;
  margin-right: 10px;
}

.mmf_action_pallete .mmf_grid_50 .mmf_grid_content.mmf_like_to {
  background-color: #e59600;
}

.mmf_list_block {
  width: 100%;
  padding: 5px 5px 5px 0;
}

.mmf_list_block .mmf_list_row {
  float: left;
  width: 100%;
  border-top: 1px solid #E1E1E1;
  background-color: #f3f3f3;
}

.mmf_list_block .mmf_list_row .left_col {
  float: left;
  padding: 5px;
  background-color: #FFFFFF;
  border-right: 1px solid #e1e1e1;
}

.mmf_list_block .mmf_list_row .right_col {
  float: left;
  padding: 5px 10px;
}

.mmf_list_block .mmf_list_row .right_col .mmf_heading {
  color: #848484;
  font-size: 12px;
  font-weight: bold;
  margin: 0;
}

.mmf_list_block .mmf_list_row .right_col .mmf_per_bar {
  border: 1px solid #aaaaaa;
  width: 220px;
  height: 20px;
  margin-top: 5px;
  background: #FFFFFF;
}

.mmf_list_block .mmf_list_row .right_col .mmf_per_bar .mmf_per_done {
  background-color: #287ab5;
}

.mmf_list_block .mmf_list_row .right_col .mmf_per_bar .mmf_per_done .mmf_per_text {
  color: #FFFFFF;
  font-weight: bold;
  padding: 2px 0 0 10px;
}

.routes_nearby {
  width: 100%;
  padding: 5px 5px 5px 0;
}

.routes_nearby .mmf_list_row {
  float: left;
  width: 100%;
  border-top: 1px solid #bdbdbd;
  background-color: #FFFFFF;
}

.routes_nearby .mmf_list_row .left_col {
  float: left;
  padding: 10px 5px;
  background-color: #FFFFFF;
}

.routes_nearby .mmf_list_row .right_col {
  float: left;
  padding: 5px 10px;
}

.routes_nearby .mmf_list_row .right_col a.mmf_heading {
  display: block;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 5px;
}

.routes_nearby .mmf_list_row .right_col .mmf_distance {
  color: #000000;
  font-size: 12px;
  float: left;
  width: 90px;
  padding-top: 10px;
}

.routes_nearby .mmf_list_row .right_col .mmf_distance span {
  font-size: 18px;
  font-weight: bold;
}

.routes_nearby .mmf_list_row .right_col .mmf_route_map {
  width: 100px;
  height: 45px;
  float: left;
  background-color: gray;
  margin-right: 5px;
}

.routes_nearby .mmf_list_row .right_col .mmf_elevation {
  float: left;
  padding-top: 15px;
  font-size: 14px;
  font-weight: bold;
}

.routes_nearby .mmf_list_row .right_col .mmf_elevation .mmf_increase {
  color: #009966;
}

.routes_nearby .mmf_list_row .right_col .mmf_elevation .mmf_decrease {
  color: #cc3333;
}

.mmf_route_stats .mmf_stat_row {
  margin-bottom: 10px;
}

.mmf_route_stats .mmf_hr {
  width: 100%;
  height: 1px;
  border-top: 1px solid #e7e7e7;
  clear: both;
  margin: 20px 0;
}

.mmf_route_stats .mmf_stat_col {
  float: left;
  margin-right: 0;
}

.mmf_route_stats .mmf_stat_col p {
  font-size: 12px;
  margin: 0;
  padding-top: 5px;
}

.mmf_route_stats .mmf_stat_col p strong {
  font-size: 14px;
}

.mmf_route_stats .mmf_stat_col p a {
  font-size: 14px;
  font-weight: bold;
}

.mmf_route_stats .mmf_stat_col.mmf_heading {
  font-size: 20px;
  width: 100px;
  text-align: right;
  padding-top: 10px;
}

.mmf_route_stats .mmf_stat_col .mmf_badge {
  float: right;
  margin-right: 0;
}

.mmf_route_stats .mmf_badge_col {
  font-size: 20px;
  width: 50px;
  text-align: right;
  margin-bottom: 10px;
  margin-right: 5px;
}

/*Route Stat Block*/
.mmf_stat_block {
  padding: 5px;
  color: #666666;
  text-align: center;
  margin: 6px;
  font-size: 12px;
  height: 48px;
}

.mmf_stat_block span {
  font-size: 14px;
  color: #666666;
  font-weight: bold;
}

.mmf_stat_block div {
  margin-left: auto;
  margin-right: auto;
}

.mmf_stat_block .mmf_difficulty_container {
  margin-top: 2px;
}

/*Route Difficulty Blocks*/
.mmf_difficulty_container {
  margin-left: auto;
  margin-right: auto;
  margin-top: 3px;
  width: 45px;
}

.mmf_difficulty_container div {
  border: 1px solid #666;
  height: 10px;
  margin: 1px;
  width: 10px;
  font-size: 1px;
  float: left;
}

.mmf_difficulty_container.mmf_easy div, .mmf_difficulty_container.mmf_very_easy div {
  background-color: green;
}

.mmf_difficulty_container.mmf_medium div {
  background-color: blue;
}

.mmf_difficulty_container.mmf_hard div {
  background-color: black;
}

.mmf_difficulty_container.mmf_very_hard div {
  background-color: black;
}

/*Route Landing Page*/
.mmf_pubpriv_stat {
  width: 70px;
  padding: 5px;
  text-align: center;
  margin-top: 10px;
  margin-right: 7px;
  float: left;
}

.mmf_pubpriv_stat hr {
  margin: 2px 0 1px;
}

.mmf_pubpriv_stat strong {
  font-size: 18px;
}

.mmf_pubpriv_stat span {
  font-size: 12px;
  color: #999999;
}

* html .mmf_pubpriv_stat {
  border: 1px solid #999;
}

/*--percentage bars--*/
.mmf_perbar_container {
  float: left;
  margin-left: 20px;
}

.mmf_perbar_container .mmf_perbar_title {
  font-size: 12px;
  color: #888888;
}

.mmf_perbar_container .mmf_perbar_amt {
  float: left;
  display: block;
  color: #000000;
  font-weight: bold;
  font-size: 14px;
  padding: 0 0 0 7px;
}

.mmf_perbar_container .mmf_perbar_type {
  float: left;
  display: block;
  font-size: 12px;
  color: #888888;
  padding: 1px 0 0 3px;
}

.mmf_perbar_outer {
  width: 240px;
  background-color: #e7e7e7;
  padding: 2px 0 2px 2px;
}

.mmf_perbar_outer .mmf_perbar {
  float: left;
}

.mmf_perbar_outer .mmf_perbar .mmf_perbar_inner {
  height: 14px;
  margin-right: 2px;
}

.mmf_perbar_outer .mmf_perbar.mmf_per_road .mmf_perbar_inner {
  background-color: #63503a;
}

.mmf_perbar_outer .mmf_perbar.mmf_per_trail .mmf_perbar_inner {
  background-color: #00AD1D;
}

.mmf_perbar_outer .mmf_perbar.mmf_per_nc .mmf_perbar_inner {
  background-color: #e7e7e7;
}

.mmf_perbar_outer .mmf_perbar.mmf_per_easy .mmf_perbar_inner {
  background-color: #82BF03;
}

.mmf_perbar_outer .mmf_perbar.mmf_per_hard .mmf_perbar_inner {
  background-color: #FEAF03;
}

.mmf_perbar_outer .mmf_perbar.mmf_per_difficult .mmf_perbar_inner {
  background-color: #E5630F;
}

/*Top Row Result actions:*/
.mmf_top_row_actions {
  margin: 15px 0 3px 0;
}

.mmf_top_row_actions a.mmf_right_link {
  padding: 8px 0 0 0;
  outline: none;
}

.mmf_top_row_actions a.mmf_right_link span {
  float: left;
}

.mmf_top_row_actions a.mmf_right_link div {
  float: left;
  margin: 2px 0 0 5px;
}

.mmf_top_row_actions .mmf_pointer_container {
  float: left;
  width: 20px;
  padding: 8px 0 0 8px;
  height: 16px;
}

.mmf_top_row_actions .mmf_secondary_button {
  float: left;
}

.mmf_btm_row_actions {
  clear: both;
  margin-top: 3px;
}

.mmf_btm_row_actions a.mmf_right_link {
  padding-top: 8px;
}

.mmf_btm_row_actions .mmf_pointer_container {
  float: left;
  width: 20px;
  padding: 2px 0 0 8px;
  height: 16px;
}

.mmf_btm_row_actions .mmf_secondary_button {
  float: left;
}

.mmf_btm_row_actions .mmf_row_instructions, .mmf_top_row_actions .mmf_row_instructions {
  float: left;
  margin-left: 15px;
  padding-top: 8px;
  display: block;
  color: #666666;
  font-size: 12px;
}

.mmf_btm_row_actions .mmf_row_instructions strong, .mmf_top_row_actions .mmf_row_instructions strong {
  color: #000000;
}

.mmf_route_sort_by {
  float: right;
}

.mmf_route_sort_by label {
  color: #666666;
  font-size: 12px;
  padding-right: 5px;
}

.mmf_route_sort_by select {
  font-size: 12px;
}

/*elevation chart*/
.elevation_chart table {
  margin-bottom: 15px;
  width: 97%;
  border-collapse: separate;
  font-size: 12px;
  color: #666666;
}

.elevation_chart table th {
  color: #999999;
  font-weight: bold;
  border-bottom: 1px solid #999999;
  text-align: right;
  padding-right: 3px;
}

.elevation_chart table td {
  text-align: right;
  border-bottom: 1px solid #ccc;
  padding-right: 3px;
}

.elevation_chart table tr {
  height: 32px;
}

.elevation_chart table tr.odd {
  background-color: #F4F8FC;
}

.elevation_chart table tr.hover td {
  background-color: #ced8c3;
}

.elevation_chart .mmf_right_link {
  margin-right: 15px;
}

/* Route 3d Video */
#advert_video {
  height: 370px;
  width: 100%;
}

#advert_video #player {
  display: block;
  width: 600px;
  height: 360px;
  position: absolute;
}

.embed_code {
  display: none;
  text-align: center;
  padding-top: 20px;
}

.embed_code textarea {
  text-align: left;
}

#video_footer_actions {
  float: right;
  text-align: right;
}
