@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900italic,900);

@font-face {
	font-family: "Helvetica 45 Light";
	font-style: normal;
	font-weight: normal;
	src: local("Helvetica 45 Light"), url("../fonts/HelveticaNeue-Light.woff") format("woff");
}

@font-face {
	font-family: "Helvetica 65 Medium";
	font-style: normal;
	font-weight: normal;
	src: local("Helvetica 65 Medium"), url("../fonts/HelveticaNeue-Medium.woff") format("woff");
}

@font-face {
	font-family: "Helvetica Neue Bold";
	font-style: normal;
	font-weight: normal;
	src: local("Helvetica Neue Bold"), url("../fonts/HelveticaNeueBold.woff") format("woff");
}

:root {
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  }
* {
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    -webkit-font-smoothing: antialiased;
    box-sizing: border-box;
    font-family: inherit;
    font-style: inherit;
    font-weight: inherit;
    font-size: 100%;
}
html,
body {
    width: 100%;
    min-height: 100vh;
    overflow-x: hidden;
    scroll-behavior: smooth;
    background-image: linear-gradient(90deg, #cad6e4, #D5E1EF);
    color: linear-gradient(90deg, #0877f6, rgb(5, 255, 59));
    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    font-smoothing: antialiased;
    font-family: var(--font-family-sans-serif);
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}

body {
    font-size: 14px;
    font-weight: 450;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0px;
	color: #c26231;
	font-weight: 600;
}

h1 {
	font-size: 70px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 2em;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}
.cartfoot{
    margin-top: 1em;
}
@media only screen and (min-width:320px) and (max-width:360px) {
    
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 450;
    }
    
h1 {
	font-size: 45px;
}

h2 {
	font-size: 34px;
}
h3 {
	font-size: 30px;
}
}
p {
	font-size: 15px;
	color: #71767b;
	line-height: 1.8;
	font-family: "Helvetica 45 Light", sans-serif;
}

a:active {
    color: #000
}

a:hover,
a:focus {
	text-decoration: none;
	outline: none;
}

ul,
ol {
	padding: 0;
	margin: 0;
}
a.button {
    text-decoration: none
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset
}

:focus {
    outline: none !important
}

::-moz-focus-inner {
    border: 0 !important
}
img {
    max-width: 100%;
  }
iframe {
    border: 0
}

p .small {
    font-size: .9em
}

.margin-small {
    margin-top: 5px;
    margin-bottom: 5px
}

.backbutton {
    width: 80px;

    height: 40px;
    border-radius: 50%;
  }

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

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

.handwriting {
    font-family: 'Indie Flower', cursive
}

.alignleft {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    margin-top: 5px
}

.alignright {
    float: right;
    margin-left: 10px;
    margin-bottom: 10px;
    margin-top: 5px
}

.aligncenter {
    display: block;
    margin: 0 auto
}

.imageborder {
    padding: 5px;
    border: solid 1px #ddd
}

.form-control {
    display: inline-block;
    border-radius: 0;
    width: 100%;
    height: 36px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
}

.form-control:focus {
    border-color: #0099da;
    box-shadow: none
}

textarea.form-control,
select.form-control {
    border-radius: 0
}

textarea.form-control:focus {
    border-color: #0099da
}

@media (min-width:768px) and (max-width:991px) {
    .navbar-brand {
        font-size: 1.9em;
        word-spacing: -5px;
        -webkit-text-stroke: 0;
        background-image: none
    }
}

.card {
    box-shadow: 0 15px 35px -5px rgba(50, 88, 130, .32);
    border-radius: 15px;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
    transition: transform .2s
}


.card-body {
    padding: 10px;
    margin-top: -50px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease-in-out
}

.heart {
    color: #989898;
    margin-top: 15px;
    margin-left: 230px;
    font-size: 30px;
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 30px;
    padding: 0;
    text-align: center;
    cursor: pointer
}

.heart-active {
    color: #C50707
}

.heart:hover {
    color: red;
    background-color: #f9f9f9;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease-in-out
}

.card-body a {
    visibility: hidden
}

.card:hover>.card-body {
    margin-top: -0px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease
}

.card:hover {
    transform: scale(1.02)
}

.card:hover>.card-body>a {
    visibility: visible
}

.wish {
    color: #C50707
}

#toast,
#toast-cart {
    padding: 10px;
    padding-left: 5px;
    position: fixed;
    width: 230px;
    height: 50px;
    top: 0;
    left: 80%;
    transform: translate(-50%);
    background-color: #EFF2FF;
    color: #76777E;
    padding: 1px;
    border-radius: 8px;
    text-align: center;
    z-index: 1;
    box-shadow: 0 0 20px rgba(0, 0, 0, .3);
    visibility: hidden;
    opacity: 0;
    -ms-display: flex;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px
}

#toast.show,
#toast-cart.show {
    visibility: visible;
    animation: fadeInOut 3s
}

@keyframes fadeInOut {

    5%,
    95% {
        opacity: 1;
        top: 50px
    }

    15%,
    85% {
        opacity: 1;
        top: 30px
    }
}

.hider {
    z-index: -1
}

.floating-chat {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(252, 252, 252);
    position: fixed;
    bottom: 10px;
    width: 40px;
    border: 2px solid purple;
    height: 40px;
    transition: all 250ms ease-out;
    border-radius: 50%;
    z-index: 10;
    background: -moz-linear-gradient(-45deg, #0d1452 0, #3b47ac 25%, #0d1452 50%, #1c1e2e 75%, #0d1452 100%);
    background: -webkit-linear-gradient(-45deg, #10196d 0, #0d1452 25%, #111218 50%, #0d1452 75%, #7f84b1 100%);
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: 11
}

.floating-chat.enter:hover {
    box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23);
    opacity: 1
}

.floating-chat.enter {
    transform: translateY(0);
    opacity: .6;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .14)
}

.product_compare_area {
    padding: 100px 0 50px 0
}

.compare_table .table {
    border-left: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    border-top: 1px solid #cccccc;
    margin-bottom: 0
}

.compare_table .table thead {
    text-align: center
}

.compare_table .table thead tr th {
    border-top: 0;
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    font-size: 16px;
    color: #000;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .4px
}

.compare_table .table thead tr th:first-child {
    border-bottom: 1px solid #fff
}

.compare_table .table tbody {
    text-align: center
}

.compare_table .table tbody tr th {
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    padding-top: 16px;
    padding-bottom: 15px
}

.compare_table .table tbody tr th:first-child {
    width: 270px;
    text-align: left;
    padding-left: 80px;
    vertical-align: middle
}

.compare_table .table tbody tr th span {
    font-size: 14px;
    font-family: "Poppins", sans-serif;
    letter-spacing: .35px;
    font-weight: 600
}

.compare_table .table tbody tr td {
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    padding-top: 16px;
    padding-bottom: 15px
}

.compare_table .table tbody tr td:last-child {
    padding-left: 4.5px;
    padding-right: 4.5px
}

.compare_table .table tbody tr td img {
    padding-top: 25px
}

.compare_table .table tbody tr td h3 {
    color: #F0DD75;
    font-size: 18px;
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    padding: 30px 0
}

.compare_table .table tbody tr td h3 span {
    color: #000;
    font-size: 16px;
    font-weight: normal;
    font-family: "Poppins", sans-serif
}

.compare_table .table tbody tr td ul {
    padding-bottom: 30px
}

.compare_table .table tbody tr td ul li {
    display: inline-block;
    vertical-align: top
}

.compare_table .table tbody tr td ul li:last-child {
    margin-right: 0;
    margin-left: 7px
}

.compare_table .table tbody tr td h6 {
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    color: #666666
}

.compare_table .table tbody tr:first-child th {
    text-transform: uppercase
}

.compare_table .continue {
    padding: 0 25px;
    line-height: 48px;
    margin-top: 30px
}

.pagination_area {
    text-align: center;
    margin-top: 25px
}

.pagination_area .pagination {
    display: inline-block;
    border-radius: 0
}

.pagination_area .pagination li {
    display: inline-block
}

.pagination_area .pagination li a {
    font-size: 14px;
    font-family: "Montserrat", sans-serif;
    font-weight: bold;
    color: #333333;
    border-radius: 0 !important;
    padding: 10px 15px;
    border: 1px solid transparent;
    -webkit-transition: all 400ms linear 0s;
    -o-transition: all 400ms linear 0s;
    transition: all 400ms linear 0s
}

.pagination_area .pagination li:first-child a {
    border: 1px solid #000002
}

.pagination_area .pagination li.next a {
    background: #333333;
    color: #fff
}

.pagination_area .pagination li:hover a {
    background: #333333;
    color: #fff
}
.shop_header_area {
    margin-bottom: 9.3em;
}

@media only screen and (min-width:320px) and (max-width:767px) {
    .shop_header_area {
        margin-bottom: 7.4em;
    }
    }
.shop_header_area .navbar {
    padding: 0;
    background-color: white;
    border-top: 1px solid #60af48
}

.shop_header_area .navbar .navbar-brand {
    display: inline;
    font-size: 30px;
    color: #f4f4f8;
    font-weight: 800;
    text-transform: uppercase
}

.shop_header_area .navbar .navbar-brand .resize {
    width: 200px;
    height: 100%;
    display: inline-block;
    vertical-align: baseline
}


.header-meta {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    min-width: 100%;
    width: 100%
}

@media only screen and (max-width:767px) {
    .header-meta {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        min-width: 100%;
        width: 100%
    }
}

.header-meta {
    height: 70px;
    position: relative;
    z-index: 1;
    float: left
}

@media only screen and (max-width:767px) {
    .header-meta {
        height: 35px
    }
}

.search-area form {
    position: relative;
    z-index: 1;
    height: 70px;
    border-left: 1px solid #ebebeb
}

.sub-area form {
    position: relative;
    z-index: 1;
    padding: 10px;
    margin: 10px;
    height: 70px;
    border-left: 1px solid #ebebeb
}

@media only screen and (max-width:767px) {
    .search-area form {
        height: 35px;
        border-left: none
    }
}

@media only screen and (max-width:767px) {
    .sub-area form {
        height: 35px;
        border-left: none
    }
}

.search-area form input {
    border: none;
    background-color: #ffffff;
    width: 180px;
    height: 70px;
    padding: 0 15px 0 60px;
    color: #314b30;
    font-size: 14px;
    font-weight: 500;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms
}

.sub-area form input {
    border: none;
    background-color: #ffffff;
    width: 300px;
    height: 70px;
    padding: 0 15px 0 60px;
    color: #314b30;
    font-size: 14px;
    font-weight: 500;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms
}

@media only screen and (max-width:767px) {
    .search-area form input {
        width: 150px;
        height: 40px;
        padding: 0 10px 0 30px
    }
}

@media only screen and (max-width:767px) {
    .sub-area form input {
        width: 290px;
        height: 40px;
        padding: 0 10px 0 30px
    }
}

.search-area form input:focus {
    outline: none !important;
    width: 350px
}

