.ay_navbar_profile{
    white-space: normal;
    padding: 8px 16px;
    float: left;
    width: auto;
    border: none;
    outline: none;
    display: block;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: inherit;
    text-align: center;
    cursor: pointer;
}

.application_map_space_row{
    position: absolute;
    bottom: 60px;
    margin: 0px;
    width: 100%;
}
.application_map_space_button{
    margin: 10px;
    width: calc(25% - 25px);
    border-radius: 5px;
    border: 1px solid black;
}

/*general styles*/
body, html {
  height: 100%;
  line-height: 1.8;
  overflow-x: hidden;
  font-family: Verdana, sans-serif;
  font-size: 15px;
  box-sizing: border-box;
  color: #333;
  background-color: #fff;
  margin: 0px;
}
.ay_topnav{
    position: fixed;
    width: 100%;
    z-index: 100;
    top: 0;
    /*overflow: hidden;*/
    color: #000 !important;
    background-color: #fff !important;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    height: 50px;
    box-sizing: inherit;
}
.ay_logo{
    float:left;
    padding: 5px;
    border: none;
    display: inline-block;
    outline: 0;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: inherit;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    letter-spacing: 4px;
}
.ay_nav_buttons{
    float: right !important;
    
}
.ay_page_title{
    float: left;
    padding-left: 40px;
    font-size: 20px;
    font-family: 'Raleway',sans-serif;
    color: #474747;
    padding-top: 7px;
}
.ay_page_subtitle{
    float: left;
    padding-left: 40px;
    font-size: 20px;
    font-family: 'Raleway',sans-serif;
    color: #474747;
    padding-top: 7px;
}
.ay_avatar_dropdown{
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}
.ay_avatar_dropdown > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}
.ay_avatar_dropdown > li > a:hover {
    background-color: lightgrey;
}
.ay_nav_button{
    padding: 8px 16px;
    float: left;
    width: auto;
    border: none;
    outline: none;
    display: block;
    white-space: normal;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: inherit;
    text-align: center;
    cursor: pointer;
}
.ay_nav_button_sel{
    padding: 8px 16px;
    float: left;
    width: auto;
    border: none;
    outline: none;
    display: block;
    white-space: normal;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: #f3f3f3;
    text-align: center;
    cursor: pointer;
}
.ay_empty_notice{
    text-align: center;
    padding: 10px;
    color: darkgray;
    font-style: italic;
}
/*general styles*/

/*spaces page*/
.ay_spaces_header{
    margin: 0px;
    margin-top: 10px;
    text-align: center !important;
    font-family: "Raleway", sans-serif;
    font-weight: 400;
    font-size: 24px;
    box-sizing: inherit;
    line-height: 1.1;
    color: inherit;   
}
.ay_gallery_section{
    height: 100%;
    padding: 0.01em 16px;
    padding-top: 25px;
    background-color: #eccc93;
}
.ay_gallery{
    margin-top: 20px;
    padding-top: 100px;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    padding: 0.01em 16px;
    box-sizing: inherit;
    text-align: center !important;
    filter: grayscale(75%);
}
.ay_gallery_row{
    padding-left: 0px;
    padding: 0 8px;
    box-sizing: inherit;
    color: #000 !important;
}
.ay_gallery_item {
    padding: 0px;
    margin: 1%;
    margin-bottom: 1%;
    width: 23%;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    margin-bottom: 16px !important;
    float: left;
    box-sizing: inherit;
}
.ay_vertical_gallery{
    padding: 0px;
    float: left;
    box-sizing: inherit;
    color: #000 !important;
    width: 48%;
}
.ay_gallery_image_large{
    border-radius: 8px;
    max-width: 100%;
    height: auto;
    margin-bottom: -5px;
    border-style: none;
    vertical-align: middle;
    border: 0; 
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}
.ay_vertical_details{
    padding: 10px;
    width: 48%;
    float: right;
    box-sizing: inherit;
    background-color: #f1f1f1;
    border-radius: 8px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}
