@import "main";

#resourceDetailsPopup h4 {
  float:left;
}



#resourceDetailsPopup #userDetailsPopup {
  min-width: 300px;
  max-width: 1000px;
  width: auto;
}

#resourceDetailsPopup ul {
  margin-left: 25px;
}

#resourceDetailsPopup .resourceNameTitle, #userDetailsPopup #userDetailsName {
  border-bottom: solid 1px #000;
  font-size: 1.2em;
  margin-bottom: 3px;
  font-weight: bold;
}

#resourceDetailsPopup .hideResourceDetailsPopup {
  float:right;
  font-size: 1em;
  font-weight: normal;
}

#resourceDetailsPopup .customAttribute, #userDetailsPopup .customAttribute {
  font-size: inherit;
}

#resourceDetailsPopup .attributes {
  border-left: solid 1px #ced1c5;
}

#resourceDetailsPopup .description, #resourceDetailsPopup .attributes {
  padding: 10px 5px;
  float: left;
  max-width: 400px;
}

//#resourceDetailsPopup .resourceImage {
//  max-width: 200px;
//  float: left;
//}

//#resourceDetailsPopup .resourceImage img {
//  max-height: 200px;
//  max-width: 200px;
//}

#resourceDetailsDiv, #userDetailsDiv, #customize-columns {
  display: none;
  position: absolute;
  border: solid 2px #212121;
  background-color: #fff;
  padding: 5px;
  .box-shadow(0px 0px 3px 0px #212121);
  z-index: 99999;
}

.resourceNameSelector {
	cursor:pointer;
}

#userDetailsPopup .label {
  font-weight: bold;
  color: #000;
}

@media only screen and (max-device-width: 480px) {
  #resourceDetailsPopup, #userDetailsPopup {
    min-width: 250px;
    max-width: 310px;
    font-size: .8em;
  }

  #resourceDetailsPopup .description, #resourceDetailsPopup .attributes, #userDetailsPopup .attributes {
    max-width: 100%;
    float: none;
  }

  #resourceDetailsPopup .resourceImage {
    float: none;
  }

  #resourceDetailsPopup ul, #resourceDetailsPopup li {
    margin-left: -10px;
  }

  #resourceDetailsPopup .attributes {
    border: none;
  }
}