Upate all CSS on MVW website

src/Web/WebMVC/wwwroot/css/app.component.css

@@ -0,0 +1,15 @@
+.esh-app-footer {
+  background-color: #000000;
+  border-top: 1px solid #EEEEEE;
+  margin-top: 2.5rem;
+  padding-bottom: 2.5rem;
+  padding-top: 2.5rem;
+  width: 100%; }
+  .esh-app-footer-brand {
+    height: 50px;
+    width: 230px; }
+  .esh-app-footer-text {
+    color: #83D01B;
+    line-height: 50px;
+    text-align: right;
+    width: 100%; }

src/Web/WebMVC/wwwroot/css/app.css

@@ -0,0 +1,12 @@
+/* For development environment */
+
+@import url('./app.component.css');
+@import url('./shared/components/header/header.css');
+@import url('./shared/components/identity/identity.css');
+@import url('./shared/components/pager/pager.css');
+@import url('./basket/basket.component.css');
+@import url('./basket/basket-status/basket-status.component.css');
+@import url('./catalog/catalog.component.css');
+@import url('./orders/orders.component.css');
+@import url('./orders/orders-detail/orders-detail.component.css');
+@import url('./orders/orders-new/orders-new.component.css');

src/Web/WebMVC/wwwroot/css/basket/basket-status/basket-status.component.css

@@ -0,0 +1,25 @@
+.esh-basketstatus {
+  cursor: pointer;
+  float: right;
+  position: relative;
+  transition: all 0.35s; }
+  .esh-basketstatus-image {
+    height: 36px;
+    margin-top: .5rem; }
+  .esh-basketstatus-badge {
+    background-color: #83D01B;
+    border-radius: 50%;
+    color: #FFFFFF;
+    display: block;
+    height: 1.5rem;
+    left: 50%;
+    position: absolute;
+    text-align: center;
+    top: 0;
+    transform: translateX(-38%);
+    transition: all 0.35s;
+    width: 1.5rem; }
+  .esh-basketstatus:hover .esh-basketstatus-badge {
+    background-color: transparent;
+    color: #75b918;
+    transition: all 0.35s; }

src/Web/WebMVC/wwwroot/css/basket/basket.component.css

