/*Style Listed For zelussydney*/
/*Base Structure*/
.site_wrapper {width: 100%;  margin: 0 auto 0 auto;}




body{}
p{ letter-spacing: 1px;    color: #000;}
h1, h2,h3,h4{font-family: 'Roboto', sans-serif;}

h1 {
    font-size: 40px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    text-transform: capitalize;
}
.btn { border-radius: 0;
    overflow: visible;
    border: solid 1px #696868;
    background-color: #000;
    padding: 10px 17px;
    transition: ease-in-out .5s;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-top: 11px;
    font-size: 17px;
}


/*-------------------*/
/*header-top-area*/
/*-------------------*/

#header-top-area{ width: 100%; float: left; position: relative; padding: 0; background-color: #000; clear: both;}
#header-top-area p{ font-size: 12px;
    color: #fff;
    letter-spacing: 0;
    margin: 7px 0;
    font-weight: 600;}
#header-top-area  li .currency-picker {    min-width: 60px;
    background-color: #000 !important; padding: 1px 10px;
    border: none;}
#header-top-area ul{ display: inline-block; float: left; padding: 0; width: 100%; text-align: right;}
#header-top-area .logo-area{width: auto;
    float: left;
    position: absolute;
    top: 12px;
    background-color: #fff;
    z-index: 99;
    padding: 6px 10px;
    border-radius: 0;
    box-shadow: 0 -2px 5px 1px #00000030;}
#header-top-area .logo-area img{margin-top: 8px;}
#header-top-area ul li{ display: inline-block; padding: 0 5px;}
#header-top-area ul li a{color: #fff;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;}
#header-top-area  sup, sub { font-size: 9px;
    height: 4px;
    line-height: 1;
    position: relative;
    vertical-align: baseline;
    background-color: #fff;
    padding: 0 2px;
    border-radius: 50px;
    color: #000000;
}
#header-top-area  .search-area{ width: 100%; float: left; text-align:right; position: relative;    margin-top: 0;
    padding: 7px 0; }
#header-top-area  .search-area ul li { margin-right: 4px;    color: #fff;
    text-align: center;
}
#header-top-area .login-area{ width: 100%; float: left; padding: 0;    margin-top: 8px;}
#header-top-area .login-area ul li a{color: #fff;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 800;
    border-right: solid 2px #79797b;
    padding-right: 11px;}
#header-top-area .login-area .fa{
    color: #f5b567;}
#header-top-area  .search-area ul li a{ color: #fff;}



/* Full screen search*/
#search .search-area{ width: 37%;
    float: none;
    margin: 0 auto;
    background-color: #fff;
    padding: 20px;}
#search{
    position:fixed;
    width: 100vw;
    height: 0;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all .5s;
    will-change: transform, opacity;
    z-index: -1;
}

#searchbox{ height: 2rem;
    width: 100%;
    background-color: #fff;
    border: solid 1px #bfbcbc;
    color: #000;
    flex: 1 0 auto;
    font-size: 14px;
    outline: 0;
    padding: 20px;
}

#close-btn{ color: #fff;
    position: relative;
    right: 0;
    top: -20px;
    left: 20px;
    float: right;
    background-color: #000;
    padding: 10px;
    text-align: center;
    width: 10%;
}

#search:target{
    height: 100vh !important;
    width: 100% !important;
    opacity: 1;
    z-index: 999;
}

/* other directions */

#search.bottom{
    bottom:0;
}

#search.left{
    left: 0;
    height: 100vh;
    width:0;
}

#search.right{
    height: 100vh;
    width:0;
    right:0;
}

#search.bottom.left, #search.bottom.right, #search.top.left, #search.top.right{
    height: 0;
}

#search.fade{
    height: 100vw;
    width: 100vw;
    transition: opacity .5s ;
}
#search-button {
    position: absolute;
    top: 0;
    right: 0;
    height: 4.7em;
    width: 100px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    line-height: 42px;
    border-width: 0;
    background-color: #4d90fe;
    -webkit-border-radius: 0 2px 2px 0;
    -moz-border-radius: 0 2px 2px 0;
    border-radius: 0 2px 2px 0;
    cursor: pointer;
}




@media (min-width: 768px) and ( max-width: 991px){#header-top-area ul li {
    display: inline-block;padding: 0 2px !important;
    float: right;
}
    #close-btn{ width: 20%;}}


@media (max-width: 768px){#header-top-area .search-area {
    width: 100%;
}

    #header-top-area .social-area {
        margin-top: 10px;
		
    }
    #header-top-area ul {
        text-align:center;
    }
    #header-top-area ul li {
        display: inline-block;
        padding: 0;
    }
    #header-top-area p {    margin-bottom: 0;
        font-size: 9px;}
    #header-top-area .search-area { padding: 0 0 5px 0;
    }
}



/*-------------------*/
/*header-top-area2*/
/*-------------------*/
#header-top-area2{ width: 100%; float: left; position: relative; padding: 10px 0; background-color: #fff;clear: both;
    box-shadow: 0 1px 4px #00000040;}


#header-top-area2  .search-area{ width: 100%; float: left; text-align:right; position: relative;    margin-top: 0;
    padding: 7px 0; }
#header-top-area2  .search-area ul li { margin-right: 4px;
    text-align: center;
}
#header-top-area2  .search-area ul li a{ color: #fff;}








#header-top-area2  .navbar-default {width: 100%; float: left; background-color: rgba(248, 248, 248, 0);
    border-color: transparent;    margin-bottom: 0; }

#header-top-area2   .navbar-brand { float: left; height:0; padding: 0 20px;  font-size: 18px;  line-height: 20px;
    margin-left: 0;}

#header-top-area2   .navbar-default .navbar-nav>li>a {font-size: 12px;
    font-weight: 500;    color: #000;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: none;
    padding: 0 12px;}

