You are here

Home » API reference » Commerce Guys Marketplace 7

commerceguys-marketplace.css in Commerce Guys Marketplace 7 

/* Styling Tabs */
.page-commerceguys-marketplace #branding ul.tabs {
  position: relative;
  float: right; }

.marketplace,
#marketplace-listing-form {
  background-color: black;
  border: 1px solid #555555;
  border-width: 0 1px 1px 1px;
  color: white;
  margin: 0 auto;
  padding: 0; }

/* Other Marketplace page overrides */
.page-commerceguys-marketplace {
  background: transparent; }
  .page-commerceguys-marketplace #page {
    padding: 0;
    background-color: #000; }
  .page-commerceguys-marketplace #branding {
    padding-left: 40px;
    padding-right: 40px; }
    .page-commerceguys-marketplace #branding ul.tabs {
      height: 42px; }
  .page-commerceguys-marketplace #overlay #overlay-title-wrapper {
    height: 50px; }
    .page-commerceguys-marketplace #overlay #overlay-title-wrapper #overlay-title {
      font: 0/0 none; }
  .page-commerceguys-marketplace #overlay #overlay-close-wrapper {
    right: 0; }
  .page-commerceguys-marketplace #overlay #overlay-close,
  .page-commerceguys-marketplace #overlay #overlay-close:hover {
    background: transparent url("images/close.png") no-repeat center center; }
  .page-commerceguys-marketplace #overlay #overlay-titlebar {
    background: transparent;
    box-shadow: none;
    padding: 0; }
  .page-commerceguys-marketplace #overlay #overlay-content {
    background: transparent;
    padding: 0; }
    .page-commerceguys-marketplace #overlay #overlay-content #branding {
      padding: 0; }
    .page-commerceguys-marketplace #overlay #overlay-content #page {
      padding: 0; }
  .page-commerceguys-marketplace #overlay .marketplace,
  .page-commerceguys-marketplace #overlay #marketplace-listing-form {
    border-width: 1px; }
  .page-commerceguys-marketplace #overlay-tabs-wrapper {
    height: 50px; }
  .page-commerceguys-marketplace #overlay-tabs {
    right: 0; }
  .page-commerceguys-marketplace #overlay-tabs li,
  .page-commerceguys-marketplace #overlay-tabs li.active,
  .page-commerceguys-marketplace #branding ul.tabs li,
  .page-commerceguys-marketplace #branding ul.tabs li.active {
    float: left;
    padding: 0;
    margin: 0; }
    .page-commerceguys-marketplace #overlay-tabs li a,
    .page-commerceguys-marketplace #overlay-tabs li a:focus,
    .page-commerceguys-marketplace #overlay-tabs li a:active,
    .page-commerceguys-marketplace #overlay-tabs li a:visited,
    .page-commerceguys-marketplace #overlay-tabs li a:hover,
    .page-commerceguys-marketplace #overlay-tabs li.active a,
    .page-commerceguys-marketplace #overlay-tabs li.active a:focus,
    .page-commerceguys-marketplace #overlay-tabs li.active a:active,
    .page-commerceguys-marketplace #overlay-tabs li.active a:visited,
    .page-commerceguys-marketplace #overlay-tabs li.active a:hover,
    .page-commerceguys-marketplace #branding ul.tabs li a,
    .page-commerceguys-marketplace #branding ul.tabs li a:focus,
    .page-commerceguys-marketplace #branding ul.tabs li a:active,
    .page-commerceguys-marketplace #branding ul.tabs li a:visited,
    .page-commerceguys-marketplace #branding ul.tabs li a:hover,
    .page-commerceguys-marketplace #branding ul.tabs li.active a,
    .page-commerceguys-marketplace #branding ul.tabs li.active a:focus,
    .page-commerceguys-marketplace #branding ul.tabs li.active a:active,
    .page-commerceguys-marketplace #branding ul.tabs li.active a:visited,
    .page-commerceguys-marketplace #branding ul.tabs li.active a:hover {
      background: #252525;
      border: 1px solid #707070;
      border-width: 1px 0 1px 1px;
      color: #a1a1a1;
      line-height: 1em;
      margin: 0 !important;
      padding: 15px 30px;
      -moz-box-shadow: 0 0 0 transparent;
      -webkit-box-shadow: 0 0 0 transparent;
      box-shadow: 0 0 0 transparent;
      -moz-border-radius: 0 0 0 0;
      -webkit-border-radius: 0 0 0 0;
      border-radius: 0 0 0 0; }
      .page-commerceguys-marketplace #overlay-tabs li a.active,
      .page-commerceguys-marketplace #overlay-tabs li a:focus.active,
      .page-commerceguys-marketplace #overlay-tabs li a:active.active,
      .page-commerceguys-marketplace #overlay-tabs li a:visited.active,
      .page-commerceguys-marketplace #overlay-tabs li a:hover.active,
      .page-commerceguys-marketplace #overlay-tabs li.active a.active,
      .page-commerceguys-marketplace #overlay-tabs li.active a:focus.active,
      .page-commerceguys-marketplace #overlay-tabs li.active a:active.active,
      .page-commerceguys-marketplace #overlay-tabs li.active a:visited.active,
      .page-commerceguys-marketplace #overlay-tabs li.active a:hover.active,
      .page-commerceguys-marketplace #branding ul.tabs li a.active,
      .page-commerceguys-marketplace #branding ul.tabs li a:focus.active,
      .page-commerceguys-marketplace #branding ul.tabs li a:active.active,
      .page-commerceguys-marketplace #branding ul.tabs li a:visited.active,
      .page-commerceguys-marketplace #branding ul.tabs li a:hover.active,
      .page-commerceguys-marketplace #branding ul.tabs li.active a.active,
      .page-commerceguys-marketplace #branding ul.tabs li.active a:focus.active,
      .page-commerceguys-marketplace #branding ul.tabs li.active a:active.active,
      .page-commerceguys-marketplace #branding ul.tabs li.active a:visited.active,
      .page-commerceguys-marketplace #branding ul.tabs li.active a:hover.active {
        background: #000;
        border-bottom: 1px solid #000;
        color: #ffc015;
        margin: 0;
        padding: 15px 30px; }
    .page-commerceguys-marketplace #overlay-tabs li a:hover,
    .page-commerceguys-marketplace #overlay-tabs li.active a:hover,
    .page-commerceguys-marketplace #branding ul.tabs li a:hover,
    .page-commerceguys-marketplace #branding ul.tabs li.active a:hover {
      color: #ffc015; }
    .page-commerceguys-marketplace #overlay-tabs li:last-child a,
    .page-commerceguys-marketplace #overlay-tabs li.active:last-child a,
    .page-commerceguys-marketplace #branding ul.tabs li:last-child a,
    .page-commerceguys-marketplace #branding ul.tabs li.active:last-child a {
      border-right: 1px solid #707070; }

