/* COMMON */

BODY {
      margin: 0;
}

DIV,UL,LI,TABLE,TR,TD,SPAN,TEXTAREA {
      font-family: Verdana;
      font-size: 12px;
}

/* PAGE SECTIONS */

DIV.top, DIV.bottom {
      background: #F5F5F5;
      width: 100%;
      float: left;
      box-sizing: border-box;
}

DIV.bottom {
      margin-top: 12px;
      padding: 12px;
      text-align: center;
      display: none;
      color: #8F8F8F;;
}

      DIV.top > DIV.left {
            width: 75%;
            float: left;
            margin-left: 5%;
            border-left: 1px solid #DADADA;
            padding: 12px;
            color: #8F8F8F;;
            font-size: 12px;
            box-sizing: border-box;
      }
      
      DIV.top > DIV.right {
            width: 15%;
            float: left;
            border-right: 1px solid #DADADA;
            padding: 12px;
            box-sizing: border-box;
            text-align: right;
      }
      
      DIV.top > DIV.left > I, DIV.top > DIV.right > I {
            color: #8F8F8F;
            font-size: 24px;
            margin-right: 12px;
            margin-left: 12px;
      }

/* HEADER AND FOOTER */

DIV.header, DIV.footer {
      background: #FFF;
      width: 100%;
      float: left;
}

      DIV.header > DIV.left, DIV.footer > DIV.left {
            padding: 12px;
            box-sizing: border-box;
            margin-left: 5%;
            width: 40%;
            float: left;
      }
      
            DIV.header > DIV.left > IMG, DIV.footer > DIV.left > IMG {
                  width: 80%;
                  height: 90px;
            }

      DIV.header > DIV.right, DIV.footer > DIV.right {
            margin-right: 5%;
            width: 50%;
            float: left;
            padding: 40px;
            box-sizing: border-box;
      }
      
/* HEADER, FOOTER AND CONTROL PANEL NAVIGATION MENU */

UL.menu, UL.footer-menu, UL.cp-menu {
      padding: 0;
}

      UL.menu > LI, UL.footer-menu > LI, UL.cp-menu > LI {
            display: inline;
      }
      
      UL.menu > LI > A, UL.footer-menu > LI > A {
            padding: 14px;
            text-transform: uppercase;
            text-decoration: none;
            font-size: 14px;
            color: #8F8F8F;
      }
      
            UL.cp-menu > LI > A
            {
                  padding: 14px;
                  color: #48526D;
                  text-decoration: none;
            }
      
      UL.menu > LI > A:hover, UL.menu > LI > A.active {
            background: #000;
            color: #FFF;
      }
      
      UL.footer-menu > LI > A:hover {
            color: #000;
      }

            UL.cp-menu > LI > A:hover {
                  color: #CF600F;
                  text-decoration: underline;
            }
      
DIV.responsive-menu {
      position: fixed;
      top: 20px;
      left: 0;
      width: 70%;
      float: left;
      background: rgba( 0, 0, 0, 0.9 );
      padding: 30px;
      border-top-right-radius: 7px;
      border-bottom-right-radius: 7px;
      box-shadow: 2px 2px 5px #C0C0C0;
      box-sizing: border-box;
      display: none;
}

      DIV.responsive-menu > A > DIV {
            width: 100%;
            float: left;
            padding: 18px;
            box-sizing: border-box;
            border-top: 1px solid #FFF;
            color: #EFEFEF;
            font-weight: bold;
            font-size: 14px;
      }
      
      DIV.responsive-menu > A:nth-of-type(1) > DIV {
            border: 0;
      }

DIV.page-spacer {
      width: 100%;
      float: left;
      padding: 44px;
      box-sizing: border-box;
      text-align: center;
      padding-left: 10%;
      padding-right: 10%;
}

/* SLIDESHOW */

DIV.slideshow {
      width: 100%;
      float: left;
      height: 65%;
      background-image: url(../images/site/mercedes.jpg);
      background-size: cover;
      background-position: center;
}

/* SEARCH BAR */