#header-top-area2  .dropdown-menu {
    padding: 0;
    margin: 0;
    font-size: 14px;}
#header-top-area2  .dropdown-menu>li>a {
    display: block; color: #000;
    clear: both;
    line-height: 1.42857143;    border-bottom: solid 1px #eee;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 500;
    text-transform: capitalize;
    letter-spacing: 1px;
    text-shadow: none;
    padding: 6px 12px;
}
#header-top-area2 .btn:hover{ background-color: transparent; color: #fff; border: solid 1px #fff; border-radius: 0;}
#header-top-area2  .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{ color: #000 !important;}
#header-top-area2   .navbar-right {float: right!important; margin-right: 0;  }
#header-top-area2   .navbar-nav>li {
    padding: 15px 0 10px 0;}
#header-top-area2   .navbar-brand-centered {position: absolute; left: 0; right: 0; display: block; text-align: center;
    width: 100%; background-color: transparent;  margin: 0 auto;  }

#header-top-area2   .navbar-brand>img {display: block;  margin: 0 auto !important; float: none;
    padding-top: 0;}
#header-top-area2  .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default
.navbar-nav>.open>a:hover {
    color: #555;
    background-color: transparent;
}

@media (min-width: 320px) and (max-width: 767px){#header-top-area2 {position: relative; z-index: 9;}
    #header-top-area2 .navbar {position: relative; min-height: 50px; margin-bottom: 0; width: 100%; float: left;}

    #header-top-area2 .navbar-right {float: left !important; margin-right: 0;  }
    .navbar-default .navbar-collapse, .navbar-default .navbar-form { margin-top: 10px;
        position: absolute;
        width: 100%;
        background-color: #eee;}
}

@media (min-width: 768px) and (max-width: 991px){#header-top-area2 .navbar-default .navbar-nav>li>a {font-size: 14px;
    letter-spacing: 0;}}







/*--------------------*/
/*banner-area*/
/*--------------------*/

#banner-area{ width: 100%; float: left; padding: 0; clear: both;}
#banner-area img{ width: 100%;}
#banner-area  .caption-area{ width: 100%; float: left; padding: 0; clear: both; position: relative;
    bottom: 2em;}



#banner-area  .caption-area .inner{background-color: #0000001f;
    position: absolute;
    width: 50%;
    float: left;
    bottom: 32em;
    padding: 11px;}
@media( max-width: 767px){#banner-area .caption-area .inner {
    bottom: -20em; width: 100%;
}}



#banner-area  .caption-area h3 {font-size: 20px;
    line-height: 30px;
    margin-bottom: 5px;
    font-style: normal;
    font-weight: 600;
    color: #131212;
    letter-spacing: 1px;
    text-transform: uppercase;
}
#banner-area  .btn.focus, .btn:focus, .btn:hover {
    color: #fff;
    text-decoration: none;
    background-color: transparent;
}
#banner-area  .caption-area ul{ width: 100%;
    float: left;
    text-align: center;
    padding: 29px 0;}
#banner-area  .caption-area ul li { border-right: dashed 2px #ffffff61;
    list-style: none;    width: 49%;
    display: inline-block;
}
#banner-area  .caption-area ul li:last-child { border-right: none;}

#banner-area  .caption-area p{ font-size: 12px;
    color: #000;
    letter-spacing: 1px;}

@media ( max-width: 767px){#banner-area .caption-area {bottom: 21.9em;}
 #banner-area .caption-area h3 {  font-size: 15px;  margin-bottom: 0;  letter-spacing: 2px;    color: #fff;}
    #banner-area .caption-area p {  font-size: 13px;  letter-spacing: 0;  width: 100%;     line-height: 18px; padding: 1px 0;}
    #banner-area button {
        padding: 3px 13px;
        letter-spacing: 3px;
        margin-top: 3px;
        font-size: 9px;
    }
    #banner-area .btn { padding: 4px 3px;
        letter-spacing: 1px;
        margin-top: 3px;
        font-size: 9px;
    }
    #banner-area .caption-area ul {
         padding: 5px 0;
     }
}
@media (min-width: 768px) and (max-width: 991px){#header-top-area {
    padding: 6px;
}
    #banner-area .caption-area {bottom: -21em;
}
    #banner-area .caption-area h3 {
        font-size: 18px;}
    #banner-area .caption-area ul {
        padding: 15px 0;
    }
 #banner-area .caption-area p {  font-size: 14px;  letter-spacing: 2px;  width: 100%; }}
@media (min-width: 992px) and (max-width: 1199px){#banner-area .caption-area {
    bottom: -15em;
}}



/*--------------------*/
/*about-us*/
/*--------------------*/

#about-us{ width: 100%; float: left; padding: 80px 0; position: relative; clear: both; text-align: center;}
#about-us img{ width: 100%;}
#about-us h1{ text-align: center; font-size: 27px; margin: 30px 0;}
#about-us h1 span{
    color: #6f696c;}
#about-us p{ font-weight: 800;
    font-size: 16px}
#about-us  .btn:hover{ background-color: transparent; color: #000; border: solid 1px #000; border-radius: 0;}
#about-us  img{ width: 100%; height: 100%;}





/*--------------------*/
/*chart-area*/
/*--------------------*/

#chart-area{ width: 100%; float: left; padding:0; position: relative; clear: both; text-align: center;}








/*--------------------*/
/*featured-products*/
/*--------------------*/

#featured-products{ width: 100%; float: left; padding: 60px 0; position: relative; clear: both;}
#featured-products  h1{ text-align: center;
    font-size: 20px;
    border: solid 1px #000;
    width: 30%; color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 2px 0;
    letter-spacing: 1px;}

#featured-products .main-area{ width: 100%; float: left; position: relative;
    padding:0;}