.ay_vertical_details_header{
    
}
.ay_assembly_header_title{
    line-height: 1.1;
    color: inherit;
    box-sizing: inherit;
    font-family: "Raleway", sans-serif;
    font-weight: 400;
    margin: 10px 0;
    font-size: 24px;
}
.ay_assembly_header_descrip{
    margin: 0 0 10px;
    box-sizing: inherit;
    line-height: 1.8;    
}
.ay_assembly_heading{
    font-family: "Segoe UI",Arial,sans-serif;
    font-weight: 400;
    margin: 10px 0;
    font-size: 24px;
    line-height: 1.1;
    color: inherit;
}
.ay_assembly_descrip{
    font-size: 8pt;
    margin: 0 0 10px;
}
.ay_assembly_link{
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: grey;
    border-top-style: solid;
    border-top-width: 1px;
    border-top-color: grey;
    box-sizing: inherit;
}
.ay_assembly_img_container{
    padding: 0px;
    margin: 1%;
    width: 30%;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    box-sizing: inherit;
    margin-bottom: 16px !important;
    float: left;
    display: inline-block;
}
.ay_assembly_img_caption{
    font-size: 10px;
    margin: 2px;
    text-align: center;
    border-bottom: darkgray;
    border-bottom-style: solid;
    border-bottom-width: thin;
}
.ay_assembly_img{
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: -5px;
    border-style: none;
    vertical-align: middle;
    box-sizing: inherit;
}
.ay_spaces_container{
    height: 400px;
    padding: 0.01em 16px;
    padding-top: 0.01em;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    padding-top: 50px;
    border-bottom: currentColor;
    border-bottom-style: ridge;
    border-bottom-width: 2px;
}
.ay_button{
    padding: 0px;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    display: block;
    width: 100%;
    -moz-user-select: none;
    border: none;
    outline: 0;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    box-sizing: inherit; 
}
.ay_button_border{
    padding: 0px;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    display: block;
    width: 100%;
    -moz-user-select: none;
    outline: 0;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    box-sizing: inherit; 
    border-top-style: solid;
    border-top-width: thin;
    border-top-color: darkgray;
}
.ay_spaces_description{
    margin: 0px;
    text-align: center !important;
    font-size: 18px !important;
    box-sizing: inherit;
}
/*spaces page*/

/*assemblies page*/
.ay_assy_container{    
    min-height: 100%;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    padding: 0.01em 16px;
    box-sizing: inherit;
    padding-top: 50px;
    border-bottom-style: ridge;
    border-bottom-width: 2px;
}
.ay_assy_header{
    margin: 0px;
    margin-top: 10px;
    text-align: center !important;
    font-family: "Segoe UI",Arial,sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 1.1;
    color: inherit;
}
.ay_assy_description{
   margin: 0px;
   text-align: center !important;
   font-size: 18px !important;
   box-sizing: inherit;
   color: #000 !important;
}
.ay_assy_gallery_container{
    margin-top: 20px;
    text-align: center !important;
    filter: grayscale(75%);
    padding: 0 8px;
}
.ay_assy_img_container{
    padding: 1%;
    width: calc(100%/6);
    margin-bottom: 16px !important;
    float: left;    
}
.ay_assy_img_card{
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}
.ay_assy_img_button{
    font-size: 12px;
    padding: 0px;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    display: block;
    width: 100%;
    -moz-user-select: none;
    border: none;
    outline: 0;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    box-sizing: inherit;    
}
.ay_assy_img_button_border{
    font-size: 12px;
    padding: 0px;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    display: block;
    width: 100%;
    -moz-user-select: none;
    outline: 0;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    box-sizing: inherit;  
    border-top-style: solid;
    border-top-width: thin;
    border-top-color: darkgray;
}
.ay_assy_img{
    width: 100%;
    margin-bottom: -5px;
    border-style: none;
    vertical-align: middle;
}
.ay_assy_img_caption{
    font-size: 12px;
    color: #000 !important;
    background-color: #f1f1f1 !important;
    display: block;
    width: 100%;
    -moz-user-select: none;
    border: none;
    outline: 0;
    padding: 8px 16px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    box-sizing: inherit;
}
.ay_assy_assembly_row{
    padding: 0.01em 16px;
    min-height: 100%;
    padding-top: 50px;
    background-color: #eccc93;
    width:100%;
}
.ay_assy_assembly_row_alt{
    padding: 0.01em 16px;
    min-height: 100%;
    padding-top: 50px;
    width:100%;
    background-color: #f1f1f1;
}
.ay_assy_row_pad{
    padding: 0 8px;  
    padding-left: 0px;
}
.ay_assy_img_col{
    padding: 0px;
    float: left;
    width: 66.66666%;
}
.ay_assy_det_col{
    width: 33.33333%;
    padding: 10px;
    float: right;
    background-color: #f1f1f1;
    border-radius: 8px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}