DIV.search {
      width: 100%;
      float: left;
      background: #F5F5F5;
      padding: 26px;
      box-sizing: border-box;
      text-align: center;
}

      DIV.search > SPAN.title {
            float: left;
            color: #8F8F8F;
            font-size: 32px;
            margin-right: 14px;
      }

      DIV.search > INPUT {
            width: 15%;
            float: left;
      }

DIV.search-spacer {
      width: 100%;
      float: left;
      margin-top: 16px;
}

DIV.search-spacer:nth-of-type(1) {
      margin: 0;
}

DIV.search-display-box {
      width: 100%; 
      float: left;
      margin-top: 22px;
      padding-bottom: 22px;
      border-bottom: 1px solid #000;
}

DIV.search-display-box:nth-of-type(1) {
      margin-top: 0;
      border-bottom: 0;
}

/* FEATURED CARS */

DIV.featured {
      background: #000;
}

      DIV.featured > SPAN.title {
            color: #FFF;
            font-size: 26px;
      }
      
DIV.featured-box {
      width: 31%;
      float: left;
      margin-right: 2%;
      margin-top: 2%;
      background: #FFF;
      padding: 18px;
      box-sizing: border-box;
}

      DIV.featured-box > IMG {
            width: 100%;
            height: 200px;
            float: left;
      }
      
      DIV.featured-box > DIV.description {
            width: 100%;
            float: left;
            margin-top: 6px;
            margin-bottom: 6px;
            color: #8F8F8F;
            text-align: left;
            font-size: 14px;
      }
      
      DIV.featured-box > DIV.price {
            width: 100%;
            float: left;
            color: #000;
            text-align: left;
            font-size: 28px;
      }
      
      DIV.featured-box > DIV.price > INPUT {
            float: right;
            padding: 8px;
      }
      
/* ABOUT AND WELCOME PAGES */

DIV.about, DIV.welcome {
      background: #FFF;
}

DIV.welcome {
      padding-left: 10%;
      padding-right: 10%;
}

      DIV.welcome > DIV.box {
            width: 33.3%;
            float: left;
            margin-top: 44px;
            text-align: center;
            box-sizing: border-box;
      }

      DIV.welcome > DIV.box > DIV.circle {
            width: 55%;
            margin-left: 22.5%;
            float: left;
            border: 1px solid #000;
            border-radius: 50%;
            color: #000;
            font-size: 74px;
            padding: 50px;
            box-sizing: border-box;
      }

      DIV.welcome > DIV.box > DIV.text {
            width: 100%;
            float: left;
            text-align: center;
            margin-top: 44px;
            color: #8F8F8F;
            font-size: 14px;
      }

      DIV.about > SPAN.title, DIV.welcome > SPAN.title {
            color: #8F8F8F;
            font-size: 26px;
      }
      
      DIV.about > DIV.left {
            width: 36%;
            margin-right: 4%;
            float: left;
            margin-top: 30px;
      }

      DIV.about > DIV.right {
            width: 60%;
            float: left;
            text-align: left;
            margin-top: 30px;
            color: #8F8F8F;
            font-size: 14px;
            letter-spacing: 1px;
      }
      
/* CONTACT OPTIONS */

DIV.contact-options {
      width: 100%;
      float: left;
      background-image: url(../images/site/traffic.jpg);
      background-size: cover;
      padding: 8%;
      box-sizing: border-box;
}

      DIV.contact-options > DIV.box {
            width: 32%;
            margin-right: 1%;
            float: left;
            background: rgba( 0, 0, 0, 0.5 );
            padding: 20px;
            box-sizing: border-box;
      }
      
      DIV.contact-options > DIV.box > DIV.circle {
            width: 35%;
            float: left;
            background: #FFF;
            border-radius: 50%;
            font-size: 50px;
            padding: 30px;
            box-sizing: border-box;
            text-align: center;
      }
      
      DIV.contact-options > DIV.box > DIV.text {
            width: 65%;
            float: left;
            padding-left: 20px;
            word-wrap: break-word;
            box-sizing: border-box;
            color: #FFF;
            font-size: 14px;
      }
      
/* VIEW CAR AD */

DIV.ad-pic {
      width: 55%;
      float: left;
      margin-right: 5%;
}

DIV.ad-spec {
      width: 40%;
      float: left;
}