#featured-products .main-area  .snip1583 {
    font-family: 'Fira Sans Extra Condensed', Arial, sans-serif;
    position: relative;
    overflow: hidden;
    font-size: 16px;
    background-color: #fff;
    color: #111;
    line-height: 1.2em;
    text-align: center;
}
#featured-products .main-area  .snip1583 img{ margin: 0 auto;}
.mr-bt{ margin-bottom: 40px;}
#featured-products .main-area  .snip1583 *,
.snip1583 *:before,
.snip1583 *:after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.35s ease;
    transition: all 0.35s ease;
}

#featured-products .main-area  .snip1583 img {
    max-width: 100%;
    vertical-align: top;
}

#featured-products .main-area .snip1583 figcaption {
    padding: 10px;
    text-align: center;
}

#featured-products .main-area  .snip1583 h3 {
    font-size: 14px;
    font-weight: 400;
    margin:0;
}

#featured-products .main-area .snip1583 .price { margin: 0;
    font-weight: 500;
    color: #252422;
    font-size: 13px;
}

#featured-products .main-area  .snip1583 .icons {
    position: absolute;
    z-index: 9;
    bottom: 10em;
    left: 0;
    right: 0;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

#featured-products .main-area  .snip1583 .icons a {
    opacity: 0;
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
}

#featured-products .main-area  .snip1583 .icons a{
    display: block;
    line-height: 34px;
    width: 100%;
    font-size: 16px;
    background-color: #000;
    text-align: center;
    color: #fff;
}

#featured-products .main-area  .snip1583 .icons a:hover { background-color: #000;
    color: #fff;
    cursor: pointer;
}

#featured-products .main-area  .snip1583:hover a,
.snip1583.hover a {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

#featured-products .main-area  .snip1583:hover a:nth-child(2),
.snip1583.hover a:nth-child(2) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

#featured-products .main-area  .snip1583:hover a:nth-child(3),
.snip1583.hover a:nth-child(3) {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}








/* ===============================================
// Reveal module
// =============================================== */

#featured-products   .reveal .hidden { display: block !important; visibility: visible !important;}
#featured-products   .product-index:hover .reveal img { opacity: 1; }
#featured-products   .reveal { position: relative; }

#featured-products   .reveal .hidden {
    position: absolute;
    z-index: -1;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}
#featured-products   .reveal:hover .hidden {
    z-index: 1;
    opacity: 1;
}
#featured-products   .product{ width: 100%;
    float: left;
    position: relative;}
























.product_view .modal-dialog{max-width: 800px; width: 100%;}
.pre-cost{text-decoration: line-through; color: #a5a5a5;}
.space-ten{padding: 10px 0;}

.modal-body  .carousel {
    margin-top:0;
}
.modal-body   .item .thumb {
    width: 25%;
    cursor: pointer;
    float: left;
}
.modal-body  .item .thumb img {
    width: 97%;
    margin: 2px;
    background-color: #dedada;
    float: left;
}
.modal-body   .item img {
    width: 100%;
}

.modal-body   .area-image {
    width: 100%;
    height: 100%;
}

.modal-body  .carousel-control.left{ background:0;}
.modal-body  .carousel-control.right{ background:0;}

.modal-body   .carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.modal-body  .btn {
    border-radius: 0;
    overflow: visible;
    border: solid 1px #696868;
    background-color: #000;
    padding: 9px 10px;
    transition: ease-in-out .5s;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0;
    margin-top: 11px;
    font-size: 14px;
    width: 100%;
}
.modal-body .qyt-area > div {
    width: 100%;
    display: inline-flex;
    float: left;
    margin: 20px 0;
}
.modal-body  .btn-minus { cursor: pointer;
    font-size: 7px;
    display: flex;
    align-items: center;
    padding: 5px;
    padding-left: 16px;
    padding-right: 16px;
    border: 1px solid #dedede;
    border-radius: 2px;
    border-right: 0;
    background-color: #d8d5d5;
}
.modal-body .qyt-area > div > input {
    margin: 0;
    padding-left: 5px;
    font-size: 10px;
    padding-right: 5px;
    max-width: 15%;
    text-align: center;
    border: solid 1px #dedede;
    background-color: transparent;
}
.modal-body  .btn-plus {
    cursor: pointer;
    font-size: 7px;
    display: flex;
    align-items: center;
    padding: 5px;
    padding-left: 16px;
    padding-right: 16px;
    border: 1px solid #dedede;
    border-radius: 2px;
    border-left: 0;
    background-color: #d8d5d5;
}
.modal-dialog {
    position: relative;
    width: auto;
    margin: 0 auto;
}
.modal-body   label{    text-transform: uppercase;
    min-width: 82px;
    display: inline-block;
    float: left;
    line-height: 42px;}
.modal-body  .form-control {    display: inline-block;
    width: 71%;
    border-radius: 0;
    text-align: left;
    float: left;}
.modal-body .product_content h4 {
    font-size: 18px;
    line-height: 25px;
    margin-bottom: 5px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: 1px;
}
.modal-body .product_content h3{    font-size: 18px;
    font-weight: 600;
}
.modal-body p{ margin: 20px 0;
    letter-spacing: 0;
    font-size: 11px;
    line-height: 17px;}
.modal-body  .select{width: 100%;
    float: left;
    margin-top: 26px;}

.modal-body  .text{font-size: 11px;
    color: #000;}

.modal-body .share-area{ width: 100%; float: left; margin-top: 20px;}
.modal-body .share-area a{ font-size: 11px;
    color: #000;
    padding-right: 10px;}



.modal-header {
    padding: 0;
    border-bottom: none;
}
.modal-header .cross-area-modal{ padding: 10px;
    background-color: #000;
    color: #fff;}


.modal-body .share-area ul li{ display: inline-block;}


@media( max-width: 767px){#featured-products h1 {
    text-align: center;
    font-size: 20px;
    border: solid 1px #000;
    width: 74%;}}


/*--------------------*/
/*instagram*/
/*--------------------*/

#instagram{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#instagram h1{ text-align: center;
    font-size: 20px;
    border: solid 1px #000;
    width: 25%; color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 2px 0;
    letter-spacing: 1px;}
#instagram .image-area{ width: 100%; float: left; position: relative; margin: 40px 0 0 0;
    border-bottom: solid 1px #adabab;}

#instagram .image-area img {    opacity: 0.6;
    filter: gray;
    -webkit-filter: grayscale(100%);
}

