/*
 * [2019-02-18] @daniel : 新增。
 */

.pure-button {
    min-width: 120px;
}
a.pure-button {
    text-decoration: none !important;
}
.button-xsmall {
    font-size: 70%;
}

.button-small {
    font-size: 85%;
}

.button-large {
    font-size: 110%;
}

.button-xlarge {
    font-size: 125%;
}


.readonly {
    background-color: #e9ecef !important;
    pointer-events: none !important;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    height: 0; 
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.select-container {
  position: relative;
  /*Don't really need this just for demo styling*/
  
  /*float: left;*/
  /*min-width: 200px;*/
  /*margin: 50px 33%;*/
}
 
/*To remove button from IE11, thank you Matt */
select::-ms-expand {
     display: none;
}
.select-container-:after {
  content: ' ';
  background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAA1UlEQVRIS+3SMWpCQRSF4e9FTJsyrUX2YGNjYWGTHbgHwcJkJTapQsAUQrBQyBZcQcAUAQtBcAlJZCCPaNA3oyBp3tTnnn/mv5M588nO3K8ERA2Xik5W1MEU62jDb6COb8y2Zw7t4BL3GGCVAGmghqe/2aIlV3GHBywLIE1c43lfJvaLKj+QRyz2FLRwhdGhC8QAYe4CfQzxsVXURlA5LlKYAsghPbzgHbf4xCS2n1RA6AnZLr7whtdYeT6UksszAXKDeerQMS9I7dzJlYCotlLR/yvaAK8IGBnVmkD0AAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
  /*font-size: 21px;*/
  /*font-family: Consolas,monaco,monospace;*/
  /*color: #949aa0;*/
  /*-webkit-transform: rotate(90deg);*/
  /*-moz-transform: rotate(90deg);*/
  /*-ms-transform: rotate(90deg);*/
  /*transform: rotate(90deg);*/
  right: 4px;
  /*Adjust for position however you want*/
  width: 24px;
  height: 24px;
  top: 8px;
  /*padding: 0 0 2px;*/
  /*border-bottom: 1px solid #999;*/
  /*left line */
  
  position: absolute;
  pointer-events: none;
}
 
.select-container- select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* Add some styling */
  
  display: block;
  width: 100%;
  /*max-width: 320px;*/
  /*height: 50px;*/
  float: right;
  margin: 0;
  /*padding: 0px 24px;*/
  /*font-size: 16px;*/
  /*line-height: 1.75;*/
  /*color: #333;*/
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #cccccc;
  -ms-word-break: normal;
  word-break: normal;
}

.upload-success-show {
    display: none;
}

.pika-lendar {
    width: 260px;
}
.pika-single {
    font-family: "Arial", "Heiti TC", "Microsoft JhengHei", sans-serif;
}
.pika-label,
.pika-table th{
    font-size: 16px;
}
.pika-button {
    font-size: 16px;
    padding: 8px;
}
.pika-button {
    border-radius: 0 !important;
}

input[readonly], select[readonly]
{
    /*background-color: #ddd;*/
}

.pure-form input[type=password], .pure-form input[type=email], .pure-form input[type=url], .pure-form input[type=date], .pure-form input[type=month], .pure-form input[type=time], .pure-form input[type=datetime], .pure-form input[type=datetime-local], .pure-form input[type=week], .pure-form input[type=tel], .pure-form input[type=color], .pure-form input[type=number], .pure-form input[type=search], .pure-form input[type=text], .pure-form select, .pure-form textarea {
    border: 1px solid #dbdddf;
    box-shadow: none;
    border-radius: 6px;
    color: #48565f;
    /*padding: .8em 1em;*/
}
.pure-form input[type=password], .pure-form input[type=email], .pure-form input[type=url], .pure-form input[type=date], .pure-form input[type=month], .pure-form input[type=time], .pure-form input[type=datetime], .pure-form input[type=datetime-local], .pure-form input[type=week], .pure-form input[type=tel], .pure-form input[type=color], .pure-form input[type=number], .pure-form input[type=search], .pure-form input[type=text], .pure-form textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
}

