@charset "utf-8";
/* CSS Document */

a{ text-decoration: none; }
a:hover{ color: #666;text-decoration: none;  }

/*-------------------fonts----------------------*/


@font-face {
    font-family: 'open_sanslight';
    src: url('../fonts/opensans-light-webfont.woff2') format('woff2'),
         url('../fonts/opensans-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'open_sansregular';
    src: url('../fonts/opensans-regular-webfont.woff2') format('woff2'),
         url('../fonts/opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sanssemibold';
    src: url('../fonts/opensans-semibold-webfont.woff2') format('woff2'),
         url('../fonts/opensans-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sansbold';
    src: url('../fonts/opensans-bold-webfont.woff2') format('woff2'),
         url('../fonts/opensans-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'rubikbold';
    src: url('../fonts/rubik-bold-webfont.woff2') format('woff2'),
         url('../fonts/rubik-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'rubiklight';
    src: url('../fonts/rubik-light-webfont.woff2') format('woff2'),
         url('../fonts/rubik-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}



@font-face {
    font-family: 'rubikmedium';
    src: url('../fonts/rubik-medium-webfont.woff2') format('woff2'),
         url('../fonts/rubik-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'rubikregular';
    src: url('../fonts/rubik-regular-webfont.woff2') format('woff2'),
         url('../fonts/rubik-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoon.eot?pnqer3');
  src:  url('../fonts/icomoon.eot?pnqer3#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?pnqer3') format('truetype'),
    url('../fonts/icomoon.woff?pnqer3') format('woff'),
    url('../fonts/icomoon.svg?pnqer3#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-cancel:before {
  content: "\e900";
  color: #d6d6d6;
}
.icon-checked:before {
  content: "\e901";
  color: #e0e0e0;
}

/*-------------------fonts end----------------------*/


body{font-family: 'open_sansregular';}


.header_wrap, .header_wrap a {
    color: #0c0c0c;
    text-transform: uppercase;
    font-size: 14px;
}


.graybg{
/*
background: rgb(251,251,251);
background: -moz-linear-gradient(top, rgba(251,251,251,1) 0%, rgba(238,238,238,1) 90%, rgba(255,255,255,1) 66%, rgba(255,255,255,1) 66%);
background: -webkit-linear-gradient(top, rgba(251,251,251,1) 0%,rgba(238,238,238,1) 90%,rgba(255,255,255,1) 66%,rgba(255,255,255,1) 66%);
background: linear-gradient(to bottom, rgba(251,251,251,1) 0%,rgba(238,238,238,1) 90%,rgba(255,255,255,1) 66%,rgba(255,255,255,1) 66%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#ffffff',GradientType=0 );
*/

background: #fbfbfb;



}

.contentwrap {
    padding: 55px 0 0 0;
}


.contentwrap h1 {
    font-family: 'open_sanssemibold';
    color: rgb(66, 70, 74);
    font-size: 43px;
    margin: 93px 0 37px 0;
}
.contentwrap p{ font-size: 16px; }

.loginimg {
    margin: 40px 0 0 0;
}

.logo_wrap {
    padding: 15px 0 33px 0;
}


.login_form {

    border: 1px solid #e8e8e8;
    background: #fff;
    box-shadow: 0px 0px 9px rgb(231, 228, 228);
    padding: 30px;
    font-family: 'rubikregular';
    color: #0c0c0c;

}

.login_form p{ font-size: 14px; font-family: 'rubiklight';}


.appbtnwrap {
    display: flex;
}

.login_form .form-control {

    padding: 12px .75rem;
    color: rgb(73, 80, 87);
    border: 1px solid rgb(206, 212, 218);
    border-radius: 0;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    box-shadow: 0px 0px 7px rgb(234, 230, 230) inset;
    font-size: 13px;
    font-family: 'rubiklight';

}

.form-control:focus {

    color: rgb(73, 80, 87);
    background-color: rgb(255, 255, 255);
    border-color: rgb(198, 154, 108);
    outline: 0;
    box-shadow: 0 0 0 .1rem rgb(241, 205, 159);


}

.btn.logins {
    display: block;
    margin: 0 auto;
    width: 170px;
    height: 41px;
    border-radius: 0;
    font-family: 'rubikmedium';
    background: #626466;
    color: #fff;
    text-transform: uppercase;
    font-size: 15px;
    transition: all 0.2s ease-out;
    border: 2px solid transparent;
}


.btn.logins:hover {
    /*background: rgb(185, 140, 94);*/
    /*border: 2px solid rgb(246, 174, 101);*/
        background: rgb(29 49 79);
    border: 2px solid rgb(17 40 75);
}

.link1{
/*color: #c69a6c;*/
    color: #11284b;

}

.downlink {

    font-family: 'rubikmedium';
    font-weight: 500;
    padding: 33px 0 25px 0;

}

.applikwrap {
    display: flex;
    justify-content: space-around;
}

.footerwrap {
    font-size: 13px;

    padding:22px 0 27px;
    color: #0c0c0c;
    font-family: 'open_sanslight';
}

.footerwrap .nav-link, .copyright a {
    color: #333;

}

.sidebar-offcanvas {
    width: 220px;
}



.copyright {
    display: flex;
    justify-content: flex-end;
    font-size: 13px;
    padding: 33px 0 0;
}

.nav-link:hover ,.copyright a:hover{

/*color: rgb(200, 108, 11);*/
    color: rgb(17 40 75);
}


.shake_effect
{
 animation: shake 1s ;
}
@keyframes shake 
{
 10%, 90% 
 {
  transform: translate3d(-8px, 0, 0);
 }
  
 20%, 80% 
 {
  transform: translate3d(5px, 0, 0);
 }

 30%, 50%, 70% 
 {
  transform: translate3d(-10px, 0, 0);
 }

 40%, 60% 
 {
  transform: translate3d(2px, 0, 0);
 }
}


.applink {
    display: flex;
    padding: 10px 0 0 0;
    margin: 0;
   
}

.shadow{ box-shadow: 2px 2px 6px rgb(233, 231, 231); }

.app-link img {
    padding: 0 5px;
     transition: all 0.2s ease-in;
}

.app-link img:hover {
    margin: -5px 0 0 0;
    transform: scale(0.9);

}

.applink p {
    font-family: 'rubiklight';
    font-size: 14px;
    text-transform: none;
    padding: 3px 21px 0px 0;
}

.header-links a{  transition: all 0.2s ease-in; }
.header-links a:hover{  margin: -5px 0 0 0;}



.header-icn {
    background-image: url(../img/header-icons.png);
    background-repeat: no-repeat;
    display: block;
}

.header-icn-msgs {
    width: 21px;
    height: 21px;
    background-position: -5px -5px;
}

.header-icn-profile {
    width: 17px;
    height: 22px;
    background-position: -5px -36px;
}

.header-icn-searchs-icon {
    width: 19px;
    height: 19px;
    background-position: -5px -68px;
    float: right;
}


.header_icons {
    display: flex;
    
}

.header-links {
    width: 130px;
    display: flex;
    justify-content: space-around;
    position: relative;
}


/*------------------------hambuger menu---------------------------*/



.navbar-toggler {
  border: none;
  
}

.navbar-toggler:focus {
  outline: none;
  
}

.navbar-toggler .icon-bar {
  background-color: #fff;
  transform: rotate(0deg) translate(0px, 0px);
  transition: ease all .2s;
}

.navbar-toggler .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}

.navbar-toggler .icon-bar+.icon-bar {
  margin-top: 4px;
}

.icon-bar:nth-child(2) {
  width: 16px;
  transition: ease all .2s;
}

.navbar-toggler:hover>.icon-bar:nth-child(2) {
  width: 22px;
  transition: ease all .2s;
}

.navbar-toggler:active>.icon-bar:nth-child(2) {
  width: 22px;
  transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(1) {
  transform: rotate(45deg) translate(5px, 4px);
  transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(2) {
  opacity: 0;
  transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(3) {
  transform: rotate(-45deg) translate(4px, -4px);
  transition: ease all .2s;
}









.messages span {
    display: flex;
    position: absolute;
    width: 20px;
    height: 20px;
    background: rgb(221, 33, 33);
    color: rgb(255, 255, 255);
    font-size: 10px;
    align-items: center;
    justify-content: center;
    top: -9px;
    right: 13px;
    border-radius: 13px;
    animation: bounce 2s infinite;
}


@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
    40% {-webkit-transform: translateY(-30px);}
    60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
    40% {-moz-transform: translateY(-30px);}
    60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce {
    0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
    40% {-o-transform: translateY(-30px);}
    60% {-o-transform: translateY(-15px);}
}
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-30px);}
    60% {transform: translateY(-15px);}
}




.header_search {
    border: 0;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
    width: 0px;
    transition: all 0.5s ease-out;

}

.header-icn-searchs-icon {
    width: 19px;
    height: 19px;
    background-position: -5px -68px;
    margin: -22px 0 0 0;
     float: right;
}



.search-form input[type="text"] {
    height: 20px;
    font-size: 12px;
    display: inline-block;
    border: none;
    outline: none;
    color: rgb(85, 85, 85);
    width: 0px;
    position: relative;
    top: 0;
    right: 0;
    background: none;
    z-index: 3;
    transition: width .4s linear;
    cursor: pointer;
    padding: 0 30px;
}


.search-form input[type="text"]:focus:hover {
  border-bottom: 1px solid #BBB;
}




.search-form input[type="text"]:focus {
  width: 250px;
  z-index: 1;
  border-bottom: 1px solid #BBB;
  cursor: text;
  background-repeat: no-repeat;
}

.search-form input[type="submit"] {
    display: inline-block;
    color:red;
    float: right;
    width: 19px;
    height: 19px;
    background-position: -5px -68px;
    background-image: url(../img/header-icons.png);
    background-color: transparent;
    text-indent: -10000px;
    border: none;
    position: relative;
    top: 0;
    right: 22px;
    /*z-index: 9;*/
    cursor: pointer;
    transition: all .4s ease;

}


.search-form input[type="submit"]:hover {
   
    top: -5px;
  
}

.btn-toggle{ display: none; }

.media-body p{  font-family: 'open_sansregular'; font-size: 13px;}

.media-body {
    padding: 10px 13px;
}

.media img {
    width: 70px;
    height: 70px;
    display: block;
}

.media-body h5 {
    font-size: 17px;
    color: #42464a;
     font-family: 'open_sanssemibold';
}

.profilepic {
    display: flex;
    margin: 2px 0 0;
}


/*.sidebar-offcanvas .media {
    padding: 0 16px;
}*/

.sidebar-offcanvas .nav-link {
    font-size: 14px;
    color: rgb(88, 90, 93);
}

/*.sidebar-offcanvas .nav {
    padding: 9px 16px 0 7px;
}*/

.seperater {
    margin: 23px auto;
    width: 90%;
}

.sidebar-offcanvas .nav-item {
    padding-bottom: 13px;
}


.contentwraper {
    padding: 34px 0 0 0;
}

.paddingno{ padding-top:0px !important;  }

.contentwraper h3{
    color: #42464a;
    font-size: 23px;

}


.list-hover-slide li {
  position: relative;
  overflow: hidden;
}
.list-hover-slide a {
  display: block;
  position: relative;
  z-index: 1;
  transition: .35s ease color;
}

.list-hover-slide a:hover{ color: #fff; }
/*
.nav-link.active{
    border-right: solid 5px rgb(174, 111, 47);
    background: rgb(185, 140, 94);
    color: #fff;

}*/

.list-hover-slide a::before {
    content: '';
    display: block;
    z-index: -1;
    position: absolute;
    left: -100%;
    top: 0;
    width: 100%;
    height: 100%;
    border-right: solid 5px rgb(174, 111, 47);
    background: rgb(185, 140, 94);
    transition: .35s cubic-bezier(.18,.89,.32,1.28) left;

}
.list-hover-slide a.is-current:before, .list-hover-slide a:hover:before {
  left: 0;
  color: #fff;
}

.navbar-light .navbar-toggler {
    color: rgb(204, 13, 13);
    border-color: rgb(104, 54, 13);
    background: rgb(213, 172, 126);
    padding: 10px;
    border-radius: 0;
}

.profile-mobi{ display: none; }

.navbar-toggler {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 99;
    
}



.nav-tabs .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    color: #9d9595;
}

.nav-tabs{

    font-family: 'open_sanslight';
    font-size: 15px;
    border: 1px solid #dee2e6;
    background: #f8f8f8;
}

.nav-tabs a {
    padding: 14px 26px;
}


.nav-tabs .nav-link.active {

    border-top: 0;
    border-bottom: 3px solid #d7ae80;

}

.nav-tabs .nav-item.active {
    
}

.nav-item.active:first-child{
border-left: 0;

}


.tab-content {

    background: #fff;
    border: 1px solid #ccc;
    border-top: 0;
    padding: 50px;

}

.nav-tabs .nav-item:last-child{ border-right:  1px solid #dee2e6 !important;border-left:  1px solid #dee2e6 !important;}

.profile .form-control {
    /*padding: 12px .75rem;*/
    color: rgb(73, 80, 87);
    border: 1px solid rgb(206, 212, 218);
    border-radius: 0;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    box-shadow: 0px 0px 7px rgb(234, 230, 230) inset;
    font-size: 13px;
    padding: 9px 10px;
   
}

.profile .col-form-label {

    font-size: 14px;

}

.profile {

    width: 69%;

}

.profilewrap {
    display: flex;
}

.edit_profile {

    display: block;
    width: 22%;
    margin: 0 auto;
    text-align: center;
    font-size: 15px;
    padding: 0 0 0 22px;

}

.btn.btn-secondary {

    border-radius: 0;
    background-image: url(../img/btnimg.jpg);
    background-repeat: no-repeat;
    background-color: rgb(94, 93, 99);
    padding: 15px 55px;
    background-position-y: 17px;
    background-position-x: 24px;
    transition: all 0.5s ease;
    float: right;
    margin: 28px 0 0;

}

.btn.btn-secondary:hover{

  background-position-y: 17px;
  background-position-x: 20px;


}

.tab-content h5 a {

    font-size: 15px !important;
    color: #333;

}

.contentwraper.dash .card {
    border: 1px solid #e4e2e3;
    border-radius: 0;
    width: 76%;
    margin-bottom: 31px;
}

.cards-header .media img {
    width: 50px;
    height: 50px;
    display: block;
}

.cards-header {
    padding: 19px 0 0 19px;
    margin: 0;
}

.cards-header .media-body {
    padding: 5px 0 0 11px;
}

.cards-header .media-body h5 {
    font-size: 14px;
    color: rgb(66, 70, 74);
    font-family: 'open_sanssemibold';
}


.info .card-title {
    font-family: 'open_sansbold';
    font-size: 17px;
    color: #4a4a4a;
    text-transform: capitalize;
}

.info .card-text {
    font-size: 13px;
    color: rgb(74, 74, 74);
    font-family: 'open_sanslight';
}

.price_wrap {
    font-size: 25px;
    font-family: 'open_sanssemibold';
    color: #4a4a4a;

}

.sprite-options {
    background-image: url(../img/options-icon.png);
    background-repeat: no-repeat;
    display: block;
    opacity: 0.5;
}

.sprite-options-cart {
    width: 21px;
    height: 23px;
    background-position: -5px -5px;
}

.sprite-options-comments {
    width: 21px;
    height: 19px;
    background-position: -36px -5px;
}

.sprite-options-liked {
    width: 20px;
    height: 17px;
    background-position: -67px -5px;
}

.options {
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
    margin: 0;
}

.options a {
    display: block;
    padding: 9px;
}

.options li {

    padding: 8px;
    border: 1px solid rgb(229, 229, 229);       
    border-bottom: 0;
    border-top: 0;

}

.infoicon span {
    float: left;
    display: block;
    font-size: 14px;
    margin: 15px 0 0 45px;
}


.options li:last-child {

    border-left: 0 !important;
    border-right: 0;

}

.options li:first-child {

    border-right: 0 !important;
    border-left: 0;
}

.infoicon {
    padding-right: 0;
    /*display: flex;*/
    justify-content: right;
    align-items: center;
}

.options-wrap .row {

    border-top: 1px solid rgb(229, 229, 229);

}

.contentwraper .card-body {
  
    padding-bottom: 0;
}

.info {
    padding-bottom: 20px;
}

.info-tags {
    display: flex;
    align-items: center;
}

.info-tags a {
    font-size: 13px;
    color: #4a4a4a;
    display: inline-block;
    margin: 0 8px 0 0;
}



.sprite-options:hover {
   opacity: 1;
}

.sprite-options{
    transition: all 0.2s ;
}


.inventory-search {
    display: flex;
    justify-content: space-between;
    padding: 0 6% 0 0;
}

.in-search-col .form-control {
    border-radius: 0;
    border: 1px solid rgb(241, 241, 241);
    box-shadow: 0px 0px 5px rgb(245, 245, 245);
    font-size: 13px;
    padding: 9px 27px;
}

.in-search-col select.form-control:not([size]):not([multiple]) {
    height: auto;
}


.searchbox {
    background: url(../img/search-box-bg.jpg);
    background-repeat: no-repeat;
    background-color: #fff;
    background-position-x: 94%;
    background-position-y: 12px;
}


.product-list {
    width: 94%;
    margin: 33px 0;
}

.product-list .card {
    width: 100%;
}


.product-list  .card-block {

    color: #505050;
    padding: 20px;

}

.product-list .card-title {
    font-size: 16px;
    margin: 0 0 4px 0;
}

.product-list .card-text {

    font-size: 12px;
    color: rgb(187, 187, 187);
    padding: 11px 0 0 0;

}

.status {
    border-top: 1px solid rgb(240, 240, 240);
    display: flex;
    justify-content: space-between;
    align-items: center;
    
}

.status-wrap1 {
    margin: 0 0 0 21px;
    color: rgb(187, 187, 187);
}

.status-wrap1 strong {

    color: rgb(125, 123, 123);
    font-size: 12px;

}

.btn.btn-status {   
    border-radius: 0;
    background: #f5f3f4;
    font-size: 17px;

}


.status-wrap2 {

    justify-content: flex-end;
    display: flex;

}

/*---------------button status------------------*/

/*.green{ color: #fff!important; background:#52a146 !important; }

.green .icon-checked::before {
    content: "\e901";
    color: #fff!important;
}
.red{ color: #fff!important; background:#c83c18!important; }

.red .icon-cancel::before {
    content: "\e900";
    color: #fff!important;
}

*/

.btn.btn-status.ok:hover {
    background: #52a146;
    color: #fff;
}

.btn.btn-status.cancel:hover {
    background: #c83c18;
    color: #fff;
}

 .btn.btn-status.ok .icon-checked::before {
    content: "\e901";
    
}


.btn.btn-status.cancel .icon-cancel::before {
    content: "\e900";  

}

.icon-checked:hover{ color: #fff !important; }



.btn.focus, .btn:focus {
    outline: 0;
    box-shadow: none !important;
}



.payment-info {
    padding: 0;
    list-style: none;
    font-size: 13px;
    padding: 7px 0;
}

.payment-info li {
    padding: 3px 0;
}

.product-img .img-fluid {
    height: 100%;
}

.paywrap {
    display: block;
    float: left;
    width: 64%;
}

.paywrap .card-block {
    float: left;
    width: 100%;
}

.paywrap .price_wrap{

float: left;

}


.paywrap-price {
    font-size: 25px;
    font-family: 'open_sanssemibold';
    color: rgb(66, 70, 74);
    padding: 14px 0 0 27px;
    
}



@media screen and (-webkit-min-device-pixel-ratio:0) { 

   .paywrap-price {
    padding: 14px 0 0 13px;

 }

}

.product-list .card {
    margin-bottom: 27px;
}

.paywrap-btn .btn {
    border: 0;
    border-radius: 0;
}

.paywrap-btn .btn:hover {
    background: #ccc;
}

.btn-down::after{
    content: "";
}

.paywrap-btn {

    padding: 35px 0 0 0;

}

.edit_profile .profilepic {
    margin: 0 auto !important;
}

.edit_profile small {
    display: block;
    padding: 9px 0;
}



/*======================================Responsive===============================================*/





@media only screen   and (min-width: 980px)   and (max-width: 1024px) 
{

.sidebar-offcanvas {
    width: 195px;
}

.infoicon span {
   
    margin: 14px 0 0 10px;
}


.paywrap {
    display: block;
    float: left;
    width: 57%;
}



}

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

.profile {
    width: 100%;
}


.btn.btn-secondary {
    
    float: none;
    margin: 28px auto;
    display: block;
}




}

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

.sidebar-offcanvas {
    width: 100%;
}

.seperater {
       display: none;
}

.nav.flex-column {
    margin: 39px 0 0 0;
}

.nav.flex-column {
   
    margin: 39px 0 0 0;
    background: rgba(225, 225, 225, 0.9);
    text-align: center;
    border: 1px solid rgb(204, 204, 204);
    z-index: 9999;
    position: relative;
}


.sidebar-offcanvas .nav-link {

    font-size: 17px;
    color: rgb(88, 90, 93);
    text-transform: uppercase;
    font-family: 'open_sansbold';

}


.sidebar-offcanvas .nav-item {

    padding-bottom: 0;

}

.profilepic {
    
    margin: 0 !important;
}

.contentwraper .card {
  
    width: 100%;
}


.navbar-toggler {
   
    right: 4%;
    
}


.inventory-search {

    display: block;
    justify-content: space-between;
    padding: 0;

}


.copyright {

    display: flex;
    justify-content: center;
    font-size: 13px;
    padding: 14px 0;

}

.footerwrap {

    display: flex;
    padding: 0;
    justify-content: center;
    

}


.product-list {
    width: 100%;
    margin: 33px auto;
}


.profile-mobi{ display: block; }

.profile_img{ display: none; }


}



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

.mobile{ display: none; }

.btn-toggle{ display: block; }



.contentwrap {
    padding: 10px 0 0 0;
}


.seperater {
    margin: 23px auto;
    width: 95%;
}


.tab-content {
    padding: 14px;
}

/*.contentwraper {
    padding: 9px 10px;
}*/

.tab-content{ border:0; }

.profilewrap {
    display: block;
    /*text-align: center;*/
}

.edit_profile {
    display: block;
    width: 100%;
    padding: 0;
}

.profilepic {
    display: block;
    margin: 35px auto 0;
}




.contentwraper h3 {
    
    text-align: center;
}


.tab-content .card{


    border-radius: 0;
}


.tab-content .card-header{

    border-bottom: 0;
}


.applink {

    display: block;
    padding: 10px 0 0 0;
    margin: 0 auto;
    width: 100%;
    text-align: center;

}

.header_icons {

    display: flex;
    justify-content: center;
    padding: 20px 0 0 0;

}

.navbar-brand {
    display: flex;
    text-align: center;
    width: 100%;
    justify-content: center;
}

.appbtnwrap {

    display: flex;
    justify-content: center;

}

.product-list {

    width: 100%;
    margin: 33px auto;

}

.product-list .card .img-fluid {
    max-width: 100%;
    height: 100%;
}

.paywrap {
    display: block;
    float: left;
    width: 59%;
}

.paywrap-price {
    width: 100%;
}

.paywrap-btn {
    padding: 0;
    display: block;
    float: right;
}

.paywrap-price {
    width: 100%;
    border-top: 1px solid #e9e6e6;
}


#frame .content {
   
    width: 55% !important;
  
}

#frame #sidepanel {
   
    max-width: 100% !important;
    min-width: 280px;
    
    width: 100% !important;
    height: auto !important;
    background: rgb(250, 250, 250);
    color: rgb(245, 245, 245);
    overflow: hidden;
    position: relative;
}

#frame .content {
    float: left!important;
    width: 100%!important;
    height: auto!important;
    overflow: hidden;
    position: relative;
}

#frame {
    width: 100%!important;
   /* min-width: 360px;
    max-width: 1000px;
    height: 92vh;
    min-height: 300px;*/
    max-height: 720px;
    background: #fdfbfc;
    border: 1px solid #f6f6f6;
    box-shadow: 0px 0px 4px #ccc;
}


.mobishadow {
    box-shadow: 0px 2px 3px #cccc;
}

#frame{ box-shadow: none!important; }


}



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

.infoicon {
  
    border-top: 1px solid #ccc;
}


.options-wrap .row {
    border-top: 0;
}

.info-tags {
    display: flex;
    align-items: center;
    margin: 0 auto;
    padding: 20px 20px;
}

[data-aos-delay] {
    transition-delay: 0s;
  }

  .footerwrap .nav-link {
    display: block;
    padding: .5rem 0.4rem;
}


.search-form input[type="text"]:focus {
    width: 102px;
   
}

.card  .col-auto {
    justify-content: center;
    display: flex;
    width: 100%;
    padding: 21px 0;
    
}

#frame .content {
    float: left !important;
    width: 100% !important;
    height: 80% !important;
    overflow: hidden;
    position: relative;
}


}


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

    .appbtnwrap {
        display: block;
        justify-content: center;
    }

    .contentwraper {
    padding: 34px 10px;
}

}


/*===================responsive tab========================*/
.nav-tabs {
    display:none;
}

@media(min-width:768px) {
    .nav-tabs {
        display: flex;
    }
    
    .card {
        /*border: none;*/
    }

    .card .card-header {
        display:none;
    }  

    .card .collapse{
        display:block;
    }
}

@media(max-width:767px){
    .tab-pane {
        display: block !important;
        opacity: 1;
    }
}



/*===================responsive tab end========================*/




/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

}

/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

}

/* ----------- iPhone X ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

}





/* ----------- iPad 1, 2, Mini and Air ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* ----------- iPad Pro 10.5" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 1112px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 834px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1112px) 
  and (max-device-width: 1112px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* ----------- iPad Pro 12.9" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1366px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {

}