@import 'fonts.css';

@import 'style.css';

:root{

  --bg: #F5EFE7;

  --cardbg: #EFE9E2;

  --chip: #E8E2DA;

  --text: #2A2A2A;

  --muted: #6A6A6A;

  --chipText: #3A3A3A;

  --line: #E1D9CE;

  --accent: #111111;

  --shadow: 0 8px 24px rgba(0, 0, 0, 0.06);

  --max: 1200px;

  --rad: 5px;

  --rad10: 10px;

  --rad15: 15px;



  --primary: #007fff;

  --primary2: #0054a9;

  --red: #cd2923;

  --red2: #b51812;

  --secondary: #374856;

  --secondary2: #2b3e4e;

  --heading: #23303b;

  --bg-light: #c7c7c7;

  --dark: #000;

  --black: #000;

  --white: #ffffff;

  --gray: #777;

  --grey: #777;

  --light: #f6f7f9;

  --bg-body: #fff;

  --link: #007fff;



}





html{

  scroll-behavior: smooth;

}

body{

  font-family: "Mulish", sans-serif;

  color: var(--secondary);

  background: #fff;

  line-height: 1.6

}

body.overflow-hidden {

  overflow: hidden;

}



/*cms style*/

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{

  font-weight: normal

}

h1,h2,h3,h4,h5,h6{

  font-family: "Play", sans-serif;

  color: var(--heading);

  margin-bottom: 30px;

  font-weight: normal

}

h1{

  font-size: 44px

}

h2{

  font-size: 40px;

}

h3{

  font-size: 36px

}

h4{

  font-size: 24px;

  margin-bottom: 20px

}

h5{

  font-size: 20px;

  margin-bottom: 20px

}

h6{

  font-size: 18px;

  margin-bottom: 20px

}



.flex-center{

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 20px

}

.flex-center-wrap{

  display: flex;

  align-items: center;

  justify-content: center;

  flex-wrap: wrap;

  gap: 20px

}



.lead{

  font-size: 18px;

  font-weight: 500

}



b{

  font-weight: bold

}

strong{

  font-weight: 600

}

a{

  transition: ease-in-out 0.2s;

  text-decoration: none

}

.fw-300{

  font-weight: 300!important

}

.fw-400{

  font-weight: 400!important

}

.fw-500{

  font-weight: 500!important

}

.fw-600{

  font-weight: 600!important

}

.fw-700{

  font-weight: 700!important

}

.text-primary{

  color: var(--primary)!important

}

.text-primary2{

  color: var(--primary2)!important

}

.text-black{

  color: var(--black)!important

}

.text-dark{

  color: var(--black)!important

}



.owl-theme .owl-nav{

  position: absolute;

  top: 50%;

  left: 2px;

  right: 2px;

  transform: translateY(-50%);

  -webkit-transform: translateY(-50%);

  z-index: 5;

  margin: 0

}

.owl-theme.owl_hero .owl-nav{

  left: 50px;

  right: 50px;

}



.owl-theme.owl_hero{

  padding-left: 0;

  padding-right: 0

}



.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{

  width: 32px;

  height: 32px;

  font-size: 16px;

  background: #999;

  opacity: 0.8;

  color: #fff;

  z-index: 100;

  border-radius: 50%;

  margin: 0;

  display: inline-flex;

  align-items: center;

  justify-content: center

}

.owl-carousel .owl-nav button.owl-next:hover, .owl-carousel .owl-nav button.owl-prev:hover{

  background: var(--primary);

  opacity: 1

}

.owl-prev{

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%)

}

.owl-next{

  position: absolute;

  right: 0;

  top: 50%;

  transform: translateY(-50%)

}

.owl-prev i,.owl-next i{

  padding-top: 1px

}



.owl-theme .owl-dots .owl-dot span{

  width: 36px ;

  height: 4px;

  border-radius: 20px;

  margin: 0 5px;

  background: #999

}

.owl-theme .owl-dots .owl-dot.active span{

  background: var(--primary)

}

.btn{

  border-radius: 50px;

  padding: 0.75rem 2rem;

  font-weight: 600;

  transition: all 0.3s ease;

  position: relative;

  overflow: hidden;

  text-align: center;

  background-color: #fff;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  line-height: 1;

  min-height: 44px;

  gap: 4px;

}

.btn:hover{

  transform: translateY(-2px);

  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);

}



.btn.btn-sm{

  padding: 0.6rem 1.5rem;

  font-weight: 500;

  font-size: 14px;

  min-height: 40px

}



.btn.btn-lg{

  padding: 0.75rem 2.5rem;

  font-weight: 500;

  font-size: 17px;

  min-height: 48px

}

.btn-primary{

  background: var(--primary);

  border-color:var(--primary);

  color: var(--white);

}

.btn-primary:hover,.btn-primary:active,.btn-primary:focus,.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle,.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active{

  background-color: var(--primary2);

  border-color: var(--primary2);

  color: var(--white);

}

.btn-red{

  background: var(--red);

  border-color:var(--red);

  color: var(--white);

}

.btn-red:hover,.btn-red:active,.btn-red:focus,.btn-red:not(:disabled):not(.disabled).active, .btn-red:not(:disabled):not(.disabled):active, .show>.btn-red.dropdown-toggle,.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active{

  background-color: var(--red2);

  border-color: var(--red2);

  color: var(--white);

}



.btn-outline-primary{

  background-color: #fff;

  border-color: var(--primary);

  color: var(--primary);

}

.btn-outline-primary:hover,.btn-outline-primary:active,.btn-outline-primary:focus,.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle,.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active{

  background-color: var(--primary);

  border-color:var(--primary);

  color: #fff;

}



.btn-secondary{

  background-color: var(--secondary);

  border-color:var(--secondary);

  color: var(--white);

}

.btn-secondary:hover,.btn-secondary:active,.btn-secondary:focus,.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle,.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active{

  background-color: var(--secondary2);

  border-color: var(--secondary2);

  color: var(--white)

}



.btn-outline-secondary{

  background-color: var(--white);

  border-color: var(--secondary2);

  color: var(--secondary2)

}

.btn-outline-secondary:hover,.btn-outline-secondary:active,.btn-outline-secondary:focus,.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show>.btn-outline-secondary.dropdown-toggle,.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active{

  background-color: var(--secondary);

  border-color:var(--secondary);

  color: var(--white);

}



.btn-light{

  background-color: #999;

  border-color: #999;

  color: #fff

}



.btn-light:hover,.btn-light:active,.btn-light:focus,.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show>.btn-light.dropdown-toggle,.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active{

  background-color: #555;

  border-color: #555;

  color: #fff

}



.anim{

  transition: ease-in-out 0.3s;

}

.anim:hover{

  transform: translateY(-10px);

  -webkit-transform: translateY(-10px);

  box-shadow: 0 10px 20px #ddd

}

.btn.disabled, .btn:disabled, fieldset:disabled .btn{

  color: inherit;

  pointer-events: none;

  background-color: inherit;

  border-color: inherit;

  opacity: 0.5;

}

.btn-light:disabled{

  background-color: #eee;

  border-color: #eee;

}



/*defalt*/





header{

  background-color: var(--secondary);

  color: #fff;

  font-size: 15px;

  padding: 10px

}

header b{

  color: var(--primary);

}

header a{

  color: #007fff;

}

header a:hover{

  color: var(--primary)

}



.navbar-brand{

  padding: 0;

  margin:0;

  font-family: 'Alata';

  font-weight: normal;

  font-style: normal;

  gap: 8px;

  display: inline-flex;

  align-items: center;

  font-size: 18px

}

.ff-alata{

  font-family: 'Alata'!important;

  font-weight: normal

}

.header-search-wrap{

  display: flex;

  align-items: center;

  justify-content: flex-end;

  position: relative

}

.search-form{

  position: absolute;

  top: 42px;

  right: 106px;

  z-index: 99;

  left: auto;

  min-width: 300px;

  box-shadow: 0 10px 10px #0000005c;

  border-radius: 50px

}



.search-form .form-control{

  min-height: 50px;

  border-radius: 50px;

  padding-left: 24px

}

.search-form .btn{

  position: absolute;

  top: 50%;

  right: 5px;

  transform: translateY(-50%);

  --webkit-transform: translateY(-50%);

  z-index: 5;

  border: 0;

  background-color: transparent;

  height: 40px;

  width: 40px;

  padding: 0;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  color: var(--secondary);

  font-size: 20px

}

.search-form .btn:hover{

  background: var(--primary);

  color: #fff;

  box-shadow: none;

}





.header-search-wrap a{

  display: inline-flex;

  align-items: center;

  justify-content: center;

  padding: 5px 7px;

  color: var(--secondary);

  position: relative;

  font-size: 22px;

}

.header-search-wrap a:hover{

  color: var(--primary)

}

.cart-counter{

  position: absolute;

  top: 0;

  left: 82%;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  font-size: 13px;



}

.form-control,.form-select{

  min-height: 44px;

  padding-left: 20px;

  padding-right: 20px;

  border-radius: 44px;

  border-color: #ddd;

}

.form-control.form-control-lg,.form-select.form-select-lg, .form-control.lg,.form-select.lg{

  min-height: 50px;

  padding-left: 25px;

  padding-right: 25px;

  border-radius: 30px;

  font-size: 18px;

}

.form-control:focus,.form-select:focus{

  border-color: var(--secondary);

  box-shadow: none;

}

.form-control.form-control-sm{

  min-height: 38px;

  padding-left: 15px;

  padding-right: 15px;

  border-radius: 20px;

  border-color: #ddd;

  font-size: 14px;

}

.form-control.text-end{

  text-align: right

}

textarea.form-control{

  border-radius: 10px;

  padding: 15px

}

.navbar-toggler{

  font-size: 30px;

  padding: 5px;

  border: 0;

  margin-right: 5px;

}

.navbar-toggler:focus{

  box-shadow: none

}

.navbar-toggler i{

  color: var(--secondary)

}

.navbar-expand-lg{

  transition: ease-in-out 0.1s;

  background-color: var(--bg-body);

  border-bottom: 1px solid #ddddddad;

  position: sticky;

  top: 0;

  z-index: 999;

}



.navbar-toggler.collapsed .la-times, .navbar-toggler .la-bars{

  display: none

}

.navbar-toggler.collapsed .la-bars, .navbar-toggler .la-times{

  display: block

}