.marketplace-header {
  display: inline-block;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
  padding: 30px;
  width: 100%; }
  .marketplace-header:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }
  .marketplace-header a:link, .marketplace-header a:visited {
    color: white; }
  .marketplace-header a:hover {
    color: #00afef;
    text-decoration: none; }
  .marketplace-header .logo {
    float: left; }
  .marketplace-header .item-list {
    padding: 0;
    text-align: right; }
    .marketplace-header .item-list ul {
      margin-bottom: 0;
      text-align: right; }
      .marketplace-header .item-list ul li {
        display: inline;
        line-height: 55px;
        padding: 0 15px; }

.status-container {
  background: #2c2c2c;
  color: #fff;
  font-size: 22px;
  line-height: 1.5em;
  padding: 15px 70px; }
  .status-container .message {
    padding: 6px 0; }

.not-registered {
  padding: 60px 80px;
  background: #0265a5 url("images/flag.png") no-repeat -20px -20px; }
  .not-registered a {
    background: #018cc8;
    border: 2px solid #56ade6;
    color: #fff;
    float: right;
    font-size: 16px;
    padding: 5px 50px; }
    .not-registered a:hover {
      background: #0097d8; }

.success .message {
  background: transparent url("images/success.png") no-repeat left center;
  padding-left: 70px; }

.empty-message {
  color: #fff;
  font-size: 22px;
  line-height: 1.5em;
  padding: 70px;
  text-align: center; }

.marketplace-promotions {
  background: black url("images/slide-overlay.png") repeat 0 0;
  overflow: hidden; }
  .marketplace-promotions .bx-wrapper {
    margin-bottom: 0; }
    .marketplace-promotions .bx-wrapper .bx-viewport {
      -moz-box-shadow: 0;
      -webkit-box-shadow: 0;
      box-shadow: 0;
      border: 0;
      background: #fff;
      left: 0;
      overflow: visible !important; }
      @media screen and (max-width: 768px) {
        .marketplace-promotions .bx-wrapper .bx-viewport {
          overflow: hidden !important; } }
  .marketplace-promotions .bx-controls .slide-overlay-left,
  .marketplace-promotions .bx-controls .slide-overlay-right {
    background: transparent url("images/slide-overlay.png") repeat 0 0;
    height: 320px;
    position: absolute;
    top: 0; }
    @media screen and (max-width: 768px) {
      .marketplace-promotions .bx-controls .slide-overlay-left,
      .marketplace-promotions .bx-controls .slide-overlay-right {
        display: none; } }
  .marketplace-promotions .bx-controls .slide-overlay-left {
    right: 100%; }
  .marketplace-promotions .bx-controls .slide-overlay-right {
    left: 100%; }
  .marketplace-promotions .bx-controls a.bx-next,
  .marketplace-promotions .bx-controls a.bx-prev {
    background-image: url("images/slide-controls.png");
    width: 34px;
    height: 34px; }
  .marketplace-promotions .bx-controls a.bx-next {
    right: -40px;
    background-position: -42px -35px; }
    .marketplace-promotions .bx-controls a.bx-next:hover {
      background-position: -42px 0; }
    @media screen and (max-width: 768px) {
      .marketplace-promotions .bx-controls a.bx-next {
        right: 10px; } }
  .marketplace-promotions .bx-controls a.bx-prev {
    left: -40px;
    background-position: 0 -35px; }
    .marketplace-promotions .bx-controls a.bx-prev:hover {
      background-position: 0 0; }
    @media screen and (max-width: 768px) {
      .marketplace-promotions .bx-controls a.bx-prev {
        left: 10px; } }
  .marketplace-promotions #commerceguys-marketplace-slideshow {
    margin: 0; }
    .marketplace-promotions #commerceguys-marketplace-slideshow li {
      background: #000;
      height: 320px;
      list-style: none;
      overflow: hidden;
      margin: 0;
      padding: 0;
      width: 580px; }