DIV.ad-price {
      width: 60%;
      margin-left: 20%;
      margin-right: 20%;
      float: left;
      background: #000;
      color: #FFF;
      font-size: 18px;
      font-weight: bold;
      border-radius: 3px;
      box-shadow: 2px 2px 4px #404040;
      margin-bottom: 16px;
      padding: 12px;
      box-sizing: border-box;
      text-align: center;
}

      DIV.ad-spec > SPAN.title {
            font-size: 20px;
      }
      
      DIV.ad-spec > TABLE {
            border-spacing: 0px;
            padding: 0;
      }
      
      DIV.ad-spec > TABLE TD {
            padding: 6px;
            font-size: 14px;
      }

DIV.ad-desc {
      width: 100%;
      float: left;
      margin-top: 12px;
      font-size: 14px;
      border: 1px solid #000;
      box-sizing: border-box;
      padding: 8px;
}

SPAN.ad-desc-title {
      font-size: 18px;
}

DIV.ad-images {
      width: 100%;
      float: left;
      margin-top: 12px;
}

DIV.ad-image {
      width: 10%;
      float: left;
      border: 1px solid #FFF;
      background: #000;
      height: 65px;
}

DIV.ad-image:hover {
      cursor: pointer;
      border: 1px solid #000;
}

DIV.ad-image > IMG {
      width: 100%;
      height: 65px;
}

/* SEARCH PAGE RESULTS */

DIV.ad-box {
      width: 32%;
      float: left;
      margin-right: 1%;
      margin-bottom: 1%;
      border: 1px solid #DADADA;
      padding: 14px;
      box-sizing: border-box;
      font-size: 14px;
}

      DIV.ad-box > A > IMG {
            width: 100%;
            height: 200px;
            margin-bottom: 14px;
      }
      
      DIV.ad-box > UL {
            list-style-type: square;
            padding-left: 20;
      }
      
      DIV.ad-box > UL, DIV.ad-box > UL > LI {
            font-size: 14px;
            margin-bottom: 4px;
      }

/* COPYRIGHT AND CREDIT BAR */

DIV.copyright {
      width: 100%;
      float: left;
      background: #000;
      padding: 20px;
      padding-left: 5%;
      padding-right: 5%;
      box-sizing: border-box;
      color: #FFF;
}

      DIV.copyright > DIV.left {
            width: 50%;
            float: left;
      }
      
      DIV.copyright > DIV.right {
            width: 50%;
            float: left;
            text-align: right;
      }
      
      DIV.copyright > DIV.right > A {
            color: #FFF;
            text-decoration: none;
      }
      
      DIV.copyright > DIV.right > A:hover {
            text-decoration: underline;
      }
      
/* MAIN PAGE SIDE MENU */

DIV.side-menu {
      width: 100%;
      float: left;
      background: #FFF;
      padding-left: 5%;
      padding-right: 5%;
      box-sizing: border-box;
}

      DIV.side-menu > DIV.left {
            width: 22%;
            margin-right: 2%;
            float: left;
      }

      DIV.side-menu > DIV.right {
            width: 76%;
            float: left;
      }

SPAN.side-menu-search {
      color: #8F8F8F;
      font-size: 24px;
}

/* IN PAGE NAVIGATION */

DIV.in-page-nav {
      width: 100%;
      float: left;
      padding: 12px;
      background: #F5F5F5;
      box-sizing: border-box;
      font-size: 14px;
      margin-bottom: 12px;
}

DIV.in-page-title {
      width: 100%;
      float: left;
      color: #000;
      font-size: 26px;
      margin-bottom: 12px;
}

DIV.in-page-text {
      width: 100%;
      float: left;
      margin-top: 12px;
      color: #8F8F8F;
      font-size: 14px;
}

DIV.contact-box {
      width: 100%;
      float: left;
      background: #F5F5F5;
      padding: 18px;
      box-sizing: border-box;
      margin-top: 12px;
}

      DIV.contact-box > DIV {
            width: 100%;
            float: left;
            margin-top: 12px;
      }
      
      DIV.contact-box > DIV:nth-of-type(1) {
            margin-top: 0;
      }
      
      DIV.contact-box > DIV > INPUT[type=text], DIV.contact-box > DIV > TEXTAREA {
            width: 40%;
            float: left;
            border: 1px solid #CCCCCC;
            background: #FFF;
            padding: 10px;
            font-size: 16px;
      }
      
      DIV.contact-box > DIV > TEXTAREA {
            width: 60%;
            height: 20%;
      }