.sub-area form input:focus {
    outline: none !important;
    width: 350px
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .search-area form input:focus {
        width: 300px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .sub-area form input:focus {
        width: 300px
    }
}

@media only screen and (max-width:767px) {
    .search-area form input:focus {
        width: 170px
    }
}

@media only screen and (max-width:767px) {
    .sub-area form input:focus {
        width: 170px
    }
}

@media only screen and (min-width:480px) and (max-width:767px) {
    .search-area form input:focus {
        width: 270px
    }
}

@media only screen and (min-width:480px) and (max-width:767px) {
    .sub-area form input:focus {
        width: 270px
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .search-area form input:focus {
        width: 300px
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .sub-area form input:focus {
        width: 300px
    }
}

.search-area form button {
    position: absolute;
    z-index: 10;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 30px;
    background-color: transparent;
    border: none;
    color: #787878;
    font-size: 14px
}

.sub-area form button {
    position: absolute;
    z-index: 10;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 30px;
    background-color: transparent;
    border: none;
    color: #787878;
    font-size: 14px
}

@media only screen and (max-width:767px) {
    .search-area form button {
        left: 10px;
        height: 40px
    }
}

@media only screen and (max-width:767px) {
    .sub-area form button {
        right: 10px;
        height: 40px
    }
}
.login{
z-index: 200000;}
.favourite-area a,
.user-login-info a,
.cart-area a {
    position: relative;
    z-index: 1;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 90px;
    flex: 0 0 90px;
    width: 90px;
    display: block;
    text-align: center;
    border-left: 1px solid linear-gradient(85deg, #6bcbf1, #4833fb);
    height: 100%;
    line-height: 80px
}

@media only screen and (max-width:767px) {

    .favourite-area a,
    .user-login-info a {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 40px;
        flex: 0 0 40px;
        width: 40px;
        line-height: 30px
    }
}

@media only screen and (max-width:767px) {

    .favourite-area a,
    .cart-area a {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 65px;
        flex: 0 0 65px;
        width: 65px;
        line-height: 30px
    }
}

.favourite-area a img,
.user-login-info a img,
.cart-area a img {
    max-width: 18px
}


.favourite-area a span,
.user-login-info a span,
.cart-area a span {
    font-family: "Ubuntu", sans-serif;
    font-size: 18px;
    color: #3b371d;
    font-weight: 700;
    position: absolute;
    top: -10px
}

@media only screen and (max-width:767px) {

    .favourite-area a span,
    .user-login-info a span,
    .cart-area a span {
        font-size: 14px
    }
}

.header_area.sticky {
    position: fixed;
    z-index: 900;
    top: 0;
    left: 0;
    width: 100%;
    box-shadow: 0 5px 30px rgba(0, 0, 0, .15)
}

.cart-bg-overlay.cart-bg-overlay-on {
    -webkit-transition-duration: 1000ms;
    transition-duration: 1000ms;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .4);
    z-index: 1050
}

.right-side-cart-area {
    position: fixed;
    width: 670px;
    height: 100%;
    top: 0;
    right: -800px;
    background-color: #ffffff;
    z-index: 1100;
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, .1);
    -webkit-transition-duration: 800ms;
    transition-duration: 800ms
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .right-side-cart-area {
        width: 700px;
        right: -800px
    }
}

@media only screen and (min-width:992px) and (max-width:1024px) {
    .right-side-cart-area {
        width: 990px;
        right: -1090px
    }
}

@media only screen and (min-width:540px) and (max-width:767px) {
    .right-side-cart-area {
        width: 500px;
        right: -550px
    }
}

@media only screen and (max-width:360px) {
    .right-side-cart-area {
        width: 90%;
        right: -400px
    }
}

@media only screen and (min-width:280px) and (max-width:320px) {
    .right-side-cart-area {
        width: 90%;
        right: -450px
    }
}

@media only screen and (min-width:361px) and (max-width:500px) {
    .right-side-cart-area {
        width: 360px;
        right: -550px
    }
}

.right-side-cart-area.cart-on {
    right: 0
}

.right-side-cart-area .cart-button a {
    position: absolute;
    top: 0;
    right: 100%;
    z-index: 100;
    width: 90px;
    display: block;
    text-align: center;
    border-left: 1px solid #ebebeb;
    height: 85px;
    line-height: 80px;
    background-color: #f5f7f9
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-button a {
        width: 50px;
        height: 50px;
        line-height: 50px
    }
}

.right-side-cart-area .cart-button a img {
    max-width: 20px
}

.right-side-cart-area .cart-button a span {
    font-family: "Ubuntu", sans-serif;
    font-size: 18px;
    color: #463b00;
    font-weight: 700;
    position: absolute;
    top: -10px
}

.right-side-cart-area .cart-content {
    position: relative;
    z-index: 1;
    width: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
    height: 100%
}

.right-side-cart-area .cart-content .cart-list {
    position: relative;
    z-index: 10;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 190px;
    flex: 0 0 190px;
    width: 190px
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-list {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100px;
        flex: 0 0 100px;
        width: 100px
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-list {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 150px;
        flex: 0 0 150px;
        width: 150px
    }
}

.right-side-cart-area .cart-content .cart-list .single-cart-item {
    position: relative;
    z-index: 1;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms
}

.right-side-cart-area .cart-content .cart-list .single-cart-item .product-image {
    position: relative;
    z-index: 1;
    display: block
}

.right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .6);
    padding: 50px 15px 15px;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc {
        padding: 5px
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc {
        padding: 30px 20px
    }
}

.right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc .product-remove {
    position: absolute;
    top: 15px;
    right: 15px;
    color: #ffffff;
    font-size: 12px;
    padding: 5px
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc .product-remove {
        top: 5px;
        right: 5px
    }
}

.right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc .right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc h6 {
    font-size: 12px;
    color: #ffffff;
    text-transform: capitalize;
    margin-bottom: 30px
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc h6 {
        margin-bottom: 10px
    }
}

.right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc .size,
.right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc .color {
    display: block;
    font-weight: 600;
    font-size: 10px;
    color: rgba(255, 255, 255, .5);
    text-transform: uppercase;
    margin-bottom: 5px;
    line-height: 1
}

.right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc .price {
    font-family: "Ubuntu", sans-serif;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 0;
    margin-top: 30px;
    color: #ffffff
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-list .single-cart-item .product-image .cart-item-desc .price {
        margin-top: 10px;
        font-size: 12px
    }
}

.right-side-cart-area .cart-content .cart-list .single-cart-item:hover .product-image .cart-item-desc {
    background-color: rgba(0, 0, 0, .8)
}

.right-side-cart-area .cart-content .cart-amount-summary {
    padding: 100px 10%;
    position: relative;
    z-index: 10;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(100% - 190px);
    flex: 0 0 calc(100% - 190px);
    width: calc(100% - 190px)
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-amount-summary {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 100px);
        flex: 0 0 calc(100% - 100px);
        width: calc(100% - 100px);
        padding: 50px 15px
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-amount-summary {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 150px);
        flex: 0 0 calc(100% - 150px);
        width: calc(100% - 150px);
        padding: 50px 30px
    }
}

.right-side-cart-area .cart-content .cart-amount-summary h2 {
    font-size: 30px;
    margin-bottom: 100px
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-amount-summary h2 {
        font-size: 24px;
        margin-bottom: 30px
    }
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-amount-summary h2 {
        font-size: 30px;
        margin-bottom: 50px
    }
}

.right-side-cart-area .cart-content .cart-amount-summary .summary-table li {
    margin-bottom: 20px;
    color: #000000;
    font-size: 14px;
    letter-spacing: .75px;
    text-transform: uppercase;
    font-weight: 600;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-amount-summary .summary-table li {
        font-size: 12px;
        margin-bottom: 10px
    }
}

@media only screen and (min-width:576px) and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-amount-summary .summary-table li {
        font-size: 14px;
        margin-bottom: 15px
    }
}

.right-side-cart-area .cart-content .cart-amount-summary .summary-table li span:last-child {
    font-weight: 700;
    font-family: "Ubuntu", sans-serif
}

@media only screen and (max-width:767px) {
    .right-side-cart-area .cart-content .cart-amount-summary .essence-btn {
        min-width: 140px;
        width: 140px;
        padding: 0 15px
    }
}

::-webkit-scrollbar {
    height: 10px;
    overflow: visible;
    width: 5px;
    color: rgb(255, 255, 255);
    background-image: -webkit-gradient(linear, left top, right top, from(#5D3384), to(#e3e3e4))
}

::-webkit-scrollbar-button {
    height: 0;
    width: 0
}

::-webkit-scrollbar-track {
    background-clip: padding-box;
    border: solid transparent;
    border-width: 0 0 0 4px
}

::-webkit-scrollbar-track:horizontal {
    border-width: 4px 0 0
}

::-webkit-scrollbar-track:hover {
    background-color: rgba(0, 0, 0, .05);
    box-shadow: inset 1px 0 0 rgba(0, 0, 0, .1)
}

::-webkit-scrollbar-track:horizontal:hover {
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, .1)
}

::-webkit-scrollbar-track:active {
    background-color: rgba(0, 0, 0, .05);
    box-shadow: inset 1px 0 0 rgba(0, 0, 0, .14), inset -1px 0 0 rgba(0, 0, 0, .07)
}

::-webkit-scrollbar-track:horizontal:active {
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, .14), inset 0 -1px 0 rgba(0, 0, 0, .07)
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .2);
    background-clip: padding-box;
    border: solid transparent;
    border-width: 1px 1px 1px 6px;
    min-height: 28px;
    padding: 100px 0 0;
    box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset 0 -1px 0 rgba(0, 0, 0, .07)
}

::-webkit-scrollbar-thumb:horizontal {
    border-width: 6px 1px 1px;
    padding: 0 0 0 100px;
    box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset -1px 0 0 rgba(0, 0, 0, .07)
}

::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, .4);
    box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .25)
}

::-webkit-scrollbar-thumb:active {
    background-color: rgba(0, 0, 0, .5);
    box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .35)
}

::-webkit-scrollbar-corner {
    background: transparent
}

table {
    background: white;
    margin-bottom: 1.25rem;
    border: solid 1px #dddddd;
    table-layout: fixed;
    width: 100%
}

table caption {
    background: transparent;
    color: #222222;
    font-size: 1rem;
    font-weight: bold
}

table thead {
    background: whitesmoke
}

table thead tr th,
table thead tr td {
    padding: .5rem .625rem .625rem;
    font-size: .875rem;
    font-weight: bold;
    color: #222222
}

table tfoot {
    background: whitesmoke
}

table tfoot tr th,
table tfoot tr td {
    padding: .5rem .625rem .625rem;
    font-size: .875rem;
    font-weight: bold;
    color: #222222
}

table tr th,
table tr td {
    padding: .5625rem .625rem;
    font-size: .875rem;
    color: #222222;
    text-align: left
}

table tr.even,
table tr.alt,
table tr:nth-of-type(even) {
    background: #f9f9f9
}

table thead tr th,
table tfoot tr th,
table tfoot tr td,
table tbody tr th,
table tbody tr td,
table tr td {
    display: table-cell;
    line-height: 1.125rem
}

table.show-for-small-only,
table.show-for-small-up,
table.show-for-small,
table.show-for-small-down,
table.hide-for-medium-only,
table.hide-for-medium-up,
table.hide-for-medium,
table.show-for-medium-down,
table.hide-for-large-only,
table.hide-for-large-up,
table.hide-for-large,
table.show-for-large-down,
table.hide-for-xlarge-only,
table.hide-for-xlarge-up,
table.hide-for-xxlarge-only,
table.hide-for-xxlarge-up {
    display: table
}

thead.show-for-small-only,
thead.show-for-small-up,
thead.show-for-small,
thead.show-for-small-down,
thead.hide-for-medium-only,
thead.hide-for-medium-up,
thead.hide-for-medium,
thead.show-for-medium-down,
thead.hide-for-large-only,
thead.hide-for-large-up,
thead.hide-for-large,
thead.show-for-large-down,
thead.hide-for-xlarge-only,
thead.hide-for-xlarge-up,
thead.hide-for-xxlarge-only,
thead.hide-for-xxlarge-up {
    display: table-header-group !important
}

tbody.show-for-small-only,
tbody.show-for-small-up,
tbody.show-for-small,
tbody.show-for-small-down,
tbody.hide-for-medium-only,
tbody.hide-for-medium-up,
tbody.hide-for-medium,
tbody.show-for-medium-down,
tbody.hide-for-large-only,
tbody.hide-for-large-up,
tbody.hide-for-large,
tbody.show-for-large-down,
tbody.hide-for-xlarge-only,
tbody.hide-for-xlarge-up,
tbody.hide-for-xxlarge-only,
tbody.hide-for-xxlarge-up {
    display: table-row-group !important
}

tr.show-for-small-only,
tr.show-for-small-up,
tr.show-for-small,
tr.show-for-small-down,
tr.hide-for-medium-only,
tr.hide-for-medium-up,
tr.hide-for-medium,
tr.show-for-medium-down,
tr.hide-for-large-only,
tr.hide-for-large-up,
tr.hide-for-large,
tr.show-for-large-down,
tr.hide-for-xlarge-only,
tr.hide-for-xlarge-up,
tr.hide-for-xxlarge-only,
tr.hide-for-xxlarge-up {
    display: table-row !important
}

th.show-for-small-only,
td.show-for-small-only,
th.show-for-small-up,
td.show-for-small-up,
th.show-for-small,
td.show-for-small,
th.show-for-small-down,
td.show-for-small-down,
th.hide-for-medium-only,
td.hide-for-medium-only,
th.hide-for-medium-up,
td.hide-for-medium-up,
th.hide-for-medium,
td.hide-for-medium,
th.show-for-medium-down,
td.show-for-medium-down,
th.hide-for-large-only,
td.hide-for-large-only,
th.hide-for-large-up,
td.hide-for-large-up,
th.hide-for-large,
td.hide-for-large,
th.show-for-large-down,
td.show-for-large-down,
th.hide-for-xlarge-only,
td.hide-for-xlarge-only,
th.hide-for-xlarge-up,
td.hide-for-xlarge-up,
th.hide-for-xxlarge-only,
td.hide-for-xxlarge-only,
th.hide-for-xxlarge-up,
td.hide-for-xxlarge-up {
    display: table-cell !important
}

@media only screen and (min-width:40.063em) {

    .hide-for-small-only,
    .show-for-small-up,
    .hide-for-small,
    .hide-for-small-down,
    .show-for-medium-only,
    .show-for-medium-up,
    .show-for-medium,
    .show-for-medium-down,
    .hide-for-large-only,
    .hide-for-large-up,
    .hide-for-large,
    .show-for-large-down,
    .hide-for-xlarge-only,
    .hide-for-xlarge-up,
    .hide-for-xxlarge-only,
    .hide-for-xxlarge-up {
        display: inherit !important
    }

    .show-for-small-only,
    .hide-for-small-up,
    .show-for-small,
    .show-for-small-down,
    .hide-for-medium-only,
    .hide-for-medium-up,
    .hide-for-medium,
    .hide-for-medium-down,
    .show-for-large-only,
    .show-for-large-up,
    .show-for-large,
    .hide-for-large-down,
    .show-for-xlarge-only,
    .show-for-xlarge-up,
    .show-for-xxlarge-only,
    .show-for-xxlarge-up {
        display: none !important
    }

    .hidden-for-small-only,
    .visible-for-small-up,
    .hidden-for-small,
    .hidden-for-small-down,
    .visible-for-medium-only,
    .visible-for-medium-up,
    .visible-for-medium,
    .visible-for-medium-down,
    .hidden-for-large-only,
    .hidden-for-large-up,
    .hidden-for-large,
    .visible-for-large-down,
    .hidden-for-xlarge-only,
    .hidden-for-xlarge-up,
    .hidden-for-xxlarge-only,
    .hidden-for-xxlarge-up {
        position: static !important;
        height: auto;
        width: auto;
        overflow: visible;
        clip: auto
    }

    .visible-for-small-only,
    .hidden-for-small-up,
    .visible-for-small,
    .visible-for-small-down,
    .hidden-for-medium-only,
    .hidden-for-medium-up,
    .hidden-for-medium,
    .hidden-for-medium-down,
    .visible-for-large-only,
    .visible-for-large-up,
    .visible-for-large,
    .hidden-for-large-down,
    .visible-for-xlarge-only,
    .visible-for-xlarge-up,
    .visible-for-xxlarge-only,
    .visible-for-xxlarge-up {
        position: absolute !important;
        height: 1px;
        width: 1px;
        overflow: hidden;
        clip: rect(1px, 1px, 1px, 1px)
    }

    table.hide-for-small-only,
    table.show-for-small-up,
    table.hide-for-small,
    table.hide-for-small-down,
    table.show-for-medium-only,
    table.show-for-medium-up,
    table.show-for-medium,
    table.show-for-medium-down,
    table.hide-for-large-only,
    table.hide-for-large-up,
    table.hide-for-large,
    table.show-for-large-down,
    table.hide-for-xlarge-only,
    table.hide-for-xlarge-up,
    table.hide-for-xxlarge-only,
    table.hide-for-xxlarge-up {
        display: table
    }

    thead.hide-for-small-only,
    thead.show-for-small-up,
    thead.hide-for-small,
    thead.hide-for-small-down,
    thead.show-for-medium-only,
    thead.show-for-medium-up,
    thead.show-for-medium,
    thead.show-for-medium-down,
    thead.hide-for-large-only,
    thead.hide-for-large-up,
    thead.hide-for-large,
    thead.show-for-large-down,
    thead.hide-for-xlarge-only,
    thead.hide-for-xlarge-up,
    thead.hide-for-xxlarge-only,
    thead.hide-for-xxlarge-up {
        display: table-header-group !important
    }

    tbody.hide-for-small-only,
    tbody.show-for-small-up,
    tbody.hide-for-small,
    tbody.hide-for-small-down,
    tbody.show-for-medium-only,
    tbody.show-for-medium-up,
    tbody.show-for-medium,
    tbody.show-for-medium-down,
    tbody.hide-for-large-only,
    tbody.hide-for-large-up,
    tbody.hide-for-large,
    tbody.show-for-large-down,
    tbody.hide-for-xlarge-only,
    tbody.hide-for-xlarge-up,
    tbody.hide-for-xxlarge-only,
    tbody.hide-for-xxlarge-up {
        display: table-row-group !important
    }

    tr.hide-for-small-only,
    tr.show-for-small-up,
    tr.hide-for-small,
    tr.hide-for-small-down,
    tr.show-for-medium-only,
    tr.show-for-medium-up,
    tr.show-for-medium,
    tr.show-for-medium-down,
    tr.hide-for-large-only,
    tr.hide-for-large-up,
    tr.hide-for-large,
    tr.show-for-large-down,
    tr.hide-for-xlarge-only,
    tr.hide-for-xlarge-up,
    tr.hide-for-xxlarge-only,
    tr.hide-for-xxlarge-up {
        display: table-row !important
    }

    th.hide-for-small-only,
    td.hide-for-small-only,
    th.show-for-small-up,
    td.show-for-small-up,
    th.hide-for-small,
    td.hide-for-small,
    th.hide-for-small-down,
    td.hide-for-small-down,
    th.show-for-medium-only,
    td.show-for-medium-only,
    th.show-for-medium-up,
    td.show-for-medium-up,
    th.show-for-medium,
    td.show-for-medium,
    th.show-for-medium-down,
    td.show-for-medium-down,
    th.hide-for-large-only,
    td.hide-for-large-only,
    th.hide-for-large-up,
    td.hide-for-large-up,
    th.hide-for-large,
    td.hide-for-large,
    th.show-for-large-down,
    td.show-for-large-down,
    th.hide-for-xlarge-only,
    td.hide-for-xlarge-only,
    th.hide-for-xlarge-up,
    td.hide-for-xlarge-up,
    th.hide-for-xxlarge-only,
    td.hide-for-xxlarge-only,
    th.hide-for-xxlarge-up,
    td.hide-for-xxlarge-up {
        display: table-cell !important
    }
}