.pure-form legend {
    /*padding: 10px 15px;*/
    color: #46bbe8;
    border-bottom: 2px solid #f5f5f5;
    font-weight: normal;
    font-size: 18px;
    text-align: center;
}
.pure-form label {
    /*color: #949aa0;*/
}

.pure-form select {
    /* height: 2.25em; */
    /* border: 1px solid #ccc; */
    /* background-color: #fff; */
    /*padding: 5px 5px 10px;*/
    padding: 0 0 0 4px;
}

.pure-form input:not([type]), .pure-form input[type=password], .pure-form input[type=email], .pure-form input[type=url], .pure-form input[type=date], .pure-form input[type=month], .pure-form input[type=time], .pure-form input[type=datetime], .pure-form input[type=datetime-local], .pure-form input[type=week], .pure-form input[type=tel], .pure-form input[type=color], .pure-form input[type=number], .pure-form input[type=search], .pure-form input[type=text], .pure-form label {
    margin-bottom: 0;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #dbdddf;
    font-size: 14px;
    opacity: 1; /* Firefox */
}
::-webkit-input-placeholder, /* webkit solution */
::-moz-placeholder, /* mozilla solution - this is for firefox 18+ */
:-moz-placeholder, /* mozilla solution - this is for firefox 18- */
:-ms-input-placeholder, /* Internet Explorer 10-11 */
::-ms-input-placeholder { /* Microsoft Edge */
    color: #dbdddf;
    font-size: 14px;
    opacity: 1; /* Firefox */
}

.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.pure-button-primary, .pure-button-selected, a.pure-button-primary, a.pure-button-selected {
    background-color: #46bbe8;
    color: #fff;
}
input[type=checkbox], input[type=radio] {
    margin-top: 2px;
    margin-right: 2px;
}
.pure-form input[type=file]:focus, .pure-form input[type=checkbox]:focus, .pure-form input[type=radio]:focus {
    outline: 0;
}

.pure-container {
    
}

.pure-g {
    letter-spacing: normal;
}

.pure-g a:hover {
    /*text-decoration: underline;*/
}
/*.input-group .input-group-text {
    padding: 0 0.6rem;
}
.input-group .form-control {
    height: 100%;
}*/

.pure-list {
    list-style: none;
    border-top: 1px solid #e8ebed;
}

.pure-list li {
    border-bottom: 1px solid #e8ebed;
}

.pages ul li span {
    width: 24px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
    margin: 0;
    padding: 0;
    text-align: center;
}

.pages ul li a {
    width: 24px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
    font-weight: normal; 
    margin: 0; 
    text-decoration: none;
}
.pages ul li span.now {
    color: #fff;
    border-radius: 12px;
    font-weight: normal;
}
.pages ul li span.now:hover {
    color: #fff;
}

.wrapper {
        /*background: #fafafa;*/
    }
    .pure-g [class*="pure-u"] {
        font-family: "Arial", "Heiti TC", "Microsoft JhengHei", sans-serif;
    }
.pure-g > div {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
        .l-box {
            padding: 1em;
        }
.content {
    border: 1px solid #e8ebed;
    /*border-radius: 8px;*/
    background: #fff;
}
.content {
    padding: 30px;
    padding-bottom: 100px;
    margin-bottom: 30px;
    min-height: 475px;
}

.ui-datepicker-trigger {
    position: absolute;
    right: 8px;
    bottom: 8px;
}

#no-more-tables {
    width: 100%;
}

.pure-table {
    font-size: 15px;
    width: 100%;
    /*color: #888;*/
    border: 0;
    border: 1px solid #e8ebed;
    text-align: center;
    margin-bottom: 15px;
}
.pure-table thead {
    color: inherit;
}
.pure-table-hover tr:hover {
    background: #fffff6;
}
.pure-table th {
    text-align: center;
    background: #f8fafb;
    white-space: nowrap;
}
.pure-table td {
    height: 3em;
    line-height: 1.2;
}
.pure-table td, .pure-table th {
    border: 0;
    /*border-top: 1px solid #e8ebed;*/
    border-bottom: 1px solid #e8ebed;
    padding: .5em;
}
.pure-table form  {
    border-bottom: 1px solid #e8ebed;
}
.pure-table form:last-child  {
    border: 0;
}
.pure-table .table-upload td {
    border: 0;
}
.pure-table a {
    /*color: #46bbe8;*/
}
.pure-table a:hover {
    /*color: #1998c9;*/
}