#instagram .image-area img:hover {opacity: 1;
    filter: none; /* IE6-9 */
    -webkit-filter: grayscale(0); /* Google Chrome, Safari 6+ & Opera 15+ */

}
#instagram .image-area .col-lg-2{ padding-right: 0;
    padding-left: 0;}



@media( max-width: 767px){#instagram h1{
    width: 82%;}}
@media( min-width: 768px) and ( max-width: 991px){
#instagram h1 {
    width: 42%;}}







/*-----------------------*/
/*footer*/
/*-----------------------*/
.footer { width: 100%;
    float: left;    background-color: #eee;
    padding: 20px 0;
    color: #878c94;
}
.footer  h2 {text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
    color: #000;
    letter-spacing: 1px;
    border-bottom: solid 1px #c7bec2;
}
.footer .title{
    text-align: left;
    color:#fff;
    font-size:25px;
}
.footer p{ color: #000; font-weight: 800;}
.footer .social-icon{
    padding:0;
    margin:0;
}
.footer .social-icon a{
    display:inline-block;
    color:#000;
    font-size:25px;
    padding:5px;
}
.footer .acount-icon a{
    display: block;
    color: #000;
    padding: 0 5px;
    font-size: 12px;
    margin: 0;
    text-transform: capitalize;
}
.footer .acount-icon .fa{
    margin-right:25px;
}
.footer .category a {
    text-decoration: none;
    color: #000;
    display: inline-block;
    padding: 5px 20px;
    margin: 1px;
    border-radius:4px;
    margin-top: 6px;
    background-color: black;
    border: solid 1px #fff;
}
.footer .payment{
    margin:0;
    padding:0;
    list-style-type:none
}
.footer .payment li{
    list-style-type:none
}
.footer .payment li a {
    text-decoration: none;
    display: inline-block;
    color: #fff;
    float: left;
    font-size: 20px;
    padding: 10px 2px;
}

.footer  .social-area{ width: 100%; float: left; text-align:right; position: relative;     margin-top: 12px;padding: 0;}
.footer  .social-area ul{ width: 100%;
    float: left;
    text-align: left;}
.footer  .social-area ul li { margin-right: 4px; width: 25px; display: inline-block; list-style-type: none;
    text-align: center;
    border: solid 1px #000;}
.footer  .social-area ul li .fa{ margin-top: 9px;}

.footer a{ color: #000;}





.footer .formnewsletter {
    width: 100%;
    float: left;
    padding: 5px;
    background-color: #fff;
}
.footer  .formnewsletter fieldset {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
    border: 0;
    position: relative;
}
.footer fieldset .form-control {
    border: 0;
    z-index: 1;
    width: 100%;
    float: left;
    height: 38px;
    line-height: 38px;
    position: relative;
    padding: 0;
}
.mr-b{ border-bottom: solid 1px #bdb8b8;
    padding-bottom: 20px;}
.footer  .form-control:focus{ outline: 0; border: none; box-shadow: none;}
.footer  fieldset button { right: 0;
    width: 25%;
    float: left;
    z-index: 2;
    height: 38px;
    color: #fff;
    font-size: 12px;
    line-height: 34px;
    text-align: center;
    background-color: #000;
    position: absolute;
    text-transform: uppercase;
    border: solid 1px #000;
}


.footer  .bottom-area{text-align: center;}

.footer  .bottom-area a {
    color: #000;
    font-size: 11px;
    letter-spacing: 2px;
}
.footer  .bottom-area .social-area-bottom{ width: 100%; float: left;}
.footer  .bottom-area .social-area-bottom ul li{ display: inline-block; width: 6%;}
.footer  .bottom-area .social-area-bottom ul li .fa{font-size: 26px;}

.footer  .bottom-area .payment-area{ width: 100%; float: left; position: relative; padding: 0; margin: 19px 0 10px 0;}
.footer  .bottom-area .payment-area ul li{ display: inline-block;}
.footer  .bottom-area .payment-area  img {
    max-width: 50px;
    display: inline-block;
}







/*--------------------*/
/*inner-page1*/
/*--------------------*/

#inner-page1{ width: 100%; float: left; padding: 25px 0; position: relative; clear: both; text-align: center;}
#inner-page1 .breadcrumb li a{ font-size: 10px; color: #000; text-transform: uppercase;}
#inner-page1 .breadcrumb>.active { font-size: 10px; color: #000; text-transform: uppercase;}
#inner-page1 .breadcrumb {
    padding: 8px 15px;
    margin-bottom: 0;}







/*--------------------*/
/*account-page*/
/*--------------------*/

#account-page{ width: 100%; float: left; padding:0 0 80px 0; position: relative; clear: both; text-align: center;}
#account-page .left-area{ width:100%; float: left; margin-bottom: 10px;
    padding: 10px; background-color: #eee; position: relative;}
#account-page  h1{
    font-size: 18px; margin-bottom: 20px;
    font-weight: 700;
    color: #000;
    letter-spacing: 1px;}

#account-page

{ font-size: 13px;
    font-weight: 400;
    text-align: left;
    color: #000;
    float: left;}

#account-page .btn {
    font-size: 12px;
    width: 100%;
}
#account-page .btn:hover{ color: #000;}
#account-page .password-area {
    float: left;
    color: #000;
    font-size: 12px;
}
#account-page .form-control {
    display: block;    border: 1px solid #e0e0e0;
    width: 100%;
    height: 43px;}