.ay_assy_img_large{
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: -5px;
    border-style: none;
    vertical-align: middle;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}
.ay_assy_det_head{
    font-family: "Segoe UI",Arial,sans-serif;
    font-weight: 400;
    margin: 10px 0;
    font-size: 24px;
    line-height: 1.1;
    color: inherit;
}
.ay_assy_det_desc{
    margin: 0 0 10px;
}
/*assemblies page*/

/*Footer*/
.ay_footer_container{
    position: fixed;
    width: 100%;
    height: 60px;
    bottom: 0;
    padding: 5px;
    margin: 0px;
    text-align: center !important;
    color: #fff !important;
    background-color: #000 !important;
    display: block;
}
.ay_footer_division{
    padding: 0px;
    width: 33.33333%;
    float: left;
}
.ay_footer_division_right{
    padding: 0px;
    width: 33.33333%;
    float: right;
}
.ay_footer_contact_container{}
.ay_footer_company{}
.ay_footer_contact{}
.ay_footer_text_format{
    margin: 0px;
    font-size: 10px;
    text-align: left;
}
.ay_footer_text_format_right{
    margin: 0px;
    font-size: 10px;
    text-align: right;
}
/*Footer*/


.ay_gallery_item_img{
    width:100%;
}



/*-- mc added the stuff below --*/