.navbar-expand-lg .navbar-nav .nav-link{

  padding-right: 20px;

  padding-left: 20px;

  text-transform: uppercase;

  font-size: 18px;

  font-weight: 500;

  color: var(--secondary)

}

.navbar-expand-lg .navbar-nav .nav-link:hover, .navbar-expand-lg .navbar-nav .nav-link:hover{

  color: var(--primary)

}



.dropdown-menu .dropdown-item{

  padding: 8px 20px;

  font-size: 17px;

  font-weight: 400;

  display: flex;

  flex-direction: column

}

.dropdown-menu .dropdown-item:hover,.dropdown-menu .dropdown-item:active,.dropdown-menu .dropdown-item:focus{

  background: #eee;

  color: var(--black)

}



.hero-section{

  position: relative;

  overflow: hidden;

  z-index: 1

}

.hero-cta{

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  -webkit-transform: translate(-50%, -50%);

  z-index: 5;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 20px;

  display: none

}

.hero-cta a.btn-outline{

  color: #fff;

  opacity: 0.7;

  border: 1px solid #ddd;

  background-color: rgba(0,0,0,0.2)

}

.hero-cta a.btn-outline:hover{

  opacity: 1;

}



.hero-section .item{

  position: relative

}

.hero-section .item:before{

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background-color: rgba(0,0,0,0.5);

  z-index: 1

}



.owl_hero .owl-nav{

  opacity: 0.4

}

.owl_hero:hover .owl-nav{

  opacity: 1

}

.navbar>.container{

  gap: 15px

}

.search-bar-container{

  width: 90%;

  max-width: 550px;

  margin: -30px auto 80px;

  display: flex;

  background-color: #fff;

  border-radius: 50px;

  padding: 5px;

  box-shadow: 0 4px 15px rgba(0,0,0,0.2);

  overflow: hidden;

  position: relative;

  z-index: 2

}



.search-bar-container input{

  flex: 1;

  border: none;

  padding: 13px 25px;

  outline: none;

  font-size: 16px;

  border-radius: 50px 0 0 50px;

}



.search-btn{

  background-color: var(--primary);

  color: #fff;

  border: none;

  width: 48px;

  height: 48px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50px;

  cursor: pointer;

  transition: 0.3s;

}

.btn{

  text-transform: capitalize;

}

.search-btn:hover{

  background-color: var(--primary2);

}



.bg1{

  background-image: url(../images/bg1.png);

  background-position: left center;

  background-repeat: no-repeat;

}

.bg2{

  background-image: url(../images/bg2.png);

  background-position: left center;

  background-repeat: no-repeat;

}

.bg3{

  background-image: url(../images/bg3.png);

  background-position: left center;

  background-repeat: no-repeat;

}

.bg4{

  background-image: url(../images/bg4.png);

  background-position: left center;

  background-repeat: no-repeat;

}

.bg5{

  background-image: url(../images/bg5.png);

  background-position: left center;

  background-repeat: no-repeat;

}

.bg6{

  background-image: url(../images/bg6.png);

  background-position: left center;

  background-repeat: no-repeat;

}

.bg-dtls1{

  background-image: url(../images/bg-dtls1.png);

  background-position: right top;

  background-repeat: no-repeat;

}

.bginner{

  background-image: url(../images/bg6.png);

  background-attachment: fixed;

  background-position: center;

  background-repeat: no-repeat;

}



.p-20{

  padding: 20px

}

.home-sec:nth-of-type(even){

  background-color: #f9f9f9d9;

}



.bg-white{

  background-color: #fff!important;

}

.bgc1{

  background-color: #f9f9f9d9

}

.bgc2{

  background-color: #f7f7f7

}

.bgc3{

  background-color: #f5f5f5

}



.featured{

}



.art-card{

  transition: ease-in-out 0.2s

}

.art-card:hover{

  transform: translateY(-5px);

  --webkit-transform: translateY(-5px);

  box-shadow: 0 8px 20px #00000047

}



.exhib .lead span{

  display: inline-block;

  width: 130px

}





.owl_exhibition,.owl_exhibition .owl-item img, .owl_news_home, .owl_news_home .owl-item img{

  border-radius: 10px

}



.owl_news_home .item{

  position: relative

}

.owl_news_home .item a{

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  display: flex;

  padding: 20px;

  color: #fff;

  z-index: 5;

  align-items: flex-end;

  font-size: 18px;

  font-family: 'Play';

  line-height: 1.2;

  opacity: 0.75

}

.owl_news_home .item a:before{

  content: '';

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 80%;

  background: linear-gradient(to top, rgba(0,0,0,0.3), rgba(0,0,0,0));

  z-index: -1;

  border-radius: 10px

}

.owl_news_home .item:hover a:before{

  background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0));

}

.owl_news_home .item:hover a{

  opacity: 1

}



.preview .mt--50{

  margin-top: -50px

}

.preview img{

  border-radius: var(--rad10);

  transition: ease-in-out 0.3s;

}

.preview img:hover{

  transform: translateY(-10px);

  -webkit-transform: translateY(-10px);

  box-shadow: 0 10px 20px #ddd

}



.featuredartist{

}



.artist-card{

  position: relative;

  overflow: hidden

}

.artist-card p{

  position: absolute;

  bottom: 20px;

  left: 15px;

  right: 15px;

  text-align: center;

  z-index: 99;

  color: #fff;

  margin: 0;

  transition: ease-in-out 0.2s;

  opacity: 0.4

}

.artist-card:hover p{

  opacity: 1;

  bottom: 35px

}

.artist-card:hover .artist-img{

  filter: grayscale(0%);

}



.artwork-counter{

  position: absolute;

  z-index: 10;

  top: -45px;

  left: 50%;

  transform: translateX(-50%);

  -webkit-transform: translateX(-50%);

  padding: 6px 18px;

  background: #fff;

  color: var(--primary);

  font-size: 15px;

  font-weight: 500;

  border-radius: 30px;

  transition: ease-in-out 0.2s;

  white-space: nowrap;

  text-align: center

}

.artist-card:hover .artwork-counter{

  top: 20px;

}



.owl_testi{

  /*padding-top: 60px*/

}



.testi-card{

  position: relative;

  background: url(../images/bg-testi.png) top right no-repeat #fff;

  border-radius: var(--rad10);

  box-shadow: 0 10px 10px #dddddd59;

  padding: 60px 20px 20px;

  margin: 65px 0 20px;

  text-align: center

}

.testi-image{

  position: absolute;

  top: -60px;

  width: 120px;

  height: 120px;

  border-radius: 50%;

  left: 50%;

  transform: translateX(-50%);

  --webkit-transform: translateX(-50%);

  border-radius: 50%;

  overflow: hidden;

  box-shadow: 0 8px 8px #eee;

}

.testi-image img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 50%;

}

.testi-card .star{

  width: auto!important;

  margin-bottom: 15px

}

.testi-card h5{

  margin: 15px 0

}

.testi-card p{

  margin: 0 0 10px

}





footer h5{

  font-size: 22px

}

.footer-logo{

  max-width: 50px

}

footer .link{

  transition: ease-in-out 0.2s

}

footer .link:hover{

  color: var(--primary);

  padding-left: 5px;

  opacity: 1

}

.footer-about{

  font-size: 14px;

  color: #aaa

}

.footer-social a{

  width: 30px;

  height: 30px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border: 1px solid #666;

  border-radius: 50%;

  font-size: 16px;

  color: #999;

  padding: 0

}

.footer-social a:hover{

  border-color: #999;

  color: #fff;

  padding: 0!important

}



footer p.txt{

  color: #aaa;

  font-size: 15px

}





.copyright{

  font-size: 15px;

  color: #999

}

.copyright .link{

  padding: 10px;

  color: #fff;

  opacity: 0.9

}

.copyright .link:hover{

  padding: 10px;

  opacity: 1

}

.view-more-wrap .more-link{

  display: inline-flex;

  align-items: center;

  gap: 10px;

  font-size: 15px;

  color: var(--primary);

  text-decoration: none;

  padding-bottom: 4px;

  text-align: right;

}







.inner-banner{

  background-image: url();

  background-attachment: fixed;

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

  position: relative;

  z-index: 1;

  height: 20vh;

  display: flex;

  align-items: center;

  justify-content: center

}

.inner-banner:before{

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(0,0,0,0.5);

  content: '';

  z-index: -1

}

.inner-banner h4{

  font-size: 24px;

  text-align: center;

  color: #fff;

  margin: 0;

}



.bread_crumb{

  background: #f9f9f9;

  border-bottom: 1px solid #ddddddad;

  padding: 15px 0;

  transition: ease-in-out 0.1s;

  position: relative;

}

.bread_crumb.sticky{

  position: sticky;

  top: 77px;

  z-index: 11;



}



.bread_crumb .breadcrumb{

  margin: 0

}



.fixed-400,

.col-fluid{

  padding-left: 15px;

  padding-right: 15px;

}





.filter-wrap{

  position: fixed;

  top: 0;

  left: 0;

  width: 90%;

  max-width: 350px;

  bottom: 0;

  z-index: 101;

  box-shadow: 0 0 20px #0000004d;

  background: #fff;

  height: 100vh;

  margin-left: -370px;

  transition: ease-in-out 0.5s;

}

.filter-wrap.open{

  margin-left: 0

}

.filter-overlay {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(0,0,0,0.4);

  z-index: 100;

  display: none;

}

.filter-header{

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 12px 20px;

  box-shadow: 0 0 10px #0000003b;

  position: relative;

  height: 64px;

}

.filter-footer{

  padding: 10px 20px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  height: 60px;

  box-shadow: 0 0 10px #0000003b;

}



.art-filter{

  padding: 20px;

  background: #fff;

  display: flex;

  flex-direction: column;

  height: calc(100vh - 124px);

  overflow-y: auto

}



.filter-block+.filter-block{

  border-top: 1px solid #eee;

  padding-top: 20px;

  /*margin-top: 18px;*/

}

/*.filter-block:last-child{

  border-bottom: 0;

  padding-bottom: 0;

  margin-bottom: 0;

}*/



.filter-title{

  margin-bottom: 20px;

  font-size: 18px;

  cursor: pointer;

  position: relative

}



.filter-title .toggle-icon{

  transition: transform 0.25s ease;

  position: absolute;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

  --webkit-transform: translateY(-50%)

}

.filter-title.collapsed .toggle-icon{

  transform: translateY(-50%) rotate(180deg);

  -webkit-transform: translateY(-50%) rotate(180deg);

}