#account-page .right-area{ float: left; width:100%;
    padding: 10px; background-color: #eee; position: relative;}




/*--------------------*/
/*product-page*/
/*--------------------*/

#product-page{ width: 100%; float: left; padding:0 0 80px 0; position: relative; clear: both; text-align: center;}
#product-page .main-area{ width: 100%; float: left; position: relative; border-top: solid 1px #e0dfdf;
    padding:0;}
#product-page h1 {
    text-align: center;
    font-size: 20px;
    width: 30%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 2px 0;
    letter-spacing: 1px;
}
#product-page .main-area  .snip1583 {
    font-family: 'Fira Sans Extra Condensed', Arial, sans-serif;
    position: relative;
    overflow: hidden;
    font-size: 16px;
    background-color: #fff;
    color: #111;
    line-height: 1.2em;
    text-align: center;
}
#product-page .main-area   .snip1583 img{ margin: 0 auto;}
.mr-bt{ margin-bottom: 40px;}
#product-page .main-area   .snip1583 *,
.snip1583 *:before,
.snip1583 *:after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.35s ease;
    transition: all 0.35s ease;
}

#product-page .main-area   .snip1583 img {
    max-width: 100%;
    vertical-align: top;
}

#product-page .main-area .snip1583 figcaption {
    padding: 10px;
    text-align: center;
}

#product-page .main-area  .snip1583 h3 {
    font-size: 14px;
    font-weight: 400;
    margin:0;
}

#product-page .main-area .snip1583 .price { margin: 0;
    font-weight: 500;
    color: #252422;
    font-size: 13px;
}

#product-page .main-area   .snip1583 .icons {
    position: absolute;
    z-index: 9;
    bottom: 10em;
    left: 0;
    right: 0;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

#product-page .main-area    .snip1583 .icons a {
    opacity: 0;
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
}

#product-page .main-area   .snip1583 .icons a{
    display: block;
    line-height: 34px;
    width: 100%;
    font-size: 16px;
    background-color: #000;
    text-align: center;
    color: #fff;
}
#product-page .main-area    .snip1583 .icons a:hover { background-color: #000;
    color: #fff;
    cursor: pointer;
}

#product-page .main-area   .snip1583:hover a,
.snip1583.hover a {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

#product-page .main-area .snip1583:hover a:nth-child(2),
.snip1583.hover a:nth-child(2) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

#product-page .main-area  .snip1583:hover a:nth-child(3),
.snip1583.hover a:nth-child(3) {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

#product-page   .reveal .hidden { display: block !important; visibility: visible !important;}
#product-page   .product-index:hover .reveal img { opacity: 1; }
#product-page   .reveal { position: relative; }

#product-page   .reveal .hidden {
    position: absolute;
    z-index: -1;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}
#product-page   .reveal:hover .hidden {
    z-index: 1;
    opacity: 1;
}
#product-page  .product{ width: 100%;
    float: left;
    position: relative;}
#product-page  .pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    font-size: 11px;
    margin-left: 0;
    color: #000000;
    background-color: #fff;
    border: 1px solid #ddd;
}


/*--------------------*/
/*product-detail*/
/*--------------------*/

#product-detail{ width: 100%; float: left; padding:0 0 80px 0; position: relative; clear: both; text-align: center;}
#product-detail  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#product-detail  h1 {
    font-size: 18px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 400;
    text-transform: capitalize;
}
#product-detail .product_content{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#product-detail .product_content h4 {
    font-size: 18px;
    line-height: 25px;
    margin-bottom: 5px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: 1px;
}
#product-detail    .product_content h3{    font-size: 18px;
    font-weight: 600;
}
#product-detail .product_content  p{ margin: 10px 0;
    text-align: left;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 13px;}
#product-detail .product_content  .select{width: 100%;
    float: left; display: flex;
    margin-top: 26px;}
#product-detail .product_content  .select .form-control { border-radius: 0;
    display: block;
    width: 30%;}
#product-detail .product_content .btn-primary{    width: 100%; margin-bottom: 10px;
    font-size: 11px;
    letter-spacing: 1px;}
.btn-primary:active:focus{    color: #fff;
    background-color: #212121;
    border-color: #212121;}

#product-detail .product_content .btn-primary:hover{ color: #000;}

#product-detail .product_content  .area1{ margin-top: 20px;}
#product-detail .product_content  .area1 li{ font-size: 11px;
    color: #000;
    text-align: left;}
#product-detail .product_content    .text{font-size: 11px;
    color: #000;}

#product-detail .product_content .share-area{ width: 100%; float: left; margin-top: 20px; text-align: left;}
#product-detail .product_content  .share-area a{ font-size: 11px;
    color: #000;
    padding-right: 10px;}



#product-detail .product_content  .share-area ul li{ display: inline-block;}
#product-detail .product_content  .qyt-area{
    width: 100%; display: flex;
    float: left;
    margin: 20px 0;
}

#product-detail .product_content  .qyt-area  input[type="number"] { display: inline-block;
    text-align: center;
    border: solid 1px #a9a9a9;
    width: 59px;
    height: 28px;
    border-radius: 0;
    padding: 0;
}

#product-detail .product_content  label{ float: left;
    text-align: left;
    min-width: 76px;}




#product-detail   .carousel {
    margin-top:0;
}
#product-detail   .item .thumb {
    width: 25%;
    cursor: pointer;
    float: left;
}
#product-detail  .item .thumb img {
    width: 60%;
    margin: 2px;
    background-color: #dedada;
    float: left;
}
#product-detail   .item img {
    width: 50%;
    margin: 0 auto;
}