@media only screen and (min-width:64.063em) {

    .hide-for-small-only,
    .show-for-small-up,
    .hide-for-small,
    .hide-for-small-down,
    .hide-for-medium-only,
    .show-for-medium-up,
    .hide-for-medium,
    .hide-for-medium-down,
    .show-for-large-only,
    .show-for-large-up,
    .show-for-large,
    .show-for-large-down,
    .hide-for-xlarge-only,
    .hide-for-xlarge-up,
    .hide-for-xxlarge-only,
    .hide-for-xxlarge-up {
        display: inherit !important
    }

    .show-for-small-only,
    .hide-for-small-up,
    .show-for-small,
    .show-for-small-down,
    .show-for-medium-only,
    .hide-for-medium-up,
    .show-for-medium,
    .show-for-medium-down,
    .hide-for-large-only,
    .hide-for-large-up,
    .hide-for-large,
    .hide-for-large-down,
    .show-for-xlarge-only,
    .show-for-xlarge-up,
    .show-for-xxlarge-only,
    .show-for-xxlarge-up {
        display: none !important
    }

    .hidden-for-small-only,
    .visible-for-small-up,
    .hidden-for-small,
    .hidden-for-small-down,
    .hidden-for-medium-only,
    .visible-for-medium-up,
    .hidden-for-medium,
    .hidden-for-medium-down,
    .visible-for-large-only,
    .visible-for-large-up,
    .visible-for-large,
    .visible-for-large-down,
    .hidden-for-xlarge-only,
    .hidden-for-xlarge-up,
    .hidden-for-xxlarge-only,
    .hidden-for-xxlarge-up {
        position: static !important;
        height: auto;
        width: auto;
        overflow: visible;
        clip: auto
    }

    .visible-for-small-only,
    .hidden-for-small-up,
    .visible-for-small,
    .visible-for-small-down,
    .visible-for-medium-only,
    .hidden-for-medium-up,
    .visible-for-medium,
    .visible-for-medium-down,
    .hidden-for-large-only,
    .hidden-for-large-up,
    .hidden-for-large,
    .hidden-for-large-down,
    .visible-for-xlarge-only,
    .visible-for-xlarge-up,
    .visible-for-xxlarge-only,
    .visible-for-xxlarge-up {
        position: absolute !important;
        height: 1px;
        width: 1px;
        overflow: hidden;
        clip: rect(1px, 1px, 1px, 1px)
    }

    table.hide-for-small-only,
    table.show-for-small-up,
    table.hide-for-small,
    table.hide-for-small-down,
    table.hide-for-medium-only,
    table.show-for-medium-up,
    table.hide-for-medium,
    table.hide-for-medium-down,
    table.show-for-large-only,
    table.show-for-large-up,
    table.show-for-large,
    table.show-for-large-down,
    table.hide-for-xlarge-only,
    table.hide-for-xlarge-up,
    table.hide-for-xxlarge-only,
    table.hide-for-xxlarge-up {
        display: table
    }

    thead.hide-for-small-only,
    thead.show-for-small-up,
    thead.hide-for-small,
    thead.hide-for-small-down,
    thead.hide-for-medium-only,
    thead.show-for-medium-up,
    thead.hide-for-medium,
    thead.hide-for-medium-down,
    thead.show-for-large-only,
    thead.show-for-large-up,
    thead.show-for-large,
    thead.show-for-large-down,
    thead.hide-for-xlarge-only,
    thead.hide-for-xlarge-up,
    thead.hide-for-xxlarge-only,
    thead.hide-for-xxlarge-up {
        display: table-header-group !important
    }

    tbody.hide-for-small-only,
    tbody.show-for-small-up,
    tbody.hide-for-small,
    tbody.hide-for-small-down,
    tbody.hide-for-medium-only,
    tbody.show-for-medium-up,
    tbody.hide-for-medium,
    tbody.hide-for-medium-down,
    tbody.show-for-large-only,
    tbody.show-for-large-up,
    tbody.show-for-large,
    tbody.show-for-large-down,
    tbody.hide-for-xlarge-only,
    tbody.hide-for-xlarge-up,
    tbody.hide-for-xxlarge-only,
    tbody.hide-for-xxlarge-up {
        display: table-row-group !important
    }

    tr.hide-for-small-only,
    tr.show-for-small-up,
    tr.hide-for-small,
    tr.hide-for-small-down,
    tr.hide-for-medium-only,
    tr.show-for-medium-up,
    tr.hide-for-medium,
    tr.hide-for-medium-down,
    tr.show-for-large-only,
    tr.show-for-large-up,
    tr.show-for-large,
    tr.show-for-large-down,
    tr.hide-for-xlarge-only,
    tr.hide-for-xlarge-up,
    tr.hide-for-xxlarge-only,
    tr.hide-for-xxlarge-up {
        display: table-row !important
    }

    th.hide-for-small-only,
    td.hide-for-small-only,
    th.show-for-small-up,
    td.show-for-small-up,
    th.hide-for-small,
    td.hide-for-small,
    th.hide-for-small-down,
    td.hide-for-small-down,
    th.hide-for-medium-only,
    td.hide-for-medium-only,
    th.show-for-medium-up,
    td.show-for-medium-up,
    th.hide-for-medium,
    td.hide-for-medium,
    th.hide-for-medium-down,
    td.hide-for-medium-down,
    th.show-for-large-only,
    td.show-for-large-only,
    th.show-for-large-up,
    td.show-for-large-up,
    th.show-for-large,
    td.show-for-large,
    th.show-for-large-down,
    td.show-for-large-down,
    th.hide-for-xlarge-only,
    td.hide-for-xlarge-only,
    th.hide-for-xlarge-up,
    td.hide-for-xlarge-up,
    th.hide-for-xxlarge-only,
    td.hide-for-xxlarge-only,
    th.hide-for-xxlarge-up,
    td.hide-for-xxlarge-up {
        display: table-cell !important
    }
}

@media only screen and (min-width:90.063em) {

    .hide-for-small-only,
    .show-for-small-up,
    .hide-for-small,
    .hide-for-small-down,
    .hide-for-medium-only,
    .show-for-medium-up,
    .hide-for-medium,
    .hide-for-medium-down,
    .hide-for-large-only,
    .show-for-large-up,
    .hide-for-large,
    .hide-for-large-down,
    .show-for-xlarge-only,
    .show-for-xlarge-up,
    .hide-for-xxlarge-only,
    .hide-for-xxlarge-up {
        display: inherit !important
    }

    .show-for-small-only,
    .hide-for-small-up,
    .show-for-small,
    .show-for-small-down,
    .show-for-medium-only,
    .hide-for-medium-up,
    .show-for-medium,
    .show-for-medium-down,
    .show-for-large-only,
    .hide-for-large-up,
    .show-for-large,
    .show-for-large-down,
    .hide-for-xlarge-only,
    .hide-for-xlarge-up,
    .show-for-xxlarge-only,
    .show-for-xxlarge-up {
        display: none !important
    }

    .hidden-for-small-only,
    .visible-for-small-up,
    .hidden-for-small,
    .hidden-for-small-down,
    .hidden-for-medium-only,
    .visible-for-medium-up,
    .hidden-for-medium,
    .hidden-for-medium-down,
    .hidden-for-large-only,
    .visible-for-large-up,
    .hidden-for-large,
    .hidden-for-large-down,
    .visible-for-xlarge-only,
    .visible-for-xlarge-up,
    .hidden-for-xxlarge-only,
    .hidden-for-xxlarge-up {
        position: static !important;
        height: auto;
        width: auto;
        overflow: visible;
        clip: auto
    }

    .visible-for-small-only,
    .hidden-for-small-up,
    .visible-for-small,
    .visible-for-small-down,
    .visible-for-medium-only,
    .hidden-for-medium-up,
    .visible-for-medium,
    .visible-for-medium-down,
    .visible-for-large-only,
    .hidden-for-large-up,
    .visible-for-large,
    .visible-for-large-down,
    .hidden-for-xlarge-only,
    .hidden-for-xlarge-up,
    .visible-for-xxlarge-only,
    .visible-for-xxlarge-up {
        position: absolute !important;
        height: 1px;
        width: 1px;
        overflow: hidden;
        clip: rect(1px, 1px, 1px, 1px)
    }

    table.hide-for-small-only,
    table.show-for-small-up,
    table.hide-for-small,
    table.hide-for-small-down,
    table.hide-for-medium-only,
    table.show-for-medium-up,
    table.hide-for-medium,
    table.hide-for-medium-down,
    table.hide-for-large-only,
    table.show-for-large-up,
    table.hide-for-large,
    table.hide-for-large-down,
    table.show-for-xlarge-only,
    table.show-for-xlarge-up,
    table.hide-for-xxlarge-only,
    table.hide-for-xxlarge-up {
        display: table
    }

    thead.hide-for-small-only,
    thead.show-for-small-up,
    thead.hide-for-small,
    thead.hide-for-small-down,
    thead.hide-for-medium-only,
    thead.show-for-medium-up,
    thead.hide-for-medium,
    thead.hide-for-medium-down,
    thead.hide-for-large-only,
    thead.show-for-large-up,
    thead.hide-for-large,
    thead.hide-for-large-down,
    thead.show-for-xlarge-only,
    thead.show-for-xlarge-up,
    thead.hide-for-xxlarge-only,
    thead.hide-for-xxlarge-up {
        display: table-header-group !important
    }

    tbody.hide-for-small-only,
    tbody.show-for-small-up,
    tbody.hide-for-small,
    tbody.hide-for-small-down,
    tbody.hide-for-medium-only,
    tbody.show-for-medium-up,
    tbody.hide-for-medium,
    tbody.hide-for-medium-down,
    tbody.hide-for-large-only,
    tbody.show-for-large-up,
    tbody.hide-for-large,
    tbody.hide-for-large-down,
    tbody.show-for-xlarge-only,
    tbody.show-for-xlarge-up,
    tbody.hide-for-xxlarge-only,
    tbody.hide-for-xxlarge-up {
        display: table-row-group !important
    }

    tr.hide-for-small-only,
    tr.show-for-small-up,
    tr.hide-for-small,
    tr.hide-for-small-down,
    tr.hide-for-medium-only,
    tr.show-for-medium-up,
    tr.hide-for-medium,
    tr.hide-for-medium-down,
    tr.hide-for-large-only,
    tr.show-for-large-up,
    tr.hide-for-large,
    tr.hide-for-large-down,
    tr.show-for-xlarge-only,
    tr.show-for-xlarge-up,
    tr.hide-for-xxlarge-only,
    tr.hide-for-xxlarge-up {
        display: table-row !important
    }

    th.hide-for-small-only,
    td.hide-for-small-only,
    th.show-for-small-up,
    td.show-for-small-up,
    th.hide-for-small,
    td.hide-for-small,
    th.hide-for-small-down,
    td.hide-for-small-down,
    th.hide-for-medium-only,
    td.hide-for-medium-only,
    th.show-for-medium-up,
    td.show-for-medium-up,
    th.hide-for-medium,
    td.hide-for-medium,
    th.hide-for-medium-down,
    td.hide-for-medium-down,
    th.hide-for-large-only,
    td.hide-for-large-only,
    th.show-for-large-up,
    td.show-for-large-up,
    th.hide-for-large,
    td.hide-for-large,
    th.hide-for-large-down,
    td.hide-for-large-down,
    th.show-for-xlarge-only,
    td.show-for-xlarge-only,
    th.show-for-xlarge-up,
    td.show-for-xlarge-up,
    th.hide-for-xxlarge-only,
    td.hide-for-xxlarge-only,
    th.hide-for-xxlarge-up,
    td.hide-for-xxlarge-up {
        display: table-cell !important
    }
}