.filter-content{

  /*margin-bottom: 18px;*/

  /*  max-height: 186px;

    overflow-y: auto*/

}

.form-check-input{

  --bs-form-check-bg: var(--bs-form-control-bg);

  width: 18px;

  height: 18px;

  margin-top: .20em;

  border: 1px solid #ccc

}

.form-check-input:focus{

  box-shadow: none

}

.form-check-input:checked{

  background-color: var(--primary);

  border-color: var(--primary);

}

.form-check{

  position: relative;

  margin-bottom: 12px;

}

.form-check:last-child{

  margin-bottom: 18px;

}

.dropdown-menu.filter-dropdown{

  padding: 0;

  min-width: 240px;

}

.dropdown-menu.filter-dropdown.price-range{

  padding: 0;

  min-width: 320px;

}

.dropdown-menu.dropdown-menu-end.filter-dropdown .form-check-label{

  white-space: nowrap

}



.dd-filter-list-wrap{

  padding: 20px 20px 10px;

  max-height: 300px;

  overflow-y: auto

}

.dd-filter-footer{

  padding: 20px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  box-shadow: 0 0 10px #0000003b

}





.form-check .counter{

  position: absolute;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

  --webkit-transform: translateY(-50%);

  z-index: 5;

  display: inline-flex;

  padding: 3px 7px;

  border-radius: var(--rad);

  color: var(--secondary);

  background: #eee;

  font-size: 14px

}



.form-check-label{

  cursor: pointer;

}



.filter-more{

  font-size: 12px;

  color: #666;

  text-transform: uppercase;

  letter-spacing: 0.05em;

  display: inline-block;

  margin-top: 6px;

}



.filter-more:hover{

  text-decoration: underline;

}



.color-swatches{

  display: grid;

  grid-template-columns: repeat(8, 1fr);

  gap: 6px;

}



.color-swatches span{

  width: 18px;

  height: 18px;

  border-radius: 50%;

  cursor: pointer;

  border: 1px solid #ddd;

}





.artwork-list-header{

  background: var(--bg-body);

  padding: 30px 0 20px;

  transition: ease-in-out 0.1s

}



.artwork-list-header.sticky{

  position: sticky;

  top: 77px;

  z-index: 11;

  box-shadow: 0 5px 8px #00000033;

  padding: 15px 0

}

.artwork-list-header.exhibitions.sticky{

  position: sticky;

  top: 77px;

  z-index: 11;

  box-shadow: none;

  padding: 15px 0;

  border-bottom: 1px solid #ddd

}



.artwork-list-header p{

  margin: 0

}

.artwork-list-header .sort-by{

  max-width: 300px;

  display: flex;

  flex-wrap: nowrap;

  gap: 20px;

  align-items: center;

  white-space: nowrap;

  margin: 0 0 0 auto

}

.filter-btn-wrap{

  display: flex;

  align-items: center;

  gap: 15px;

}

.pitem{

  position: relative;

  background: #fff;

  border-radius: var(--rad10);

  overflow: hidden;

  /* height: 100%; */

  transition: ease-in-out 0.2s;

  box-shadow: 0 5px 5px #eee;

  overflow: hidden;

}

.pitem:hover{

  box-shadow: 0 10px 10px #ddd;

  transform: translateY(-3px);

  --webkit-transform: translateY(-3px);

}

.pitem-wishlist{

  position: absolute;

  right: 15px;

  top: 15px;

  z-index: 5;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 32px;

  height: 32px;

  background: rgba(255,255,255,0.9);

  border-radius: 50%;

  color: var(--gray);

  font-size: 20px;

}

.pitem-wishlist.active{

  color: var(--primary)

}

.pitem-wishlist i{

  transition: ease-in-out 0.2s;

  transform: scale(1);

}

.pitem-wishlist:hover i{

  transform: scale(1.2);

}



.pitem-image{

  /*aspect-ratio: 1/1;*/

  display: block;

  overflow: hidden;

  border-radius: var(--rad10)

}

.pitem-image img{

  width: 100%;

  height: auto;

  transition: ease-in-out 0.5s;

}

.pitem-image:hover img{

  /*transform: scale(1.05);*/

}



.pitem-actions{

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column;

  gap: 10px;

  position: absolute;

  right: -100px;

  bottom: 15px;

  transition: ease-in-out 0.3s;

  z-index: 6

}

.pitem:hover .pitem-actions{

  right:15px;

}



.pitem-actions a{

  font-size: 20px;

  color: var(--secondary);

  display: inline-flex;

  padding: 8px;

  background: #eee;

  border-radius: 50%;

}



.pitem-actions a:hover{

  color: var(--primary)

}



.btn-wlist.active .la-heart:before{

  font-weight: 900;

  color: var(--primary)

}

.btn-wlist.active:hover .la-heart:before{

  color: var(--secondary)

}

.btn-wlist .la-heart:before{

  font-weight: 400

}





.pitem-desc{

  background: url(../images/bg-pcard.png) bottom right no-repeat #fff;

  padding: 8px 20px 20px;

  border-radius: 0 0 var(--rad10) var(--rad10)

}

.pitem.exhibitions .pitem-desc p{

  margin-top: 10px

}



.pitem-name{

  font-size: 20px;

  font-family: "Play", sans-serif;

  color: var(--primary);

  display: block;

  margin-bottom: 5px

}

.pitem-name span{

  color: var(--gray);

}

.pitem-name:hover,.pitem-name:hover span{

  color: var(--primary);

}

.pitem-artist{

  font-size: 15px;

  font-family: "Play", sans-serif;

  color: var(--heading);

  display: inline-flex;

  background: #eee;

  border-radius: 20px;

  padding: 6px 20px;

  margin-bottom: 15px;

}

.pitem-artist:hover{

  background: var(--primary);

  color: #fff;

}



.pitem-desc p{

  color: var(--secondary);

  font-weight: 700;

  margin-bottom: 14px;

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

}

.pitem-desc p .price-inr{

  /*  color: #000;*/

}

.pitem-desc ul{

  /*padding-left: 20px;*/

  margin: 0;

  padding: 0;

  display: block;

}

.pitem-desc ul li{

  font-size: 15px;

  color: var(--gray);

  position: relative;

  line-height: 1.6;

  display: block

}

.pitem-desc ul li strong{

  font-weight: 600;

}

.pitem-desc ul li:last-child strong{

  display: block

}

.search-filter{

  position: relative;

  margin-bottom: 20px

}



.search-filter .btn{

  position: absolute;

  top: 50%;

  right: 5px;

  transform: translateY(-50%);

  --webkit-transform: translateY(-50%);

  z-index: 5;

  border: 0;

  background: transparent;

  height: 40px;

  width: 40px;

  padding: 0;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  color: var(--secondary)

}

.search-filter .btn:hover{

  color: var(--primary)

}

.search-filter .btn i{

  -webkit-transform: scale(-1, 1);

  transform: scale(-1, 1);

}

.filter-content.fixed-height{

  height: 220px;

  overflow-y: auto

}

.open-filter-icon{

  color: var(--primary);

  padding: 5px 10px 5px 0;

  font-size: 24px;

}

.close-filter-icon{

  font-size: 20px;

  color: var(--primary);

  padding: 10px 0 10px 10px;

  display: inline-flex

}



#priceSliderSidebar, #priceSliderDropdown{

  height: 8px;

  background: #ddd;

  border-radius: 2px;

  border: 0;

}



.ui-slider .ui-slider-range{

  background: var(--primary);

  border: 0;

}



.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{

  width: 20px;

  height: 20px;

  border-radius: 50%;

  background: #555;

  border: none;

  top: -6px;

  cursor: pointer;

  border: 0

}



.btn.btn-apply{

  padding: 6px 10px;

  min-width: 50px

}



.owl_more_from_artist .pitem{

  margin: 10px

}

.owl_you_may_like .pitem{

  margin: 10px

}





.dtlsp-img-wrap{

  max-width: 700px;

  margin: 0 auto;

}



.dtlsp-img-wrap-main{

  margin-bottom:20px;

  display:flex;

  align-items:center;

  justify-content:center;

}

.dtlsp-img-wrap-main .owl-item img{

  max-height: 65vh;

  width: auto;

  height: auto;

  max-width: 100%;

  margin: 0 auto

}

.owl_dtls_thumb{

  padding: 0 20px

}

.owl-carousel.owl_dtls_thumb .owl-nav button.owl-next, .owl-carousel.owl_dtls_thumb .owl-nav button.owl-prev{

  background: #888

}



.owl_dtls_thumb img{

  border:1px solid transparent;

  width:calc(100% - 6px);

  height:110px;

  object-fit:cover;

  cursor:pointer;

  opacity:0.75;

  transition:0.2s;

  padding:2px;

  display:block;

}



.owl_dtls_thumb img:hover{

  opacity:0.9;

}



.owl_dtls_thumb .current img{

  border-color:var(--secondary);

  opacity:1;

}



.art-dtls-right-col p{

  margin-bottom: 15px

}

.art-dtls-right-col h6{

  color: #000;

  margin-bottom: 5px

}

.art-dtls-right-col p span{

  color: #000;

  font-family: 'Play';

  font-size: 18px

}

.art-dtls-right-col ul{

  padding-left: 20px

}

.art-dtls-right-col ul li{

  margin: 5px 0

}





.dtlsp-art-name{

  margin-bottom: 20px;

  line-height: 1.3

}

.dtlsp-art-name small{

  display: block;

  color: #777;

  font-size: 18px;

}





.pitem-artist.dtlsp{

  display: block;

  background: #fff;

  font-size: 18px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 5px;

  border: 1px solid #ddd

}

.pitem-artist.dtlsp:hover{

  background: var(--primary)

}



.dtlsp-artist-name a{

  font-size: 18px;

  font-weight: 500;

  color: var(--primary)

}

.dtlsp-artist-name a:hover{

  color: var(--primary2);

  padding-left: 6px;

}



.badge{

  font-size: 14px;

  font-weight: 500;

  padding: 8px 14px;

  background: #f9f9f9;

  border: 1px solid #ccc;

  border-radius: 20px;

  color: var(--gray);

  margin-right: 5px;


}

.badge:hover{

  background: #eee;

  border-color: #999;

  color: #000;

}

a.badge:hover{

  background: var(--primary);

  border-color: var(--primary);

  color: #fff;

}



.badge.sm{

  font-size: 12px;

  font-weight: 400;

  padding: 7px 12px;

  margin-right: 0

}



.dtlsp-btns{

  display: flex;

  align-items: center;

  gap: 20px;

  flex-wrap: wrap

}