/*-- HOTSPOTS STYLE --*/
img{
  max-width: 100%;
  height: auto;
}
.map{
  position: relative;
  width: 100%;
  margin: 0px;
}
.map img{
  display: block;
  width: 100%;
}
.map-popup{
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 99;
  width: 60%;
  padding: 2rem;
  background-color: #fff;
  /*transition: all 300ms ease-in;*/
  transform: translate(-50%,-50%);
  box-shadow: 0 0 24px rgba(0,0,0,0.22);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.map-popup > *:first-child{ margin-top: 0; }
.map-popup > *:last-child{ margin-bottom: 0; }
.map-popup.open{
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}
.marker{  /*-- the actual hotspot --*/
  position: absolute;
  z-index: 1;
  display: inline-block;
  width: 36px;
  height: 36px;
  color: #fff;
  line-height: 36px;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  background-color: tomato;
  transition: all 300ms;
  border: 0px;
  padding: 0px;
}
.marker1{
  top: 30%;
  left: 20%;
}
.marker2{
  top: 50%;
  left: 64%;
}
@media only screen and (min-width:48em){
  .map-item{
    position: absolute;
    width: 36px;
    height: 36px;
    }
  .map-item .marker{
      top: auto;
      left: auto;
    }
  .map-popup{
    position: absolute;
    left: 58px;
    width: 280px;
    transform: translateY(-50%);
  }
  .map-popup:before{
    content: "";
    position: absolute;
    top: 50%;
    left: -16px;
    margin-top: -16px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 16px 16px 0;
    border-color: transparent #fff transparent transparent;
  }
  .map-popup.edge{
    left: auto;
    right: calc(100% + 24px);
  }
  .map-popup.edge:before{
    left: auto;
    right: -16px;
    border-width: 16px 0 16px 16px;
    border-color: transparent transparent transparent #fff;
  }
}
/*-- HOTSPOTS STYLE --*/


/*-- FIXED MODAL STYLE --*/
/*-- modal styling --*/
.modal{
  top: 0px;
  left: 0px;
  padding-top: 50px;
}
.modal-content {
  border-radius: 0;
  border: none;
}
.modal-header {
  border-bottom-color: #EEEEEE;
  background-color: #FAFAFA;
  padding: 7px;
  margin-bottom: 5px;
}
.modal.left .modal-dialog{
  position: fixed;
  margin: auto;
  width: 320px;
  height: 100%;
  -webkit-transform: translate3d(0%, 0, 0);
      -ms-transform: translate3d(0%, 0, 0);
       -o-transform: translate3d(0%, 0, 0);
          transform: translate3d(0%, 0, 0);
}
.modal.left .modal-content{
  height: 100%;
  overflow-y: auto;
}
.modal.left .modal-body{
  padding: 15px 15px 80px;
}
/*-- fade in and out --*/
.modal.left.fade .modal-dialog{
  left: -320px;
  -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
     -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
       -o-transition: opacity 0.3s linear, left 0.3s ease-out;
          transition: opacity 0.3s linear, left 0.3s ease-out;
}
.modal.left.fade.in .modal-dialog{
  left: 0px;
  width: 100%;
  padding: 5px;
  padding-bottom: 55px;
}
/* ----- FIXED MODAL STYLE ----- */

.ay_product_thumbnail_container{
  position:relative;
  margin: 2px;
  border: 1px solid darkgrey;
  background-color: white;
}
.ay_product_thumbnail{
  width: 80px !important;
  min-height: 80px !important;
  margin: 8px;
}
.ay_product_thumbnail_title{
  font-size: 10px;
  background-color: #ffbc58;
  width: 100%;
}
.ay_products_container_twocol{
  float: right;
  width: 200px;
  padding: 0px;
  height: 100%;
}
.ay_products_container_col_50{
  width: 50%;
  float: left;
  position: relative;
}

.project_row{
    margin: 0px;
    height: 30px;
    border-bottom: 1px dashed lightgrey;
/*    font-size:14px;
    border-top-style:solid;
    border-top-width:1px;
    border-top-color:darkgrey;
    background-color:#d0d8db;
    margin: 5px 0px;*/
}
.project_row_name{
    min-height:1px;
    padding:0px;
    margin:0px;
    font-size:14px;
    padding-left:5px;
    width: 16%;
    float: left;
    height: inherit;
}
.project_row_number{
    min-height:1px;
    padding:0px;
    margin:0px;
    font-size:14px;
    padding-left:5px;
    width: 10%;
    float: left;
    height: inherit;
}
.project_row_description{
    min-height:1px;
    padding:0px;
    margin:0px;
    font-size:14px;
    padding-left:5px;
    text-align:left;
    width: 33%;
    float: left;
    height: inherit;
}
.project_row_text{
    min-height:1px;
    color:#989393;
    font-size:9px;
    text-align:right;
    padding:3px;
    width: 8%;
    float: left;
    position: relative;
    min-height: 1px;
    height: inherit;
}
.project_row_action{
    min-height: 1px;
    color: #989393;
    font-size: 10px;
    text-align: right;
    padding: 5px;
    width: 17%;
    float: left;
    height: inherit;
}
.project_row_action>button{
    border: none;
    color: #647b98;
    background: transparent;
}

.projects_card{
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    position: relative;
    min-height: 1px;
    float: left;
    width: 100%;
}
.projects_card_container{
    padding-top: 60px;
    padding-bottom:60px;
}
.projects_card_header_row{
    padding: 5px;
    background-color: #9f9f9f;
    margin: 0px;
    height: 35px;
}
.projects_card_header_row>p{
    margin:0px;
    float:left;
}
.projects_card_header_row>button{
    float: right;
    display:inline;
    font-size:12px;
    padding: 5px;
}

.project_detail_container{
    min-height:100%;
    padding-top:50px;
    padding-bottom:100px;
}
.project_detail_container_row{
    margin-top:20px;
    border-top:grey 1px solid;
    border-bottom:grey 1px solid;
    position: relative;
}
.project_detail_container_row>button{
    float:right;
    display:inline;
    font-size:12px;
    padding:5px;
    top:5px;
    right:5px;
    z-index:1;
    position: absolute;
}
.project_detail_description_row{
    margin:0px;
    padding:0px
}
.project_detail_name_row{
    margin:0px;
    padding:0px
}
.project_detail_number_row{
    margin:0px;
    padding:0px
}
.project_detail_text{
    padding:4px;
    font-size:9px;
    color:grey;
    text-align:right;
    width: 16.66666667%;
    float: left;
    position: relative;
    min-height: 1px;
}
.project_detail_name{
    padding-left:5px;
    font-size:16px;
    width: 83.33333333%;
    float: left;
    position: relative;
    min-height: 1px;
}
.project_detail_description{
    padding-left:5px;
    font-size:16px;
    width: 83.33333333%;
    float: left;
    position: relative;
    min-height: 1px;
}
.project_detail_number{
    padding-left:5px;
    font-size:16px;
    width: 83.33333333%;
    float: left;
    position: relative;
    min-height: 1px;
}
.ay_project_admin_button{
    color: #fff;
    background-color: #5bc0de;
    padding: 5px;
    font-size: 12px;
    line-height: 1.3333333;
    border-radius: 6px;
    border: none;
    float: right;    
    width: 100%;
    margin-bottom: 5px;
    margin-top: 5px;
}

.space_row_text{
    min-height:1px;
    color:#989393;
    font-size:9px;
    text-align:right;
    padding:3px;
    width: 8.33333333%;
    float: left;
    position: relative;
}
.space_row_name{
    min-height:1px;
    padding:0px;
    margin:0px;
    font-size:14px;
    padding-left:5px;
    width: 25%;
    float: left;
    position: relative;
}
.space_row_type{
    min-height:1px;
    padding:0px;
    margin:0px;
    font-size:14px;
    padding-left:5px;
    width: 25%;
    float: left;
    position: relative;
}
.space_row_quantity{
    min-height:1px;
    padding:0px;
    margin:0px;
    font-size:14px;
    padding-left:5px;
    text-align:center;
    width: 8.33333333%;
    float: left;
    position: relative;
}
.space_container{
    padding: 0px;
    margin: 0px;
    padding-bottom: 5px;
}
.space_row_actions{
    min-height:1px;
    color:#989393;
    font-size:10px;
    text-align:right;
    padding:5px;
    width: 16.66666667%;
    float: left;
    position: relative;
}
.space_row{
    font-size:14px;
    border-top-style:solid;
    border-top-width:1px;
    border-top-color:darkgrey;
    background-color:#d0d8db;
    margin: 0px;
    padding: 0px;
}
.space_details_container{
    width: calc(100% - 20px);
    margin-left: 20px;
}

.assembly_row{
    font-size:10px;
    padding-left:20px;
    padding-right: 10px;
    background-color: whitesmoke;
    margin: 0px;
    padding: 0px 5px;
}
.assembly_type_row{
    padding-left:15px;
    border-top-style:dashed;
    border-top-color:grey;
    border-top-width:1px;
    background-color:lightgrey;
    margin: 0px;
    padding: 0px 5px;
}
.assembly_row_designvalue{
    min-height:1px;
    font-size:10px;
    color:grey;
}
.assembly_row_header{
    min-height:1px;
    font-size:10px;
    color:grey;
    padding: 0px;
    font-style:bold;
    float:left;
}
.assembly_row_name{
    min-height:1px;
    font-size:10px;
    color:grey;
    padding: 0px;
    font-style:bold;
}
.assembly_row_qty{
    min-height:1px;
    font-size:10px;
    color:grey;
}

.project_plan_row{
    padding: 5px;
    background-color: #9f9f9f;
    margin: 0px;
}
.project_plan_row>p{
    margin:0px;
    float:left;
}
.project_plan_row>button{
    float: right;
    display: inline;
    font-size: 12px;
    padding: 5px;
}

.BOMcol{
    margin-left:10px;
    padding: 0px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    width: calc(35% - 10px);
    float: left;
    position: relative;
    min-height: 1px;
}
.PPcol{
    padding: 0px;
    margin: 0px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    width: 65%;
    float: left;
    position: relative;
    min-height: 1px;
}
/*-- APPLICATION MAP TOOLTIP ------------------------------------------------ */