.marketplace-content {
  background: white url("images/bg-sidebar.gif") repeat-y 0 0;
  color: #000;
  width: 100%;
  display: inline-block; }
  .marketplace-content:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }
  .marketplace-content a:hover {
    text-decoration: none; }
  .marketplace-content .marketplace-sidebar {
    float: left;
    margin: 20px 20px 20px 45px;
    margin-top: 85px;
    width: 245px; }
    .marketplace-content .marketplace-sidebar .item-title {
      color: #898989;
      font-size: 13px;
      margin-bottom: 10px;
      text-transform: lowercase; }
    .marketplace-content .marketplace-sidebar .item-list ul {
      margin: 0;
      padding: 0; }
    .marketplace-content .marketplace-sidebar .item-list ul li {
      list-style: none;
      margin-left: 0; }
      .marketplace-content .marketplace-sidebar .item-list ul li a {
        color: #000;
        font-size: 16px;
        text-transform: lowercase; }
        .marketplace-content .marketplace-sidebar .item-list ul li a:hover {
          color: #00afef; }
  .marketplace-content .marketplace-addons-wrapper {
    margin-left: 350px; }
    .marketplace-content .marketplace-addons-wrapper h3 {
      color: #2aace2;
      font-weight: normal;
      margin-left: 10px;
      margin-top: 45px;
      text-transform: lowercase; }
    .marketplace-content .marketplace-addons-wrapper .marketplace-list {
      margin-bottom: 45px; }
      .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon {
        float: left;
        display: inline-block;
        height: 202px;
        padding: 10px;
        width: 302px;
        -webkit-box-sizing: border-box;
        /* Safari/Chrome, other WebKit */
        -moz-box-sizing: border-box;
        /* Firefox, other Gecko */
        box-sizing: border-box;
        /* Opera/IE 8+ */ }
        .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a {
          border: 1px solid #c2c2c2;
          float: left;
          height: 182px;
          margin: 1px;
          position: relative;
          width: 282px; }
          .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a img {
            max-width: 100%; }
          .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay {
            background: transparent url("images/bg-overlay.png") repeat 0 0;
            color: #fff;
            display: none;
            height: 180px;
            left: 0;
            padding: 15px;
            position: absolute;
            top: 0;
            width: 280px;
            -webkit-box-sizing: border-box;
            /* Safari/Chrome, other WebKit */
            -moz-box-sizing: border-box;
            /* Firefox, other Gecko */
            box-sizing: border-box;
            /* Opera/IE 8+ */ }
          .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a:hover .addon-overlay {
            display: block; }
        .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay .title {
          color: #2aace2;
          font-size: 20px;
          margin-bottom: 10px; }
        .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay .tagline {
          font-size: 14px;
          height: 85px; }
        .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay .category {
          color: #acacac; }

.marketplace-trainings {
  display: inline-block;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
  background: #262626;
  padding: 45px;
  width: 100%;
  margin: -5px 0; }
  .marketplace-trainings:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }
  .marketplace-trainings h3 {
    color: #fff;
    font-weight: normal;
    text-transform: lowercase; }
  .marketplace-trainings .marketplace-training-event-title {
    color: white;
    font-size: 16px;
    margin-bottom: 10px; }
  .marketplace-trainings .marketplace-training {
    -webkit-box-sizing: border-box;
    /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;
    /* Firefox, other Gecko */
    box-sizing: border-box;
    /* Opera/IE 8+ */
    margin: 0 0 10px;
    padding: 10px;
    width: 100%; }
    .marketplace-trainings .marketplace-training:hover {
      background: #151515; }
      .marketplace-trainings .marketplace-training:hover a {
        text-decoration: none; }
      .marketplace-trainings .marketplace-training:hover .marketplace-training-event-title {
        color: #2aace2; }
  .marketplace-trainings .marketplace-training-event-content {
    color: #898989;
    width: 100%; }
    .marketplace-trainings .marketplace-training-event-content .t.location {
      margin-left: 20px; }
    .marketplace-trainings .marketplace-training-event-content .t-audience {
      float: right;
      font-size: 11px;
      text-align: left;
      text-transform: lowercase;
      width: 280px; }

.marketplace-signup {
  background: #008ebd url("images/bg-signup.png") no-repeat -50px -50px;
  font-weight: 100;
  padding: 75px 125px 20px; }
  .marketplace-signup .button {
    float: right;
    padding-top: 10px; }
    .marketplace-signup .button a {
      background: #00afe9;
      border: 2px solid #60cbee;
      color: #fff;
      float: right;
      font-weight: normal;
      line-height: 1em;
      padding: 15px 65px;
      text-shadow: 0 1px 1px #0098cb; }
      .marketplace-signup .button a:hover {
        background: #1ab4e7;
        text-decoration: none; }
  .marketplace-signup .message {
    font-size: 25px;
    line-height: 1.3em;
    margin-bottom: 65px; }
  .marketplace-signup .help {
    color: #75d7f8;
    font-size: 12px; }

#commerceguys-marketplace-listing-form {
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
  border: 1px solid #707070;
  background: #000;
  padding: 20px; }
  #commerceguys-marketplace-listing-form h1 {
    color: #fff;
    font-weight: normal;
    margin-bottom: 20px; }
  #commerceguys-marketplace-listing-form .filter {
    margin-bottom: 20px; }
  #commerceguys-marketplace-listing-form .form-item-filters-category {
    float: left;
    margin-right: 10px;
    padding: 0; }
  #commerceguys-marketplace-listing-form .marketplace-addon-licenses {
    clear: both; }
    #commerceguys-marketplace-listing-form .marketplace-addon-licenses a:hover {
      color: #2aace2;
      text-decoration: underline; }
    #commerceguys-marketplace-listing-form .marketplace-addon-licenses .addon-category {
      margin-bottom: 10px;
      border-bottom: 1px solid #5d5d5d; }
    #commerceguys-marketplace-listing-form .marketplace-addon-licenses h2 {
      float: left;
      font-size: 16px;
      color: #2aace2; }
    #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license {
      background: #272727;
      margin: 0 0 10px 200px;
      padding: 10px; }
      #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license:hover {
        background: #3b3b3b; }
      #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-image {
        background: #fff;
        display: inline-block;
        float: left;
        height: 80px;
        width: 80px;
        line-height: 80px;
        text-align: center; }
        #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-image img {
          max-width: 90%;
          vertical-align: middle; }
      #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info {
        margin: 0 100px;
        min-height: 80px; }
        #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info .title {
          font-weight: bold;
          color: #fff; }
        #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info .tagline {
          color: #b8b8b8; }
        #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info .more a {
          background: transparent url("images/arrow.png") no-repeat right center;
          padding: 2px 25px 2px 0; }
      #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-enabled {
        float: right;
        text-align: center;
        width: 80px;
        padding-top: 50px;
        position: relative; }
        #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-enabled .status {
          display: inline-block;
          height: 16px;
          width: 16px;
          border-radius: 16px;
          background: #5d5d5d;
          border: 2px solid #5d5d5d;
          position: absolute;
          top: 10px;
          left: 50%;
          margin-left: -9px; }
        #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-enabled .status-on {
          background: #31c744; }