#product-detail   .area-image {
    width: 100%;
    height: 100%;
}

#product-detail  .carousel-control.left{ background:0;}
#product-detail   .carousel-control.right{ background:0;}

#product-detail    .carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
}





/*--------------------*/
/*terms-and-conditions*/
/*--------------------*/

#terms-and-conditions{ width: 100%; float: left; padding:0 0 36px 0; position: relative; clear: both; text-align: center;}
#terms-and-conditions  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#terms-and-conditions  h1 { font-size: 13px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 1px;
    text-decoration: underline;
    text-align: left;
}
#terms-and-conditions .terms{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#terms-and-conditions h4 {    font-size: 12px;
    line-height: 25px;
    margin-top: 4em;
    font-style: normal;
    text-align: left;
}
#terms-and-conditions .terms  p{ margin: 10px 0;
    text-align: left;
    letter-spacing: 0;
    line-height: 17px;}



#terms-and-conditions .terms ol {
    list-style-type: decimal;
    text-align: left;
    margin-top: 0;
    font-size: 13px;
    color: #000;
}
#terms-and-conditions .terms ul {
    list-style-type: decimal;
    text-align: left;
    margin-top: 0;
    font-size: 13px;
    color: #000;
}
#terms-and-conditions .terms  ol li{ text-align: left;
    letter-spacing: 0;
    line-height: 22px;}
#terms-and-conditions .terms  ul li{ text-align: left;
    letter-spacing: 0;
    line-height: 22px;}


.mr-top{ margin-top: 4em !important;}


#terms-and-conditions .terms ol ol {
    margin-left: 40px;
    margin-top: 0;
}

/*--------------------*/
/*privacy-policy*/
/*--------------------*/

#privacy-policy{ width: 100%; float: left; padding:0 0 36px 0; position: relative; clear: both; text-align: center;}
#privacy-policy  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#privacy-policy  h1 { font-size: 13px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 1px;
    text-decoration: underline;
    text-align: left;
}
#privacy-policy .privacy{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#privacy-policy h4 {    font-size: 12px;
    line-height: 25px;
    margin-top: 4em;
    font-style: normal;
    text-align: left;
}
#privacy-policy .privacy  p{ margin: 10px 0;
    text-align: left;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 17px;}



#privacy-policy .privacy ol {
    list-style-type: decimal;
    text-align: left;
    margin-top: 4em;
    font-size: 13px;
    color: #000;
}
#privacy-policy .privacy ol li{ text-align: left; margin-top: 2em;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 22px;}


.mr-top{ margin-top: 4em !important;}



/*--------------------*/
/*terms-of-use*/
/*--------------------*/

#terms-of-use{ width: 100%; float: left; padding:0 0 36px 0; position: relative; clear: both; text-align: center;}
#terms-of-use  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#terms-of-use  h1 { font-size: 13px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 1px;
    text-align: left;
}
#terms-of-use .terms{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#terms-of-use h4 {    font-size: 12px;
    line-height: 25px;
    margin-top: 4em;
    font-style: normal;
    text-align: left;
}
#terms-of-use .terms  p{ margin: 10px 0;
    text-align: left;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 17px;}



#terms-of-use .terms ol {
    list-style-type: decimal;
    text-align: left;
    margin-top: 0;
    font-size: 13px;
    color: #000;
}
#terms-of-use .terms ol li{ text-align: left; margin-bottom: 1em;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 22px;}

.mr-top{ margin-top: 4em !important;}
#sidebar-wrapper { padding: 20px;
    margin-right: -250px;
    right: 0;
    width: 250px;
    background-color: #fff;
    position: fixed;
    height: 100%;
    overflow-y: auto;
    z-index: 1000;
    transition: all 0.5s ease-in 0s;
    -webkit-transition: all 0.5s ease-in 0s;
    -moz-transition: all 0.5s ease-in 0s;
    -ms-transition: all 0.5s ease-in 0s;
    -o-transition: all 0.5s ease-in 0s;
}
#sidebar-wrapper.active {
    right: 250px;
     width: 23%;;
    transition: all 0.5s ease-out 0s;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
}
#sidebar-wrapper .btn {background-color: #fff;
    color: #000;
    text-align: right;
    border: none;
    float: left;
    position: absolute;
    z-index: 999;
    right: 0;
    top: 0;
    margin-top: 7px;}
#sidebar-wrapper  .headline{ width: 100%; float: left; text-align: left; position: relative; border-bottom: 1px solid #e5e5e5;}
#sidebar-wrapper  h3 {
    font-size: 15px;
    line-height: 30px;
    margin-bottom: 5px;
    font-style: normal;
    font-weight: 600;
    color: #131212;
    letter-spacing: 1px;
    text-transform: uppercase;
}

#sidebar-wrapper .area-content1{ width: 100%; float: left; text-align: left; border-bottom: 1px solid #e5e5e5;
    padding:20px 0; position: relative;}
#sidebar-wrapper .area-content1  .col-md-6{ padding-left: 0; padding-right: 0;}
#sidebar-wrapper .area-content1 p{ color: #000; text-align: left;}
#sidebar-wrapper .area-content1 .qyt-area > div {
    width: 100%;
    display: inline-flex;
    float: left;
    margin: 0;
}
#sidebar-wrapper .area-content1  .btn-minus { cursor: pointer;
    font-size: 7px;
    display: flex;
    align-items: center;
    padding: 5px;
    padding-left: 16px;
    padding-right: 16px;
    border: 1px solid #dedede;
    border-radius: 2px;
    border-right: 0;
    background-color: #fff;
}
#sidebar-wrapper .area-content1 .qyt-area > div > input {
    margin: 0;
    padding-left: 5px;
    font-size: 10px;
    padding-right: 5px;
    max-width: 28%;
    text-align: center;
    border: solid 1px #dedede;
    background-color: transparent;
}
#sidebar-wrapper .area-content1  .btn-plus {
    cursor: pointer;
    font-size: 7px;
    display: flex;
    align-items: center;
    padding: 5px;
    padding-left: 16px;
    padding-right: 16px;
    border: 1px solid #dedede;
    border-radius: 2px;
    border-left: 0;
    background-color: #fff;
}