.dtlsp-price h4{

  font-family: 'Mulish', sans-serif

}
.iconic-link{
  position: relative;
  z-index: 1
}
.iconic-link a{

  display: inline-flex;

  padding: 6px 0;

  color: var(--secondary);

  gap: 5px;

}

.iconic-link a:hover{

  color: var(--primary)

}



.iconic-link a i{

  font-size: 24px;

  color: var(--primary)

}



.lined-tabs .tab-content{

  display: block!important;

  padding-top: 10px

}

.lined-tabs .nav-tabs{

  border-bottom: 2px solid #ccc;

  margin-bottom: 20px;

  /*display: inline-flex;*/

  gap: 20px

}

.lined-tabs .nav-tabs .nav-item:not(:last-child){

  margin-right:20px;

}

.lined-tabs .nav-tabs .nav-link{

  color: var(--gray);

  font-size: 18px;

  font-weight: 500;

  border: 0;

  border-bottom: 2px solid transparent;

  padding: 0 0 10px 0;

  margin-bottom: -2px

}

.lined-tabs .nav-tabs .nav-link.active{

  color: var(--primary);

  border-color: var(--primary)

}

.lined-tabs .nav-tabs .nav-link:hover{

  color: var(--primary);

}

.owl_more_from_artist{

  padding-bottom: 20px;

  padding-top: 10px

}

.owl_more_from_artist .pitem-image, .owl_you_may_like .pitem-image, .owl_artist_details_artwork .pitem-image{

  aspect-ratio: 1/1

}

.owl_more_from_artist .pitem-image img, .owl_you_may_like .pitem-image img, .owl_artist_details_artwork .pitem-image img{

  width: 100%;

  height: 100%;

  object-fit: cover

}



.owl_you_may_like{

  padding-bottom: 20px;

  padding-top: 10px

}



.dtlsp-artist-profile-box{



}



.tab-pane-artist-profile p{

  font-size: 17px;

}

.tab-pane-artist-profile p:has(strong){

  display: block;

  font-size: 18px;

  font-family: 'Play';

  margin-bottom: 5px;

}





.dtlsp-profile{

  display: flex;

  align-items: center;

  gap: 20px

}

.dtlsp-profile-img{

  width: 150px;

  aspect-ratio: 1/1;

  flex: 0 0 150px;

  border-radius: 50%;

  overflow: hidden

}

.dtlsp-profile-img img{

  width: 100%;

  height: 100%;

  object-fit: cover

}

.dtlsp-profile-info{

  flex: 1

}

.profile-short-desc{

  display: -webkit-box;

  -webkit-line-clamp: 4;

  -webkit-box-orient: vertical;

  overflow: hidden;

  font-size: 17px;

  line-height: 1.7

}



.page-link,.disabled>.page-link, .page-link.disabled{

  color: var(--gray);

  border: 0;

  background: #fff;

  font-size: 20px;

  padding: 8px 11px;

  transition: ease-in-out 0.2s;

  transform: scale(1);

  --webkit-transform: scale(1);

  /*font-family: 'Play'*/

}



.disabled>.page-link, .page-link.disabled{

  color: #999;

}

.page-link:hover{

  transform: scale(1.2);

  --webkit-transform: scale(1.2);

}

.page-link:hover,.page-link:active,.page-link:focus{

  color: var(--primary);

  border: 0;

  background: #fff;

  box-shadow: none;

}



.active>.page-link, .page-link.active{

  color: var(--primary);

  background: #fff;

  font-weight: bold;

  transform: scale(1);

  --webkit-transform: scale(1);

}

.active>.page-link.next{

  color: #333

}







/*artist list*/

.search-artist{

  position: relative

}

.search-artist .form-control-lg{

  height: 50px;

}

.search-artist .btn{

  position: absolute;

  top: 0;

  right: 0;

  height: 50px;

  border-radius: 0 30px 30px 0

}

.search-artist .btn:hover{

  transform: none;

  --webkit-transform: none;

}



.artit-pagination .pagination{

  flex-wrap: wrap

}



.sec-artist-by-types:nth-of-type(even){

  background-color: #f9f9f9d9;

}



.card-artist-type{

  position: relative;

  border-radius: 10px

}

.card-artist-type .card-artist-type-img{

  aspect-ratio: 1/1;

  position: relative;

  border-radius: 10px;

  overflow: hidden

}

.card-artist-type .card-artist-type-img:after{

  content: "";

  position: absolute;

  inset: 0;

  background: radial-gradient(

    circle,

    rgba(0,0,0,0) 0%,

    rgba(0,0,0,0.2) 40%,

    rgba(0,0,0,0.5) 70%,

    rgba(0,0,0,0.7) 100%

    );

  z-index: 1;

  border-radius: var(--rad10);

  transition: ease-in-out 0.2s

}

.card-artist-type:hover .card-artist-type-img:after{

  opacity: 0.1

}

.card-artist-type .card-artist-type-img img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: top center

}

.card-artist-type .card-artist-type-info{

  position: relative;

  display: flex;

  padding: 20px 2px;

  gap: 10px;

  align-items: center;

  justify-content: space-between

}

.card-artist-type.search-loop .card-artist-type-info{

  padding: 15px 2px;

}

.card-artist-type .card-artist-type-info h5{

  position: relative;

  margin-bottom: 5px;

  transition: ease-in-out 0.2s;

  color: var(--secondary);

  font-size: 18px;

}

.card-artist-type.search-loop .card-artist-type-info h5{

  font-size: 16px;

  margin-bottom: 2px

}

.card-artist-type .card-artist-type-info h5:hover{

  color: var(--primary)

}

.card-artist-type .card-artist-type-info p{

  position: relative;

  margin: 0;

  color: var(--gray)

}

.card-artist-type.search-loop .card-artist-type-info p{

  font-size: 14px

}

.card-artist-type .card-artist-type-info .btn{

  position: relative;

  min-height: 40px;

  padding: 8px 30px;



}

.card-artist-type .card-artist-type-info div{

  flex: 1

}



.card-artist-type .card-artist-type-info .btn{

  flex: 0 0 112px;

  display: none

}





/* same card in search result page*/



.card-artist-type.search-loop {

  position: relative;

  border-radius: 10px

}

.card-artist-type.search-loop .card-artist-type-img{

  aspect-ratio: 1/1;

  position: relative;

  border-radius: 10px;

  overflow: hidden

}

.card-artist-type.search-loop .card-artist-type-img:after{

  content: "";

  position: absolute;

  inset: 0;

  background: radial-gradient(

    circle,

    rgba(0,0,0,0) 0%,

    rgba(0,0,0,0.2) 40%,

    rgba(0,0,0,0.5) 70%,

    rgba(0,0,0,0.7) 100%

    );

  z-index: 1;

  border-radius: var(--rad10);

  transition: ease-in-out 0.2s

}

.card-artist-type:hover .card-artist-type-img:after{

  opacity: 0.1

}





small{

  color: var(--gray)

}



.artist-profile-box{

  display: flex;

  gap: 20px;

  align-items: center

}

.artist-profile-box .profile-image{

  width: 200px;

  flex: 0 0 200px;

}

.artist-profile-box .profile-image{

  width: 250px;

  flex: 0 0 250px;

  background: #fff;

  padding: 10px;

  border-radius: 10px;

  overflow: hidden;



}

.artist-profile-box .profile-image img{

  width: 100%;

  height: auto;

  border-radius: 10px;

  overflow: hidden;

}

.artist-profile-box .profile-info{

  flex: 1;

}

.artist-profile-box .profile-info h3{

  font-size: 30px

}

.artist-profile-box .profile-info{

  font-size: 18px;

}

.artist-profile-box .profile-info p i{

  width: 26px;

  color: var(--primary);

  font-size: 20px;

}

.rad10{

  border-radius: 10px;

  overflow: hidden

}



.tab-pane ul{

  padding-left: 20px

}

.tab-pane ul li{

  margin: 10px 0;

  line-height: 1.7

}

.tab-pane .pitem-desc ul{

  padding-left: 0

}

.tab-pane .pitem-desc ul li{

  margin: 0

}





.details-image-wrap{

  display: flex;

  gap: 20px;

}

.details-image-wrap .thumb-wrap{

  display: flex;

  gap: 17px;

  flex-direction: column;

  width: 80px;

  flex: 0 0 80px

}

.details-image-wrap .thumb-wrap div{

  width: 80px;

  height: 80px;

  padding: 4px;

  border: 1px solid #ddd;

  border-radius: 3px;

  background: #fff;

  cursor: pointer

}

.details-image-wrap .thumb-wrap div.active{

  border-color: var(--secondary)

}

.details-image-wrap .thumb-wrap div img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  cursor: pointer

}





.details-image-wrap .main-image-wrap{

  flex: 1;

  position: relative

}

.details-image-wrap .main-image-wrap img{

  width: 100%;

  height: auto;

  border-radius: 5px;

}



.img-loader {

  position: absolute;

  inset: 0;

  background: rgba(255,255,255,0.6);

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 10;

  opacity: 0;

  visibility: hidden;

  transition: 0.2s;

}



.img-loader.show {

  opacity: 1;

  visibility: visible;

}



.img-loader::after {

  content: "";

  width: 36px;

  height: 36px;

  border: 3px solid #ccc;

  border-top: 3px solid #000;

  border-radius: 50%;

  animation: spin 0.7s linear infinite;

}



@keyframes spin {

  to {

    transform: rotate(360deg);

  }

}



.exhibition-header{

  white-space: nowrap;

  display: flex;

  gap: 20px;

  align-items: center;

  flex-wrap: wrap

}

.exhibition-header .form-control, .exhibition-header .form-select{

  max-width: 200px

}



.artwork-list-header.exhibitions{

}

.artwork-list-header.exhibitions.sticky{

  box-shadow: none;

  border-bottom: 1px solid #ddd

}



.card-exhibition-list-item{

  position: relative;

  border-radius: 10px;

  text-align: center;

  transition: ease-in-out 0.2s;

  box-shadow: 0 5px 5px #eee;

  display: flex;

  flex-direction: column;

  height: 100%;

}

.card-exhibition-list-item:hover{

  box-shadow: 0 10px 10px #ddd;

  transform: translateY(-3px);

  --webkit-transform: translateY(-3px);

}

