/* Section 10 */

#section-10-connected {
   display: none;
   width: 464px;
   margin: auto;
}

#section-10-portal-darcels {
   width: 100%;
   height: 155px;
   display: flex;
   margin-top: 16px;
   overflow-x: auto;
   overflow-y: hidden;
   -webkit-overflow-scrolling: touch;
}

a.section-10-portal-thumb {
   border: 6px solid transparent;
   cursor: pointer;
   height: 128px;
}

a.section-10-portal-thumb.selected {
   border-color: #FFF;
}

a.section-10-portal-thumb:first-child {
   margin-left: auto;
}

a.section-10-portal-thumb:last-child {
   margin-right: auto;
}

#section-10-portal-darcels img {
   width: 128px;
}

#section-10-portal-darcels p {
   margin-top: 40px;
}

.section-10-portal-action {
   float: left;
   margin: 12px;
   margin-bottom: 0;
   width: 208px !important;
   box-sizing: border-box;
   opacity: 0.25;
   transition: opacity 0.25s ease-in !important;
   pointer-events: none;
}

.section-10-portal-action.enabled {
   pointer-events: auto;
   opacity: 1;
}

.section-10-portal-action.wait {
   pointer-events: none;
   background-image: url('../img/generating.gif');
   color: #000 !important;
   background-size: 208px 48px;
   background-repeat: no-repeat;
   opacity: 1;
}

a#section-10-portal-download {
   background-color: #000;
   color: #FFF;
}

p#section-10-portal-note {
   font-size: 14px;
   font-style: italic;
}

#section-10-portal-canvas {
   width: 0px;
   height: 0px;
   overflow: hidden;
}

@media only screen and (max-width: 926px) {
   #section-10-connected {
      width: 100%;
   }

   .section-10-portal-action {
      margin-left: auto;
      margin-right: auto;
      float: none;
   }

   a#section-10-portal-download {
      background-color: #FFCC00;
      color: #FFF;
   }
}