#sidebar-wrapper  ul{ padding: 20px 0;}
#sidebar-wrapper  ul li{ margin-right: 4px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: #000 !important;}
#sidebar-wrapper  ul li:first-child{ float: left;color: #000 !important;}
#sidebar-wrapper p{ color: #000;}
#sidebar-wrapper  button{
    line-height: inherit;
    width: 100%;
    background-color: #000;
    padding: 10px 0;
    border-color: #000;
    color: #fff;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 1px;
}

@media(max-width: 767px){#sidebar-wrapper.active {
    right: 250px;
    width: 100%;
}}

/*--------------------*/
/*search-page*/
/*--------------------*/

#search-page{ width: 100%; float: left; padding:0 0 36px 0; position: relative; clear: both; text-align: center;}
#search-page  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#search-page  h1 { font-size: 13px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 1px;
    text-decoration: underline;
    text-align: left;
}
#search-page .search-area{ width: 100%; float: left; padding: 0; position: relative; clear: both; border-bottom: solid 1px #d0caca;
    padding-bottom: 2em;}
#search-page h4 {    font-size: 12px;
    line-height: 25px;
    margin-top: 4em;
    font-style: normal;
    text-align: left;
}
#search-page .search-area  p{ margin: 10px 0;
    text-align: left;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 17px;}

#search-page .search-area input {
    line-height: normal;    text-transform: uppercase;
    background-color: #eee;
    border: solid 1px #d6d6d6;    font-size: 11px;
    letter-spacing: 1px;
    padding: 10px;
    width: 300px;
}


#search-page .search-area2{ width: 100%; float: left; padding: 0; position: relative; clear: both; margin: 20px 0;}
#search-page .search-area2 ul li{ display: inline-block; list-style-type: none; width: 33%;
    float: left;text-align: center;}
#search-page .search-area2 img{ width: 80%;}
#search-page .search-area2  .pagination {
    clear: left;
    text-align: center;
    margin-top: 20px;
    padding-top: 20px;
    margin-bottom: 20px;
}
#search-page .pagination span{ color: #000;
    font-size: 12px;}

@media( max-width: 767px){#search-page .search-area input{ width: 100%;}
    #search-page .search-area2 ul li{ width: 100% !important;}
    #search-page .search-area2 img{ width: 100% !important;}
}

@media( max-width: 768px) and ( max-width: 991px){#search-page .search-area input{ width: 100%;}
    #search-page .search-area2 ul li{ width: 50%;}
}















.back-to-top {
    cursor: pointer;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;-webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.3s ease;
    background-color: #eee;
    border: solid 1px #969696;
    border-radius: 50px;
    color: #908d8d;
    height: 46px;
    width: 46px;
    text-align: center;}
.back-to-top  p{ text-transform: uppercase;    line-height: 18px;
    color: #555;
    font-size: 10px;
}
.back-to-top .glyphicon{ top: 7px;}

/*--------------------*/
/*Contact-us*/
/*--------------------*/

#contact-us{ width: 100%; float: left; padding:0 0 36px 0; position: relative; clear: both; text-align: center;}
#contact-us  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#contact-us  h1 {font-size: 16px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    letter-spacing: 1px;
    text-align: center;
}
#contact-us .contact-form-area{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#contact-us  h4 {    font-size: 12px;
    line-height: 25px;
    margin-top: 4em;
    font-style: normal;
    text-align: left;
}
#contact-us  .contact-form-area  p{ margin: 10px 0;
    text-align: left;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 17px;}

#contact-us  .contact-main-form{width: 68%; margin-top: 2em;
    display: inline-block;    position: relative;
    vertical-align: middle;}


#contact-us  .contact-main-form .form-control{ text-transform: capitalize; color: #000; border-radius: 0;}
#contact-us  .contact-main-form input::placeholder {
    color: #000; font-size: 12px;
}
#contact-us  .contact-main-form textarea::placeholder {
    color: #000; font-size: 12px;
}
#contact-us  .contact-main-form .btn {
    width: 100%;
    margin-top: 11px;
    font-size: 13px!important;
    font-weight: 400;
}
#contact-us  .contact-main-form .btn:hover{ color: #fff; background-color: #000;}
@media( max-width: 767px){#contact-us h1 {
    font-size: 12px;
    line-height: 22px;}
    #contact-us .contact-main-form {
        width: 100%;}}




/*--------------------*/
/*blog-page*/
/*--------------------*/

#blog-page{ width: 100%; float: left; padding:0 0 36px 0; position: relative; clear: both; text-align: center;}
#blog-page  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#blog-page  h1 { font-size: 20px;
    line-height: 40px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 3px;
    text-align: center;
}
#blog-page .blog-area1{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#blog-page .blog-area1 img{ width: 100%;}

#blog-page .blog-area1  .content-area{ width: 100%; float: left; padding: 0; position: relative; clear: both;
    text-align: left; margin: 10px 0;}
#blog-page .blog-area1 .blog-image-area{ min-height: 320px;}

#blog-page .blog-area1 h4{ margin-top: 2em;
    font-size: 12px;
    text-transform: capitalize;
    letter-spacing: 2px;}


@media ( max-width: 767px){#blog-page .blog-area1 .blog-image-area{ min-height: 100%;}}

@media ( min-width: 768px) and (max-width: 991px){#blog-page .blog-area1 .blog-image-area {
    min-height: 210px;
}}