.card-exhibition-list-item .hover-upcoming{

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%,-40%);

  --webkit-transform: translate(-50%, -40%);

  width:44px;

  height: 44px;

  border-radius: 50%;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  font-size: 24px;

  background: #fff;

  transition: ease-in-out 0.2s;

  opacity: 0;

  z-index: 99

}

.card-exhibition-list-item:hover .hover-upcoming{

  top: 30%;

  opacity: 1

}

.card-upcoming-img{

  aspect-ratio: 1.2/1;

}

.card-upcoming-img img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: top center

}

.card-exhibition-list-item .img-wrap{

  aspect-ratio: 1/1;

  position: relative;

  border-radius: 10px;

  overflow: hidden;

  position: relative;

  flex: 0 0 auto;

}

.card-exhibition-list-item .img-wrap img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: top center

}

.card-exhibition-list-item .img-wrap .hover{

  position: absolute;

  bottom: 15%;

  left: 50%;

  transform: translate(-50%,-40%);

  --webkit-transform: translate(-50%, -40%);

  width:44px;

  height: 44px;

  border-radius: 50%;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  font-size: 24px;

  background: #fff;

  transition: ease-in-out 0.2s;

  opacity: 0

}

.card-exhibition-list-item .img-wrap:hover .hover{

  bottom: 40%;

  opacity: 1

}



.card-exhibition-list-item .info-wrap{

  padding: 20px 15px;

  background: url(../images/bg-pcard.png) bottom right no-repeat #fff;

  border-radius: 0 0 var(--rad10) var(--rad10);

  flex: 1 1 auto;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

}

.card-exhibition-list-item .info-wrap i{

  color: var(--primary)

}

.card-exhibition-list-item .info-wrap h5{

  transition: ease-in-out 0.2s;

  color: var(--primary);

}

.card-exhibition-list-item .info-wrap h5:hover{

  color: var(--primary);

}

/*a.card-exhibition-list-item .info-wrap h5{

  font-size: 16px;

}*/

a.card-exhibition-list-item .info-wrap p{

  font-size: 15px;

  color: #000

}

.card-exhibition-list-item .info-wrap .badge{

  margin: 10px auto 15px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: fit-content;

}



.card-exhibition-list-item .info-wrap p{

  margin-bottom: 5px;

  color: var(--gray)

}

.card-exhibition-list-item .info-wrap p:first-child{

  color: #000

}

.card-exhibition-list-item .info-wrap p:last-child{

  margin: 0;

}



.info-wrap-gap{



}



.owl_exhibitions_list.owl-theme .owl-nav.disabled + .owl-dots{

  margin: 0;

  position: absolute;

  bottom: 15px;

  left: 50%;

  transform: translateX(-50%);

  --webkit-transform: translateX(-50%);

  z-index: 8

}

.owl_exhibitions_list.owl-theme .owl-dots .owl-dot span, .owl_exhibitions_list.owl-theme .owl-dots .owl-dot span{

  background: #fff;

  width: 10px;

  height: 10px;

}

.owl_exhibitions_list.owl-theme .owl-dots .owl-dot.active span, .owl_exhibitions_list.owl-theme .owl-dots.active .owl-dot span{

  background: var(--primary)

}



.owl_exhibition_list_hero{

  margin-bottom: 16px

}

.owl_exhibition_list_hero.owl-theme .owl-nav.disabled + .owl-dots{

  margin-top: -40px;

  z-index: 8;

  position: relative

}



.owl_exhibition_list_hero.owl-theme .owl-dots .owl-dot span, .owl_exhibition_list_hero.owl-theme .owl-dots .owl-dot span{

  background: #fff

}

.owl_exhibition_list_hero.owl-theme .owl-dots .owl-dot.active span, .owl_exhibition_list_hero.owl-theme .owl-dots.active .owl-dot span{

  background: var(--primary)

}



.fab {

  position: fixed;

  left: 10px;

  bottom: 24px;

  border-radius: 999px;

  color: #fff;

  border: none;

  box-shadow: 0 10px 10px rgba(0, 0, 0, .25);

  width: 60px;

  height: 60px;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 0.6rem;

  font-weight: 700;

  z-index: 99;

  transition: all 0.3s ease;

  animation: floatY 6s linear infinite;

  will-change: transform;

}



.fab:hover {

  transform: translateY(-3px);

  box-shadow: 0 16px 32px rgba(0, 0, 0, .3);

  animation-play-state: paused;

}



#scrollTopBtn{

  position: fixed;

  bottom: 24px;

  right: 20px;

  width: 36px;

  height: 36px;

  border: none;

  border-radius: 50%;

  background: #999;

  color: #fff;

  font-size: 16px;

  cursor: pointer;

  display: none;

  box-shadow: 0 5px 10px rgba(0, 0, 0, .15);

  transition: all .3s ease;

  z-index: 999;

  animation: floatY 6s linear infinite;

  will-change: transform;

}

#scrollTopBtn:hover{

  transform:translateY(-5px);

  background:#444;



}







footer.footer-dark{

  background-color: #111;

  background-image: url(../images/bgf11.png), url(../images/bgf12.png);

  background-position: top left, top right;

  background-repeat: no-repeat

}

footer{

  h5{

    color: #fff

  }

}

footer.footer-dark{

  h5{

    color: #fff

  }

}

footer.footer-dark p.txt,footer.footer-dark p.txt a{

  color: #ccc

}

footer.footer-dark p.txt a:hover{

  color: var(--link)

}

.card-exhibition-item{

  position: relative;



}

.fancybox__thumbs .carousel__slide .fancybox__thumb::after{

  border: 2px solid var(--primary);

  padding: 2px

}



.owl_news_common{

}

.owl_news_common .item{

  background: #fff;

  border-radius: var(--rad10);

  overflow: hidden;

  background: #fff;

  transition: ease-in-out 0.2s;

  margin-bottom: 20px;

  display: flex;

  height: 100%

}

.owl_news_common item:hover{

  background: #f9f9f9

}





.card-news{

  display: block;

  position: relative;

  z-index: 1;

  text-align: center

}



.card-news .hover{

  position: absolute;

  bottom: 15%;

  left: 50%;

  transform: translate(-50%,-40%);

  --webkit-transform: translate(-50%, -40%);

  display: inline-flex;

  align-items: center;

  justify-content: center;

  font-size: 15px;

  background: #fff;

  transition: ease-in-out 0.2s;

  opacity: 0;

  padding: 7px 24px;

  border-radius: 30px;

  white-space: nowrap

}

.card-news:hover .hover{

  bottom: 40%;

  opacity: 1

}

.card-news .card-news-image{

  aspect-ratio: 1/1;

  border-radius: var(--rad);

  overflow: hidden;

  /*padding: 5px;*/

  background: #fff



}

.card-news .card-news-image img{

  width: 100%;

  height: 100%;

  object-fit: contain;

  object-fit: cover;

  transition: ease-in-out 0.2s;

}

.card-news .card-news-image:hover img{

  transform: scale(1.05);

  --webkit-transform: scale(1.05);

}



.card-news .card-news-desc{

  padding: 20px;

  background: url(../images/bg-news-card.png) bottom center no-repeat #fff;



}

.card-news-desc i{

  color: #777

}

.card-news .card-news-desc h5{

  margin-bottom: 12px;

  color: var(--dark);

  /*min-height: 50px;*/

  font-size: 18px;

  line-height: 1.4;

}

.card-news.news-views h5{

  /*text-align: center;*/

  margin: 0;

  font-family: inherit;

}

.card-news.news-blog h5{

  font-size: 18px;

}

.card-news.card-archive h5{

  /*text-align: center;*/

}



.card-news:hover .card-news-desc h5{

  color: var(--primary)

}

.card-news .card-news-desc p{

  margin: 0;

  color: var(--gray);

  display: -webkit-box;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

}



.card-news.news-views .card-news-desc{

  padding: 20px 0;

  text-align: left

}

.card-news.news-views .card-news-desc h5{

  display: flex;

  flex-wrap: wrap;

  gap: 5px;

  flex-direction: column

}



.listing-news-views .card-news .card-news-image{

  aspect-ratio: 1/1

}

.listing-card-archive .card-news .card-news-image{

  aspect-ratio: 1/1

}

.listing-news-blog .card-news .card-news-image{

  aspect-ratio: 1/0.7

}





.news-sidebar{

  background: #fff;

}

.news-sidebar h4{

  font-size: 22px

}

.sidebar-block{

  background: #f5f5f5;

  margin-bottom: 20px;

  border-radius: var(--rad10)

}

.sidebar-block.padding{

  padding: 20px

}

.sidebar-mostly-item{

  display: flex;

  gap: 20px;

  color: #000;

  align-items: center;

  padding: 20px;

  background: #fbfbfb;

  border-top: 1px solid #ddd;

}

.sidebar-mostly-item:last-child{

  border-bottom: 1px solid #ddd;

}

.sidebar-mostly-item:hover{

  color: var(--link);

  background: #f3f3f3;

}

.sidebar-mostly-item div{

  flex: 0 0 70px;

  height: 70px;

  border-radius: 5px;

  overflow: hidden

}

.sidebar-mostly-item img{

  width: 100%;

  height: 100%;

  object-fit: cover

}

.sidebar-mostly-item p{

  flex: 1;

  margin: 0;

  line-height: 1.5;

  font-size: 15px;

  font-weight: 500

}

.newsviews .sidebar-mostly-item p{

  font-size: 17px

}





.search-form-news{

  position: relative;

}



.search-form-news .form-control{

  min-height: 50px;

  border-radius: 50px;

  padding-left: 24px

}

.search-form-news .btn{

  position: absolute;

  top: 50%;

  right: 5px;

  transform: translateY(-50%);

  --webkit-transform: translateY(-50%);

  z-index: 5;

  border: 0;

  background-color: transparent;

  height: 40px;

  width: 40px;

  padding: 0;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  color: var(--secondary);

  font-size: 20px

}

.search-form-news .btn:hover{

  background: var(--primary);

  color: #fff;

  box-shadow: none;

}



/*news views sidebar menu */

.news-sidebar-menu{

  background: #fff;

}

.news-sidebar-menu.sticky{

  position: sticky;

  top: 155px;

  overflow-y: auto;

  max-height: calc(100vh - 165px)

}

.news-sidebar-menu ul{

  list-style: none;

  margin: 0;

  padding: 0;

}

.news-sidebar-menu ul li{

  display: block;

  border-bottom: 1px solid #ddd

}

.news-sidebar-menu ul li a{

  display: block;

  padding: 10px 20px 8px 14px; /* added 6 px left border to make balance*/

  border-left: 6px solid transparent;

  background: #f9f9f9;

  color: #777;



}