.pure-tabs-container {
    position: relative;
}
.pure-tabs {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    /*transform: translate3d(0,0,0);*/
    border-left: 1px solid #e8ebed;
    margin-bottom: 0;
}
.pure-tabs li {
    display: inline-block;
    margin-right: -4px;
    border-right: 1px solid #e8ebed;
    border-top: 1px solid #e8ebed;
}
.pure-tabs .active,
.pure-tabs .active a,
.pure-tabs .active a:hover {
    /*border-top: 4px solid;*/
    color: #f8fafb;
    /*background: #f8fafb;*/
    background: #46bbe8;
}
.pure-tabs-arrow-left {
    position: absolute;
    top: 0;
    left: -18px;
    width: 18px;
    color: #7f92a5;
    background: #e8ebed;
    padding: 5px 0;
    text-align: center;
    display: none;
}
.pure-tabs-arrow-right {
    position: absolute;
    top: 0;
    right: -18px;
    width: 18px;
    color: #7f92a5;
    background: #e8ebed;
    padding: 5px 0;
    text-align: center;
    display: none;
}
.js-cd-content {
    list-style: none;
    padding: 15px 0;
    border-top: 1px solid #e8ebed;
    margin-bottom: 30px;
}

.title-center {
    width: 100%;
    height: 100%;
    text-align: center;
    font-size: 24px;
    /*background: #333;*/
    color: #eee;
    vertical-align: middle;
    justify-content: center;
    display: flex;
    font-weight: normal;
    align-items: center;
}

.order-table {
    border-left: 1px solid #e8ebed;
    border-top: 1px solid #e8ebed;      
    line-height: 1.6;
}
.order-th, .order-td {
    border-right: 1px solid #e8ebed;
    border-bottom: 1px solid #e8ebed;
    padding: .5em .5em;
    /*line-height: 1;*/
    /*min-height: 2em;*/
}
.order-title {
    /*color: #fff;*/
    background: #e0f4ff;
    padding: .5em .5em;
}
.order-th {
    background: #f8fafb;
}






.pure-table-condensed th,
.pure-table-condensed td {
    padding: .5em .5em;
}
.pure-table-condensed td {
    /*height: auto;*/
    /*line-height: 1.2;*/
}
.pure-table .pure-table-condensed td {
    height: auto;
}

.pure-tabs a {
    padding: 5px 20px;
    display: inline-block;
    text-decoration: none !important;
    background-color: #f8fafb;
    color: inherit;
}
.pure-tabs a:hover {
    /*color: #333;*/
}
.pure-alert {
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}
.pure-alert-warning {
    background-color: #fcf8e3;
    border-color: #faf2cc;
    color: #8a6d3b;
}
.pure-title {
    font-size: 30px;
    color: #46bbe8;
    font-weight: bold;
    text-align: left;
    margin-top: 0;
    margin-bottom: 15px;
}



.pure-menu {
    text-align: left;
}
.pure-menu .pure-menu-has-children>.pure-menu-link:after {
    content: '';
}
.pure-menu a:hover {
    text-decoration: none;
}
.pure-menu img {
    width: 16px;
    vertical-align: top;
}
.pure-menu .pure-menu-children {
    left: initial;
    right: 0;
    top: 0;
    box-shadow: rgba(57, 70, 78, 0.15) 0px 0px 1px, rgba(57, 70, 78, 0.25) 0px 20px 55px -8px;
}
.pure-menu-more {
    width: 32px;
    height: 32px;
    padding: 8px;
    border-radius: 15px;
}
.pure-menu-active>.pure-menu-link, .pure-menu-link:focus, .pure-menu-link:hover {
    /*background-color: #f8fafb;*/
}


.pure-td-img {
    margin: 2px;
}
.hover {
    opacity: .6;
}
.hover:hover {
    opacity: 1;
}