@media only screen and (min-width:120.063em) {

    .hide-for-small-only,
    .show-for-small-up,
    .hide-for-small,
    .hide-for-small-down,
    .hide-for-medium-only,
    .show-for-medium-up,
    .hide-for-medium,
    .hide-for-medium-down,
    .hide-for-large-only,
    .show-for-large-up,
    .hide-for-large,
    .hide-for-large-down,
    .hide-for-xlarge-only,
    .show-for-xlarge-up,
    .show-for-xxlarge-only,
    .show-for-xxlarge-up {
        display: inherit !important
    }

    .show-for-small-only,
    .hide-for-small-up,
    .show-for-small,
    .show-for-small-down,
    .show-for-medium-only,
    .hide-for-medium-up,
    .show-for-medium,
    .show-for-medium-down,
    .show-for-large-only,
    .hide-for-large-up,
    .show-for-large,
    .show-for-large-down,
    .show-for-xlarge-only,
    .hide-for-xlarge-up,
    .hide-for-xxlarge-only,
    .hide-for-xxlarge-up {
        display: none !important
    }

    .hidden-for-small-only,
    .visible-for-small-up,
    .hidden-for-small,
    .hidden-for-small-down,
    .hidden-for-medium-only,
    .visible-for-medium-up,
    .hidden-for-medium,
    .hidden-for-medium-down,
    .hidden-for-large-only,
    .visible-for-large-up,
    .hidden-for-large,
    .hidden-for-large-down,
    .hidden-for-xlarge-only,
    .visible-for-xlarge-up,
    .visible-for-xxlarge-only,
    .visible-for-xxlarge-up {
        position: static !important;
        height: auto;
        width: auto;
        overflow: visible;
        clip: auto
    }

    .visible-for-small-only,
    .hidden-for-small-up,
    .visible-for-small,
    .visible-for-small-down,
    .visible-for-medium-only,
    .hidden-for-medium-up,
    .visible-for-medium,
    .visible-for-medium-down,
    .visible-for-large-only,
    .hidden-for-large-up,
    .visible-for-large,
    .visible-for-large-down,
    .visible-for-xlarge-only,
    .hidden-for-xlarge-up,
    .hidden-for-xxlarge-only,
    .hidden-for-xxlarge-up {
        position: absolute !important;
        height: 1px;
        width: 1px;
        overflow: hidden;
        clip: rect(1px, 1px, 1px, 1px)
    }

    table.hide-for-small-only,
    table.show-for-small-up,
    table.hide-for-small,
    table.hide-for-small-down,
    table.hide-for-medium-only,
    table.show-for-medium-up,
    table.hide-for-medium,
    table.hide-for-medium-down,
    table.hide-for-large-only,
    table.show-for-large-up,
    table.hide-for-large,
    table.hide-for-large-down,
    table.hide-for-xlarge-only,
    table.show-for-xlarge-up,
    table.show-for-xxlarge-only,
    table.show-for-xxlarge-up {
        display: table
    }

    thead.hide-for-small-only,
    thead.show-for-small-up,
    thead.hide-for-small,
    thead.hide-for-small-down,
    thead.hide-for-medium-only,
    thead.show-for-medium-up,
    thead.hide-for-medium,
    thead.hide-for-medium-down,
    thead.hide-for-large-only,
    thead.show-for-large-up,
    thead.hide-for-large,
    thead.hide-for-large-down,
    thead.hide-for-xlarge-only,
    thead.show-for-xlarge-up,
    thead.show-for-xxlarge-only,
    thead.show-for-xxlarge-up {
        display: table-header-group !important
    }

    tbody.hide-for-small-only,
    tbody.show-for-small-up,
    tbody.hide-for-small,
    tbody.hide-for-small-down,
    tbody.hide-for-medium-only,
    tbody.show-for-medium-up,
    tbody.hide-for-medium,
    tbody.hide-for-medium-down,
    tbody.hide-for-large-only,
    tbody.show-for-large-up,
    tbody.hide-for-large,
    tbody.hide-for-large-down,
    tbody.hide-for-xlarge-only,
    tbody.show-for-xlarge-up,
    tbody.show-for-xxlarge-only,
    tbody.show-for-xxlarge-up {
        display: table-row-group !important
    }

    tr.hide-for-small-only,
    tr.show-for-small-up,
    tr.hide-for-small,
    tr.hide-for-small-down,
    tr.hide-for-medium-only,
    tr.show-for-medium-up,
    tr.hide-for-medium,
    tr.hide-for-medium-down,
    tr.hide-for-large-only,
    tr.show-for-large-up,
    tr.hide-for-large,
    tr.hide-for-large-down,
    tr.hide-for-xlarge-only,
    tr.show-for-xlarge-up,
    tr.show-for-xxlarge-only,
    tr.show-for-xxlarge-up {
        display: table-row !important
    }

    th.hide-for-small-only,
    td.hide-for-small-only,
    th.show-for-small-up,
    td.show-for-small-up,
    th.hide-for-small,
    td.hide-for-small,
    th.hide-for-small-down,
    td.hide-for-small-down,
    th.hide-for-medium-only,
    td.hide-for-medium-only,
    th.show-for-medium-up,
    td.show-for-medium-up,
    th.hide-for-medium,
    td.hide-for-medium,
    th.hide-for-medium-down,
    td.hide-for-medium-down,
    th.hide-for-large-only,
    td.hide-for-large-only,
    th.show-for-large-up,
    td.show-for-large-up,
    th.hide-for-large,
    td.hide-for-large,
    th.hide-for-large-down,
    td.hide-for-large-down,
    th.hide-for-xlarge-only,
    td.hide-for-xlarge-only,
    th.show-for-xlarge-up,
    td.show-for-xlarge-up,
    th.show-for-xxlarge-only,
    td.show-for-xxlarge-only,
    th.show-for-xxlarge-up,
    td.show-for-xxlarge-up {
        display: table-cell !important
    }
}

.show-for-landscape,
.hide-for-portrait {
    display: inherit !important
}

.hide-for-landscape,
.show-for-portrait {
    display: none !important
}

table.hide-for-landscape,
table.show-for-portrait {
    display: table
}

thead.hide-for-landscape,
thead.show-for-portrait {
    display: table-header-group !important
}

tbody.hide-for-landscape,
tbody.show-for-portrait {
    display: table-row-group !important
}

tr.hide-for-landscape,
tr.show-for-portrait {
    display: table-row !important
}

td.hide-for-landscape,
td.show-for-portrait,
th.hide-for-landscape,
th.show-for-portrait {
    display: table-cell !important
}

@media only screen and (orientation:landscape) {

    .show-for-landscape,
    .hide-for-portrait {
        display: inherit !important
    }

    .hide-for-landscape,
    .show-for-portrait {
        display: none !important
    }

    table.show-for-landscape,
    table.hide-for-portrait {
        display: table
    }

    thead.show-for-landscape,
    thead.hide-for-portrait {
        display: table-header-group !important
    }

    tbody.show-for-landscape,
    tbody.hide-for-portrait {
        display: table-row-group !important
    }

    tr.show-for-landscape,
    tr.hide-for-portrait {
        display: table-row !important
    }

    td.show-for-landscape,
    td.hide-for-portrait,
    th.show-for-landscape,
    th.hide-for-portrait {
        display: table-cell !important
    }
}

@media only screen and (orientation:portrait) {

    .show-for-portrait,
    .hide-for-landscape {
        display: inherit !important
    }

    .hide-for-portrait,
    .show-for-landscape {
        display: none !important
    }

    table.show-for-portrait,
    table.hide-for-landscape {
        display: table
    }

    thead.show-for-portrait,
    thead.hide-for-landscape {
        display: table-header-group !important
    }

    tbody.show-for-portrait,
    tbody.hide-for-landscape {
        display: table-row-group !important
    }

    tr.show-for-portrait,
    tr.hide-for-landscape {
        display: table-row !important
    }

    td.show-for-portrait,
    td.hide-for-landscape,
    th.show-for-portrait,
    th.hide-for-landscape {
        display: table-cell !important
    }
}

.show-for-touch {
    display: none !important
}

.hide-for-touch {
    display: inherit !important
}

.touch .show-for-touch {
    display: inherit !important
}

.touch .hide-for-touch {
    display: none !important
}

table.hide-for-touch {
    display: table
}

.touch table.show-for-touch {
    display: table
}

thead.hide-for-touch {
    display: table-header-group !important
}

.touch thead.show-for-touch {
    display: table-header-group !important
}

tbody.hide-for-touch {
    display: table-row-group !important
}

.touch tbody.show-for-touch {
    display: table-row-group !important
}

tr.hide-for-touch {
    display: table-row !important
}

.touch tr.show-for-touch {
    display: table-row !important
}

td.hide-for-touch {
    display: table-cell !important
}

.touch td.show-for-touch {
    display: table-cell !important
}

th.hide-for-touch {
    display: table-cell !important
}

.touch th.show-for-touch {
    display: table-cell !important
}

@media print {
    .show-for-print {
        display: block
    }

    .hide-for-print {
        display: none
    }

    table.show-for-print {
        display: table
    }

    thead.show-for-print {
        display: table-header-group !important
    }

    tbody.show-for-print {
        display: table-row-group !important
    }

    tr.show-for-print {
        display: table-row !important
    }

    td.show-for-print {
        display: table-cell !important
    }

    th.show-for-print {
        display: table-cell !important
    }
}

.ttU {
    text-transform: uppercase
}

.l0 {
    left: 0
}

.r0 {
    right: 0
}

.bgFB {
    background: #FBFBFB
}

.z22 {
    z-index: 1022
}

.bdbE {
    border-bottom: 1px solid #EEE
}

.bs {
    box-sizing: border-box
}

.hclearfix {
    padding-top: 12em
}

.taC {
    text-align: left
}

.vipRecc .anSelect,
.adj .anSelect {
    border-bottom: 1px solid #9C3
}

.wp100 {
    width: 100%
}

.dT {
    display: table
}

.h36 {
    height: 36px
}

.fs14 {
    font-size: .875rem
}

.dTc {
    display: table-cell
}

.clear {
    clear: both
}

.menu-mobile {
    display: none;
}

.menu-mobile:hover {
    color: transparent
}

.menu-mobile:after {
    content: "\f067";
    font-family: "FontAwesome";
    font-size: 1.5rem;
    padding: 3.5em 2em;
    float: right;
    position: relative;
    -webkit-transform: translateY(-25%);
    -ms-transform: translateY(-25%);
    transform: translateY(-25%)
}

.menu-drodbwn-icon:before {
    content: "\f067";
    font-family: "FontAwesome";
    display: none;
    cursor: pointer;
    float: right;
    padding: .5em;
    background: linear-gradient(85deg, #61c7ef, #4833fb);
    color: rgb(0, 0, 0)
}

.menu {
    color: #0d1452;
}

.menu>ul {
    margin: 0 auto;
    width: 100%;
    list-style: none;
    padding: 0;
    position: relative;
    box-sizing: border-box
}

.menu>ul:before,
.menu>ul:after {
    content: "";
    display: table
}

.menu>ul:after {
    clear: both
}

.menu>ul>li {
    float: left;
    color: #76767e;
    padding: 0;
    margin: 0
}

.menu>ul>li a {
    text-decoration: none;
    padding: 1.5em 20px;
    display: block;
    color: rgb(95, 7, 7)
}

.menu>ul>li:hover {
    background: #fcfafaa1;
    
}

.menu>ul>li>ul {
    display: none;
    width: 100%;
    background: #f0f0f0;
    padding: 20px;
    position: absolute;
    z-index: 999999;
    left: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box
}

.menu>ul>li>ul:before,
.menu>ul>li>ul:after {
    content: "";
    display: table
}

.menu>ul>li>ul:after {
    clear: both
}

.menu>ul>li>ul>li {
    margin: 0;
    padding-bottom: 0;
    list-style: none;
    width: 25%;
    background: none;
    float: left
}

.menu>ul>li>ul>li a {
    color: #777;
    padding: .2em 0;
    width: 95%;
    display: block;
    border-bottom: 1px solid #ccc;
    font-size: 14px;
    color: #333
}

.menu>ul>li>ul>li>ul {
    display: block;
    padding: 0;
    margin: 10px 0 0;
    list-style: none;
    box-sizing: border-box
}

.menu>ul>li>ul>li>ul:before,
.menu>ul>li>ul>li>ul:after {
    content: "";
    display: table
}

.menu>ul>li>ul>li>ul:after {
    clear: both
}

.menu>ul>li>ul>li>ul>li {
    float: left;
    width: 100%;
    padding: 10px 0;
    margin: 0;
    font-size: .8em
}

.menu>ul>li>ul>li>ul>li a {
    border: 0
}

.menu>ul>li>ul.normal-sub {
    width: 220px;
    left: auto;
    padding: 10px 20px
}

.menu>ul>li>ul.normal-sub>li {
    width: 100%
}

.menu>ul>li>ul.normal-sub>li a {
    border: 0;
    padding: 1em 0
}

.scroll {
    overflow-y: scroll;
    overflow-x: hidden;
    height: 568px;
    max-height: 600px
}

@media only screen and (max-width:959px) {
    .menu-container {
        width: 100%
    }

    .menu-mobile {
        position: relative
    }
    
    .menu-mobile :hover {
        position: relative
    }

    .menu-drodbwn-icon:before {
        display: inline;
        position: relative;
        text-align: right
    }

    .menu>ul {
        width: 90%;
        list-style: none;
        position: relative;
        padding-top: .5em;
        box-sizing: border-box
    }

    .menu>ul:before,
    .menu>ul:after {
        content: "";
        display: table
    }

    .menu>ul:after {
        clear: both
    }

    .menu>ul>li {
        float: none;
        color: #76767e;
        padding: 0;
        font-size: small;
        font-weight: 200px;
        margin: 0
    }

    .menu>ul>li a {
        width: 50%;
        padding: .5em;
        display: block
    }

    .menu>ul>li a:hover {
        background: white;

    }

    .menu>ul>li>ul {
        position: relative
    }

    .menu>ul>li>ul.normal-sub {
        width: 100%
    }

    .menu>ul>li>ul>li {
        float: none;
        width: 100%;
        margin-top: 20px
    }

    .menu>ul>li>ul>li:first-child {
        margin: 0
    }

    .menu>ul>li>ul>li>ul {
        position: relative
    }

    .menu>ul>li>ul>li>ul>li {
        float: none
    }

    .menu .show-on-mobile {
        display: block
    }
}

.bx-wrapper {
    position: relative;
    box-shadow: none;
    border: 0;
    margin-bottom: 0
}

.bx-controls {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9999
}

.welcome {
    width: 100%;
    height: auto;
    overflow: hidden;
    background: #333;
    text-align: center;
    padding: 70px 0;
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative
}

.welcome .overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .8;
    background: #333
}

.welcome h2 {
    color: #fff;
    margin-bottom: 25px
}

.welcome p {
    color: #fff
}

.welcome p.button {
    color: #fff;
    margin-top: 35px
}

.welcome p.button a {
    background: #0d1452;
    color: #fff;
    padding: 10px 14px;
    transition: all .4s ease;
    text-decoration: none
}

.welcome p.button a:hover {
    background: #fff;
    color: #0d1452
}

.service {
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 25px 0 25px 0
}

.service .item {
    text-align: center
}