.news-sidebar-menu ul li a:hover{

  background: #e5e5e5;

  color: #000

}

.news-sidebar-menu ul li.active a, .news-sidebar-menu ul li.active a:hover{

  background: var(--primary);

  border-left-color: var(--primary2);

  color: #fff

}



.news-sidebar-menu ul li:last-child{

  border-bottom: none;

}



.article-nav a{

  display: block;

  padding: 10px 14px;

  font-size: 14px;

  color: #333;

  text-decoration: none;

  line-height: 1.4;

  transition: background 0.2s ease, color 0.2s ease;

}



.article-nav a:hover{

  background: #f5f7fa;

  color: #0d6efd;

}



.article-nav .active a{

  background: #0d6efd;

  color: #fff;

  font-weight: 500;

}









.art-news-views-navbar-mobile{

  display: flex;

  align-items: center;

  justify-content: space-between;

  background: #f7f7f7;

  padding: 15px;

  border-radius: 8px;

  margin-bottom: 20px;

}





.news-menu-toggle{

  background: none;

  border: 0;

  cursor: pointer;

  display: inline-flex;

  gap: 6px;

  align-items: center;

  font-size: 18px;

  font-weight: 500;

  padding: 0;

  border-radius: 5px;

}

.news-menu-toggle i, .acc-menu-toggle i{

  font-size: 24px;

}



.prev-article,.next-article{

  width: 36px;

  height: 36px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  font-size: 36px;

  color: #fff;

  color: var(--primary);

  border-radius: 50%

}



.prev-article.disabled{

  opacity: 0.5;

  pointer-events: none;

  color: var(--gray)

}



.close-article-menu, .close-account-nav{

  position: absolute;

  top: 5px;

  right: 10px;

  z-index: 99;

  font-size: 30px;

  display: inline-flex;

  background: #eee;

  border-radius: 50%;

  color: #000;

  padding: 5px;

  align-items: center;

  justify-content: center;

}

.border{

  border-radius: 10px

}

/*cart page*/



.cart-item{

  background: #fff;

  display: flex;

  align-items: center;

  gap: 20px;

  margin-bottom: 20px;

  border: 1px solid #ddd;

  border-radius: 10px;

  padding: 20px;

  justify-content: space-between

}



.cart-img{

  width: 80px;

  height: 80px;

  object-fit: cover;

  border-radius: 6px;

}

.cart-item-desc1,cart-item-desc1{

  flex: 0 0 25%

}

cart-item-desc2{

  flex: 1

}

.cart-item-price{

  flex: 0 0 20%;

  text-align: right

}

.cart-item h6{

  margin-bottom: 5px

}

.cart-item p{

  margin: 0;

  color: var(--gray)

}

.cart-item-price p{

  font-size: 16px!important;

  font-weight: 600;

  color: #000;

  margin-bottom: 5px

}

.cart-coupon{



}

.cart-coupon-input{

  max-width: 600px;

  position: relative;

}

/*.cart-coupon-input .form-control,.cart-coupon-input .form-control:focus{

  border-color: var(--primary)

}*/

.cart-coupon-input .btn{

  position: absolute;

  top: 0;

  bottom: 0;

  right: 0;

  z-index: 2;

  border-radius: 0 40px 40px 0

}

.cart-coupon-input .btn:hover{

  transform: none;

  --webkit-transform: none

}



.cart-order-note{

}



.cart-summary{

  background: #f9f9f9;

  position: sticky;

  top: 150px;

}

.remove-cart{

  font-size: 18px;

  display: inline-flex;

  padding: 10px;

  background: #f9f9f9;

  border-radius: 5px;

}







/*checkout*/























































.cmspage{

  font-size: 16px;

  line-height: 1.65

}

.cmspage h3{

  font-size: 30px

}

.cmspage p, .cmspage ul, .cmspage ol{

  margin-bottom: 20px

}

.cmspage img{

  margin-bottom: 20px;

  padding: 10px;

  max-width: 100%;

  height: auto

}



.cmspage p+h3{

  margin-bottom: 10px

}

.cmspage p+h4{

  margin-bottom: 10px

}

.cmspage p+h5{

  margin-bottom: 10px

}

.cmspage p+h6{

  margin-bottom: 10px

}

.cmspage p:has(+ ul){

  margin-bottom: 5px

}

.cmspage ul+h3,.cmspage ul+h4,.cmspage ul+h5,.cmspage ul+h6{

  margin-bottom: 8px

}

.cmspage ol+h3,.cmspage ol+h4,.cmspage ol+h5,.cmspage ol+h6{

  margin-bottom: 8px

}







.box-bordered{

  border: 1px solid #ddd;

  padding: 20px;

  border-radius: 10px;

}

.box-bordered.cart-summary{

  border: 0!important;

}



/*order confirmation page*/

.order-success-message{

}

.order-cust-info{

}

.order-cust-shipping{

}

.order-item-summary{

}

.order-payment-summary-cust{

}

.order-payment-info{

}





/*login modal*/

.login-form-wrap i{

  position: absolute;

  left: 18px;

  top: 15px;

  z-index: 5;

  font-size: 20px;

  color: var(--primary)

}

#loginModal .btn-close{

  position: absolute;

  top: 10px;

  right: 10px;

  z-index: 5;

  font-size: 20px

}

#loginModal .btn-close:focus{

  box-shadow: none

}



.small, small{

  font-size: 85%

}





/*myaccount*/

.account-nav{

  position: relative

}

.account-nav.sticky{

  position: sticky;

  top: 150px;

}

.account-nav ul{

  list-style: none;

  margin: 0;

  padding: 0;

}

.account-nav ul li{

  display: block;

  margin-bottom: 4px;

  border-radius: 5px;

  overflow: hidden

}

.account-nav ul li a{

  display: block;

  padding: 12px 20px 12px 14px; /* added 6 px left border to make balance*/

  border-left: 6px solid transparent;

  background: #f9f9f9;

  color: #000;

  font-weight: 500;

  font-size: 17px;

}

.account-nav ul li a:hover{

  background: #e5e5e5;

  color: #000

}

.account-nav ul li a.active, .account-nav ul li a.active:hover{

  background: var(--primary);

  border-left-color: var(--primary2);

  color: #fff

}



.account-nav ul li:last-child{

  border-bottom: none;

}





.address-box{



}

.address-box i{

  font-size:18px;

  cursor:pointer;

}



.wishlist.pitem{

}

.wishlist.pitem .pitem-image{

  aspect-ratio: 1 / 0.7

}

.wishlist.pitem .pitem-image img{

  width: 100%;

  height: 100%;

  object-fit: cover

}

.wishlist.pitem .pitem-desc{

  text-align: center;

  padding-top: 12px

}

.wishlist.pitem .pitem-desc p{

  justify-content: center

}

.wishlist .pitem-actions{

  flex-direction: row;

  position: relative;

  right: auto;

  bottom: auto;

  justify-content: center;

  margin-bottom: 20px

}



.wishlist.pitem:hover .pitem-actions{

  right: auto;

}



.wishlist .pitem-actions a{

  font-size: 20px;

  color: var(--secondary);

  display: inline-flex;

  padding: 8px;

  background: #eee;

  border-radius: 50%;

}



.wishlist .pitem-actions a:hover{

  color: var(--primary)

}



.order-history .btn.btn-sm{

  min-height: 38px;

  padding: 0.4rem 1.5rem

}



.rating-stars i{

  font-size:36px;

  cursor:pointer;

  color:#ccc;

  margin-right:2px;

}

.rating-stars i.text-warning{

  color:#f4b400;

}

.preview-images img{

  border-radius:4px;

}

.fs-20{

  font-size: 20px

}

.fs-26{

  font-size: 26px

}

.fs-30{

  font-size: 30px

}

.fs-32{

  font-size: 32px

}



a.back{

  display: inline-flex;

  padding: 5px;

  border: 1px solid var(--link);

  border-radius: 5px;

}

a.back:hover{

  background: var(--link);

  color: #fff;

  border: 1px solid var(--link);

}



/*events*/

.bgevent{

  background-image: url(../images/bgevent.png);

  background-position: top left;

  background-repeat: no-repeat;

  background-color: #fff;

}

.bgcommon{

  background-image: url(../images/bgcommon.png);

  background-position: top left;

  background-repeat: no-repeat;

  background-color: #fff;

}



.card-event-list-item{

  position: relative;

  border-radius: 10px;

  /*text-align: center;*/

  transition: ease-in-out 0.2s;

  display: flex;

  flex-direction: column;

  height: 100%;

}

.card-event-list-item:hover{

  transform: translateY(-3px);

  --webkit-transform: translateY(-3px);

  /*box-shadow: 0 10px 10px #ddd*/

}



a.event-title{

  display: -webkit-box;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

  color: var(--black)

}

a.event-title:hover{

  color: var(--link)

}

.card-event-list-item h6{

  color: var(--gray);

  font-family: 'Mulish';

  font-size: 17px

}

.card-event-list-item .img-wrap{

  aspect-ratio: 1/0.7;

  position: relative;

  border-radius: 10px;

  overflow: hidden;

  position: relative;

  flex: 0 0 auto;

  margin-bottom: 20px

}

.card-event-list-item .img-wrap img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: center

}

.card-event-list-item .info-wrap{

  padding: 20px 0;

  background: url(../images/bg-pcard.png) bottom right no-repeat #fff;

  border-radius: 0 0 var(--rad10) var(--rad10);

  /*   flex: 1 1 auto;

   display: flex;

   flex-direction: column;

   justify-content: space-between;*/

}



.card-event-list-item .info-wrap p{

  display: -webkit-box;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

}

.card-event-list-item .info-wrap a{

  display: inline-block;

  padding: 6px 0

}



.bgeventdtls{

  background-image: url(../images/bgeventdtls.png);

  background-position: top left;

  background-repeat: no-repeat;

  background-color: #fff;

}







/*event dtls*/

.event-gallery-image-item{

  aspect-ratio: 1/0.7;

  border-radius: 10px;

  overflow: hidden;

  display: block;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #000

}

.event-gallery-image-item img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: ease-in-out 0.2s;

  position: relative;

  opacity: 1;

  transition: ease-in-out 0.2s

}

.event-gallery-image-item:hover img{

  opacity: 0.65;

}