@@ -0,0 +1,46 @@
+.esh-basket {
+  min-height: 80vh; }
+  .esh-basket-titles {
+    padding-bottom: 1rem;
+    padding-top: 2rem; }
+    .esh-basket-titles--clean {
+      padding-bottom: 0;
+      padding-top: 0; }
+  .esh-basket-title {
+    text-transform: uppercase; }
+  .esh-basket-items--border {
+    border-bottom: 1px solid #EEEEEE;
+    padding: .5rem 0; }
+    .esh-basket-items--border:last-of-type {
+      border-color: transparent; }
+  .esh-basket-item {
+    font-size: 1rem;
+    font-weight: 300; }
+    .esh-basket-item--middle {
+      line-height: 8rem; }
+      @media screen and (max-width: 1024px) {
+        .esh-basket-item--middle {
+          line-height: 1rem; } }
+    .esh-basket-item--mark {
+      color: #00A69C; }
+  .esh-basket-image {
+    height: 8rem; }
+  .esh-basket-input {
+    line-height: 1rem;
+    width: 100%; }
+  .esh-basket-checkout {
+    border: none;
+    border-radius: 0;
+    background-color: #83D01B;
+    color: #FFFFFF;
+    display: inline-block;
+    font-size: 1rem;
+    font-weight: 400;
+    margin-top: 1rem;
+    padding: 1rem 1.5rem;
+    text-align: center;
+    text-transform: uppercase;
+    transition: all 0.35s; }
+    .esh-basket-checkout:hover {
+      background-color: #4a760f;
+      transition: all 0.35s; }

src/Web/WebMVC/wwwroot/css/catalog/catalog.component.css

@@ -0,0 +1,111 @@
+.esh-catalog-hero {
+  background-image: url("../../images/main_banner.png");
+  background-size: cover;
+  height: 260px;
+  width: 100%; }
+
+.esh-catalog-title {
+  position: relative;
+  top: 74.28571px; }
+
+.esh-catalog-filters {
+  background-color: #00A69C;
+  height: 65px; }
+
+.esh-catalog-filter {
+  background-color: transparent;
+  border-color: #00d9cc;
+  color: #FFFFFF;
+  cursor: pointer;
+  margin-right: 1rem;
+  margin-top: .5rem;
+  outline-color: #83D01B;
+  padding-bottom: 0;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+  padding-top: 1.5rem;
+  min-width: 140px;
+  -webkit-appearance: none; }
+  .esh-catalog-filter option {
+    background-color: #00A69C; }
+
+.esh-catalog-label {
+  display: inline-block;
+  position: relative;
+  z-index: 0; }
+  .esh-catalog-label::before {
+    color: rgba(255, 255, 255, 0.5);
+    content: attr(data-title);
+    font-size: 0.65rem;
+    margin-top: 0.65rem;
+    margin-left: 0.5rem;
+    position: absolute;
+    text-transform: uppercase;
+    z-index: 1; }
+  .esh-catalog-label::after {
+    background-image: url("../../images/arrow-down.png");
+    height: 7px;
+    content: '';
+    position: absolute;
+    right: 1.5rem;
+    top: 2.5rem;
+    width: 10px;
+    z-index: 1; }
+
+.esh-catalog-send {
+  background-color: #83D01B;
+  color: #FFFFFF;
+  cursor: pointer;
+  font-size: 1rem;
+  margin-top: -1.5rem;
+  padding: 0.5rem;
+  transition: all 0.35s; }
+  .esh-catalog-send:hover {
+    background-color: #4a760f;
+    transition: all 0.35s; }
+
+.esh-catalog-items {
+  margin-top: 1rem; }
+
+.esh-catalog-item {
+  text-align: center;
+  margin-bottom: 1.5rem;
+  width: 33%; }
+  @media screen and (max-width: 1024px) {
+    .esh-catalog-item {
+      width: 50%; } }
+  @media screen and (max-width: 768px) {
+    .esh-catalog-item {
+      width: 100%; } }
+
+.esh-catalog-thumbnail {
+  max-width: 370px;
+  width: 100%; }
+
+.esh-catalog-button {
+  background-color: #83D01B;
+  border: none;
+  color: #FFFFFF;
+  cursor: pointer;
+  font-size: 1rem;
+  height: 3rem;
+  margin-top: 1rem;
+  transition: all 0.35s;
+  width: 80%; }
+  .esh-catalog-button:hover {
+    background-color: #4a760f;
+    transition: all 0.35s; }
+
+.esh-catalog-name {
+  font-size: 1rem;
+  font-weight: 300;
+  margin-top: .5rem;
+  text-align: center;
+  text-transform: uppercase; }
+
+.esh-catalog-price {
+  text-align: center;
+  font-weight: 900;
+  font-size: 28px; }
+  .esh-catalog-price::before {
+    content: '$'; }

src/Web/WebMVC/wwwroot/css/orders/orders-detail/orders-detail.component.css

@@ -0,0 +1,28 @@
+.esh-orders_detail {
+  min-height: 80vh; }
+  .esh-orders_detail-section {
+    padding: 1rem 0; }
+    .esh-orders_detail-section--right {
+      text-align: right; }
+  .esh-orders_detail-titles {
+    padding-bottom: 1rem;
+    padding-top: 2rem; }
+  .esh-orders_detail-title {
+    text-transform: uppercase; }
+  .esh-orders_detail-items--border {
+    border-bottom: 1px solid #EEEEEE;
+    padding: .5rem 0; }
+    .esh-orders_detail-items--border:last-of-type {
+      border-color: transparent; }
+  .esh-orders_detail-item {
+    font-size: 1rem;
+    font-weight: 300; }
+    .esh-orders_detail-item--middle {
+      line-height: 8rem; }
+      @media screen and (max-width: 768px) {
+        .esh-orders_detail-item--middle {
+          line-height: 1rem; } }
+    .esh-orders_detail-item--mark {
+      color: #83D01B; }
+  .esh-orders_detail-image {
+    height: 8rem; }

src/Web/WebMVC/wwwroot/css/orders/orders-new/orders-new.component.css

@@ -0,0 +1,81 @@
+.esh-orders_new {
+  min-height: 80vh; }
+  .esh-orders_new-header {
+    background-color: #00A69C;
+    height: 4rem; }
+  .esh-orders_new-back {
+    color: rgba(255, 255, 255, 0.4);
+    line-height: 4rem;
+    text-transform: uppercase;
+    text-decoration: none;
+    transition: color 0.35s; }
+    .esh-orders_new-back:hover {
+      color: #FFFFFF;
+      transition: color 0.35s; }
+  .esh-orders_new-section {
+    padding: 1rem 0; }
+    .esh-orders_new-section--right {
+      text-align: right; }
+  .esh-orders_new-placeOrder {
+    float: right;
+    margin-top: 40px;
+    margin-bottom: 40px;
+    background-color: #83d01b;
+    color: #fff;
+    padding: 10px 20px 10px 20px;
+    border-radius: 0;
+    border: none;
+    width: 255px;
+    display: inline-block;
+    text-align: center;
+    text-transform: uppercase;
+    height: 45px;
+    font-size: 16px;
+    font-weight: normal; }
+  .esh-orders_new-titles {
+    padding-bottom: 1rem;
+    padding-top: 2rem; }
+  .esh-orders_new-title {
+    font-size: 1.25rem; }
+  .esh-orders_new-items--border {
+    border-bottom: 1px solid #EEEEEE;
+    padding: .5rem 0; }
+    .esh-orders_new-items--border:last-of-type {
+      border-color: transparent; }
+  .esh-orders_new-item {
+    font-size: 1rem;
+    font-weight: 300; }
+    .esh-orders_new-item--middle {
+      line-height: 8rem; }
+      @media screen and (max-width: 768px) {
+        .esh-orders_new-item--middle {
+          line-height: 1rem; } }
+    .esh-orders_new-item--mark {
+      color: #83D01B; }
+  .esh-orders_new-image {
+    height: 8rem; }
+
+@media screen and (min-width: 992px) {
+  .form-input {
+    width: 360px;
+    max-width: 360px; } }
+
+.form-input {
+  border-radius: 0;
+  padding: 10px;
+  height: 45px; }
+
+.form-input-small {
+  max-width: 100px !important; }
+
+.form-input-medium {
+  width: 150px !important; }
+
+.alert {
+  padding-left: 0px; }
+
+.alert-danger {
+  background-color: transparent;
+  border: none;
+  color: #fb0d0d;
+  font-size: 12px; }

src/Web/WebMVC/wwwroot/css/orders/orders.component.css

@@ -0,0 +1,49 @@
+.esh-orders {
+  min-height: 80vh;
+  overflow-x: hidden; }
+  .esh-orders-header {
+    background-color: #00A69C;
+    height: 4rem; }
+  .esh-orders-back {
+    color: rgba(255, 255, 255, 0.4);
+    line-height: 4rem;
+    text-transform: uppercase;
+    text-decoration: none;
+    transition: color 0.35s; }
+    .esh-orders-back:hover {
+      color: #FFFFFF;
+      transition: color 0.35s; }
+  .esh-orders-titles {
+    padding-bottom: 1rem;
+    padding-top: 2rem; }
+  .esh-orders-title {
+    text-transform: uppercase; }
+  .esh-orders-items {
+    height: 2rem;
+    line-height: 2rem;
+    position: relative; }
+    .esh-orders-items:nth-of-type(2n + 1):before {
+      background-color: #EEEEFF;
+      content: '';
+      height: 100%;
+      left: 0;
+      margin-left: -100vw;
+      position: absolute;
+      top: 0;
+      width: 200vw;
+      z-index: -1; }
+  .esh-orders-item {
+    font-weight: 300; }
+    .esh-orders-item--hover {
+      opacity: 0;
+      pointer-events: none; }
+  .esh-orders-items:hover .esh-orders-item--hover {
+    opacity: 1;
+    pointer-events: all; }
+  .esh-orders-link {
+    color: #83D01B;
+    text-decoration: none;
+    transition: color 0.35s; }
+    .esh-orders-link:hover {
+      color: #75b918;
+      transition: color 0.35s; }

src/Web/WebMVC/wwwroot/css/shared/components/header/header.css

@@ -0,0 +1,12 @@
+.esh-header {
+  background-color: #00A69C;
+  height: 4rem; }
+  .esh-header-back {
+    color: rgba(255, 255, 255, 0.5);
+    line-height: 4rem;
+    text-transform: uppercase;
+    text-decoration: none;
+    transition: color 0.35s; }
+    .esh-header-back:hover {
+      color: #FFFFFF;
+      transition: color 0.35s; }

src/Web/WebMVC/wwwroot/css/shared/components/identity/identity.css

@@ -0,0 +1,36 @@
+.esh-identity {
+  line-height: 3rem;
+  position: relative;
+  text-align: right; }
+  .esh-identity-section {
+    display: inline-block;
+    width: 100%; }
+  .esh-identity-name {
+    display: inline-block; }
+    .esh-identity-name--upper {
+      text-transform: uppercase; }
+    @media screen and (max-width: 768px) {
+      .esh-identity-name {
+        font-size: 0.85rem; } }
+  .esh-identity-image {
+    display: inline-block; }
+  .esh-identity-drop {
+    background: #FFFFFF;
+    height: 0;
+    min-width: 14rem;
+    right: 0;
+    overflow: hidden;
+    padding: .5rem;
+    position: absolute;
+    top: 2.5rem;
+    transition: height 0.35s; }
+  .esh-identity:hover .esh-identity-drop {
+    border: 1px solid #EEEEEE;
+    height: 7rem;
+    transition: height 0.35s; }
+  .esh-identity-item {
+    cursor: pointer;
+    transition: color 0.35s; }
+    .esh-identity-item:hover {
+      color: #75b918;
+      transition: color 0.35s; }

src/Web/WebMVC/wwwroot/css/shared/components/pager/pager.css

@@ -0,0 +1,16 @@
+.esh-pager-wrapper {
+  padding-top: 1rem;
+  text-align: center; }
+
+.esh-pager-item {
+  margin: 0 8vw; }
+  .esh-pager-item--navigable {
+    cursor: pointer; }
+    .esh-pager-item--navigable:hover {
+      color: #83D01B; }
+  @media screen and (max-width: 1280px) {
+    .esh-pager-item {
+      font-size: 0.85rem; } }
+  @media screen and (max-width: 1024px) {
+    .esh-pager-item {
+      margin: 0 4vw; } }

src/Web/WebMVC/wwwroot/css/site.css

@@ -1,873 +0,0 @@
-@font-face {
-    font-family: Montserrat;
-    font-weight: 400;
-    src: url("/fonts/Montserrat-Regular.eot?") format("eot"),url("/fonts/Montserrat-Regular.woff") format("woff"),url("/fonts/Montserrat-Regular.ttf") format("truetype"),url("/fonts/Montserrat-Regular.svg#Montserrat") format("svg")
-}
-
-@font-face {
-    font-family: Montserrat;
-    font-weight: 700;
-    src: url("/fonts/Montserrat-Bold.eot?") format("eot"),url("/fonts/Montserrat-Bold.woff") format("woff"),url("/fonts/Montserrat-Bold.ttf") format("truetype"),url("/fonts/Montserrat-Bold.svg#Montserrat") format("svg")
-}
-
-body {
-    padding-top: 80px;
-    /*padding-bottom: 20px;*/
-    font-family: Montserrat,sans-serif;
-    min-width:480px;
-}
-
-.mt-15 {
-    margin-top:15px;
-}
-
-/* Wrapping element */
-/* Set some basic padding to keep content from hitting the edges */
-.body-content {
-    padding-left: 15px;
-    padding-right: 15px;
-}
-
-/* Set widths on the form inputs since otherwise they're 100% wide */
-input,
-select,
-textarea {
-    max-width: 280px;
-}
-
-.select-filter {
-    background-color: #00A69C;
-    padding: 10px;
-    margin: 10px;
-    margin-right: 20px;
-    color: white;
-    padding-top: 20px;
-    padding-bottom: 3px;
-    min-width: 140px;
-    border-color: #37c7ca;
-    max-height: 43px;
-    -webkit-appearance: none;
-}
-
-    .select-filter option {
-        background-color: #00a69c;
-    }
-
-select::-ms-expand {
-    display: none;
-}
-
-.select-filter-wrapper {
-    z-index: 0;
-    display:inline-block;
-    margin-left: -10px;
-    position:relative
-}
-
-.select-filter-wrapper::before {
-    content: attr(data-name);
-    opacity: 0.5;
-    z-index: 1;
-    text-transform: uppercase;
-    position: absolute;
-    font-size: 10px;
-    margin-top: 15px;
-    margin-left: 21px;
-    color: white;
-}
-
-.select-filter-arrow-container {
-    position: absolute;
-    top: 15px;
-    right: 25px;
-}
-   
-
-/*.select-filter-arrow {
-    position: absolute;
-    margin-left: 130px;
-    margin-top: 40px;
-}*/
-
-.btn-brand-small-filter {
-    margin-top: 10px;
-    position: absolute;
-    margin-left: 15px;
-}
-
-/* Carousel */
-.carousel-caption p {
-    font-size: 20px;
-    line-height: 1.4;
-}
-
-.layout-cart-image {
-    height: 36px;
-    margin-top: 5px;
-}
-
-.layout-cart-badge {
-    position: absolute;
-    margin-top: 2px;
-    margin-left: 14px;
-    background-color: #83d01b;
-    padding: 1px;
-    color: white;
-    border-radius: 50%;
-    width: 18px;
-    height: 18px;
-    font-size: 12px;
-    cursor: pointer;
-}
-
-/* buttons and links extension to use brackets: [ click me ] */
-.btn-bracketed:hover:before {
-    display: inline-block;
-    content: "[";
-    padding-right: 0.5em;
-    color: chartreuse;
-}
-
-.btn-bracketed:hover:after {
-    display: inline-block;
-    content: "]";
-    padding-left: 0.5em;
-    color: chartreuse;
-}
-
-.btn-brand {
-    background-color: #83D01B;
-    color: white;
-    padding: 10px 20px 10px 20px;
-    border-radius: 0px;
-    border: none;
-    width: 255px;
-    display: inline-block;
-    text-align: center;
-    text-transform: uppercase;
-    height: 45px;
-    font-size: 16px;
-    font-weight: normal;
-}
-
-.btn-brand::before {
-    content: '['
-}
-
-.btn-brand::after {
-    content: ']'
-}
-
-        .btn-brand:hover:before {
-            padding-right: 5px;
-        }
-
-        .btn-brand:hover:after {
-            padding-left: 5px;
-        }
-
-.btn-brand-big {
-    width: 360px;
-    margin-top: 20px;
-}
-
-.btn-brand-small {
-    width: 45px;
-}
-
-    .btn-brand-small::before {
-        content: '';
-    }
-
-    .btn-brand-small::after {
-        content: '';
-    }
-
-    .btn-brand-small:hover:before {
-        content: '';
-        padding: 0;
-    }
-
-    .btn-brand-small:hover:after {
-        content: '';
-        padding: 0;
-    }
-
-.btn-brand-dark {
-    background-color: #00a69c;
-}
-
-.btn-brand:hover {
-    color: white;
-    background-color: #83D01B;
-    text-decoration:none;
-}
-
-.btn-brand-dark:hover {
-    background-color: #00a69c;
-}
-
-.btn-cart {
-    float: right;
-    margin-top: 40px;
-    margin-bottom: 40px;
-}
-
-.btn-catalog-apply {
-    padding:0;
-}
-
-.form-label {
-    text-transform: uppercase;
-    font-weight: normal!important;
-    text-align: left;
-    margin-bottom: 10px !important;
-    color: #404040;
-}
-
-.form-input {
-    border-radius: 0;
-    padding: 10px;
-    height: 45px;
-}
-
-.form-input-small {
-    max-width: 100px!important;
-}
-
-.form-select {
-    border-radius: 0;
-    padding: 10px;
-    height: 45px;
-    width: 150px;
-}
-
-/* Make .svg files in the carousel display properly in older browsers */
-.carousel-inner .item img[src$=".svg"] {
-    width: 100%;
-}
-
-.navbar-inverse {
-    background-color: #FFF;
-    border-color: #FFF;
-}
-
-    /*.navbar-inverse li {
-        margin-top: 10px;
-    }*/
-
-.btn-login {
-    border: 1px solid #00A69C;
-    height: 36px!important;
-    margin-right: 10px;
-    margin-top: 10px;
-    background-color: white;
-    color: #00a69c;
-    text-transform:uppercase;
-    max-width: 140px;
-    width: 140px;
-    padding-top:8px!important;
-}
-
-.btn-login {
-    font-weight:normal!important;
-}
-
-    .btn-login::before {
-        content: '[';
-    }
-
-    .btn-login::after {
-        content: ']';
-    }
-
-    .btn-login:hover:before {
-        content: '[ ';
-    }
-
-    .btn-login:hover:after {
-        content: ' ]';
-    }
-
-.navbar-inverse li a {
-    height: 30px;
-    padding: 5px 20px;
-    color: #00A69C !important;
-}
-
-.navbar-brand {
-    margin-top: 20px;
-    background-image: url(../images/brand.PNG);
-    width: 201px;
-    height: 44px;
-    margin-left: 0px !important;
-}
-
-.nav > li > a {
-    color: white;
-}
-
-    .nav > li > a:hover, .nav > li > a:focus {
-        background-color: #00A69C;
-        font-weight: bolder;
-    }
-
-.container-fluid {
-    padding-left: 0px;
-    padding-right: 0px;
-}
-
-.home-banner {
-    width: 100%;
-    margin-right: 0px;
-    margin-left: 0px;
-    background-image: url(../images/main_banner.png);
-    background-size: cover;
-    height: 258px;
-    background-position: center;
-}
-
-.home-banner-text {
-    margin-top: 70px;
-}
-
-.home-catalog-container {
-    min-height: 400px;
-    margin-bottom: 20px;
-}
-
-.home-catalog-filter-container {
-    background-color: #00A69C;
-    height:63px;
-}
-
-    .home-catalog-filter-container li a {
-        padding-top: 5px !important;
-    }
-
-.home-catalog-filter-brands::before {
-    content: 'BRAND';
-    color: white;
-    font-size: x-small;
-    opacity: 0.5;
-    margin: 10px 0px 0px 15px;
-}
-
-.home-catalog-filter-types::before {
-    content: 'TYPES';
-    color: white;
-    font-size: x-small;
-    opacity: 0.5;
-    margin: 10px 0px 0px 15px;
-}
-
-.home-catalog-item {
-    margin-top: 10px;
-    margin-bottom: 10px;
-}
-
-.home-catalog-item-image {
-    width: 100%;
-    object-fit: cover;
-    /* max-width: 320px; */
-    text-align: center;
-}
-
-.home-catalog-item-image-addCart {
-    background-color: #83D01B;
-    color: white;
-    display: inline-block;
-    height: 43px;
-    padding: 10px 20px 10px 20px;
-    font-weight: bold;
-    text-align: center;
-    margin-top: 10px;
-    margin-left: 60px;
-    margin-right: 60px;
-    font-size: 16px;
-    font-weight: normal;
-}
-
-    .home-catalog-item-image-addCart:hover {
-        color: white;
-        text-decoration: none;
-    }
-
-
-.home-catalog-item-image:hover:after {
-    cursor: pointer;
-}
-
-.home-catalog-item-title {
-    text-align: center;
-    text-transform: uppercase;
-    font-weight: 300;
-    font-size: 16px;
-    margin-top: 20px;
-}
-
-.home-catalog-item-price {
-    text-align: center;
-    font-weight: 900;
-    font-size: 28px;
-}
-
-    .home-catalog-item-price::before {
-        content: '$';
-    }
-
-.home-catalog-noResults {
-    text-align:center;
-    margin-top: 100px;
-}
-
-.container .nav .navbar-nav .col-sm-6 ::before {
-    content: 'BRAND';
-}
-
-.validation-summary-errors  li {
-    list-style: none;
-}
-
-footer {
-    background-color: black;
-    height: 150px;
-    vertical-align: middle;
-}
-
-    footer .brand {
-        margin-top: 25px;
-        background-image: url(../images/brand_dark.PNG);
-        max-width: 231px;
-        height: 52px;
-        margin-left: 0px !important;
-    }
-
-    footer .text {
-        text-align: right;
-        width: 100%;
-        height: 100%;
-        color: #83D01B;
-        margin-top: 10px;
-    }
-
-.text {
-    color: #83D01B;
-}
-
-.text:hover {
-    color: #83D01B;
-}
-
-form .col-md-4 {
-    text-align: right;
-}
-
-.brand-header-block {
-    background-color: #00A69C;
-    height: 63px;
-}
-
-    .brand-header-block li {
-        list-style: none;
-        display: inline;
-        opacity: 0.5;
-        margin-top: 25px;
-        margin-left: 10px;
-        float: right;
-        cursor: pointer;
-        color: white;
-    }
-
-        .brand-header-block li a {
-            color: white;
-        }
-
-            .brand-header-block li a:hover {
-                text-decoration:none;
-            }
-
-        .brand-header-block .active {
-            opacity: 1;
-        }
-
-        .brand-header-block .active::before {
-            content: '[ ';
-            color: greenyellow;
-        }
-
-        .brand-header-block .active::after {
-            content: ' ]';
-            color: greenyellow;
-        }
-
-.brand-header-back {
-    float: left!important;
-    margin-top: 20px!important;
-    text-transform: uppercase;
-}
-
-.account-login-container {
-    min-height: 70vh;
-    text-align: center;
-    padding-top: 40px;
-}
-
-.account-register-container {
-    min-height: 70vh;
-    text-align: center !important;
-    align-content: center;
-}
-
-.cart-index-container {
-    min-height: 70vh;
-    padding-top: 40px;
-    margin-bottom: 30px;
-    min-width: 992px;
-}
-
-.register-container {
-    min-height: 70vh;
-    padding-top: 40px;
-    margin-bottom: 30px;
-    padding-left: 30px;
-}
-
-.order-create-container {
-    min-height: 70vh;
-    padding-top: 40px;
-    margin-bottom: 30px;
-    padding-left: 30px;
-    min-width: 995px;
-}
-
-.cart-product-column {
-    max-width: 120px;
-    text-transform: uppercase;
-    vertical-align: middle!important;
-}
-
-.order-create-container .cart-product-column {
-    max-width: 130px;
-}
-
-.cart-product-column-name {
-    width: 220px;
-}
-
-.cart-subtotal-label {
-    font-size: 12px;
-    color: #404040;
-    margin-top:10px;
-}
-
-.cart-subtotal-value {
-    font-size: 20px;
-    color: #00a69c;
-}
-
-.cart-total-label {
-    font-size: 14px;
-    color: #404040;
-    margin-top:10px;
-}
-
-.cart-total-value {
-    font-size: 28px;
-    color: #00a69c;
-    text-align: left;
-}
-
-.cart-product-image {
-    max-width: 210px;
-}
-
-.cart-section-total {
-    margin-bottom: 5px;
-    margin-left: 175px;
-    text-align: left;
-}
-
-.cart-product-column input {
-    width: 70px;
-    text-align: center;
-}
-
-.cart-refresh-button {
-   margin-top:0;
-   background-image: url('../images/refresh.svg');
-   color: white;
-   font-size: 8px;
-   width: 40px;
-   height: 40px;
-   background-color:transparent;
-   border:none;
-   margin-top: 25px;
-   margin-left:15px;
-}
-
-    .cart-refresh-button:hover {
-        background-color:transparent;
-    }
-
-.cart-totals {
-    border-bottom:none!important;
-}
-
-.input-validation-error {
-    border: 1px solid #fb0d0d;
-}
-
-.text-danger {
-    color: #fb0d0d;
-    font-size: 12px;
-}
-
-.cart {
-    border: none !important;
-}
-
-.form-horizontal h4 {
-    margin-top: 30px;
-}
-
-.form-horizontal .form-group {
-    margin-right: 0px!important;
-}
-
-.form-control:focus {
-    border-color: #83d01b;
-}
-
-.form-input-center {
-    margin: auto;
-}
-
-.order-index-container {
-    min-height: 70vh;
-    padding-top: 40px;
-    margin-bottom: 30px;
-}
-
-    .order-index-container .table tbody tr {
-        border-bottom:none;
-    }
-
-    .order-index-container .table tbody tr td {
-        border-top:none;
-        padding-top:10px;
-        padding-bottom:10px;
-    }
-
-
-
-    .order-index-container .table tbody tr:nth-child(even) {
-        background-color: #f5f5f5;
-    }
-
-.order-create-section-title {
-    margin-left: -15px;
-    text-transform: uppercase;
-}
-
-.order-create-section-items {
-    margin-left: -45px;
-    width: 102%;
-}
-
-.order-detail-button {
-    
-}
-
-    .order-detail-button a {
-        color: #83d01b;
-    }
-
-.order-detail-container {
-    min-height: 70vh;
-    padding-top: 40px;
-    margin-bottom: 30px;
-}
-
-    .order-detail-container .table tbody tr:first-child td{
-        border-top:none;
-    }
-
-    .order-detail-container .table tr{
-        border-bottom:none;
-    }
-
-.order-detail-section {
-    margin-top: 50px;
-}
-
-.order-detail-container .table {
-    margin-left: -7px;
-}
-
-.order-section-total {
-    margin-bottom: 5px;
-    margin-left: 20px;
-    text-align: left;
-}
-
-.fr {
-    float:right!important;
-}
-
-.down-arrow {
-    background-image: url('../images/arrow-down.png');
-    height: 7px;
-    width: 10px;
-    display: inline-block;
-    margin-left: 20px;
-}
-
-.logout-icon {
-    background-image: url('../images/logout.PNG');
-    display: inline-block;
-    height:19px;
-    width:19px;
-    margin-left: 15px;
-}
-
-.myorders-icon {
-    background-image: url('../images/my_orders.PNG');
-    display: inline-block;
-    height: 20px;
-    width: 20px;
-    margin-left: 15px;
-}
-
-.login-user {
-    position: absolute!important;
-    top: 30px;
-    right: 65px;
-    cursor:pointer;
-}
-
-.login-user-dropdown {
-    position: relative;
-    display: inline-block;
-}
-
-.login-user-dropdown-content {
-    display: none;
-    position: absolute;
-    background-color: #FFFFFF;
-    min-width: 160px;
-    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
-    right: 0px;
-}
-
-.login-user-dropdown-content a {
-    color: black;
-    padding: 12px 16px;
-    text-decoration: none;
-    display: block;
-    text-align:right;
-    text-transform:uppercase;
-}
-
-.login-user:hover .login-user-dropdown-content {
-    display: block;
-}
-
-.down-arrow:hover > .login-user-dropdown-content {
-    display: block;
-}
-
-.login-user-dropdown-content a:hover {
-    color: #83d01b;
-}
-
-.es-header {
-    min-height: 80px!important;
-}
-
-.es-pager-bottom {
-    margin-top: 40px;
-}
-
-.es-pager-top {
-    margin-bottom: 20px;
-    margin-top: 20px;
-}
-
-.es-pager-top ul {
-    list-style: none;
-}
-
-.es-pager-bottom ul {
-    list-style: none;
-}
-
-.page-item {
-    cursor: pointer;
-}
-
-.next {
-    position: absolute;
-    right: 15px;
-    top: 0;
-}
-
-.previous {
-    position: absolute;
-    left: 0;
-    top: 0;
-}
-
-.is-disabled{
-    cursor: not-allowed;
-    opacity: .5;
-    pointer-events: none;
-}
-
-.table tr {
-    border-bottom:1px solid #ddd;
-}
-
-.table th {
-    text-transform: uppercase;
-}
-
-
-.navbar-nav {
-    margin-top: 10px;
-    margin-bottom: 7.5px;
-    margin-right: -10px;
-    float: right;
-}
-
-@media screen and (max-width: 1195px) {
-    .cart-product-column-name {
-        display:none;
-    }
-}
-
-/* Hide/rearrange for smaller screens */
-@media screen and (max-width: 767px) {
-    /* Hide captions */
-    .carousel-caption {
-        display: none;
-    }
-
-    footer .text {
-        text-align: left;
-        margin-top: -15px;
-    }
-
-    .cart-product-column-brand {
-        display:none;
-    }
-}
-
-@media screen and (min-width: 992px) {
-    .form-input {
-        width: 360px;
-        max-width: 360px;
-    }
-}
-
-