.service .icon {
    text-align: center
}

.service .icon i {
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    background: #0d1452;
    color: #fff;
    font-size: 38px;
    border-radius: 50%
}

.product .product-carousel {
    position: relative
}

.product .owl-controls {
    position: absolute;
    top: -60px;
    right: 0
}

.product .owl-controls .owl-prev,
.product .owl-controls .owl-next {
    background: #353535;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    padding-left: 13px;
    padding-right: 13px
}

.product .owl-controls .owl-prev i,
.product .owl-controls .owl-next i {
    font-size: 14px
}

.product .owl-controls .owl-prev:hover,
.product .owl-controls .owl-next:hover {
    background: #0d1452
}

.product .text {
    background: #F2F3F3;
    overflow: hidden;
    border-radius: 15px;
    margin-top: -50px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease-in-out
}

.product .text del {
    color: #9d9d9d
}

.product .text a {
    visibility: hidden
}

.card:hover {
    transform: scale(1.02)
}

.card:hover>.text>a {
    visibility: visible
}

.product .text h3 {
    font-weight: 700;
    text-align: center;
    color: #353535;
    font-size: 14px;
    margin-top: 0;

    overflow: hidden;
    width: 81%;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product .text h3 a {
    color: #333;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    visibility: visible
}

.product .text h3 a:hover {
    text-decoration: none
}

.product .photo h4 {
    color: gold;
    text-align: right;
    font-size: 16px;
    visibility: visible;
}

.product .text .card-footer span {
    color: #0d1452;
    float: right;
    font-size: 16px;
    padding: 3px;
    border-radius: 10px;
    border: 1px solid beige;
    background: gainsboro;
    visibility: visible
}

.product .text h4 a {
    color: blue;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    visibility: visible
}

.product .text h4 a:hover {
    text-decoration: none
}

.product .text p {
    text-align: center;
    font-size: 14px;
    margin-top: 20px;
    margin-bottom: 14px
}

.product .text p a {
    background: #0d1452;
    color: #fff;
    font-size: 14px;
    padding: 6px 10px;
    transition: all .4s ease;
    visibility: visible
}

.product .out-of-stock {
    width: 100%;
    text-align: center
}

.product .out-of-stock .inner {
    display: inline-block;
    background: #0d1452;
    color: #fff;
    font-size: 14px;
    padding: 6px 10px;
    transition: all .4s ease;
    text-decoration: line-through;
    visibility: visible
}

.product .text .rating {
    text-align: center;
    visibility: visible;
    color: #efb504
}

.fa-star {
    color: #efb504
}

.product .text p a:hover {
    background: #333
}

.product .photo {
    width: 100%;
    height: 300px;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    margin: 0 auto;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px
}

.product .item .overlay {
    width: 100%;
    height: 100%;
    opacity: 0;
    filter: alpha(opacity=0);
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: scale(.2);
    -ms-transform: scale(.2);
    -o-transform: scale(.2);
    transform: scale(.2);
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    background: rgba(255, 255, 255, .6)
}

.product-cat {
    padding-top: 14px
}

.product-cat .item {
    margin-bottom: 30px
}

.product .item-product-cat {
    border: 0
}

.product .item-product-cat .inner {
    border: 2px solid #e5e5e5
}

.product .item-search-result {
    border: 0
}

.product .item-search-result .inner {
    border: 2px solid #e5e5e5
}

.product .item-search-result:nth-of-type(4n+1) {
    clear: both
}

.product .item-product-cat:nth-of-type(3n+1) {
    clear: both
}

.testimonial-v1 {
    padding-top: 80px;
    padding-bottom: 80px;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-attachment: fixed
}

.testimonial-v1 .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #353535;
    opacity: .7
}

.testimonial-v1 .container {
    position: relative;
    z-index: 9999
}

.testimonial-v1 .heading {
    margin-bottom: 50px
}

.testimonial-v1 .heading h2 {
    font-size: 28px;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    color: #fff
}

.testimonial-v1 .heading p {
    font-size: 14px;
    text-align: center;
    color: #fff
}

.testimonial-v1 .testimonial-carousel {
    text-align: center;
    position: relative;
    width: 70%;
    margin: 0 auto
}

.testimonial-v1 .content .comment {
    color: #fff;
    padding: 14px 50px;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    position: relative
}

.testimonial-v1 .content .comment p {
    margin: 0 auto;
    color: #fff;
    font-size: 14px
}

.testimonial-v1 .author {
    width: 100%;
    text-align: center;
    margin-top: 20px
}

.testimonial-v1 .photo {
    display: inline-block;
    margin-right: -4px;
    vertical-align: top
}

.testimonial-v1 .photo img {
    width: 80px;
    height: 80px;
    float: right;
    margin-right: 25px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%
}

.testimonial-v1 .text {
    display: inline-block;
    vertical-align: top
}

.testimonial-v1 .text h3 {
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    text-align: left;
    margin-top: 10px
}

.testimonial-v1 .text h4 {
    font-size: 13px;
    color: #fff;
    text-align: left
}

.testimonial-v1 .owl-nav {
    margin-top: 20px
}

.testimonial-v1 .owl-nav i {
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-size: 20px;
    text-align: center
}

.testimonial-v1 .owl-nav .owl-prev,
.testimonial-v1 .owl-nav .owl-next {
    color: #fff;
    background: none;
    position: absolute;
    top: 14%
}

.testimonial-v1 .owl-nav .owl-prev i,
.testimonial-v1 .owl-nav .owl-next i {
    font-size: 30px;
    font-weight: bold
}

.testimonial-v1 .owl-nav .owl-prev {
    left: -80px
}

.testimonial-v1 .owl-nav .owl-next {
    right: -80px
}

.testimonial-v1 .owl-nav .owl-prev:hover,
.testimonial-v1 .owl-nav .owl-next:hover {
    background: none
}

.home-blog {
    width: 100%;
    height: auto;
    padding: 70px 0;
    overflow: hidden
}

.home-blog .item {}

.home-blog .item .photo {
    width: 100%;
    height: 300px;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat
}

.home-blog .text {
    padding: 14px;
    background: #f2f3f3
}

.home-blog .text h3 {
    margin-top: 0;
    font-size: 18px;
    font-weight: 700
}

.home-blog .text p.button {
    margin-top: 25px
}

.home-blog .text p.button a {
    background: #0d1452;
    color: #fff;
    font-size: 14px;
    padding: 6px 10px;
    transition: all .4s ease
}

.home-blog .text p.button a:hover {
    background: #333
}

.footer-main {
    width: 100%;
    height: auto;
    padding: 50px 0;
    background: #2a2a2a
}

.footer-main h3 {
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 14px;
    margin-bottom: 25px;
    border-bottom: 1px solid #525252
}

.footer-main h3:after {
    content: "";
    position: absolute;
    width: 50px;
    background: #0d1452;
    left: 0;
    bottom: -2px;
    height: 4px
}

.footer-main .footer-col p {
    color: #a3a3a3;
    font-size: 14px;
    line-height: 22px
}

.footer-main .footer-col p a {
    color: #a3a3a3
}

.footer-main .footer-col p span {
    display: block;
    color: #a3a3a3
}

.footer-main .footer-col ul li {
    color: #a3a3a3;
    font-size: 14px;
    line-height: 22px;
    -webkit-transition: all .4s ease 0s;
    -moz-transition: all .4s ease 0s;
    -o-transition: all .4s ease 0s;
    transition: all .4s ease 0s;
    list-style-type: none;
    margin-bottom: 8px;
    position: relative;
    padding-left: 20px
}

.footer-main .footer-col ul li a {
    color: #a3a3a3;
    font-size: 14px;
    line-height: 22px;
    -webkit-transition: all .4s ease 0s;
    -moz-transition: all .4s ease 0s;
    -o-transition: all .4s ease 0s;
    transition: all .4s ease 0s
}

.footer-main .footer-col ul li a:hover {
    color: #fff
}

.footer-main .footer-col ul li:before {
    color: #a3a3a3;
    content: "\f0a4";
    font-family: "FontAwesome";
    left: 0;
    position: absolute;
    top: 0
}

.footer-main .footer-col .contact-item {
    color: #a3a3a3;
    font-size: 14px;
    overflow: hidden;
    margin-bottom: 10px;
    display: table
}

.footer-main .footer-col .contact-item .icon {
    width: 35px;
    display: table-cell;
    vertical-align: top;
    font-size: 14px;
    margin-right: 10px
}

.footer-main .footer-col .contact-item .icon i {
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    background: #dedede;
    color: #2a2a2a;
    border-radius: 50%
}

.footer-main .footer-col .contact-item .text {
    display: table-cell;
    vertical-align: top;
    line-height: 22px;
    display: block
}

.footer-main .footer-col p.social {
    margin-bottom: 10px
}

.footer-bottom {
    width: 100%;
    height: auto;
    background: #141314;
    padding: 14px 0
}

.footer-bottom .copyright {
    font-size: 13px;
    color: #a3a3a3;
    text-align: center
}

.scrollup {
    position: fixed;
    z-index: 99999;
    bottom: 20px;
    right: 20px;
    display: none
}

.scrollup i {
    width: 50px;
    height: 50px;
    line-height: 40px;
    border-radius: 50%;
    background: #0d1452;
    color: #fff;
    border: 4px solid #0d1452;
    text-align: center;
    font-size: 26px;
    opacity: .5;
    filter: alpha(opacity=50)
}

.scrollup i:hover {
    opacity: 1;
    filter: alpha(opacity=1)
}

ul.prod-slider li {
    height: 450px;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: top center;
    position: relative;
    border-radius: 20px
}

ul.prod-slider li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 20px;
    z-index: 99999999
}

.bx-controls {
    display: none
}

.prod-pager-thumb {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: top center
}

#prod-pager {
    margin-top: 20px
}

#prod-pager a {
    float: left;
    margin-right: 3px
}

ul.nav-tabs {
    margin-top: 50px
}

.product .p-title h1 {
    color: #0d1452;
    margin-top: 10px;
    margin-bottom: 16px;
    font-size: 32px
}

.product .p-status {
    margin-bottom: 10px
}

.product .p-review {
    margin-bottom: 10px
}

.product .p-price {
    line-height: 30px;
    font-size: 20px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px
}

.product .p-price span {
    font-size: 30px
}

.product .p-price del {
    color: #c7c7c7
}

.product .p-short-des {
    margin-bottom: 30px
}

.product .p-quantity {
    font-weight: 700;
    line-height: 30px;
    border-radius: 12px;
    font-size: 14px
}

.product .p-quantity input[type="number"] {
    height: 30px;
    border-radius: 12px;
    width: 100px;
    border: 2px solid #c7c7c7
}

.product .btn-cart {
    margin-bottom: 30px
}

.product .btn-cart a {
    padding: 10px 14px;
    background: #0d1452;
    color: #fff
}

.product .btn-cart1 input[type="submit"] {
    border: 0;
    padding: 10px 14px;
    background: #0d1452;
    color: #fff
}

.product .share {
    line-height: 30px;
    font-weight: 700
}

.product .nav {
    background: transparent
}

.product .nav-tabs li a {
    font-weight: 540;
    display: inline-block;
    color: #333
}

.product .tab-content>.tab-pane {
    padding-top: 20px
}

.review-form h2 {
    font-size: 24px;
    font-weight: 700
}

.review-form .btn-default {
    background: #0d1452;
    color: #fff;
    border-radius: 0;
    border: 0;
    padding: 10px 14px
}

.rating-section {
    margin-bottom: 14px
}

.page-banner {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative;
    padding-top: 80px;
    padding-bottom: 80px;
    overflow: hidden
}

.page-banner .overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .7;
    background: #333
}

.page-banner h1 {
    color: #fff;
    text-align: center;
    z-index: 999;
    position: relative
}

.page {
    width: 100%;
    height: auto;
    padding-bottom: 50px
}

.page h3.special {
    font-size: 22px;
    font-weight: 600;
    position: relative;
    padding-bottom: 14px;
    margin-bottom: 25px;
    border-bottom: 1px solid #b9b9b9;
    position: relative
}

.page h3.special:after {
    content: "";
    position: absolute;
    width: 50px;
    background: #0d1452;
    left: 0;
    bottom: -2px;
    height: 4px
}

.cart {
    width: 50%;
    height: 90%;
    position: fixed;
    overflow-y: scroll
}

.cart table img {
    width: 100%
}

.ccart {
    width: 100%;
    height: 90%;
    position: relative;
    overflow-y: scroll
}

.ccart table img {
    width: 100%
}

@media only screen and (min-width:767px) and (max-width:1024px) {
    .cart {
        width: 100%
    }
}

@media only screen and (min-width:360px) and (max-width:500px) {
    .cart {
        width: 100%
    }
}

@media only screen and (min-width:360px) and (max-width:500px) {
    .cart table img {
        width: 100%
    }
}

@media only screen and (min-width:501px) and (max-width:666px) {
    .cart {
        width: 100%
    }
}

@media only screen and (min-width:501px) and (max-width:666px) {
    .cart table img {
        width: 100%
    }
}

@media only screen and (min-width:280px) and (max-width:310px) {
    .cart {
        width: 100%
    }
}

@media only screen and (min-width:280px) and (max-width:310px) {
    .cart table img {
        width: 100%
    }
}

@media only screen and (min-width:320px) and (max-width:359px) {
    .cart {
        width: 100%
    }
}

@media only screen and (min-width:320px) and (max-width:359px) {
    .cart table img {
        width: 100%
    }
}

.cart table tr td {
    vertical-align: middle
}

.cart input[type="number"] {
    height: 30px;
    width: 70px;
    border: 2px solid #ffc0c0;
    padding-left: 10px;
    padding-right: 10px
}

.cart table tr td .trash {
    color: #0d1452;
    font-size: 18px
}

.cart table tr td.total-text,
.cart table tr th.total-text {
    text-align: left;
    font-size: 14px
}

.cart table tr td.total-amount,
.cart table tr th.total-amount {
    text-align: left;
    font-size: 14px
}

.resize {
    width: 150px;
    padding-top: 0;
    margin-top: 0;
    height: 100px
}

.cart-buttons {
    display: inline-flexbox;
    bottom: 3px;
    position: fixed;
    border-radius: 13px;
    text-align: center;
    align-items: center;
    padding: 5px;
    margin: 10px
}

.cart-buttons ul {
    width: 100%;
    text-align: center;
    list-style: none;
    position: relative;
    box-sizing: border-box;
    align-items: center
}