.event-gallery-image-item i{

  position: absolute;

  top: 50%;

  left: 50%;

  margin-left: -16px;

  z-index: 5;

  font-size: 32px;

  color: #fff;

  transition: ease-in-out 0.2s;

  margin-top: 50px;

  opacity: 0

}



.event-gallery-image-item:hover i{

  margin-top: -16px;

  opacity: 1

}







/*photo gallery*/



.card-photog-list-item{

  position: relative;

  border-radius: 10px;

  text-align: center;

  transition: ease-in-out 0.2s;

  display: flex;

  flex-direction: column;

  height: 100%;

}

.card-photog-list-item:hover{

  transform: translateY(-3px);

  --webkit-transform: translateY(-3px);

  /*box-shadow: 0 10px 10px #ddd*/

}



a.photo-title{

  /*  display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    overflow: hidden;*/

  color: var(--black)

}

a.photo-title:hover{

  color: var(--link)

}



.card-photog-list-item .img-wrap{

  /*aspect-ratio: 1/0.7;*/

  position: relative;

  border-radius: 10px;

  overflow: hidden;

  position: relative;

  flex: 0 0 auto;

  margin-bottom: 20px

}

.card-photog-list-item .img-wrap img{

  width: 100%;

  /*height: 100%;*/

  height: auto;

  /*object-fit: cover;*/

  /*object-position: center*/

}



/*gallery details*/

.pgallery-image-item{

  aspect-ratio: 1/0.7;

  border-radius: 10px;

  overflow: hidden;

  display: block;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #000

}

.pgallery-image-item img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: ease-in-out 0.2s;

  position: relative;

  opacity: 1;

  transition: ease-in-out 0.2s

}

.pgallery-image-item:hover img{

  opacity: 0.65;

}

.pgallery-image-item i{

  position: absolute;

  top: 50%;

  left: 50%;

  margin-left: -16px;

  z-index: 5;

  font-size: 32px;

  color: #fff;

  transition: ease-in-out 0.2s;

  margin-top: 50px;

  opacity: 0

}



.pgallery-image-item:hover i{

  margin-top: -16px;

  opacity: 1

}



/* video gallery */

.video-thumb {

  cursor: pointer;

  overflow: hidden;

  aspect-ratio: 16/9;

  border-radius: 10px;

}

.video-thumb .img-video-thumb {

  transition: transform 0.3s ease;

  width: 100%;

  height: 100%;

  object-fit: cover

}

.video-thumb:hover .img-video-thumb {

  transform: scale(1.05);

  --webkit-transform: scale(1.05);

}



.play-icon {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  --webkit-transform: translate(-50%, -50%);

  pointer-events: none;

  width: 50px;

  height: 50px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  background: #fff;

  border-radius: 50%;

  opacity: 0.5;

  transition: ease-in-out 0.2s

}

.video-thumb:hover .play-icon{

  opacity: 1

}

.play-icon img{

  max-width: 24px;

  padding-left: 4px

}





/*profile*/

.dprofile{

  display: flex;

  gap: 15px;

  align-items: center

}

.dprofile-img{

  flex: 0 0 200px;

  border-radius: 8px;

  overflow: hidden

}

.dprofile-img img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  margin: 0;

  padding: 0

}

.dprofile-info{

  flex: 1

}

.dprofile-info a{

  color: var(--gray);

  font-size: 20px;

  padding: 5px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  background: #eee;

  border-radius: 5px;

  margin-right: 5px

}

.dprofile-info a:hover{

  background: var(--link);

  color: var(--white)

}





.owl_about_aag .owl-item{

  border-radius: 8px;

  overflow: hidden

}



p.contact-us-meta{

  display: flex;

  align-items: flex-start;

  gap: 10px;

  color: var(--secondary)

}

p.contact-us-meta a{

  color: var(--secondary)

}

p.contact-us-meta a:hover{

  color: var(--link)

}

p.contact-us-meta i{

  width: 20px;

  font-size: 20px;

  margin-top: 3px

}



.contact-form .form-control, .contact-form .btn{

  border-radius: 5px;

  padding: 8px 16px

}



.contactboxes{

}



.card-contact{

  position: relative;

  background: url(../images/bg-testi.png) top right no-repeat #fff;

  border-radius: var(--rad10);

  box-shadow: 0 4px 15px #d5d5d5;

  padding: 70px 30px 30px;

  margin: 65px 0 20px;

  text-align: center;

  transition: ease-in-out 0.2s;

}

.card-contact:hover{

  box-shadow: 0 4px 20px #ccc;

}

.card-contact-icon{

  background: #fff;

  position: absolute;

  top: -50px;

  width: 100px;

  height: 100px;

  border-radius: 50%;

  left: 50%;

  transform: translateX(-50%);

  --webkit-transform: translateX(-50%);

  border-radius: 50%;

  overflow: hidden;

  box-shadow: 0 0 8px #ddd;

  display: flex;

  align-items: center;

  justify-content: center;



}

.card-contact-icon i{

  font-size: 50px

}

.card-contact:hover .card-contact-icon i{

  color: var(--link)

}

.card-contact h6{



}

.card-contact p{

  margin-bottom: 5px

}

.card-contact p:last-child{

  margin: 0;

}

.card-contact p a{

  color: var(--secondary)

}

.card-contact p a:hover{

  color: var(--link)

}



.db-card{

  position: relative;

  background: #fff;

  border-radius: var(--rad10);

  overflow: hidden;

  height: 100%;

  transition: ease-in-out 0.2s;

  box-shadow: 0 5px 15px #ddd;

  padding: 20px

}

.db-card:hover{

  box-shadow: 0 10px 15px #d5d5d5;

  transform: translateY(-3px);

  --webkit-transform: translateY(-3px);

}



.db-card p{

  color:#777;

  margin-bottom: 10px;

}

.db-card i{

  font-size: 30px;

  margin-bottom: 15px;

  color: #999;

  border: 1px solid #ccc;

  border-radius: 50%;

  padding: 10px;

  transition: ease-in-out 0.2s

}

.db-card:hover i{

  color: #000;

  border: 1px solid #000;

}



.db-card h6{

  font-size:24px;

  margin-bottom:0;

}

.nowrap{

  white-space: nowrap

}



.art-thumb{

  width:60px;

  height:60px;

  object-fit:cover;

  border-radius:6px;

}



.art-item img{

  border-radius:8px;

  margin-bottom:10px;

}



.art-item p{

  margin:0;

  font-size:14px;

  font-weight:500;

}



.art-item span{

  font-size:13px;

  color:#777;

}



.db-recent-viewed .pitem-image{

  aspect-ratio: 1/0.75

}

.db-recent-viewed .pitem-image img{

  width: 100%;

  height: 100%;

  object-fit: cover

}

.db-recent-viewed .pitem-desc ul{

  display: none

}

.db-recent-viewed .pitem-desc p{

  margin-bottom: 0;

}



.user-name{

}

.user-badge{

  display: inline-flex;

  aspect-ratio: 1 / 1;

  margin-left: 2px;

  border-radius: 50%;

  padding: 5px;

  background: #fff;

  color: #C0C0C0;

  border: 1px solid #C0C0C0;

}

.user-badge.gold{

  background: #fff;

  color: #FFD700;

  border: 1px solid #FFD700;

}

.user-badge.black{

  background: #fff;

  color: #000;

  border: 1px solid #000;

}



.card-user{

  display: flex;

  align-items: center;

  gap: 20px

}

.card-user-image{

  display: inline-flex;

  aspect-ratio: 1 / 1;

  border-radius: 50%;

  background: #fff;

  border: 1px solid #C0C0C0;

  position: relative;

  width: 150px;

  cursor:pointer;

  transition:.3s ease;

}

.card-user-image:hover{

  opacity:.85;

}

.card-user-image img{

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 50%;

  overflow: hidden

}

.card-user-image i{

  position: absolute;

  bottom: 10px;

  right: 10px;

  z-index: 5;

  font-size: 20px;

  background: #000;

  color: #fff;

  border-radius: 50%;

  padding: 5px

}



.lined-tabs.home-tabs{

  position: relative;

}

.home-tabs.lined-tabs .nav-tabs{

  border: 0;

}

.home-tabs.lined-tabs .view-more-wrap{

  position: absolute;
  top: 0;
  right: 0;

}

.not-found{
  padding: 50px 0;
  background: url(../images/bg1.png);
}
.not-found img{
  max-width: 200px;
}
@media (max-width: 575px){
  .not-found{
    padding: 20px 0;
    background: url(../images/bg1.png);
  }
  .not-found img{
    max-width: 100px;
  }
  .not-found h2{
    font-size: 20px;
    margin-bottom: 10px
  }
}