.faq-link {
    cursor: pointer;
    padding: 10px 15px;
    background: #f8fafb;
    color: #7f92a5;
    border-bottom: 2px solid #e8ebed;
}
.faq-link span {
    font-weight: normal;
    /*font-size: 12px;*/
}
.faq-answer {
    /*padding: 10px 15px;*/
    line-height: 1.5;
    text-align: justify;
    color: #7f92a5;
    font-size: 15px;
}

.faq-item.active>.faq-link {
    background-color: #d9480f;
    color: #f8f9fa;
}








.pure-tabs-container {
  background: #fff;
}






ul.timeline {
    list-style-type: none;
    position: relative;
    padding-left: 25px;
    margin: 0;
    line-height: 1.4;
}
ul.timeline:before {
    content: ' ';
    background: #d4d9df;
    display: inline-block;
    position: absolute;
    left: 7px;
    width: 2px;
    height: 95%;
    margin-top: 2px;
    z-index: 400;
}
ul.timeline > li {
    margin-bottom: 15px;
    padding-left: 0;
}
ul.timeline > li:before {
    content: ' ';
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    border: 2px solid #fff;
    background: #f5f5f5;
    left: 0;
    width: 12px;
    height: 12px;
    line-height: 2em;
    z-index: 400;
    margin-top: 2px;
}
ul.timeline > li.success:before {
    background: #badc58;
}
ul.timeline > li.danger:before {
    background: #ff7979;
}
ul.timeline > li span {
    font-size: 14px;
    color: #949aa0;
}






.progressbar {
  margin: 30px 0;
  padding: 0;
  overflow: hidden;
  counter-reset: step;
  position: relative;
  z-index: 1;
}

.progressbar li {
  list-style-type: none;
  float: left;
  font-size: 15px;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  color: #949aa0;
  line-height: 1;
}
.progressbar-2 li {
    width: 50%;
}
.progressbar-3 li {
    width: 33%;
}
.progressbar-4 li {
    width: 25%;
}
.progressbar-5 li {
    width: 20%;
}
.progressbar-6 li {
    width: 16.66%;
}
.progressbar-7 li {
    width: 14.28%;
}
.progressbar-8 li {
    width: 12.5%;
}
.progressbar-9 li {
    width: 11.11%;
}
.progressbar-10 li {
    width: 10%;
}
.progressbar li:before {
  width: 30px;
  height: 30px;
  content: counter(step);
  counter-increment: step;
  line-height: 28px;
  border: 2px solid #949aa0;
  display: block;
  text-align: center;
  margin: 0 auto 10px auto;
  border-radius: 50%;
  background-color: #fff;
  font-weight: bold;
}
.progressbar li:after {
  width: 100%;
  height: 2px;
  content: '';
  position: absolute;
  background-color: #949aa0;
  top: 15px;
  left: -50%;
  z-index: -1;
}
.progressbar li:first-child:after {
  content: none;
}
.progressbar li.active {
  color: #46bbe8;
}
.progressbar li.active:before {
  border-color: #46bbe8;
}
.progressbar li.active:after {
  background-color: #46bbe8;
}



.pure-header {
    font-size: 20px;
    padding: 15px;
    border: 1px solid #eee;
    border-bottom: 0;
    text-align: center;
    background: #f5f5f5;
    font-weight: normal;
    letter-spacing: 1em;
    text-indent: 1em;
}

.product-items {
    border-left: 1px solid #eee;
    border-top: 1px solid #eee;
}
.product-items .product-item {
    text-align: center;
    padding: 15px;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    line-height: 1.5;
}
.product-item a {
    display: block;
    transition: color ease-out .2s;
}
.product-item a:hover {
    color: #FF6EB4;
    text-decoration: none;
}
.product-item a:hover .product-item-title {
    /*text-decoration: underline;*/
}
.product-item-title {
    font-size: 16px;
    font-weight: normal;
    text-align: left;
    margin: 5px 0;
}
.product-item-size {
    font-size: 13px;
    color: #bbb;
    text-align: left;
    line-height: 1;
}








.news-item-wrapper {
    list-style: none;
    border: 1px solid #eee;
    padding: 5px 15px;
}

.news-item {
    border-bottom: 1px solid #eee;
    padding: 10px 0;
    line-height: 1.5;
}