.cart-buttons li {
    float: none;
    text-align: center;
    display: inline;
    list-style-type: none;
    border-radius: 13;
    align-items: center
}

.cart-buttons li input[type="submit"],
.cart-buttons li a {
    background: #0d1452;
    border: 0;
    border-radius: 13;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    font-size: 13px;
    color: #fff
}

.cart-buttons li input[type="submit"]:hover,
.cart-buttons li a:hover {
    background: #333;
    color: #fff;
    border-radius: 13
}

.cform input[type="submit"] {
    background: #0d1452;
    border: 0
}

.cform address span,
.cform address a span {
    color: #0d1452
}

.page iframe {
    width: 100%
}

.gal-container {
    padding: 12px
}

.gal-item {
    overflow: hidden;
    padding: 3px
}

.gal-item .box {
    height: 350px;
    overflow: hidden
}

.box img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    -o-object-fit: cover
}

.gal-item a:focus {
    outline: none
}

.gal-item a:after {
    content: "\e003";
    font-family: 'Glyphicons Halflings';
    opacity: 0;
    background-color: rgba(0, 0, 0, .75);
    position: absolute;
    right: 3px;
    left: 3px;
    top: 3px;
    bottom: 3px;
    text-align: center;
    line-height: 350px;
    font-size: 30px;
    color: #fff;
    -webkit-transition: all .5s ease-in-out 0s;
    -moz-transition: all .5s ease-in-out 0s;
    transition: all .5s ease-in-out 0s
}

.gal-item a:hover:after {
    opacity: 1
}

.modal-open .gal-container .modal {
    background-color: rgba(0, 0, 0, .4)
}

.modal-open .gal-item .modal-body {
    padding: 0
}

.modal-open .gal-item button.close {
    position: absolute;
    width: 25px;
    height: 25px;
    background-color: #000;
    opacity: 1;
    color: #fff;
    z-index: 999;
    right: -12px;
    top: -12px;
    border-radius: 50%;
    font-size: 14px;
    border: 2px solid #fff;
    line-height: 25px;
    -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, .35);
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, .35)
}

.modal-open .gal-item button.close:focus {
    outline: none
}

.modal-open .gal-item button.close span {
    position: relative;
    top: -3px;
    font-weight: lighter;
    text-shadow: none
}

.gal-container .modal-dialogue {
    width: 80%
}

.gal-container .description {
    position: relative;
    height: 40px;
    top: -40px;
    padding: 10px 25px;
    background-color: rgba(0, 0, 0, .5);
    color: #fff;
    text-align: left
}

.gal-container .description h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px
}

.gal-container .modal.fade .modal-dialog {
    -webkit-transform: scale(.1);
    -moz-transform: scale(.1);
    -ms-transform: scale(.1);
    transform: scale(.1);
    top: 100px;
    opacity: 0;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s
}

.gal-container .modal.fade.in .modal-dialog {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transform: translate3d(0, -100px, 0);
    transform: translate3d(0, -100px, 0);
    opacity: 1
}

@media (min-width:768px) {
    .gal-container .modal-dialog {
        width: 55%;
        margin: 50 auto
    }
}

@media (max-width:768px) {
    .gal-container .modal-content {
        height: 250px
    }
}

i.red {
    color: #BC0213
}

.gal-container {
    padding-top: 0;
    padding-bottom: 75px
}

.videos {
    padding-top: 30px;
    padding-bottom: 10px;
    text-align: center
}

.videos .adv img {
    width: 100%;
    height: auto
}

.videos .prop-4-col:nth-of-type(4n+1) {
    clear: both
}

.videos .prop-3-col:nth-of-type(3n+1) {
    clear: both
}

.videos h2 {
    color: #464646;
    font-family: "Open Sans", serif;
    font-size: 26px;
    font-weight: 800;
    position: relative;
    text-transform: uppercase
}

.videos h3 {
    color: #464646;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 40px;
    margin-top: 20px
}

.single-room {
    position: relative;
    margin-bottom: 30px;
    background: #fff;
    overflow: hidden;
    -webkit-box-shadow: 0 0 14px -2px rgba(0, 0, 0, .75);
    -moz-box-shadow: 0 0 14px -2px rgba(0, 0, 0, .75);
    box-shadow: 0 0 14px -2px rgba(0, 0, 0, .75)
}

.single-room .photo-col2 {
    width: 100%;
    height: 360px;
    -webkit-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center
}

.single-room .photo-col3 {
    width: 100%;
    height: 150px;
    -webkit-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center
}

.single-room-text {
    width: 100%;
    height: auto;
    overflow: hidden
}

.single-room-text h2 {
    background: #fff;
    font-size: 13px;
    line-height: 1.4;
    text-transform: none;
    margin-bottom: 0
}

.single-room-text h2 a {
    color: #333;
    padding: 8px !important;
    font-weight: 600;
    display: block
}

table.bill-address tr td:nth-of-type(1) {
    font-weight: bold;
    width: 200px
}

.user-sidebar ul {
    text-align: center
}

.user-sidebar ul li {
    list-style-type: none;
    border-bottom: 1px solid #fff;
    display: inline-block
}

.user-sidebar ul li a {
    padding: 7px 20px;
    min-height: 40px;
    line-height: 40px;
    background: #444;
    color: #fff
}

.user-content h3 {
    margin-bottom: 20px
}

.login-box {
    position: relative;
    top: 50%;
    width: 100%;
    padding: 40px;
    background: rgba(0,0,0,.5);
    box-sizing: border-box;
    box-shadow: 0 15px 25px rgba(0,0,0,.6);
    border-radius: 10px;
  }