/* FORM FIELDS */
/* BUTTONS */

INPUT.button {
      background: #000;
      color: #FFFFFF;
      padding: 12px;
      border: none;
      font-size: 14px;
}

INPUT.button:hover {
      background: #1074BE;
      cursor: pointer;
}

/* SELECT LIST CAR SEARCH */

SELECT.search {
      border: none;
      cursor: pointer;
      font-size: 14px;
      text-transform: uppercase;
}

SELECT.horizontal {
      width: 20%;
      float: left;
      margin-right: 14px;
}

SELECT.vertical {
      width: 100%;
      float: left;
      margin-top: 14px;
}

      SELECT.vertical:nth-of-type(2) {
            margin-bottom: 14px;
      }

SELECT.search > OPTION {
      padding: 12px;
      text-transform: uppercase;
}

INPUT.sign-in {
      width: 100%;
      padding: 12px;
      box-sizing: border-box;
      border: none;
      background: none;
}

INPUT.sign-in-inactive {
      color: #7C7C7C;
}

INPUT.sign-in-active {
      color: #000;
}

INPUT.sign-in-button {
      width: 100%;
      float: left;
      background: -webkit-linear-gradient( #C9583E, #A53B28 );
      background: -o-linear-gradient( #C9583E, #A53B28 );
      background: -moz-linear-gradient( #C9583E, #A53B28 );
      background: linear-gradient( #C9583E, #A53B28 );
      padding: 10px;
      border: none;
      border-top: 1px solid #D98774;
      box-sizing: border-box;
      text-align: center;
      color: #FFF;
      font-weight: bold;
      cursor: pointer;
}

INPUT.cp-button {
      border: 1px solid #CCCCCC;
      border-radius: 3px;
      padding: 12px;
      background: -webkit-linear-gradient( #EDEDED, #FFFFFF );
      background: -o-linear-gradient( #EDEDED, #FFFFFF );
      background: -moz-linear-gradient( #EDEDED, #FFFFFF );
      background: linear-gradient( #EDEDED, #FFFFFF );
      color: #48526D;
      font-weight: bold;
}

INPUT.cp-button:hover {
      color: #CF600F;
      cursor: pointer;
      border: 1px solid #CF600F;
      background: -webkit-linear-gradient( #FFFFFF, #EDEDED );
      background: -o-linear-gradient( #FFFFFF, #EDEDED );
      background: -moz-linear-gradient( #FFFFFF, #EDEDED );
      background: linear-gradient( #FFFFFF, #EDEDED );
}

/* LINKS */

A {
      color: #000;
      text-decoration: none;
}

A:hover {
      text-decoration: underline;
}

/* MISC ATTRIBUTES FOR VARIOUS USE */

.blue { 
      color: #000;
}

.hidden {
      display: none;
}

DIV.response {
      width: 100%;
      float: left;
      margin-bottom: 16px;
      background: #004000;
      color: #FFF;
      padding: 22px;
      border-radius: 5px;
      box-shadow: 2px 2px 5px #404040;
      box-sizing: border-box;
}

DIV.grey-box {
      width: 100%;
      float: left;
      background: #F5F5F5;
      padding: 20px;
      box-sizing: border-box;
}

.spacer-bottom { margin-bottom: 20px; }

IMG.full {
      width: 100%;
}

/* SQL ERROR PAGE */

BODY.sql-error {
      background: #EFEFEF;
      margin: 5%;
}

DIV.sql-error {
      width: 100%;
      float: left;
      padding: 40px;
      background: #FFF;
      box-sizing: border-box;
      font-family: Georgia;
      font-size: 16px;
      border: 1px solid #C0C0C0;
}

/* CONTRON PANEL SIGN IN */

BODY.cp-sign {
      height: 100%;
      background: #9F9F9F;
      background: -webkit-linear-gradient( #FFFFFF, #9F9F9F );
      background: -o-linear-gradient( #FFFFFF, #9F9F9F );
      background: -moz-linear-gradient( #FFFFFF, #9F9F9F );
      background: linear-gradient( #FFFFFF, #9F9F9F );
}

DIV.sign-in-box {
      width: 30%;
      float: left;
      margin-top: 6%;
      margin-left: 35%;
}

      DIV.sign-in-box > DIV.title {
            width: 100%;
            float: left;
            text-align: center;
            margin-bottom: 20px;
            font-family: Impact;
            font-size: 42px;
            color: #953320;
            text-shadow: 1px 1px 3px #C0C0C0;
      }
      
      DIV.sign-in-box > DIV.response {
            width: 100%;
            float: left;
            background: #FFF;
            border-radius: 3px;
            box-shadow: 0px 0px 7px #A0A0A0;
            padding: 10px;
            box-sizing: border-box;
            margin-bottom: 20px;
            color: #000;
      }

DIV.sign-in-head {
      width: 100%;
      float: left;
      border: 1px solid #A53B28;
      box-sizing: border-box;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      box-shadow: 2px 2px 5px #888888;
}

      DIV.sign-in-head > DIV.title {
            width: 100%;
            float: left;
            padding: 20px;
            box-sizing: border-box;
            background: -webkit-linear-gradient( #CB5940, #953320 );
            background: -o-linear-gradient( #CB5940, #953320 );
            background: -moz-linear-gradient( #CB5940, #953320 );
            background: linear-gradient( #CB5940, #953320 );
            border-top: 1px solid #D98875;
            text-align: center;
            font-weight: bold;
            color: #FFF;
      }
      
DIV.sign-in-body {
      width: 100%;
      float: left;
      border-left: 1px solid #B49EA4;
      border-bottom: 1px solid #B49EA4;
      border-right: 1px solid #B49EA4l;
      border-top: 1px solid #EEDAD7;
      background: #FFF;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px;
      box-shadow: 2px 2px 5px #888888;
      box-sizing: border-box;
      padding: 20px;
}

      DIV.sign-in-body > DIV.text {
            width: 100%;
            float: left;
            border: 1px solid #D9D9D9;
            box-sizing: border-box;
            margin-bottom: 20px;
            border-radius: 3px;
            background: -webkit-linear-gradient( #F2F2F2, #FFFFFF );
            background: -o-linear-gradient( #F2F2F2, #FFFFFF );
            background: -moz-linear-gradient( #F2F2F2, #FFFFFF );
            background: linear-gradient( #F2F2F2, #FFFFFF );
      }
      
            DIV.sign-in-body > DIV.text > DIV.icon {
                  width: 5%;
                  float: left;
                  padding: 12px;
                  box-sizing: border-box;
                  color: #7C7C7C;
                  font-size: 18px;
            }
      
            DIV.sign-in-body > DIV.text > DIV.input {
                  width: 90%;
                  float: left;
                  box-sizing: border-box;
            }

      DIV.sign-in-body > DIV.button-holder {
            width: 25%;
            float: left;
            border: 1px solid #A53B28;
            border-radius: 3px;
            box-shadow: 1px 1px 5px #888888;
      }
      
      DIV.sign-in-body > DIV.button-holder > DIV.button {

      }
      
DIV.sign-in-credit {
      width: 100%;
      float: left;
      margin-top: 25px;
      text-align: center;
      font-size: 10px;
      color: #000;
}

/* CONTROL PANEL PAGES */

BODY.cp {
      background: #F6F6F6;
}

DIV.black-strip {
      width: 100%;
      float: left;
      background: #000;
      height: 10px;
}

DIV.cp-header {
      width: 100%;
      float: left;
      background: #024F93;
      background: -webkit-linear-gradient( left top, #024F93, #00BDEF, #024F93 );
      background: -o-linear-gradient( bottom right, #024F93, #00BDEF, #024F93 );
      background: -moz-linear-gradient( bottom right, #024F93, #00BDEF, #024F93 );
      background: linear-gradient( to bottom right, #024F93, #00BDEF, #024F93 );
      border-bottom: 1px solid #5D92BE;
      padding: 40px;
      box-sizing: border-box;
      font-family: Georgia;
      font-size: 38px;
      color: #FFF;
}

DIV.cp-footer {
      width: 40%;
      float: left;
      margin-left: 30%;
      border-top: 1px dashed #8F8F8F;
      text-align: center;
      padding-top: 20px;
      color: #8F8F8F;
      font-size: 10px;
      font-weight: bold;
      padding-bottom: 20px;
}

DIV.cp-menu {
      width: 100%;
      float: left;
      border-bottom: 1px solid #D5D5D5;
      box-sizing: border-box;
      background: #F0F0F0;
      background: -webkit-linear-gradient( #FFFFFF, #F0F0F0 );
      background: -o-linear-gradient( #FFFFFF, #F0F0F0 );
      background: -moz-linear-gradient( #FFFFFF, #F0F0F0 );
      background: linear-gradient( #FFFFFF, #F0F0F0 );
      box-shadow: 0px 0px 5px #888888;
}

DIV.cp-page {
      width: 100%;
      float: left;
      padding: 5%;
      box-sizing: border-box;
}

DIV.cp-icon {
      width: 18%;
      float: left;
      background: -webkit-linear-gradient( #FFFFFF, #F0F0F0 );
      background: -o-linear-gradient( #FFFFFF, #F0F0F0 );
      background: -moz-linear-gradient( #FFFFFF, #F0F0F0 );
      background: linear-gradient( #FFFFFF, #F0F0F0 );
      margin-right: 2%;
      margin-bottom: 2%;
      color: #8F8F8F;
      text-align: center;
      padding: 45px;
      box-sizing: border-box;
      border-left: 1px solid #E8E8E8;
      border-top: 1px solid #E8E8E8;
      border-right: 1px solid #C1C1C1;
      border-bottom: 1px solid #C1C1C1;
      border-radius: 5px;
      box-shadow: 2px 2px 5px #888888;
      position: relative;
}

      DIV.cp-icon > I {
            font-size: 80px;
            margin-bottom: 25px;
      }
      
      DIV.cp-icon > SPAN.label {
            font-size: 10px;
            font-weight: bold;
      }
      
DIV.cp-icon:hover {
      color: #D8640E;
      cursor: pointer;
      background: -webkit-linear-gradient( #F0F0F0, #FFFFFF );
      background: -o-linear-gradient( #F0F0F0, #FFFFFF );
      background: -moz-linear-gradient( #F0F0F0, #FFFFFF );
      background: linear-gradient( #F0F0F0, #FFFFFF );
}

DIV.cp-icon > DIV.alert {
      position: absolute;
      top: 50px;
      right: 60px;
      padding: 10px;
      padding-left: 12px;
      padding-right: 12px;
      border-radius: 50%;
      background: #FF0000;
      border: 1px solid #FFF;
      box-shadow: 1px 1px 5px #888888;
      font-size: 10px;
      font-weight: bold;
      color: #FFF;
}

DIV.cp-search-field {
      width: 20%;
      float: left;
      margin-right: 12px;
}

DIV.cp-search-results {
      width: 20%;
      float: left;
      position: absolute;
      border: 1px solid #000;
      display: none;
      border: 1px solid #8F8F8F;
      border-radius: 3px;
      box-shadow: 2px 2px 2px #8F8F8F;
      background: #FFF;
}

TABLE.cp-results-table {
      border-spacing: 1;
}

TD.result {
      color: #66667F;
      padding: 8px;
}

TD.result-on {
      background: #EDEDED;
}
      
TD.result-off {
      background: #FFF;
}

/* UPLOAD IMAGES */

DIV.upload-box {
      width: 32%;
      float: left;
      margin-right: 1%;
      margin-bottom: 1%;
      box-sizing: border-box;
      padding: 6px;
      box-shadow: 1px 1px 2px #C0C0C0;
}

DIV.upload-box-passed {
      background: #FFF;
      border: 1px solid #CCCCCC;
}

DIV.upload-box-profile {
      background: -webkit-linear-gradient( #C0C0C0, #FFFFFF );
      background: -o-linear-gradient( #C0C0C0, #FFFFFF );
      background: -moz-linear-gradient( #C0C0C0, #FFFFFF );
      background: linear-gradient( #C0C0C0, #FFFFFF );
      border: 1px solid #000000;
      box-shadow: 0px 0px 8px #000000;
}

DIV.upload-box-failed {
      background: #FFC0C0;
      border: 1px solid #FF8080;
}

DIV.upload-img-failed {
      border: 1px solid #FF8080;
}

      DIV.upload-box > DIV.img-box {
            width: 100%;
            float: left;
            height: 200px;
            margin-bottom: 6px;
            box-sizing: border-box;
            background-size: cover;
      }
      
      DIV.upload-box > DIV.img-box-passed {
            background: #E0E0E0;
            border: 1px solid #CCCCCC;
      }
      
      DIV.upload-box > DIV.img-box-failed {
            background: #FFC0C0;
            text-align: center;
            color: #800000;
            font-weight: bold;
            border: 1px solid #800000;
            background: -webkit-linear-gradient( #FFC0C0, #FFFFFF );
            background: -o-linear-gradient( #FFC0C0, #FFFFFF );
            background: -moz-linear-gradient( #FFC0C0, #FFFFFF );
            background: linear-gradient( #FFC0C0, #FFFFFF );
      }

      DIV.upload-box > DIV.img-loader {
            padding-left: 37%;
            padding-top: 36%;
      }
      
      .img-preview {
            width: 100%;
            height: 200px;
      }
      
      DIV.upload-box > DIV.info, DIV.upload-box > DIV.options {
            width: 50%;
            float: left;
            font-size: 10px;
      }
      
      DIV.upload-box > DIV.options {
            text-align: right;
      }
      
      DIV.upload-box > DIV.options > I {
            border: 1px solid #CCCCCC;
            padding: 6px;
            background: -webkit-linear-gradient( #EDEDED, #FFFFFF );
            background: -o-linear-gradient( #EDEDED, #FFFFFF );
            background: -moz-linear-gradient( #EDEDED, #FFFFFF );
            background: linear-gradient( #EDEDED, #FFFFFF );
            border-radius: 3px;
      }
      
      DIV.upload-box > DIV.options > I:hover {
            cursor: pointer;
            background: -webkit-linear-gradient( #FFFFFF, #EDEDED );
            background: -o-linear-gradient( #FFFFFF, #EDEDED );
            background: -moz-linear-gradient( #FFFFFF, #EDEDED );
            background: linear-gradient( #FFFFFF, #EDEDED );
      }

/* CP NAV BAR */

DIV.cp-nav-bar {
      width: 100%;
      float: left;
}

      DIV.cp-nav-bottom {
            margin-bottom: 20px;
      }

      DIV.cp-nav-top {
            margin-top: 20px;
      }

/* CP TABLES */

TABLE.cp {
      border: 1px solid #CCCCCC;
      border-radius: 3px;
      box-shadow: 1px 1px 2px #888888;
      border-spacing: 1px;
      background: #E0E0E0;
}

TABLE.cp TD {
      padding: 18px;
      border-top: 1px solid #FFF;
      color: #666666;
      font-size: 12px;
}

TABLE.cp TD INPUT[type=text], TABLE.cp TD TEXTAREA, TABLE.cp TD SELECT {
      border: 1px solid #A0A0A0;
      padding: 8px;
}

TD.head {
      background: #EDEDED;
      font-weight: bold;
}

TD.row1 {
      background: #FBFBFB;
}

TD.row2 {
      background: #F8F8F8;
}

TABLE.cp TD.divider {
      height: 5px;
      background: #666666;
      padding: 0;
}

/* CP TABLE IMAGES */

TD > IMG.main {
      width: 100%;
      border: 1px solid #000;
      background: #FFF;
      padding: 8px;
      box-sizing: border-box;
      box-shadow: 1px 1px 3px #404040;
}

/* CP TABLE LINKS */

TD > A.title {
      font-size: 16px;
      font-weight: bold;
      text-decoration: none;
      color: #666666;
}

TD > A.title:hover {
      text-decoration: underline;
}

/* ICONS */

I.ad-icon {
      border: 1px solid #C0C0C0;
      border-radius: 3px;
      padding: 12px;
      padding-left: 12px;
      padding-right: 12px;
      background: -webkit-linear-gradient( #DFDFDF, #FFF );
      background: -o-linear-gradient( #DFDFDF, #FFF );
      background: -moz-linear-gradient( #DFDFDF, #FFF );
      background: linear-gradient( #DFDFDF, #FFF );
      box-shadow: 1px 1px 2px #C0C0C0;
      color: #404040;
      font-size: 16px;
}

I.ad-icon:hover, I.ad-icon-active {
      background: -webkit-linear-gradient( #FFF, #DFDFDF );
      background: -o-linear-gradient( #FFF, #DFDFDF );
      background: -moz-linear-gradient( #FFF, #DFDFDF );
      background: linear-gradient( #FFF, #DFDFDF );
      color: #CF5E27;
      border: 1px solid #CF5E27;
      cursor: pointer;
}

DIV.ad-change-response {
      width: 90%;
      float: left;
      margin-left: 5%;
      padding: 8px;
      box-sizing: border-box;
      background: #404040;
      border-radius: 3px;
      box-shadow: 2px 2px 3px #000;
      text-align: center;
      color: #FFF;
      margin-top: 12px;
}

DIV.inventory-description {
      width: 100%;
      float: left;
      padding: 12px;
      box-sizing: border-box;
      background: #FFF;
      border: 1px solid #DFDFDF;
      border-radius: 3px;
      margin-top: 12px;
}

/* RESPONSE */

DIV.contact-response {
      width: 100%;
      float: left;
      padding: 12px;
      background: #000;
      color: #FFF;
      margin-top: 8px;
      margin-bottom: 8px;
}

/* MOBILE AND TABLET DEVICE VIEWING */

@media (max-width: 1024px) {
      DIV.header > DIV.left {
            width: 70%;
            margin: 0;
      }
      
      DIV.header > DIV.left > IMG {
            width: 100%;
      }
      
      DIV.header > DIV.mobile-right {
            margin: 0;
            display: block;
            width: 30%;
            float: left;
            font-size: 48px;
            color: #C0C0C0;
            margin-top: 30px;
            text-align: center;
            cursor: pointer;
      }

      DIV.header > DIV.right, DIV.footer > DIV.right, DIV.side-map, DIV.footer, DIV.top {
            display: none;
      }
      
      DIV.bottom {
            display: block;
      }

      DIV.search > INPUT, DIV.search > SELECT {
            width: 100%;
            margin-top: 8px;
      }
      
      DIV.welcome > DIV.box {
            width: 100%;
      }
      
      DIV.featured-box {
            width: 100%;
            margin: 0;
            margin-top: 12px;
      }
      
      DIV.about > DIV.left, DIV.about > DIV.right {
            width: 100%;
            margin: 0;
            margin-top: 12px;
      }
      
      DIV.contact-options > DIV.box {
            width: 100%;
            margin: 0;
            margin-top: 12px;
      }

      DIV.side-menu > DIV.left, DIV.side-menu > DIV.right, DIV.side-menu > DIV.left > DIV > INPUT, DIV.ad-box, DIV.ad-pic, DIV.ad-spec, DIV.copyright > DIV.left, DIV.copyright > DIV.right {
            width: 100%;
      }
      
      DIV.copyright > DIV.left, DIV.copyright > DIV.right {
            text-align: center;
      }
      
      DIV.ad-spec {
            margin-top: 12px;
      }
      
      DIV.contact-box > DIV > INPUT[type=text], DIV.contact-box > DIV > TEXTAREA {
            width: 100%;
      }
      
      DIV.welcome > DIV.box > DIV.circle {
            font-size: 50px;
            padding: 50px;
            padding-left: 45px;
      }
      
      DIV.contact-options > DIV.box > DIV.circle {
            font-size: 32px;
            padding: 20px;
            padding-left: 18px;
      }
}

@media (min-width: 768px) and (max-width: 1024px) {
      DIV.welcome > DIV.box > DIV.circle {
            width: 25%;
            padding-left: 50px;
            margin-left: 37%;
      }
      
      DIV.contact-options > DIV.box > DIV.circle {
            width: 20%;
            font-size: 65px;
      }
      
      DIV.contact-options > DIV.box > DIV.text {
            width: 80%;
      }
}