.news-item:last-child {
    border: 0;
}

.news-item-title {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.news-item-date {
    font-size: 13px;
    color: #bbb;
    line-height: 1;
}

.news-item a {
    transition: color ease-out .2s;
}

.news-item a:hover,
.news-item a:active {
    color: #FF6EB4;
    text-decoration: none;
}




.tag-items-wrapper {
    padding: 15px;
}
.tag-item a {
    border: 1px solid #ddd;
    padding: 5px 10px;
    display: inline-block;
    margin: 0 4px 8px 0;
    color: #bbb;
    line-height: 1;
    transition: all ease-out .2s;
    border-radius: 20px;
}
.tag-item {
    display: inline-block;
}

.tag-item a:hover,
.tag-item a:active {
    color: #FF6EB4;
    border-color: #FF6EB4;
}



.pure-form .pure-help-inline, .pure-form-message-inline {
    font-style: italic;
}

.jconfirm .jconfirm-box {
    padding: 30px 30px 15px;
    border-radius: 0 !important;
}
.jconfirm .jconfirm-box div.jconfirm-title-c {
    text-align: center;
    line-height: initial;
}
.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons, .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons {
    float: none;
    text-align: center;
}
.jconfirm .jconfirm-box .jconfirm-buttons button {
    padding: .5em 2em;
    border-radius: 0;
}

.inline-block {
    display: inline-block;
}
.fleft {
    float: left;
}

/*.input-group {
    position: relative;
    display: table;
    border-collapse: separate;
}
.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.input-group-addon:first-child {
    border-right: 0;
}
.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child>.btn, .input-group-btn:first-child>.btn-group>.btn, .input-group-btn:first-child>.dropdown-toggle, .input-group-btn:last-child>.btn-group:not(:last-child)>.btn, .input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:first-child>.btn-group:not(:first-child)>.btn, .input-group-btn:first-child>.btn:not(:first-child), .input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group>.btn, .input-group-btn:last-child>.dropdown-toggle {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.input-group-addon, .input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}
.input-group .form-control, .input-group-addon, .input-group-btn {
    display: table-cell;
}
.input-group .form-control, .input-group-addon, .input-group-btn {
    display: table-cell;
}
.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin: 0 !important;
}*/















@media screen and (max-width:567px) {
    .wrapper {
        background: #fff;
    }
    .pure-g .l-box {
        /*padding: 0 1em 1em;*/
    }
    .pure-g .content {
        border: 0;
        padding: 0;
    }
    
    .sidebar-nav {
        font-size: 18px;
    }
    
    body,
    .pure-table {
        font-size: 16px;
        /*border-radius: 8px;*/
    }
    
    .pure-table .pure-table {
        font-size: 14px;
        /*border-radius: 8px;*/
    }
    
    .pure-table td {
        height: auto;
        line-height: 1;
        padding: .25em .5em;
    }
    
    .pure-table tr {
        position: relative;
    }
    .pure-menu img {
        width: 20px;
    }
    .pure-menu-more {
        width: 40px;
        height: 40px;
        padding: 10px;
        border-radius: 15px;
    }
    .pure-table td.more {
        position: absolute !important;
        right: 0;
        bottom: 0;
        padding: 0;
    }
    .pure-table td.more a {
        border-radius: 0;
    }
    
    .pure-g form .l-box {
        padding: 0;
    }
    
    /* The sticky class is added to the header with JS when it reaches its scroll position */
    .sticky {
        position: fixed;
        top: 60px;
        left: 0;
        z-index: 99999;
        width: 100%;
        padding: 0 18px;
        border-bottom: 1px solid #e8ebed;
        -webkit-overflow-scrolling: touch;
    }

    /* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) */
    .sticky .pure-tabs {
        /*padding-top: 70px;*/
    }

    .sticky .pure-tabs-arrow-left {
        left: 0;
        display: block;
    }
    .sticky .pure-tabs-arrow-right {
        right: 0;
        display: block;
    }
    
    .pure-form .pure-help-inline, .pure-form-message, .pure-form-message-inline {
        line-height: 1;
        text-align: right;
    }
    
    .pure-table-td-action {
        text-align: right !important;
    }
    
    .pure-td-img img {
        display: inline-block;
        margin: 0 4px;
        width: 24px;
    }
    
    .order-product-pic {
        padding: 10px !important;
        text-align: center !important;
        border-bottom: 1px solid #e8ebed !important;
        margin-bottom: 10px!important;
    }

    .order-product-pic img {
        width: 100%;
        max-width: 200px;
    }
    
}

@media only screen and (max-width: 767px) {
    
	/* Force table to not be like tables anymore */
	#no-more-tables table, 
	#no-more-tables thead, 
	#no-more-tables tbody, 
	#no-more-tables th, 
	#no-more-tables td, 
	#no-more-tables tr { 
		display: block; 
	}
 
	/* Hide table headers (but not display: none;, for accessibility) */
	#no-more-tables thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
 
	#no-more-tables tr { 
        /*border: 2px solid #e8ebed;*/
         border-bottom: 1px solid #e8ebed; 
        /*margin: 15px 0;*/
        padding: 10px 0;
        /*border-radius: 8px;*/
    }
 
	#no-more-tables td { 
		/* Behave  like a "row" */
		border: none;
		/*border-bottom: 1px solid #e8ebed;*/ 
		position: relative;
		padding-left: 5em; 
		white-space: normal;
		text-align:left;
	}
    
    #no-more-tables.no-th td { 
        padding-left: .5em;
        text-align: center;
    }
    
	#no-more-tables td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: .25em;
		left: .5em;
		width: 4em; 
		/*padding-right: 10px;*/ 
		white-space: nowrap;
		text-align: right;
		font-weight: bold;
        /*color: #333;*/
	}
 
	/*
	Label the data
	*/
	#no-more-tables td:before { content: attr(data-title); }
}

