.cbtn{
    background: transparent;
    border-radius: 10px;
    border: none;
}
  .login-box .user-box {
    position: relative;
  }
  
  .login-box .user-box textarea,
  .login-box .user-box select,
  .login-box .user-box input {
    width: 100%;
    padding: 10px 0;
    font-size: 16px;
    color: #fff;
    margin-bottom: 30px;
    border: none;
    border-bottom: 1px solid #c26231;
    outline: none;
    background: transparent;
  }
  .login-box .user-box label {
    position: absolute;
    top:0; 
    left: 0;
    padding: 5px 0 10px 0;
    font-size: 18px;
    color: #8c9db0;
    pointer-events: none;
    transition: .5s;
  }
  
  .login-box .user-box input:focus ~ label,
  .login-box .user-box input:valid ~ label {
    top: -20px;
    left: 0;
    color: #C26231;
    font-size: 12px;
  }
  .login-box form a {
    position: relative;
    display: inline-block;
    padding: 10px 20px;
    color: #C26231;
    font-size: 16px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 40px;
    letter-spacing: 4px
  }
  
  .login-box a:hover {
    background: #03e9f4;
    color: #C26231;
    border-radius: 5px;
    box-shadow: 0 0 5px #03e9f4,
                0 0 25px #C26231,
                0 0 50px #03e9f4,
                0 0 100px #C26231;
  }
  
  .login-box a span {
    position: absolute;
    display: block;
  }
  
  .login-box a span:nth-child(1) {
    top: 0;
    left: -100%;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #03e9f4);
    animation: btn-anim1 1s linear infinite;
  }
  
  @keyframes btn-anim1 {
    0% {
      left: -100%;
    }
    50%,100% {
      left: 100%;
    }
  }
  
  .login-box a span:nth-child(2) {
    top: -100%;
    right: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(180deg, transparent, #03e9f4);
    animation: btn-anim2 1s linear infinite;
    animation-delay: .25s
  }
  
  @keyframes btn-anim2 {
    0% {
      top: -100%;
    }
    50%,100% {
      top: 100%;
    }
  }
  
  .login-box a span:nth-child(3) {
    bottom: 0;
    right: -100%;
    width: 100%;
    height: 2px;
    background: linear-gradient(270deg, transparent, #03e9f4);
    animation: btn-anim3 1s linear infinite;
    animation-delay: .5s
  }
  
  @keyframes btn-anim3 {
    0% {
      right: -100%;
    }
    50%,100% {
      right: 100%;
    }
  }
  
  .login-box a span:nth-child(4) {
    bottom: -100%;
    left: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(360deg, transparent, #03e9f4);
    animation: btn-anim4 1s linear infinite;
    animation-delay: .75s
  }
  
  @keyframes btn-anim4 {
    0% {
      bottom: -100%;
    }
    50%,100% {
      bottom: 100%;
    }
  }
.blog {
    background: #fff
}

.blog .post-item {
    margin-bottom: 30px;
    overflow: hidden
}

.blog .image-holder {
    width: 285px;
    float: left;
    position: relative;
    margin-right: 15px
}

.blog .image-holder-single {
    width: 100%;
    float: none;
    position: relative
}

.blog .image-holder-single img {
    width: 100%;
    height: auto
}

.blog .image-holder .date {
    position: absolute;
    right: 10px;
    bottom: 10px;
    font-size: 14px;
    font-weight: 600;
    z-index: 999
}

.blog .image-holder .day {
    width: 60px;
    height: 40px;
    line-height: 40px;
    background: #0d1452;
    color: #fff;
    text-align: center;
    position: relative;
    font-size: 16px
}

.blog .image-holder .day:before {
    position: absolute;
    top: 22px;
    left: 24px;
    color: #0d1452;
    font-family: 'FontAwesome';
    content: '\f0d7';
    font-size: 24px
}

.blog .image-holder .month {
    width: 60px;
    height: 40px;
    line-height: 40px;
    background: #333;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    font-size: 16px
}

.blog .text {
    width: calc(100% - 300px);
    float: left
}

.blog .text-single {
    width: 100%;
    float: none
}

.blog .text-single h3 {
    font-family: 'Roboto', sans-serif;
    margin-top: 20px
}

.blog .text .inner {
    padding: 0 20px 20px 20px
}

.blog h3 {
    font-family: 'Roboto', sans-serif;
    text-align: left;
    color: #333;
    font-weight: 700;
    font-size: 18px;
    margin-top: 0;
    margin-bottom: 10px;
    line-height: 1.5;
    text-transform: uppercase
}

.blog h3 a {
    font-family: 'Roboto', sans-serif;
    color: #333
}

.blog h3 a:hover {
    color: #0d1452
}

.blog .text ul.status {
    overflow: hidden;
    margin-bottom: 15px
}

.blog .text ul.status li {
    text-align: left;
    margin-bottom: 15px;
    color: #0d1452;
    font-size: 14px;
    float: left;
    list-style-type: none;
    margin-right: 15px;
    line-height: 18px;
    margin-bottom: 5px;
    padding-left: 0
}

.blog .text ul.status li a {
    color: #0d1452
}

.blog .text ul.status li i {
    margin-right: 8px
}

.blog ul.status li:before {
    content: ''
}

.blog ul li {
    position: relative;
    padding-left: 18px;
    margin-bottom: 10px;
    list-style-type: none
}

.blog ul li:before {
    position: absolute;
    top: 0;
    left: 0;
    font-family: 'FontAwesome';
    content: '\f044';
    color: #333
}

.blog h1 {
    font-size: 24px;
    color: #0d1452;
    font-weight: bold
}

.blog h2 {
    font-size: 20px;
    color: #0d1452;
    font-weight: bold;
}

.blog h3 {
    font-size: 18px;
    color: #333;
    font-weight: bold
}

.blog h4 {
    font-size: 16px;
    color: #0d1452;
    font-weight: bold
}

.blog h5 {
    font-size: 14px;
    color: #0d1452;
    font-weight: bold
}

.blog h6 {
    font-size: 12px;
    color: #0d1452;
    font-weight: bold
}

.blog p {
    margin-bottom: 15px;
    font-size: 14px
}

.blog p.button {
    margin-top: 20px
}

.blog p.button a {
    font-family: 'Roboto', sans-serif;
    background: #0d1452;
    color: #fff;
    padding: 10px 14px;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

.blog p.button a:hover {
    background: #444
}

.blog .pagination {
    margin-top: 20px
}

.blog .pagination ul {
    width: 100%;
    height: auto;
    text-align: center
}

.blog .pagination ul li {
    display: inline-block;
    color: #333;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin-right: 10px;
    padding-left: 0
}

.blog .pagination ul li:before {
    content: ''
}

.blog .pagination ul li a {
    background: #0d1452;
    color: #fff;
    display: block;
    font-size: 16px
}

.blog .pagination ul li a i {
    margin-right: 0
}

.blog .pagination ul li a:hover {
    background: #333
}

.blog .pagination ul li a.active {
    background: #333
}

.blog .gallery-carousel {
    position: relative;
    z-index: 999
}

.blog .owl-controls {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 999
}

.blog .owl-controls .owl-prev,
.blog .owl-controls .owl-next {
    background: #333;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    padding-left: 13px;
    padding-right: 13px
}

.blog .owl-controls .owl-prev i,
.blog .owl-controls .owl-next i {
    font-size: 16px
}

.blog .owl-controls .owl-prev:hover,
.blog .owl-controls .owl-next:hover {
    background: #0d1452
}

.blog .video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0
}

.blog .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.blog .audio {
    width: 100%;
    height: 100%;
    margin: 0 auto
}

.sidebar {
    width: 100%
}

.widget {
    overflow: hidden;
    margin-bottom: 30px
}

.widget-search input {
    height: 36px;
    border: 2px solid #afafaf;
    float: left;
    padding-left: 6px;
    padding-right: 6px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px
}

.widget-search input:focus {
    border: 2px solid #0d1452
}

.widget-search button {
    width: 42px;
    height: 36px;
    float: left;
    border: 2px solid #0d1452;
    background: #0d1452;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    margin-left: 5px;
    color: #fff;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

.widget-search button:hover {
    background: #333;
    color: #fff;
    border-color: #333
}

.widget h4 {
    font-family: 'Roboto', sans-serif;
    font-size: 22px;
    font-weight: 700;
    padding-bottom: 6px;
    margin-bottom: 15px;
    border-bottom: 2px solid #0d1452
}

.widget ul li {
    display: block;
    float: none;
    color: #333;
    position: relative;
    padding-left: 15px;
    margin-bottom: 10px
}

.widget ul li:before {
    content: '\f105';
    font-family: 'FontAwesome';
    position: absolute;
    color: #333;
    top: 1px;
    left: 3px
}

.widget ul li a {
    color: #333;
    font-size: 14px
}

.widget ul li a:hover {
    color: #0d1452
}

.widget ul.tag-cloud li {
    display: inline-block;
    padding-left: 0;
    padding: 4px 10px;
    border: 2px solid #afafaf;
    font-size: 12px;
    margin-right: 5px
}

.widget ul.tag-cloud li:before {
    content: ''
}

.widget ul.tag-cloud li:hover {
    background: #0d1452;
    border: 2px solid #0d1452
}

.widget ul.tag-cloud li:hover a {
    color: #fff
}

.card .nav-tabs {
    border-bottom: 2px solid #DDD;
    background: #fff
}

.card .nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {}

.card .nav-tabs>li>a {
    border: none;
    color: #666
}

.card .nav-tabs>li.active>a,
.card .nav-tabs>li>a:hover {
    border: none;
    color: #0d1452 !important;
    background: transparent
}

.card .nav-tabs>li>a::after {
    content: "";
    background: #0d1452;
    height: 2px;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: -1px;
    transition: all 250ms ease 0s;
    transform: scale(0)
}

.card .nav-tabs>li.active>a::after,
.nav-tabs>li:hover>a::after {
    transform: scale(1)
}

.tab-nav>li>a::after {
    background: #21527d none repeat scroll 0% 0%;
    color: #fff
}

.tab-pane {
    padding: 14px 0
}

.tab-content {
    padding: 20px
}

.card {
    background: #FFF none repeat scroll 0% 0%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    margin-bottom: 30px
}

.vid iframe {
    width: 100%;
    height: 250px
}

div.pagination {
    padding: 3px;
    margin: 3px;
    z-index: 1000;
    font-size: 14px;
    margin-bottom: 20px
}

div.pagination a {
    padding: 5px 7px;
    margin: 2px;
    border: 1px solid #cf0d42;
    text-decoration: none;
    background-color: #0d1452;
    color: #FFF;
    font-weight: bold
}

div.pagination a:hover,
div.pagination a:active {
    border: 1px solid #cf0d42;
    color: #FFF;
    background-color: #b20b39
}

div.pagination span.current {
    padding: 5px 7px;
    margin: 2px;
    border: 1px solid #cf0d42;
    font-weight: bold;
    background-color: #b20b39;
    color: #FFF;
    font-weight: bold
}

div.pagination span.disabled {
    padding: 5px 7px;
    margin: 2px;
    border: 1px solid #929693;
    color: #929693
}

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 999999
}

#status {
    width: 200px;
    height: 200px;
    position: absolute;
    left: 50%;
    top: 50%;
    background: url(../img/1.gif);
    background-repeat: no-repeat;
    background-position: center;
    margin: -100px 0 0 -100px
}

.ad-section img {
    width: 100% !important;
    height: auto !important
}

.breadcrumb {
    background: #fff;
    margin-top: -40px
}

.breadcrumb ul li {
    float: left;
    list-style-type: none;
    margin-right: 10px;
    color: #0d1452
}

.breadcrumb ul li:last-child {
    color: #333
}

.breadcrumb ul li a {
    color: #0d1452
}

.bs-slider .item {
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 500px
}

.home-newsletter {
    padding: 80px 0;
    background: #0d1452
}

.home-newsletter .single {
    max-width: 650px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 2
}

.home-newsletter .single h2 {
    font-size: 22px;
    color: white;
    text-transform: uppercase;
    margin-bottom: 40px;
    margin-top: 0
}

.home-newsletter .single .form-control {
    height: 50px;
    border-color: #333;
    outline: none
}

.home-newsletter .single .btn {
    min-height: 50px;
    background: #333;
    color: #fff;
    padding-left: 15px;
    padding-right: 15px
}

.checkoutButton {
    position: fixed;
    bottom: 0;
    display: flex;
    width: 100%;
    background: #ffffff;
    border-radius: 12px;
    z-index: 100;
    overflow: hidden;
    box-shadow: -2px -2px 2px 0 rgba(80, 80, 80, .1), 2px 2px 3px 0 rgba(12, 12, 12, .3), inset 0 0 0 2px rgba(80, 80, 80, .2);
    margin-top: 30px;
    padding: 14px 14px 14px 14px;
    justify-content: space-between
}

.priceTag {
    display: flex;
    align-items: center;
    font-size: 32px
}

.priceTag span {
    color: #488dc7;
    font-size: 20px
}

.p-quantity2 {
    border-radius: 12px;
    display: flex;
    align-items: center;
    font-size: 10px;
    border-right: 1px solid rgba(0, 0, 0, .4)
}

button.preorder {
    outline: 0;
    border: 0;
    border-radius: 6px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background-image: linear-gradient(85deg, #61c7ef, #4833fb);
    color: rgb(3, 0, 0)
}

.preorder p {
    padding: 8px 17px;
    border-right: 1px solid linear-gradient(85deg, #eee7e4, #dcf0dc)
}

.buttonaction {
    border-left: 1px solid rgba(255, 255, 255, .2);
    padding: 5px 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(255, 255, 255)
}

@keyframes updowncontroller {
    0% {
        transform: rotate(-90deg) translate(-56px, 66px)
    }

    80%,
    100% {
        transform: rotate(-70deg) translate(10px, 66px)
    }
}

.main-footer {
    background: #E5E5E5;
    padding: 10px 0 10px 0;
    position: relative;
    z-index: 10
}

.main-footer .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.main-footer .col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center
}

.main-footer .col p {
    font-family: "p22-underground", sans-serif;
    font-weight: 600;
    font-size: 12px;
    margin: 0 0 8px 0
}

.main-footer .col p a {
    color: #1a1a1a;
    text-decoration: none
}

.main-footer .col p.copyright {
    font-family: "minion-pro", serif;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: uppercase
}

.main-footer .form-newsletter .text {
    background: none;
    border: 1px solid #666;
    font-family: "minion-pro", serif;
    font-size: 13px;
    font-style: italic;
    letter-spacing: 1px;
    padding: 4px;
    width: 70%
}

.main-footer .form-newsletter .text:focus {
    outline: none
}

.main-footer .form-newsletter .text::-webkit-input-placeholder {
    color: #1a1a1a
}

.main-footer .form-newsletter .text::-moz-placeholder {
    color: #1a1a1a
}

.main-footer .form-newsletter .text:-ms-input-placeholder {
    color: #1a1a1a
}

.main-footer .form-newsletter .text::placeholder {
    color: #1a1a1a
}

.main-footer .form-newsletter .submit {
    background: #666;
    border: none;
    color: #fff;
    font-size: 16px;
    padding: 5px;
    width: 14%;
    vertical-align: -2px
}

.main-footer .form-newsletter .submit:hover {
    cursor: pointer
}

@media screen and (max-width:1025px) {
    .main-footer {
        text-align: center
    }

    .main-footer .container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .main-footer .col {
        margin: 0 4%;
        width: auto
    }

    .main-footer .col p {
        font-size: 14px
    }

    .main-footer .col:nth-child(3) {
        display: none
    }
}

@media screen and (max-width:720px) {
    .main-footer {
        padding-bottom: 50px;
        text-align: left
    }

    .main-footer .col {
        border-bottom: 1px solid #c8c8c8;
        display: block;
        float: none;
        margin: 0 0 10px 0;
        width: 100%
    }

    .main-footer .col p a {
        display: block
    }

    .main-footer .col:last-child {
        border: none;
        margin: 45px 0 0 0
    }
}

.top-nav-social {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: inline-block;
    margin-left: 20px;
    background-color: #f1f1f1;
    box-shadow: inset 0 0 1px #ffffff;
    border: solid 1px #e8e3e8;
    border-top: 0;
    overflow: hidden
}

.top-nav-social li {
    float: left;
    margin: 0
}

.top-nav-social a {
    font-size: 1.5em;
    margin: 0;
    color: #444;
    display: inline-block;
    padding: 7px 10px;
    min-width: 40px;
    text-align: center;
    transition: all .25s ease
}

.top-nav-social a.twitter:hover {
    background-color: #00aced;
    color: #fff
}

.top-nav-social a.facebook:hover {
    background-color: #3b5998;
    color: #fff
}

.top-nav-social a.instagram:hover {
    background-color: #517fa4;
    color: #fff
}

.top-nav-social a.rss:hover {
    background-color: #2f7cef;
    color: #fff
}

.top-nav-social a.linkedin:hover {
    background-color: #007bb6;
    color: #fff
}

.top-nav-social a.git:hover {
    background-color: #666666;
    color: #fff
}

.top-nav-social a.google-plus:hover {
    background-color: #dd4b39;
    color: #fff
}

.top-nav-social a.youtube:hover {
    background-color: #bb0000;
    color: #fff
}

.top-nav-social a.pinterest:hover {
    background-color: #cb2027;
    color: #fff
}

.top-nav-social a.wordpress:hover {
    background-color: #4597be;
    color: #fff
}

.top-nav-social a.flickr:hover {
    background-color: green;
    color: #fff
}

.top-nav-social a.vine:hover {
    background-color: #00b48a;
    color: #fff
}

.top-nav-social a.dribbble:hover {
    background-color: #f26798;
    color: #fff
}

.top-nav-social a.foursquare:hover {
    background-color: #0072b1;
    color: #fff
}

.top-nav-social a.tumblr:hover {
    background-color: #32506d;
    color: #fff
}










.main {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    background-color: #181d2f;
  }
  
  .logo {
    font-family: "DM Sans", sans-serif;
    font-size: 15px;
    color: #fff;
    font-weight: 600;
    text-align: center;
    height: 68px;
    line-height: 68px;
    letter-spacing: 4px;
    position: sticky;
    top: 0;
    background: linear-gradient(to bottom, #151728 0%, #151728 76%, rgba(21, 23, 40, 0) 100%);
  }
  
  .side-title {
    font-family: "DM Sans", sans-serif;
    color: #5c5e6e;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 20px;
  }
  
  .side-wrapper {
    padding: 30px;
  }
  
  .side-menu {
    display: flex;
    flex-direction: column;
    font-size: 15px;
    white-space: nowrap;
  }
  .side-menu svg {
    margin-right: 16px;
    width: 16px;
  }
  .side-menu a {
    text-decoration: none;
    color: #9c9cab;
    display: flex;
    align-items: center;
  }
  .side-menu a:hover {
    color: #fff;
  }
  .side-menu a:not(:last-child) {
    margin-bottom: 20px;
  }
  
  .follow-me {
    text-decoration: none;
    font-size: 14px;
    display: flex;
    align-items: center;
    margin-top: auto;
    overflow: hidden;
    color: #9c9cab;
    padding: 0 20px;
    height: 52px;
    flex-shrink: 0;
    border-top: 1px solid #272a3a;
    position: relative;
  }
  .follow-me svg {
    width: 16px;
    height: 16px;
    margin-right: 8px;
  }
  
  .follow-text {
    display: flex;
    align-items: center;
    transition: 0.3s;
  }
  
  .follow-me:hover .follow-text {
    transform: translateY(100%);
  }
  .follow-me:hover .developer {
    top: 0;
  }
  
  .developer {
    position: absolute;
    color: #fff;
    left: 0;
    top: -100%;
    display: flex;
    transition: 0.3s;
    padding: 0 20px;
    align-items: center;
    background-color: #272a3a;
    width: 100%;
    height: 100%;
  }
  
  .developer img {
    border-radius: 50%;
    width: 26px;
    height: 26px;
    object-fit: cover;
    margin-right: 10px;
  }
  
  .search-bar {
    height: 60px;
    background-color: #151728;
    z-index: 3;
    position: relative;
  }
  .search-bar input {
    height: 100%;
    width: 100%;
    display: block;
    background-color: transparent;
    border: none;
    padding: 0 54px;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512'%3e%3cpath d='M508.9 478.7L360 330a201.6 201.6 0 0045.2-127.3C405.3 90.9 314.4 0 202.7 0S0 91 0 202.7s91 202.6 202.7 202.6c48.2 0 92.4-17 127.3-45.2L478.7 509c4.2 4.1 11 4.1 15 0l15.2-15.1c4.1-4.2 4.1-11 0-15zm-306.2-116c-88.3 0-160-71.8-160-160s71.7-160 160-160 160 71.7 160 160-71.8 160-160 160z' data-original='%23000000' class='active-path' data-old_color='%23000000' fill='%235C5D71'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: 25px 50%;
    color: #fff;
    font-family: "Source Sans Pro", sans-serif;
    font-weight: 600;
  }
  .search-bar input::placeholder {
    color: #5c5d71;
  }
  
  .main-container {
    padding: 9px;
    flex-grow: 1;
    overflow: auto;
    background-color: #24273b;
  }
  
  .profile {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  .profile:before {
    content: "";
    width: 100%;
    height: 100%;
    position: relative;
    z-index: -1;
    left: 0;
    top: 0;
    background-image: url("https://images.unsplash.com/photo-1508247967583-7d982ea01526?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2250&q=80");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    filter: blur(50px);
    opacity: 0.7;
  }
  
  .profile-menu {
    position: relative;
    bottom: 0;
    background: #222858;
    width: 100%;
    display: flex;
    z-index: 2;
    border-radius: 0 0 4px 4px;
  }
  
  .profile-menu-link {
    padding: 12px 5px;
    color: #5c5e6e;
    transition: 0.3s;
    cursor: pointer;
  }
  .profile-menu-link.active, .profile-menu-link:hover {
    color: #fff;
    background-color: #1b1d2e;
    border-bottom: 3px solid #1488fa;
    transition: color 0.5s ease-in;
  }
  
  .profile-avatar {
    position: relative;
    align-items: center;
    display: flex;
    z-index: 1;
  }
  
  .profile-img {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #151728;
  }
  
  .profile-name {
    margin-left: 24px;
    margin-bottom: 24px;
    font-size: 22px;
    color: #fff;
    font-weight: 600;
    font-family: "DM Sans", sans-serif;
  }
  
  .timeline {    
    display: flex;
    padding-top: 15px;
    position: relative;
    z-index: 2;
	background: rgba(0,0,0,.3);
	transition: width .3s ease-in-out;
  }
  .timeline-left {
    width: 310px;
    flex-shrink: 0;
  }
  .timeline-right {
    flex-grow: 1;
    padding-left: 20px;
  }
  @media screen and (max-width: 768px) {
    .timeline {
      flex-wrap: wrap;
      flex-direction: column-reverse;
    }
    .timeline-right {
      padding-left: 0;
      margin-bottom: 20px;
    }
    .timeline-left {
      width: 100%;
    }
  }
  
#wardrobe, #account, #about, #ptimeline{
	display: none;
}
#wardrobe{
	display: initial;	
}
  .box {
    background-color: #151728;
    border-radius: 4px;
  }
  
  .intro {
    padding: 20px;
  }
  .intro-title {
    font-family: "DM Sans", sans-serif;
    color: #5c5e6e;
    font-weight: 600;
    font-size: 18px;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
  }
  .intro-menu {
    background-color: #8f98a9;
    box-shadow: -8px 0 0 0 #8f98a9, 8px 0 0 0 #8f98a9;
    width: 5px;
    height: 5px;
    border: 0;
    padding: 0;
    border-radius: 50%;
    margin-left: auto;
    margin-right: 8px;
  }
  
  .info {
    font-size: 15px;
  }
  .info-item {
    display: flex;
    color: #c3c5d5;
  }
  .info-item + .info-item {
    margin-top: 14px;
  }
  .info-item a {
    margin-left: 6px;
    color: #1771d6;
    text-decoration: none;
  }
  .info-item svg {
    width: 16px;
    margin-right: 10px;
  }
  
  .event {
    position: relative;
    margin-top: 20px;
    padding: 10px;
  }
  
  .event-wrapper {
    position: relative;
  }
  
  .event-img {
    max-width: 100%;
    display: block;
    padding-bottom: 12px;
  }
  
  .event-date {
    position: absolute;
    left: 20px;
    top: 15px;
  }
  
  .event-month {
    background-color: #1687fa;
    padding: 7px 20px;
    font-weight: 600;
    font-family: "DM Sans", sans-serif;
    color: #fff;
    text-align: center;
    border-radius: 4px 4px 0 0;
  }
  
  .event-day {
    width: 100%;
    backdrop-filter: blur(4px);
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    font-family: "DM Sans", sans-serif;
    background-color: rgba(0, 0, 0, 0.4);
    padding: 6px 0;
    text-align: center;
  }
  
  .event-title {
    color: #c3c5d5;
    margin-bottom: 5px;
    font-family: "DM Sans", sans-serif;
    font-weight: 600;
    padding: 0 14px;
  }
  
  .event-subtitle {
    color: #5c5e6e;
    font-family: "DM Sans", sans-serif;
    font-size: 13px;
    font-weight: 500;
    padding: 0 14px;
  }
  
  .pages {
    margin-top: 20px;
    padding: 20px;
  }
  
  .user {
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  
  .user + .user {
    margin-top: 18px;
  }
  
  .user-img {
    border-radius: 50%;
    width: 45px;
    height: 45px;
    margin-right: 15px;
    object-fit: cover;
    object-position: center;
  }
  
  .username {
    font-size: 15px;
    font-family: "DM Sans", sans-serif;
  }
  
  .status-menu {
    padding: 20px;
    display: flex;
    align-items: center;
  }
  .status-menu-item {
    text-decoration: none;
    color: #ccc8db;
    padding: 10px 14px;
    line-height: 0.7;
    font-family: "DM Sans", sans-serif;
    font-weight: 500;
    border-radius: 20px;
  }
  .status-menu-item.active, .status-menu-item:hover {
    background-color: #2e2e40;
    color: #fff;
  }
  .status-menu-item + .status-menu-item {
    margin-left: 10px;
  }
  @media screen and (max-width: 500px) {
    .status-menu {
      font-size: 14px;
    }
    .status-menu-item + .status-menu-item {
      margin-left: 0;
    }
  }
  
  .status-img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
    margin-right: 20px;
  }
  
  .status-main {
    padding: 0 20px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #272a3a;
    padding-bottom: 20px;
    flex-wrap: wrap;
  }
  
  .status-textarea {
    flex-grow: 1;
    background-color: transparent;
    border: none;
    resize: none;
    margin-top: 15px;
    color: #fff;
    max-width: calc(100% - 70px);
  }
  .status-textarea::placeholder {
    color: #5c5d71;
  }
  
  .status-actions {
    display: flex;
    padding: 10px 20px;
  }
  
  .status-action {
    text-decoration: none;
    color: #ccc8db;
    margin-right: 20px;
    display: flex;
    align-items: center;
  }
  .status-action svg {
    width: 16px;
    flex-shrink: 0;
    margin-right: 8px;
  }
  @media screen and (max-width: 1320px) {
    .status-action {
      width: 16px;
      overflow: hidden;
      color: transparent;
      white-space: nowrap;
    }
  }
  
  .status-share {
    background-color: #1b86f9;
    border: none;
    color: #fff;
    border-radius: 4px;
    padding: 10px 20px;
    margin-left: auto;
    box-shadow: 0 0 20px #1b86f9;
    cursor: pointer;
  }
  
  .album {
    padding-top: 20px;
    margin-top: 20px;
  }
  .album .status-main {
    border: none;
    display: flex;
  }
  .album .intro-menu {
    margin-bottom: auto;
    margin-top: 5px;
  }
  
  .album-detail {
    width: calc(100% - 110px);
  }
  
  .album-title span {
    color: #1771d6;
    cursor: pointer;
  }
  
  .album-date {
    font-size: 15px;
    color: #595c6c;
    margin-top: 4px;
  }
  
  .album-content {
    padding: 0 20px 20px;
  }
  
  .album-photo {
    width: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 4px;
    margin-top: 10px;
  }
  
  .album-photos {
    display: flex;
    margin-top: 20px;
    max-height: 30vh;
  }
  
  .album-photos > .album-photo {
    width: 50%;
  }
  
  .album-right {
    width: 50%;
    margin-left: 10px;
    line-height: 0;
    display: flex;
    flex-direction: column;
  }
  .album-right .album-photo {
    height: calc(50% - 10px);
  }
  
  .album-actions {
    padding: 0 20px 20px;
  }
  
  .album-action {
    margin-right: 20px;
    text-decoration: none;
    color: #a2a4b4;
    display: inline-flex;
    align-items: center;
    font-weight: 600;
  }
  .album-action:hover {
    color: #fff;
  }
  .album-action svg {
    width: 16px;
    margin-right: 6px;
  }
  
  .account-button {
    border: 0;
    background: 0;
    color: #64677a;
    padding: 0;
    cursor: pointer;
    position: relative;
  }
  
  .account-button svg {
    width: 20px;
  }
  
  .account-button:not(.right-side-button) + .account-button:before {
    position: absolute;
    right: 0px;
    top: -2px;
    background-color: #1b86f8;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    content: "";
    border: 2px solid #151728;
  }
  
  .account-profile {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    margin: 0 10px;
  }
  
  .account-user {
    display: inline-flex;
    align-items: center;
    color: #64677a;
    font-weight: 600;
  }
  .account-user span {
    font-size: 10px;
    font-weight: normal;
  }
  
  .account {
    height: 60px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    position: sticky;
    top: 0;
    background-color: #151728;
    z-index: 3;
    flex-shrink: 0;
  }
  
  .stories {
    border-bottom: 1px solid #272a3a;
  }
  
  .stories .user-img {
    border: 2px solid #e2b96c;
  }
  
  .stories .album-date {
    font-family: "Source Sans Pro", sans-serif;
  }
  
  .user-status {
    background-color: #7fd222;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-left: auto;
  }
  .user-status.offline {
    background-color: #606a8d;
  }
  .user-status.idle {
    background-color: #dd1c20;
  }
  
  .contacts .username {
    display: flex;
    flex: 1;
    align-items: center;
  }
  
  .right-search svg {
    width: 16px;
    height: 16px;
  }
  
  .right-search {
    padding-right: 10px;
    display: flex;
    align-items: center;
    border-top: 1px solid #272a3a;
    position: sticky;
    bottom: 0;
    margin-top: auto;
  }
  
  .right-search input {
    padding-right: 10px;
  }
  
  .search-bar-svgs {
    color: #656679;
    display: flex;
  }
  
  .search-bar-svgs svg {
    margin-right: 16px;
  }
  
  .overlay {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(36, 39, 59, 0.8);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: 0.3s;
  }
  @media screen and (max-width: 1210px) {
    .overlay.active {
      z-index: 3;
      opacity: 1;
      visibility: visible;
      pointer-events: all;
    }
  }
  
  .right-side-button {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    border: 0;
    width: 52px;
    background-color: #1e2031;
    border-left: 1px solid #272a3a;
    color: #fff;
    display: none;
    cursor: pointer;
  }
  .right-side-button:before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    background-color: #1b86f8;
    border: 2px solid #1e2031;
    top: 13px;
    right: 12px;
  }
  .right-side-button svg {
    width: 22px;
  }
  @media screen and (max-width: 1210px) {
    .right-side-button {
      display: block;
    }
  }
  
  .left-side-button {
    display: none;
  }
  @media screen and (max-width: 930px) {
    .left-side-button {
      display: flex;
      flex-shrink: 0;
      align-items: center;
      justify-content: center;
      position: relative;
      cursor: pointer;
      height: 60px;
      background-color: rgba(39, 42, 58, 0.5);
      border: 0;
      padding: 0;
      line-height: 0;
      color: #fff;
      border-bottom: 1px solid #272a3a;
    }
    .left-side-button svg {
      transition: 0.2s;
      width: 24px;
    }
    .left-side-button svg:last-child {
      position: absolute;
      left: 50%;
      transform: translate(100%, -50%);
      top: 50%;
      opacity: 0;
    }
  }
  
  @media screen and (max-width: 700px) {
    .profile-avatar {
      top: -25px;
      left: 50%;
      transform: translatex(-50%);
      align-items: center;
      flex-direction: column;
      justify-content: center;
    }
  
    .profile-img {
      height: 100px;
      width: 100px;
    }
  
    .profile-name {
      margin: 5px 0;
    }
  
    .profile-menu {
      padding-left: 0;
      width: 100%;
      overflow: auto;
    }
  
    .profile-menu-link {
      padding: 12px;
      font-size: 15px;
    }
  }
  .pimg {
    pointer-events: none;
    position: relative;
    transform: translateY(20px) scale(1.15);
    transform-origin: 50% bottom;
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  

  
.ui-header {
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    background: transparent;
  }

  .ui-header {
    height: 50px;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-direction: row;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
            align-items: center;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    box-shadow: 0 0.3rem 0.5rem rgba(0, 0, 0, 0.1);
  }
  
.ui-filter {
    color: rgb(0, 174, 255);
    display: inline-block;
    font-size: 1 em;
    font-weight: 500;
    text-transform: uppercase;
    padding: 0 1rem;
    -webkit-transition: color 0.6s ease;
    transition: color 0.6s ease;
  }
  .ui-filter:after {
    content: '';
    display: inline-block;
    border: .3rem solid transparent;
    top: .15rem;
    border-top-color: rgb(112, 17, 17);
    margin-left: 1ch;
  }
  .ui-filter + .ui-filter {
    border-left: 1px solid rgb(195, 209, 208);
  }

  
.gavatar {
    padding: 0;
    display: inline-block;
    width: 100px;
    top: .15rem;
    height: 100px;
    border-radius: 50%;
    z-index:300000;
  }
  
  .gavatar .icon{
    width: 80%;
    height: 80%;
    border-radius: 50%;
    background-color: rgb(111, 143, 245);
    border: .1rem solid transparent;
  }
  
#login, #register{
	display: none;
}
#login{
	display: initial;	
}


.card-footer {
    margin-top: 1.25rem;
    border-top: 1px solid #ddd;
    padding: 1.25rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }
.icon-button {
    border: 0;
    background-color: #fff;
    border-radius: 50%;
    width: 2.56rem;
    height: 2.56rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    font-size: 2.55rem;
    transition: 0.25s ease;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 3px 8px 0 rgba(0, 0, 0, 0.15);
    z-index: 1;
    cursor: pointer;
    color: #565656;
  }
  .icon-button svg {
    flex-shrink: 0;
    width: 1em;
    height: 1em;

  }
  .icon-button svgtxt {
    flex-shrink: 0;
    width: 1em;
    height: 1.3em;
    font-size: 13.5px;

  }
  .icon-button:hover, .icon-button:focus {
    background-color: #EC4646;
    color: #FFF;
  }
  
.card-meta {
    display: flex;
    align-items: center;
    color: #787878;
    margin-left: 2rem;
    padding-left: 1.5rem;

  }
  .card-meta:first-child:after {
    display: block;
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: currentcolor;
    margin-left: 0.75rem;
    margin-right: 0.75rem;
  }
  .card-meta svg {
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    margin-right: 0.25em;
  }


.post-icons{
    display: flex;
    justify-content: space-between;
    padding: 5px 10px;
}

.post-icons .icons{
    height: 25px;
    width: 25px;
}

.post-icons ul{
    display: flex;
    justify-content: space-between;
    list-style: none;
    width: 20%;
}


.iform{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.iform img{
    background-color: white;
    height: 25px;
    cursor: pointer;
}

.text form input{
    width: 98%;
    height: 30px;
    border: none;
    outline: none;
    color: rgb(0, 0, 0);
    background: rgb(255, 255, 255);
    border: 1px;
    border-radius: 30px;
}

.text form button{
    border: none;
    background: transparent;
    position: absolute;
justify-content: right;
right: 27px;
}

.round-button {
    height: 4.4rem;
    width: 4.4rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--grey-900);
    transition: color 0.2s ease-in-out;
  }
  
  .round-button:hover,
  .round-button.active {
    color: var(--round-button-active-color);
  }
  
  .round-button svg {
    pointer-events: none;
    height: 2.8rem;
    width: 2.8rem;
    transform: translate(0, 0);
  }
  .content-tabs{
    display: flex;
    padding: 1rem;
    font-size: 12px;
    font-weight: 600;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #dddddd;
}

.content-tabs .tabs{
    margin: 0 2.4rem; 
    position: relative;
}

.content-tabs .tabs:nth-child(1)::before{
    left: 0;
    content: '';
    width: 60px;
    height: .1px;
    top: -16.99px;
    position: absolute;
    background: #262626;
}

.content-tabs .tabs a{
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-color);
}

.content-tabs .tabs svg{
    width: 12px;
    height: 12px;
}

.content-tabs .tabs svg.posts{
    fill:  #262626;
}

.content-tabs .tabs svg.tagged,
.content-tabs .tabs:nth-child(2) .tab-text{
    fill:  #8e8e8e;
    color: #8e8e8e;
}

.tab-content{
    display: flex;
    align-items: center;
}

.tab-text{
    margin-left: 6px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* ====== RESPONSIVE ====== */
@media (max-width: 700px){
    .content-tabs{
        padding: 10px;
        justify-content: space-around;
    }
    .content-tabs .tabs{
        margin: 0;
    }
    .content-tabs .tabs svg.posts{
        fill: #0095f6;
    }
    .content-tabs .tabs:nth-child(1)::before{
        display: none;
    }
    .content-tabs .tabs svg{
        width: 24px;
        height: 24px;
    }
    .tab-text{
        margin: 0;
        display: none;
    }
}