.select2-container{
  display: block
}
.select2-container .select2-selection--single{
  min-height: 44px;
}
.select2-container--default .select2-selection--single {
  border: 1px solid #dee2e6;
  border-radius: 40px;
}
.select2-container .select2-selection--single .select2-selection__rendered{
  padding-left: 18px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height: 42px;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder{
  color: #777
}
.select2-container--default .select2-selection--single .select2-selection__arrow b{
  border-color: #aaa transparent transparent transparent;
  border-width: 8px 6px 0 6px;
  margin-left: -6px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
  width: 36px;
  height: 40px;
}

/*respo*/



@media (min-width: 768px){

  .account-nav{

    max-width: 280px

  }

}





@media (min-width: 992px){

  .container-fluid, .container{

    padding-left: 30px;

    padding-right: 30px

  }

  .owl_hero,.hero-section{

    height: 65vh;

    background: #514f4d

  }

  .owl-theme{

    padding-left: 20px;

    padding-right: 20px

  }

  .navbar .dropdown-menu {

    display: block;

    opacity: 0;

    visibility: hidden;

    transform: translateY(10px);

    transition: all 0.3s ease;

  }



  .navbar .dropdown:hover > .dropdown-menu {

    opacity: 1;

    visibility: visible;

    transform: translateY(0);

  }

  .event-dtls-sticky{

    position: sticky;

    top: 155px;

    z-index: 5

  }

}



@media (min-width: 1200px){

  .header-search-wrap{

    min-width: 225px;

  }

  .navbar-brand{

    min-width: 225px;

  }

  footer{

    background-image:url(../images/bgf1.png),url(../images/bgf2.png);

    background-position: top left, top right;

    background-repeat: no-repeat;

    background-size: auto 100%;

  }

  .dtlsp-btns .btn{

    min-width: 200px

  }

  .news-sidebar{

    position: sticky;

    top: 155px;

  }

  .cart-item p{

    font-size: 15px

  }

}



@media (min-width: 1367px){

  .container{

    max-width: calc(100% - 100px)!important;

  }

  .news-sidebar{

    margin-left: 30px;

  }

  .news-sidebar-menu{

    padding-right: 25px;

  }

}

@media (min-width: 1600px){

  .container{

    max-width: calc(100% - 200px)!important;

  }

}





@media (max-width: 1366px){

  .preview .mt--50{

    margin-top: -30px

  }

  .container-fluid, .container{

    padding-left: 20px;

    padding-right: 20px

  }

  .container{

    max-width: 98%!important;

  }

  .container.copyright{

    max-width: 92%!important;

  }

  .sidebar-mostly-item p br{

    display: none

  }

  .card-contact p:last-child{

    font-size: 14px

  }

}



@media (max-width: 1199px){

  .navbar-brand{

    font-size: 16px;

  }

  .navbar-brand img{

    max-width: 50px

  }

  .navbar-expand-lg .navbar-nav .nav-link{

    padding-right: 10px;

    padding-left: 10px;

    font-size: 17px;

  }

  .artwork-list-header.sticky, .bread_crumb.sticky{

    top: 67px;

  }

  .account-nav.sticky{

    top: 150px;

  }

  .card-contact p:last-child{

    font-size: 16px

  }

}



@media (max-width: 991px){

  .filter-wrap {

    width: 85%;

    max-width: 320px;

    margin-left: -100%;

    z-index: 1050;

  }



  .filter-wrap.open {

    margin-left: 0;

  }

  .fab{

    bottom: 75px

  }

  #scrollTopBtn{

    bottom: 15px

  }

  body{

    padding-bottom: 54px;

  } /*same as fixed footer*/



  .navbar > .container{

    flex-wrap: nowrap;

    gap: 10px;

    padding-right: 5px

  }

  .navbar > .container .navbar-brand{

    order: 0;

  }

  .navbar > .container .navbar-toggler{

    order: 2;

  }

  .navbar > .container .header-search-wrap{

    order: 1;

    margin-left: auto

  }

  .search-form{

    right: -20px;

  }

  .header-icon-links{

    position: fixed;

    bottom: 0;

    left: 0;

    right: 0;

    z-index: 5;

    background: #fff;

    padding: 12px 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    box-shadow: 0 0 10px #0000002b;

  }

  .header-icon-links a{

    font-size: 30px

  }

  .navbar-collapse{

    position: absolute;

    top: 100%;

    z-index: 100;

    background: #fff;

    left: 0;

    right: 0;

    min-width: 250px;

    box-shadow: none;

    border: 0;

    border-radius: 0

  }

  .navbar-collapse ul{

    border: 1px solid #ddd;

    /*padding: 15px;*/

  }

  .navbar-expand-lg .navbar-nav .nav-link{

    font-size: 17px;

    padding: 10px;

    text-transform: uppercase

  }



  .preview .mt--50{

    margin-top: 30px;

  }

  .card-cont{

    flex-direction: column

  }

  .tab-main{

    flex-direction: column;

    margin-bottom: 20px

  }





  /*in tab when collapsed*/

  .news-sidebar-menu{

    position: fixed;

    top: 0;

    left: -100%;

    width: 94%;

    max-width: 600px;

    height: 100vh;

    max-height: 100vh;

    background: #fff;

    z-index: 1050;

    overflow-y: auto;

    transition: left 0.3s ease;

    padding: 15px;

  }



  .news-sidebar-menu.active{

    left: 0;

  }



  /* Dark Overlay */

  .news-sidebar-overlay{

    position: fixed;

    inset: 0;

    background: rgba(0,0,0,0.6);

    z-index: 1040;

    opacity: 0;

    pointer-events: none;

    transition: opacity 0.3s ease;

  }



  .news-sidebar-overlay.active{

    opacity: 1;

    pointer-events: auto;

  }



}



@media (max-width: 860px){

  .search-bar-container{

    margin: 30px auto 50px

  }

  .bg1,.bg2,.bg3,.bg4,.bg5,.bg6{

    background-attachment: fixed

  }

  .collection-card, .collection-card .img-wrap{

    height: 100%

  }

  .collection-card img{

    width: 100%;

    height: 100%;

    object-fit: cover

  }

  .pitem-name{

    font-size: 18px;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

  }

  .pitem-artist{

    font-size: 12px;

    padding: 4px 12px;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

  }

}



@media (max-width: 767px){

  h1{

    font-size: 36px

  }

  h2{

    font-size: 36px;

  }

  h3{

    font-size: 30px

  }

  h4{

    font-size: 22px

  }

  .fs-20{

    font-size: 18px

  }

  .fs-26{

    font-size: 22px

  }

  .fs-30{

    font-size: 24px

  }

  .fs-32{

    font-size: 26px

  }



  .lead{

    font-size: 17px;

    font-weight: 500

  }



  .hero-section .item:before{

    background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0))

  }

  .hero-cta{

    gap: 20px;

    top: auto;

    bottom: 10px;

  }

  .hero-cta .btn{

    padding: 0.50rem 1.2rem;

    font-weight: 400;

    font-size: 15px;

  }

  .container-fluid, .container{

    padding-left: 15px;

    padding-right: 15px

  }

  footer.footer-dark{

    background-image: none;

    background-position: top left, top right;

    background-repeat: no-repeat

  }



  .hero-cta a.btn-outline{

    /*background: rgba(0,0,0,0.4)*/

  }

  .card-cont{

    flex-direction: row

  }

  .aakriti-gallery-layout .art-card.wide, .aakriti-gallery-layout .art-card.tall{

    height: auto;

    min-height: 100px

  }

  .aakriti-gallery-layout .art-card{

    height: 350px

  }

  .preview h2 br{

    display: none

  }

  .artwork-list-header .sort-by{

    margin: 0

  }

  .details-image-wrap{

    flex-direction: column-reverse

  }

  .details-image-wrap .thumb-wrap{

    flex-direction: row;

    gap: 10px;

    flex: 0 0 100%;

    width: 100%;

    align-items: center;

    justify-content: center;

  }

  .details-image-wrap .thumb-wrap div{

    width: 40px;

    height: 40px;

    padding: 2px

  }

  .artist-profile-box{

    flex-direction: column;

    align-items: flex-start;

    gap: 10px

  }

  .artist-profile-box .profile-info h3{

    font-size: 24px

  }

  .cart-item{

    flex-direction: column;

    text-align: center;

  }

  .cart-img{

    width: 100%;

    max-width: 200px;

    height: auto

  }

  .cart-item-desc1, cart-item-desc2,.cart-item-price{

    flex: 0 0 100%;

    text-align: center

  }



  .account-nav{

    position: fixed;

    top: 0;

    left: -100%;

    width: 86%;

    max-width: 600px;

    height: 100vh;

    max-height: 100vh;

    background: #fff;

    z-index: 1050;

    overflow-y: auto;

    transition: left 0.3s ease;

    padding: 60px 15px 15px;

  }

  .account-nav ul li a{

    padding: 14px 20px 14px 14px;

    font-size: 18px;

  }



  .account-nav.active{

    left: 0;

  }



  /* Dark Overlay */

  .account-nav-overlay{

    position: fixed;

    inset: 0;

    background: rgba(0,0,0,0.6);

    z-index: 1040;

    opacity: 0;

    pointer-events: none;

    transition: opacity 0.3s ease;

  }



  .account-nav-overlay.active{

    opacity: 1;

    pointer-events: auto;

  }



  .card-contact{

    padding: 70px 20px 20px

  }

  .home-tabs.lined-tabs .view-more-wrap{

    position: relative;

    top: auto;

    right: auto;

    margin: 20px auto;
    text-align: center

  }

}



@media (max-width: 600px){

  .owl-theme .owl-dots .owl-dot span{

    width: 30px

  }

  .tab-btn span{

    display: none

  }

  .tab-buttons{

    width: auto

  }

  .tab-btn{

    font-size:16px;

  }

  .tab-btn::after{

    bottom: -8px

  }

}

@media (max-width: 575px){

  .bread_crumb.sticky{

    position: relative;

    top: auto;

  }

  .artwork-list-header.sticky{

    top: 76px

  }

  .pitem-desc{

    padding: 8px 15px 15px;

  }

  .pitem-desc ul li{

    font-size: 13px

  }



  .dd-fixed-width-mobile{

    max-width: 200px;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

  }

  .card-artist-type .card-artist-type-info h5,.card-artist-type.search-loop .card-artist-type-info h5{

    font-size: 16px;

    margin-bottom: 5px

  }

  .card-artist-type .card-artist-type-info p,.card-artist-type.search-loop .card-artist-type-info p{

    font-size: 14px

  }

  .page-link, .disabled>.page-link, .page-link.disabled{

    font-size: 18px;

  }

  .tab-pane-artist-profile p{

    font-size: 16px

  }

  .card-news .card-news-desc p{

    -webkit-line-clamp: 4

  }

  .cart-coupon-input .btn{

    padding-left: 1.5rem;

    padding-right: 1.5rem;

  }



  .form-control.form-control-lg, .form-select.form-select-lg, .form-control.lg, .form-select.lg{

    min-height: 48px;

  }

  .modal-content{

    min-height: 500px

  }

  .box-bordered.order-item{

    padding: 10px;

  }

  .dprofile{

    gap: 12px;

    flex-direction: column;

    align-items: flex-start

  }

  .card-user{

    gap: 15px

  }

  .card-user-image{

    width: 120px;

  }

  .card-user-image i{

    bottom: 5px;

    right: 5px;

  }



}

@media (max-width: 430px){

  h2{

    font-size: 30px;

  }

  .owl-theme .owl-dots .owl-dot span{

    width: 20px

  }

  .owl-theme.owl_about_aag .owl-dots .owl-dot span{

    width: 12px;

  }

  .navbar-brand{

    height: 50px;

    flex: 0 0 50px

  }

  .artwork-list-header.sticky{

    top: 66px

  }

}

@media (max-width: 375px){

  .card-user-image{

    width: 100px;

  }

  .card-user-image i{

    bottom: 0;

    right: 0;

  }

}



@keyframes floatY{

  0%  {

    transform: translate3d(0, 0, 0);

  }

  25% {

    transform: translate3d(0, -4px, 0);

  }

  50% {

    transform: translate3d(0, 0, 0);

  }

  75% {

    transform: translate3d(0, 4px, 0);

  }

  100%{

    transform: translate3d(0, 0, 0);

  }

}