/* pure-hidden-xs */
@media screen and (max-width:567px) {
    .pure-visible-sm{display:none;}
    .pure-visible-md{display:none;}
    .pure-visible-lg{display:none;}
    .pure-visible-xl{display:none;}
    .pure-hidden-xs{display:none;}
}
/* pure-hidden-sm */
@media screen and (min-width:568px) and (max-width:767px) {
    .pure-visible-xs{display:none;}
    .pure-visible-md{display:none;}
    .pure-visible-lg{display:none;}
    .pure-visible-xl{display:none;}
    .pure-hidden-sm{display:none;}
}
/* pure-hidden-md */
@media screen and (min-width:768px) and (max-width:1023px) {
    .pure-visible-xs{display:none;}
    .pure-visible-sm{display:none;}
    .pure-visible-lg{display:none;}
    .pure-visible-xl{display:none;}
    .pure-hidden-md{display:none;}
}
/* pure-hidden-lg */
@media screen and (min-width:1024px) and (max-width:1279px) {
    .pure-visible-xs{display:none;}
    .pure-visible-sm{display:none;}
    .pure-visible-md{display:none;}
    .pure-visible-xl{display:none;}
    .pure-hidden-lg{display:none;}
}
/* pure-hidden-xl */
@media screen and (min-width:1280px) {
    .pure-visible-xs{display:none;}
    .pure-visible-sm{display:none;}
    .pure-visible-md{display:none;}
    .pure-visible-lg{display:none;}
    .pure-hidden-xl{display:none;}
}

.pure-container {
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 30px;
}
@media screen and (min-width: 35.5em) {

    
}
@media screen and (min-width: 48m) {
    
}
@media screen and (min-width: 64em) {
}
@media screen and (min-width: 80em) {
    .pure-container {
        width: 1170px;
    }
    .product-items .product-item {
        padding: 30px;
    }
}

@media screen and (max-width: 35.5em) {

    .slick-dots {
        display: none !important;
    }
    
    .pure-header {
        padding: 5px 15px;
    }
    
    .pure-container {
        margin-bottom: 0;
    }
    
    .pure-horizontal-wrapper {
        flex-flow: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: -ms-autohiding-scrollbar;
    }
    .pure-horizontal-wrapper [class*=pure-u] {
        flex: 0 0 auto;
        padding: 15px;
    }
    
    .product-item-title {
        font-size: 15px;
    }
    .product-item-size {
        font-size: 10px;
    }
}