/*--------------------*/
/*blog-details-page*/
/*--------------------*/

#blog-details-page{ width: 100%; float: left; padding:0 0 36px 0; position: relative; clear: both; text-align: center;}
#blog-details-page  h3 {text-align: center;
    font-size: 20px;
    width: 100%;
    color: #000;
    margin: 0 auto;
    font-weight: 600;
    padding: 0 0 16px 0;
    letter-spacing: 1px;
    border-bottom: solid 1px #d0caca;
    margin-bottom: 20px;
}
#blog-details-page  h1 { font-size: 40px;
    line-height: 62px;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0;
    text-align: center;
}




#blog-details-page .blog-details-area1{ width: 100%; float: left; padding: 0; position: relative; clear: both;}
#blog-details-page .blog-details-area1 img{ width: 100%;}
#blog-details-page .blog-details-area1  .text-p-area{margin-top: 20px;
    line-height: 26px;
    font-weight: 100;
    text-transform: capitalize;}

#blog-details-page .blog-details-area1  .detail-area{ width: 72%;
    /* float: left; */
    padding: 0;
    position: relative;
    clear: both;
    text-align: left;
    margin: 10px 0;
    display: inline-block;
    vertical-align: middle;}
#blog-details-page .blog-details-area1  .detail-area ol {
    list-style-type: decimal;
    margin: 40px 0;
}
#blog-details-page .blog-details-area1  .detail-area ol strong {
    font-weight: bold;    text-transform: capitalize;
    color: #000;
    letter-spacing: 1px;
}
#blog-details-page .blog-details-area1  .detail-area ol li{ margin: 20px 0;}
#blog-details-page .blog-details-area1  .detail-area ol li p{ margin-top: 0;}
#blog-details-page .blog-details-area1  .detail-image-area{ min-height: 320px; margin-top: 2em;}

#blog-details-page .blog-details-area1 h4{ margin-top: 2em;
    font-size: 12px;
    text-transform: capitalize;
    letter-spacing: 2px;}
#blog-details-page .blog-details-area1 .share-icons { width: 100%; float: left;
    margin-bottom: 20px;
    text-align: center;
    margin-top: 20px;
}
#blog-details-page .blog-details-area1 .share-icons  a {
    text-decoration: none;
    padding-right: 1em;
    color: #000;
}
@media ( max-width: 767px){#blog-details-page .blog-details-area1 .detail-image-area{ min-height: 100%;}
    #blog-details-page h1 {
        font-size: 11px;
        line-height: 20px;}
    #blog-details-page .blog-details-area1 .detail-area {
        width: 100%;}}

@media ( min-width: 768px) and (max-width: 991px){#blog-details-page .blog-details-area1 .detail-image-area {
    min-height: 210px;
}}


















































#main-modal-area1{ width: 100%; float: left; position: relative; clear: both;}

#myModal .modal-open .modal { overflow: visible;
    width: 38%;
    margin: 0 auto;
    top: 15em;
}
#myModal .modal-content .btn{ position: absolute; right: 0;
    top: -12px;
    padding: 2px 10px;    z-index: 9;
    border-radius: 50px;    margin-top: 0;
    font-size: 17px;}
#myModal .modal-content .btn:hover{ background-color: #000;}
#myModal  .modal-content { width: 36%;
    vertical-align: middle;    border-radius: 0;
    margin: 0 auto;
    float: none;
    top: 17em;
}
#myModal .overlay{ background-color: #000; opacity: .2; width: 100%; height: 100%; position: absolute; z-index: 1;}
#myModal   .modal-body { background: url("../images/pop-up-image2.jpg") center; background-size: cover;
    position: relative; height: 300px;
    padding: 15px;
}

#myModal   .modal-body .text-area{  position: relative; z-index: 9; text-transform: unset;}

#myModal   .modal-body h1 { font-size: 15px;
    margin-top: 6em;
    line-height: 20px;
    margin-bottom: 0;
    color: #fff;
    font-weight: 600;
    letter-spacing: 2px;
    text-shadow: 0 1px 1px #000000bd;}
#myModal   .modal-body .form-control {
    display: inline-block;
    width: 85%; text-align: center;
    border-radius: 0;
    float: left;
    border: solid 1px #000;
    margin-top: 2em;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 6px 12px;
    margin-bottom: 5px;
}
#myModal   form{ position: relative; z-index: 9;}
#myModal   .modal-body .tnp-submit, html input[type=button], input[type=reset], input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer;
    width: 85%;
    margin-top: 1em;
    background-color: #000;
    border: solid 1px #fff;
    color: #d2d2d2;
    text-transform: uppercase;
    font-size: 10px !important;
    letter-spacing: 2px;
}


@media( max-width: 767px){
    #myModal .modal-body .form-control {
        display: inline-block;
        width: 100%;}
    #myModal .modal-content { top: 14em; text-align: center;
        width: 95%;}}
@media(min-width: 768px) and ( max-width: 991px){#myModal .modal-content {
    width: 62%;}
    #myModal .modal-content { text-align: center;
        top: 12em;
    }
    #myModal .modal-body .form-control {
        display: inline-block;
        width: 100%;}}





/************* size-chart-popup **************/
#size-chart-popup .modal-content {border-radius: inherit;}
#size-chart-popup .modal-dialog {
    position: relative;
    width: 50%;
    margin: 10px auto;
    top: 9em;
}
#size-chart-popup .modal-content .modal-body .close:hover {
    background-color: #464444;
}
#size-chart-popup .modal-content .modal-body .close {
    position: absolute;
    right: 0;
    top: -12px;
    padding: 7px 19px;
    z-index: 9;
    border-radius: 50px;
    margin-top: 0;
    font-size: 17px;
    background: #0a0a0a;
    opacity: .9;
    color: #fff;
}