File

theme/commerceguys-marketplace.css
View source 
  1. /* Styling Tabs */

  2. .page-commerceguys-marketplace #branding ul.tabs {

  3.   position: relative;

  4.   float: right; }

  5. 

  6. .marketplace,

  7. #marketplace-listing-form {

  8.   background-color: black;

  9.   border: 1px solid #555555;

  10.   border-width: 0 1px 1px 1px;

  11.   color: white;

  12.   margin: 0 auto;

  13.   padding: 0; }

  14. 

  15. /* Other Marketplace page overrides */

  16. .page-commerceguys-marketplace {

  17.   background: transparent; }

  18.   .page-commerceguys-marketplace #page {

  19.     padding: 0;

  20.     background-color: #000; }

  21.   .page-commerceguys-marketplace #branding {

  22.     padding-left: 40px;

  23.     padding-right: 40px; }

  24.     .page-commerceguys-marketplace #branding ul.tabs {

  25.       height: 42px; }

  26.   .page-commerceguys-marketplace #overlay #overlay-title-wrapper {

  27.     height: 50px; }

  28.     .page-commerceguys-marketplace #overlay #overlay-title-wrapper #overlay-title {

  29.       font: 0/0 none; }

  30.   .page-commerceguys-marketplace #overlay #overlay-close-wrapper {

  31.     right: 0; }

  32.   .page-commerceguys-marketplace #overlay #overlay-close,

  33.   .page-commerceguys-marketplace #overlay #overlay-close:hover {

  34.     background: transparent url("images/close.png") no-repeat center center; }

  35.   .page-commerceguys-marketplace #overlay #overlay-titlebar {

  36.     background: transparent;

  37.     box-shadow: none;

  38.     padding: 0; }

  39.   .page-commerceguys-marketplace #overlay #overlay-content {

  40.     background: transparent;

  41.     padding: 0; }

  42.     .page-commerceguys-marketplace #overlay #overlay-content #branding {

  43.       padding: 0; }

  44.     .page-commerceguys-marketplace #overlay #overlay-content #page {

  45.       padding: 0; }

  46.   .page-commerceguys-marketplace #overlay .marketplace,

  47.   .page-commerceguys-marketplace #overlay #marketplace-listing-form {

  48.     border-width: 1px; }

  49.   .page-commerceguys-marketplace #overlay-tabs-wrapper {

  50.     height: 50px; }

  51.   .page-commerceguys-marketplace #overlay-tabs {

  52.     right: 0; }

  53.   .page-commerceguys-marketplace #overlay-tabs li,

  54.   .page-commerceguys-marketplace #overlay-tabs li.active,

  55.   .page-commerceguys-marketplace #branding ul.tabs li,

  56.   .page-commerceguys-marketplace #branding ul.tabs li.active {

  57.     float: left;

  58.     padding: 0;

  59.     margin: 0; }

  60.     .page-commerceguys-marketplace #overlay-tabs li a,

  61.     .page-commerceguys-marketplace #overlay-tabs li a:focus,

  62.     .page-commerceguys-marketplace #overlay-tabs li a:active,

  63.     .page-commerceguys-marketplace #overlay-tabs li a:visited,

  64.     .page-commerceguys-marketplace #overlay-tabs li a:hover,

  65.     .page-commerceguys-marketplace #overlay-tabs li.active a,

  66.     .page-commerceguys-marketplace #overlay-tabs li.active a:focus,

  67.     .page-commerceguys-marketplace #overlay-tabs li.active a:active,

  68.     .page-commerceguys-marketplace #overlay-tabs li.active a:visited,

  69.     .page-commerceguys-marketplace #overlay-tabs li.active a:hover,

  70.     .page-commerceguys-marketplace #branding ul.tabs li a,

  71.     .page-commerceguys-marketplace #branding ul.tabs li a:focus,

  72.     .page-commerceguys-marketplace #branding ul.tabs li a:active,

  73.     .page-commerceguys-marketplace #branding ul.tabs li a:visited,

  74.     .page-commerceguys-marketplace #branding ul.tabs li a:hover,

  75.     .page-commerceguys-marketplace #branding ul.tabs li.active a,

  76.     .page-commerceguys-marketplace #branding ul.tabs li.active a:focus,

  77.     .page-commerceguys-marketplace #branding ul.tabs li.active a:active,

  78.     .page-commerceguys-marketplace #branding ul.tabs li.active a:visited,

  79.     .page-commerceguys-marketplace #branding ul.tabs li.active a:hover {

  80.       background: #252525;

  81.       border: 1px solid #707070;

  82.       border-width: 1px 0 1px 1px;

  83.       color: #a1a1a1;

  84.       line-height: 1em;

  85.       margin: 0 !important;

  86.       padding: 15px 30px;

  87.       -moz-box-shadow: 0 0 0 transparent;

  88.       -webkit-box-shadow: 0 0 0 transparent;

  89.       box-shadow: 0 0 0 transparent;

  90.       -moz-border-radius: 0 0 0 0;

  91.       -webkit-border-radius: 0 0 0 0;

  92.       border-radius: 0 0 0 0; }

  93.       .page-commerceguys-marketplace #overlay-tabs li a.active,

  94.       .page-commerceguys-marketplace #overlay-tabs li a:focus.active,

  95.       .page-commerceguys-marketplace #overlay-tabs li a:active.active,

  96.       .page-commerceguys-marketplace #overlay-tabs li a:visited.active,

  97.       .page-commerceguys-marketplace #overlay-tabs li a:hover.active,

  98.       .page-commerceguys-marketplace #overlay-tabs li.active a.active,

  99.       .page-commerceguys-marketplace #overlay-tabs li.active a:focus.active,

  100.       .page-commerceguys-marketplace #overlay-tabs li.active a:active.active,

  101.       .page-commerceguys-marketplace #overlay-tabs li.active a:visited.active,

  102.       .page-commerceguys-marketplace #overlay-tabs li.active a:hover.active,

  103.       .page-commerceguys-marketplace #branding ul.tabs li a.active,

  104.       .page-commerceguys-marketplace #branding ul.tabs li a:focus.active,

  105.       .page-commerceguys-marketplace #branding ul.tabs li a:active.active,

  106.       .page-commerceguys-marketplace #branding ul.tabs li a:visited.active,

  107.       .page-commerceguys-marketplace #branding ul.tabs li a:hover.active,

  108.       .page-commerceguys-marketplace #branding ul.tabs li.active a.active,

  109.       .page-commerceguys-marketplace #branding ul.tabs li.active a:focus.active,

  110.       .page-commerceguys-marketplace #branding ul.tabs li.active a:active.active,

  111.       .page-commerceguys-marketplace #branding ul.tabs li.active a:visited.active,

  112.       .page-commerceguys-marketplace #branding ul.tabs li.active a:hover.active {

  113.         background: #000;

  114.         border-bottom: 1px solid #000;

  115.         color: #ffc015;

  116.         margin: 0;

  117.         padding: 15px 30px; }

  118.     .page-commerceguys-marketplace #overlay-tabs li a:hover,

  119.     .page-commerceguys-marketplace #overlay-tabs li.active a:hover,

  120.     .page-commerceguys-marketplace #branding ul.tabs li a:hover,

  121.     .page-commerceguys-marketplace #branding ul.tabs li.active a:hover {

  122.       color: #ffc015; }

  123.     .page-commerceguys-marketplace #overlay-tabs li:last-child a,

  124.     .page-commerceguys-marketplace #overlay-tabs li.active:last-child a,

  125.     .page-commerceguys-marketplace #branding ul.tabs li:last-child a,

  126.     .page-commerceguys-marketplace #branding ul.tabs li.active:last-child a {

  127.       border-right: 1px solid #707070; }

  128. 

  129. .marketplace-header {

  130.   display: inline-block;

  131.   -webkit-box-sizing: border-box;

  132.   /* Safari/Chrome, other WebKit */

  133.   -moz-box-sizing: border-box;

  134.   /* Firefox, other Gecko */

  135.   box-sizing: border-box;

  136.   /* Opera/IE 8+ */

  137.   padding: 30px;

  138.   width: 100%; }

  139.   .marketplace-header:after {

  140.     content: ".";

  141.     display: block;

  142.     clear: both;

  143.     visibility: hidden;

  144.     line-height: 0;

  145.     height: 0; }

  146.   .marketplace-header a:link, .marketplace-header a:visited {

  147.     color: white; }

  148.   .marketplace-header a:hover {

  149.     color: #00afef;

  150.     text-decoration: none; }

  151.   .marketplace-header .logo {

  152.     float: left; }

  153.   .marketplace-header .item-list {

  154.     padding: 0;

  155.     text-align: right; }

  156.     .marketplace-header .item-list ul {

  157.       margin-bottom: 0;

  158.       text-align: right; }

  159.       .marketplace-header .item-list ul li {

  160.         display: inline;

  161.         line-height: 55px;

  162.         padding: 0 15px; }

  163. 

  164. .status-container {

  165.   background: #2c2c2c;

  166.   color: #fff;

  167.   font-size: 22px;

  168.   line-height: 1.5em;

  169.   padding: 15px 70px; }

  170.   .status-container .message {

  171.     padding: 6px 0; }

  172. 

  173. .not-registered {

  174.   padding: 60px 80px;

  175.   background: #0265a5 url("images/flag.png") no-repeat -20px -20px; }

  176.   .not-registered a {

  177.     background: #018cc8;

  178.     border: 2px solid #56ade6;

  179.     color: #fff;

  180.     float: right;

  181.     font-size: 16px;

  182.     padding: 5px 50px; }

  183.     .not-registered a:hover {

  184.       background: #0097d8; }

  185. 

  186. .success .message {

  187.   background: transparent url("images/success.png") no-repeat left center;

  188.   padding-left: 70px; }

  189. 

  190. .empty-message {

  191.   color: #fff;

  192.   font-size: 22px;

  193.   line-height: 1.5em;

  194.   padding: 70px;

  195.   text-align: center; }

  196. 

  197. .marketplace-promotions {

  198.   background: black url("images/slide-overlay.png") repeat 0 0;

  199.   overflow: hidden; }

  200.   .marketplace-promotions .bx-wrapper {

  201.     margin-bottom: 0; }

  202.     .marketplace-promotions .bx-wrapper .bx-viewport {

  203.       -moz-box-shadow: 0;

  204.       -webkit-box-shadow: 0;

  205.       box-shadow: 0;

  206.       border: 0;

  207.       background: #fff;

  208.       left: 0;

  209.       overflow: visible !important; }

  210.       @media screen and (max-width: 768px) {

  211.         .marketplace-promotions .bx-wrapper .bx-viewport {

  212.           overflow: hidden !important; } }

  213.   .marketplace-promotions .bx-controls .slide-overlay-left,

  214.   .marketplace-promotions .bx-controls .slide-overlay-right {

  215.     background: transparent url("images/slide-overlay.png") repeat 0 0;

  216.     height: 320px;

  217.     position: absolute;

  218.     top: 0; }

  219.     @media screen and (max-width: 768px) {

  220.       .marketplace-promotions .bx-controls .slide-overlay-left,

  221.       .marketplace-promotions .bx-controls .slide-overlay-right {

  222.         display: none; } }

  223.   .marketplace-promotions .bx-controls .slide-overlay-left {

  224.     right: 100%; }

  225.   .marketplace-promotions .bx-controls .slide-overlay-right {

  226.     left: 100%; }

  227.   .marketplace-promotions .bx-controls a.bx-next,

  228.   .marketplace-promotions .bx-controls a.bx-prev {

  229.     background-image: url("images/slide-controls.png");

  230.     width: 34px;

  231.     height: 34px; }

  232.   .marketplace-promotions .bx-controls a.bx-next {

  233.     right: -40px;

  234.     background-position: -42px -35px; }

  235.     .marketplace-promotions .bx-controls a.bx-next:hover {

  236.       background-position: -42px 0; }

  237.     @media screen and (max-width: 768px) {

  238.       .marketplace-promotions .bx-controls a.bx-next {

  239.         right: 10px; } }

  240.   .marketplace-promotions .bx-controls a.bx-prev {

  241.     left: -40px;

  242.     background-position: 0 -35px; }

  243.     .marketplace-promotions .bx-controls a.bx-prev:hover {

  244.       background-position: 0 0; }

  245.     @media screen and (max-width: 768px) {

  246.       .marketplace-promotions .bx-controls a.bx-prev {

  247.         left: 10px; } }

  248.   .marketplace-promotions #commerceguys-marketplace-slideshow {

  249.     margin: 0; }

  250.     .marketplace-promotions #commerceguys-marketplace-slideshow li {

  251.       background: #000;

  252.       height: 320px;

  253.       list-style: none;

  254.       overflow: hidden;

  255.       margin: 0;

  256.       padding: 0;

  257.       width: 580px; }

  258. 

  259. .marketplace-content {

  260.   background: white url("images/bg-sidebar.gif") repeat-y 0 0;

  261.   color: #000;

  262.   width: 100%;

  263.   display: inline-block; }

  264.   .marketplace-content:after {

  265.     content: ".";

  266.     display: block;

  267.     clear: both;

  268.     visibility: hidden;

  269.     line-height: 0;

  270.     height: 0; }

  271.   .marketplace-content a:hover {

  272.     text-decoration: none; }

  273.   .marketplace-content .marketplace-sidebar {

  274.     float: left;

  275.     margin: 20px 20px 20px 45px;

  276.     margin-top: 85px;

  277.     width: 245px; }

  278.     .marketplace-content .marketplace-sidebar .item-title {

  279.       color: #898989;

  280.       font-size: 13px;

  281.       margin-bottom: 10px;

  282.       text-transform: lowercase; }

  283.     .marketplace-content .marketplace-sidebar .item-list ul {

  284.       margin: 0;

  285.       padding: 0; }

  286.     .marketplace-content .marketplace-sidebar .item-list ul li {

  287.       list-style: none;

  288.       margin-left: 0; }

  289.       .marketplace-content .marketplace-sidebar .item-list ul li a {

  290.         color: #000;

  291.         font-size: 16px;

  292.         text-transform: lowercase; }

  293.         .marketplace-content .marketplace-sidebar .item-list ul li a:hover {

  294.           color: #00afef; }

  295.   .marketplace-content .marketplace-addons-wrapper {

  296.     margin-left: 350px; }

  297.     .marketplace-content .marketplace-addons-wrapper h3 {

  298.       color: #2aace2;

  299.       font-weight: normal;

  300.       margin-left: 10px;

  301.       margin-top: 45px;

  302.       text-transform: lowercase; }

  303.     .marketplace-content .marketplace-addons-wrapper .marketplace-list {

  304.       margin-bottom: 45px; }

  305.       .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon {

  306.         float: left;

  307.         display: inline-block;

  308.         height: 202px;

  309.         padding: 10px;

  310.         width: 302px;

  311.         -webkit-box-sizing: border-box;

  312.         /* Safari/Chrome, other WebKit */

  313.         -moz-box-sizing: border-box;

  314.         /* Firefox, other Gecko */

  315.         box-sizing: border-box;

  316.         /* Opera/IE 8+ */ }

  317.         .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a {

  318.           border: 1px solid #c2c2c2;

  319.           float: left;

  320.           height: 182px;

  321.           margin: 1px;

  322.           position: relative;

  323.           width: 282px; }

  324.           .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a img {

  325.             max-width: 100%; }

  326.           .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay {

  327.             background: transparent url("images/bg-overlay.png") repeat 0 0;

  328.             color: #fff;

  329.             display: none;

  330.             height: 180px;

  331.             left: 0;

  332.             padding: 15px;

  333.             position: absolute;

  334.             top: 0;

  335.             width: 280px;

  336.             -webkit-box-sizing: border-box;

  337.             /* Safari/Chrome, other WebKit */

  338.             -moz-box-sizing: border-box;

  339.             /* Firefox, other Gecko */

  340.             box-sizing: border-box;

  341.             /* Opera/IE 8+ */ }

  342.           .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a:hover .addon-overlay {

  343.             display: block; }

  344.         .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay .title {

  345.           color: #2aace2;

  346.           font-size: 20px;

  347.           margin-bottom: 10px; }

  348.         .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay .tagline {

  349.           font-size: 14px;

  350.           height: 85px; }

  351.         .marketplace-content .marketplace-addons-wrapper .marketplace-list .addon .marketplace-addon-featured a .addon-overlay .category {

  352.           color: #acacac; }

  353. 

  354. .marketplace-trainings {

  355.   display: inline-block;

  356.   -webkit-box-sizing: border-box;

  357.   /* Safari/Chrome, other WebKit */

  358.   -moz-box-sizing: border-box;

  359.   /* Firefox, other Gecko */

  360.   box-sizing: border-box;

  361.   /* Opera/IE 8+ */

  362.   background: #262626;

  363.   padding: 45px;

  364.   width: 100%;

  365.   margin: -5px 0; }

  366.   .marketplace-trainings:after {

  367.     content: ".";

  368.     display: block;

  369.     clear: both;

  370.     visibility: hidden;

  371.     line-height: 0;

  372.     height: 0; }

  373.   .marketplace-trainings h3 {

  374.     color: #fff;

  375.     font-weight: normal;

  376.     text-transform: lowercase; }

  377.   .marketplace-trainings .marketplace-training-event-title {

  378.     color: white;

  379.     font-size: 16px;

  380.     margin-bottom: 10px; }

  381.   .marketplace-trainings .marketplace-training {

  382.     -webkit-box-sizing: border-box;

  383.     /* Safari/Chrome, other WebKit */

  384.     -moz-box-sizing: border-box;

  385.     /* Firefox, other Gecko */

  386.     box-sizing: border-box;

  387.     /* Opera/IE 8+ */

  388.     margin: 0 0 10px;

  389.     padding: 10px;

  390.     width: 100%; }

  391.     .marketplace-trainings .marketplace-training:hover {

  392.       background: #151515; }

  393.       .marketplace-trainings .marketplace-training:hover a {

  394.         text-decoration: none; }

  395.       .marketplace-trainings .marketplace-training:hover .marketplace-training-event-title {

  396.         color: #2aace2; }

  397.   .marketplace-trainings .marketplace-training-event-content {

  398.     color: #898989;

  399.     width: 100%; }

  400.     .marketplace-trainings .marketplace-training-event-content .t.location {

  401.       margin-left: 20px; }

  402.     .marketplace-trainings .marketplace-training-event-content .t-audience {

  403.       float: right;

  404.       font-size: 11px;

  405.       text-align: left;

  406.       text-transform: lowercase;

  407.       width: 280px; }

  408. 

  409. .marketplace-signup {

  410.   background: #008ebd url("images/bg-signup.png") no-repeat -50px -50px;

  411.   font-weight: 100;

  412.   padding: 75px 125px 20px; }

  413.   .marketplace-signup .button {

  414.     float: right;

  415.     padding-top: 10px; }

  416.     .marketplace-signup .button a {

  417.       background: #00afe9;

  418.       border: 2px solid #60cbee;

  419.       color: #fff;

  420.       float: right;

  421.       font-weight: normal;

  422.       line-height: 1em;

  423.       padding: 15px 65px;

  424.       text-shadow: 0 1px 1px #0098cb; }

  425.       .marketplace-signup .button a:hover {

  426.         background: #1ab4e7;

  427.         text-decoration: none; }

  428.   .marketplace-signup .message {

  429.     font-size: 25px;

  430.     line-height: 1.3em;

  431.     margin-bottom: 65px; }

  432.   .marketplace-signup .help {

  433.     color: #75d7f8;

  434.     font-size: 12px; }

  435. 

  436. #commerceguys-marketplace-listing-form {

  437.   -webkit-box-sizing: border-box;

  438.   /* Safari/Chrome, other WebKit */

  439.   -moz-box-sizing: border-box;

  440.   /* Firefox, other Gecko */

  441.   box-sizing: border-box;

  442.   /* Opera/IE 8+ */

  443.   border: 1px solid #707070;

  444.   background: #000;

  445.   padding: 20px; }

  446.   #commerceguys-marketplace-listing-form h1 {

  447.     color: #fff;

  448.     font-weight: normal;

  449.     margin-bottom: 20px; }

  450.   #commerceguys-marketplace-listing-form .filter {

  451.     margin-bottom: 20px; }

  452.   #commerceguys-marketplace-listing-form .form-item-filters-category {

  453.     float: left;

  454.     margin-right: 10px;

  455.     padding: 0; }

  456.   #commerceguys-marketplace-listing-form .marketplace-addon-licenses {

  457.     clear: both; }

  458.     #commerceguys-marketplace-listing-form .marketplace-addon-licenses a:hover {

  459.       color: #2aace2;

  460.       text-decoration: underline; }

  461.     #commerceguys-marketplace-listing-form .marketplace-addon-licenses .addon-category {

  462.       margin-bottom: 10px;

  463.       border-bottom: 1px solid #5d5d5d; }

  464.     #commerceguys-marketplace-listing-form .marketplace-addon-licenses h2 {

  465.       float: left;

  466.       font-size: 16px;

  467.       color: #2aace2; }

  468.     #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license {

  469.       background: #272727;

  470.       margin: 0 0 10px 200px;

  471.       padding: 10px; }

  472.       #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license:hover {

  473.         background: #3b3b3b; }

  474.       #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-image {

  475.         background: #fff;

  476.         display: inline-block;

  477.         float: left;

  478.         height: 80px;

  479.         width: 80px;

  480.         line-height: 80px;

  481.         text-align: center; }

  482.         #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-image img {

  483.           max-width: 90%;

  484.           vertical-align: middle; }

  485.       #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info {

  486.         margin: 0 100px;

  487.         min-height: 80px; }

  488.         #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info .title {

  489.           font-weight: bold;

  490.           color: #fff; }

  491.         #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info .tagline {

  492.           color: #b8b8b8; }

  493.         #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-info .more a {

  494.           background: transparent url("images/arrow.png") no-repeat right center;

  495.           padding: 2px 25px 2px 0; }

  496.       #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-enabled {

  497.         float: right;

  498.         text-align: center;

  499.         width: 80px;

  500.         padding-top: 50px;

  501.         position: relative; }

  502.         #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-enabled .status {

  503.           display: inline-block;

  504.           height: 16px;

  505.           width: 16px;

  506.           border-radius: 16px;

  507.           background: #5d5d5d;

  508.           border: 2px solid #5d5d5d;

  509.           position: absolute;

  510.           top: 10px;

  511.           left: 50%;

  512.           margin-left: -9px; }

  513.         #commerceguys-marketplace-listing-form .marketplace-addon-licenses .marketplace-addon-license .marketplace-list-item-enabled .status-on {

  514.           background: #31c744; }