@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&display=swap');

body{
	font-family: 'Open Sans', sans-serif!important;
	color:#000000;
	font-size:16px;
	line-height:180%;
	font-weight:300;
	background: #f1f1f1
}

b, strong{
	font-weight:700
}


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

a{
	color:#64a3c2;
}

a:hover{
	color:#323947
}

ul{
	list-style:none;
	padding:0;
	margin:0;
}

h1, h2{
	font-family: 'Cormorant Garamond', serif;
	text-transform: uppercase;
}

h1{
	font-size:30px;
	margin-bottom:20px;
	display:inline-block;
}

h2{
	font-size:20px;
}

h1, h2, h3, h4{
	color:#64a3c2
}

h2{
	font-size:22px;
	margin-bottom:20px;
	text-transform: uppercase
}

h3{
	font-size:20px
}

h4{
	font-size:16px;
}


h2.bl::before{
	content:"|";
	width:6px;
	height:100%;
	background:#faad1e;
	color:#faad1e;
	display:inline-block;
	margin-right:10px
}
/*custom */

.btn-primary {
	color: #585858;
	background-color: #fff;
	border-color: #64a3c2;
	border-width:1px;
	border-radius:0;
	text-transform: uppercase;
	font-weight:600;
	padding:6px 30px;
}
.btn-primary:hover{
	color: #fff;
	background:#64a3c2;
	border-color: #64a3c2;
	border-width:1px;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
  border-color: rgba(219, 165, 0, 0.8)!important;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(219, 165, 0, 0.4)!important;
  outline: 0 none;
}

textarea{
	min-height:160px
}

header{
	background:#fff
}

ul{
	padding-left: 22px;
	margin:0;
	line-height:120%
		
}

ul li{
	margin-bottom:14px
}

ul li a{
	color:#323947
	
}

.px-10{
	padding-left:100px;
	padding-right:100px;
}

.content{
	background:#fff
}

.lt-links{
	position:absolute;
	left:0;
	top:40px;
	text-align:left
}

.lt-links a{
	color:#000;
	display:block;
	font-size:12px;
	text-transform: uppercase;
}

a.nicole-barr span.logo{
	width:430px;
	height:93px;
	background:url(../images/logo-business.jpg) no-repeat;
	background-size:100%;
	text-indent:-9999px;
	display:inline-block;
	margin:30px 0;
	color:#fff;
	margin-right:10px;
	vertical-align: middle;
}

.top{
	position:relative;
	z-index:99;
}

header{
	border-bottom:1px solid #ccc
}

.navbar-light .navbar-toggler{
	border-color:transparent;
}

.navbar-toggler {
    padding: .25rem .75rem;
    font-size: 1.5rem;
}

.navbar{
	padding:0;
	background: transparent!important;
	z-index:10;
}

.navbar-light .navbar-toggler{

	text-transform: uppercase
}



@media all and (min-width: 992px) {
	.navbar{ padding-top: 0; padding-bottom: 0; }
	.navbar .has-megamenu{position:static!important;}
	.navbar .megamenu{left:0; right:0; width:100%; padding:20px; top:96% }
	.navbar .nav-link{ padding:1rem 1.5rem!important; text-transform: uppercase; font-size:16px;  }
	.navbar ul li{
		margin:0
	}
}

.navbar-light .navbar-nav .nav-link{
	color:#000
}



.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-item.active .nav-link, .navbar ul li .col-megamenu li a:hover{
	color:#64a3c2
}

.dropdown-menu{
	border-radius:0;
}

.col-megamenu h6{
	font-weight:600
}

.navbar ul li .col-megamenu li a{
	padding:6px 0;
	display:block;
}

.img-nav{
	width:200px;
	height:200px;
	border:1px solid #ccc;
	overflow: hidden;
}

.top a{
	padding-bottom:6px;
	color:#7a7a7a
}


.top-bar{
	position:relative;
	padding:0;
	padding-top:6px;
}

.phone{
	position:absolute;
	right:15px;
	top:50px;
	font-size:20px;
}

.phone a{
	color:#000
}

.phone a span{
	color:#000000
}

.search-box{
	position:absolute;
	left:auto;
	right:40px;
	top:0;
	z-index:100;
	width:300px;
	background-color: rgba(0, 0, 0, 0.7);
	text-align: center;
	padding:40px 0;
	opacity:0;

	z-index:-1;
}

.search-box.show-search{
	position:absolute;
	left:auto;
	right:15px;
	top:40px;
	z-index:100;
	width:300px;
	height:auto;
	min-height:130px;
	padding-bottom:16px;
	background-color: #2c7599;
	text-align: center;
	padding:30px 0 16px;
	opacity:1;
	z-index:10
}

.search-box input{
	width:70%;
	padding:10px;
	border:none;
	border-bottom:1px solid #fff;
	/*color:#fff;*/
	font-size: 16px;
	/*background: none;*/
}

.search-box button.search-btn{
	background:none;
	border:none;
	font-size:20px;
	color:#fff
}

.search-box .close-search{
	right:10px;
	top:10px;
	position:absolute;
	z-index:9;
	color:#fff;
	font-size:20px;
	cursor: pointer
}


.search-ico{
	position:absolute;
	right:15px; 
	top:64px;
	color:#fff;
	cursor: pointer
}



.top-links{
	position:absolute;
	right:15px;
	top:20px;
	font-size:20px;
	font-weight:600;
	text-align: right;
}

.top-links a{
	color:#64a3c2;
	display:inline-block;
	margin-right:10px;
	vertical-align: top
}

.top-links a:hover{
	color:#2c7599
}


.search-ico{
	position:absolute;
	right:15px; 
	top:67px;
	color:#fff;
	cursor: pointer
}


.left-top-links{
	position:absolute;
	left:15px;
	top:60px;
	font-size:20px;
	font-weight:600;
	z-index:2;
}

.left-top-links a{
	color:#64a3c2;
	display:inline-block;
	margin-right:10px;
	vertical-align: top
}



 ul.main-nav{
	font-weight:400;
	font-size:18px;
	list-style:none;
	margin-right:20px;
	line-height:normal;
	margin:0 auto
}

ul.main-nav li{
	position:relative;
	z-index:9999;
	margin-bottom:0;
}

ul.main-nav li a{
	padding:18px 14px 14px 14px;
	color:#333333;
	display:block;
	font-size:15px;
	letter-spacing: 1px;
	border-bottom:1px solid transparent;
}


ul.main-nav li a:hover, ul.main-nav li.selected a{
	background-color:#64a3c2;
	display:block;
	color:#fff
}

ul.main-nav li ul{
	display:none
}

ul.main-nav li::before{
	display:none!important
}

/* Chevron toggle for expanding/collapsing submenus on mobile (added by
   mobileNav() in assets/js/common.js). Hidden by default (desktop keeps the
   existing :hover dropdown above) - shown and made functional only inside
   the @media (max-width:991.98px) block further down. */
.submenu-toggle{
	display:none;
}

ul.main-nav li:hover ul{
	width:240px;
	display:block;
	position:absolute;
	left:0;
	top:52px;
	background-color: rgba(255, 255, 255, 1);
	font-size:13px;
	font-weight:normal;
	padding-left:0
}

ul.main-nav li:hover ul li{
	width:100%
}

/* Was "ul.main-nav li:hover ul li a" - tied the submenu's smaller font/
   spacing to the ancestor's :hover state. On mobile the submenu is shown via
   .submenu-open (tap), not :hover, so as soon as the mouse/finger moved off
   (mouse-out), this rule stopped applying and the links fell back to the
   larger 15px top-level "ul.main-nav li a" font. Dropping ":hover" here
   makes the smaller submenu typography permanent whenever the submenu is
   visible, regardless of how it was opened. */
ul.main-nav li ul li a{
	height:auto;
	padding:12px 15px;
	line-height:normal;
	color:#333333;
	font-size:13px;
	text-transform: none;
	font-family: 'Open Sans', sans-serif!important;
	letter-spacing: normal;
	font-weight:normal;
	display:block
}

ul.main-nav li ul li a:hover{
	background-color:#64a3c2;
	color:#fff
}

ul.main-nav li:hover ul li ul{
	display:none
} 

ul.main-nav li ul li:hover ul{
	width:240px;
	display:block;
	position:absolute;
	left:240px;
	top:0;
	background:#f5faf7;
	font-size:13px;
	font-weight:normal;
	padding-left:0
}

ul.main-nav li ul li:hover ul li ul{
	display:none
}

ul.main-nav li ul li:hover ul li:hover ul{
	display:block
}


@media (max-width:992px){

	.search-box.show-search {
		right: 0;
		top: 0;
	  }

	a.nicole-barr span.logo {
		width: 200px;
		height: 60px;
		background: url(../images/logo-business.jpg) no-repeat;
			background-size: auto;
		background-size: 100%;
		text-indent: -9999px;
		display: inline-block;
		padding: 0;
		margin:10px 0;
		color: #fff;
		margin-right: 10px;
		vertical-align: middle;
	}

	.left-top-links {
		position: absolute;
		left: 15px;
		top: 70px;
		font-size: 20px;
		font-weight: 600;
	  }

	/* .container-fluid.border-top is the wrapper around the navbar itself
	   (see _header.cfm) - scoped to that compound class specifically, since
	   plain .border-top is a reused Bootstrap utility class elsewhere on the
	   site (e.g. index.cfm's page sections) that this shouldn't affect. */
	.container-fluid.border-top {
		margin-top: 10px;
	}

	.search-btn {
		margin-top: 10px;
	}

	  .top-links {
		position: absolute;
		right: 15px;
		top: 23px;
		font-size: 16px;
		font-weight: 600;
	  }

}

/* ---------------------------------------------------------------------------
   Mobile hamburger menu (<992px, matches Bootstrap's navbar-expand-lg
   collapse point): the toggler is now icon-only (see _header.cfm - the
   "menu" text label was removed), styled as a proper square icon button.
   The nav itself (#navbarNav / .navbar-collapse) now opens as an absolutely
   positioned overlay anchored to .navbar (position:relative), instead of
   Bootstrap's default static-flow collapse, which used to push the page's
   content down every time the menu opened.
--------------------------------------------------------------------------- */
@media (max-width:991.98px){
	.navbar-toggler{
		display:flex;
		align-items:center;
		justify-content:center;
		width:42px;
		height:42px;
		padding:0;
		background:#2c7599;
		border:none;
		border-radius:8px;
	}

	/* Explicit color on the icon itself, not just the button - a later,
	   higher-specificity rule (.navbar-light .navbar-toggler{color:#000})
	   further down this file would otherwise win the cascade for the
	   button's own color and get inherited by the icon. */
	.navbar-toggler .svg-inline--fa,
	.navbar-toggler i.fa-bars{
		font-size:18px;
		color:#fff;
	}

	.navbar{
		position:relative;
	}

	.navbar-collapse{
		position:absolute;
		top:100%;
		left:0;
		right:0;
		z-index:1000;
		background:#fff;
		box-shadow:0 12px 30px rgba(0,0,0,.18);
		max-height:calc(100vh - 120px);
		overflow-y:auto;
		border-top:1px solid #e1e8ed;
	}

	/* Submenus: switch from the desktop :hover trigger (which never fires
	   reliably on touch) to the .submenu-open class toggled by the chevron
	   (.submenu-toggle) - see mobileNav() in assets/js/common.js.

	   !important is required here: tapping the chevron (a descendant of the
	   <li>) makes some touch browsers register :hover on the <li> itself,
	   which re-activates the desktop dropdown rule above
	   (ul.main-nav li:hover ul{position:absolute; width:240px; top:52px;...}).
	   That selector's specificity (0,0,2,3) beats this block's plain
	   descendant selector (0,0,1,3) regardless of source order, so without
	   !important the submenu kept rendering as an absolute overlay on top of
	   the rest of the menu instead of pushing it down in normal flow. */
	ul.main-nav li:hover ul,
	ul.main-nav li ul li:hover ul{
		display:none !important;
	}

	/* padding-left:14px needs !important - the desktop ":hover" rule above
	   (ul.main-nav li:hover ul{...padding-left:0}) isn't scoped to a media
	   query, so it also matches at mobile widths whenever the row is
	   hovered/tapped. Without !important here, that unconditional rule (2
	   classes) outranks this plain descendant selector (1 class) and briefly
	   wins, giving padding-left:0 while hovering; the moment the mouse/
	   finger moves off, only this 14px rule is left and the whole submenu
	   visibly jumps to the right. Forcing 14px here makes the indent
	   constant regardless of hover state. */
	ul.main-nav li ul{
		position:static !important;
		width:auto !important;
		left:auto !important;
		top:auto !important;
		background:#fafbfc;
		padding-left:14px !important;
	}

	/* Anchored to #navbarNav (the collapse wrapper's id) rather than just
	   repeating ".main-nav li.submenu-open" - an ID in the selector outranks
	   any number of classes/types, so this rule is guaranteed to beat the
	   touch-hover suppression rules above at EVERY nesting depth, including
	   "ul.main-nav li ul li:hover ul" (specificity 0,0,2,5), which otherwise
	   outranks a plain "ul.main-nav li.submenu-open > ul" (0,0,2,3) and was
	   the actual reason second-level submenus (e.g. the categories under
	   "18K Pendants") stayed hidden even though the chevron correctly
	   rotated to its "open" state. Without the ID anchor, this only works
	   for the first level by accident of source order, and silently breaks
	   again for any deeper level added in the future. */
	#navbarNav ul.main-nav li.submenu-open > ul{
		display:block !important;
	}

	ul.main-nav li a{
		padding-right:40px;
	}

	.submenu-toggle{
		display:flex;
		align-items:center;
		justify-content:center;
		position:absolute;
		top:4px;
		right:0;
		width:38px;
		height:38px;
		cursor:pointer;
		color:#333;
		transition:transform 200ms ease-in-out;
	}

	.submenu-toggle .svg-inline--fa,
	.submenu-toggle i{
		font-size:14px;
		color:#333;
	}

	li.submenu-open > .submenu-toggle{
		transform:rotate(180deg);
	}
}


/* ---------------------------------------------------------------------------
   Header icons on mobile (max-width:768px): the envelope icon stays visible
   (per request); #chSocialPanel (WhatsApp/Telegram launcher, normally a
   fixed panel on the right edge - see social_chat_panel.css) sits inline
   right after the Calendar icon instead, sized to fit the header bar. The
   actual move into .left-top-links is done in JS (see the bottom of
   agents/OpenAI_Responses_API/channels/_ch_social_panel.cfm); this block just
   tidies up the icon row's spacing now that it holds more icons (phone,
   envelope, calendar, AI Search, plus the relocated social panel).
--------------------------------------------------------------------------- */
@media (max-width:768px){
	.left-top-links a{
		margin-right:6px;
	}
}


/*SLIDESHOW*/


.slideshow{
	background:#fff;
	width:100%;
	overflow: hidden
}


.slideshow img{
	width:100%!important
}

.slideshow .item{
	position: relative;
	overflow: hidden
}

.txt-slideshow{
	background:#cceee0;
	font-size:20px;
}



section{
	padding:60px 15px
}


a.read-more{
	display:inline-block;
	padding:6px 26px;
	color:#000;
	font-weight:300;
	font-size:16px;
	border: 1px solid #64a3c2;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
a.read-more:hover{
	background:#64a3c2;
	color:#fff
}


.collections-home span{
	font-size:24px;
	font-weight:600;
	position:absolute;
	left:30px;
	bottom:0px;
	margin-top:10px;
	color: #64a3c2 !important;
	text-transform: uppercase;
	line-height:120%;
	width:100%;
	text-align: center;
}



/*owl */

.owl-nav{
	position:absolute;
	top:50%;
	margin-top:-25px;
	z-index:100;
	width:100%
}

.owl-carousel .owl-nav button.owl-prev{
	width:50px;
	height:50px;
	background-color: rgba(255, 255, 255, 0.8);
	position:absolute;
	left:20px;
	top:0;
	display:block;
	z-index:101;
	font-size:20px;
}

.owl-carousel .owl-nav button.owl-next{
	width:50px;
	height:50px;
	background-color: rgba(255, 255, 255, 0.8);
	position:absolute;
	right:20px;
	top:0;
	display:block;
	z-index:101;
	font-size:20px;
}

.owl-dots{
	width:100%;
	position:absolute;
	bottom:6px;
	left:0;
	text-align: center;
}

.slideshow-wrapper .owl-dots{
	display:none
}

.owl-carousel button.owl-dot{
	width:20px;
	height:4px;
	background: #fff!important;
	margin:0 4px;
}

.owl-carousel button.owl-dot.active{
	background: #faad1e!important
}


.owl-carousel.h-carousel .owl-dots{
	width:100%;
	position:relative;
	bottom:auto;
	left:auto;
	text-align: center;
}

.owl-carousel.h-carousel button.owl-dot{
	width:20px;
	height:4px;
	background: #ccc!important;
	margin:0 4px;
}

.owl-carousel.h-carousel button.owl-dot.active{
	background: #64a3c2!important
}


.owl-carousel.h-carousel .owl-nav button.owl-prev{
	width:30px;
	left:-40px;
	color:#cceee0;
	font-size:24px;
}

.owl-carousel.h-carousel .owl-nav button.owl-next{
	width:30px;
	right:-40px;
	color:#cceee0;
	font-size:24px;
}


.h-carousel .item{
	border:1px solid #e8e8e8
}

.svg-inline--fa {
	color: #64a3c2;
  }

  footer .svg-inline--fa{
	color: #7a7a7a;
	font-size: 20px;
  }

form.sign-up input{
	border-radius:0;
	border:none;
	padding:6px;
}

form.sign-up input[type="submit"],form.sign-up input[type="button"],form input[type="button"],form input[type="submit"],button[type="submit"],button[type="button"]{
	background:#64a3c2;
	color:#fff;
	font-weight:600;
	text-transform: uppercase;
	padding:6px 20px;
}

.categ a img{
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}


.categ a:hover img{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.categ a span{
	font-weight:600;
	color:#000;
	text-align: center;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.categ a:hover span{
	background: #000;
	color:#fff;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

form.contact-form{
	width:600px;
	margin:0 auto
}

form.contact-form input, form.contact-form textarea{
	background: #f1f1f1;
	border:none;
}

@media (max-width:992px){
	form.contact-form{
		width:100%
	}
	
}

/* PRODUCT LIST */


ul.product-list li a{
	display:block;
	padding-bottom:10px;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

ul.product-list li a:hover{
	color:#64a3c2;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

ul.product-list li a span.img{
	overflow:hidden;
	border:1px solid #dee2e6 
}

ul.product-list li a img{
	width:100%;
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

ul.product-list li a:hover img{
	width:100%;
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

ul.product-list li a span.name{
	padding-top:10px;
	display: block;
}




.breadcrumbs{
	font-size:14px;
	color:#666
}

.breadcrumbs a{
	color:#333
}


.big-img img{
	width:100%
}

.thumbs img{
	width:100%
}


footer ul{
	padding-left:0
}


footer ul li a, footer a, footer{
	color:#7a7a7a;
	font-size:14px;
}

.tel{
	font-weight:600;
	color:#000;
	font-size:18px
}

.day{
	border-bottom:1px solid #81cbbe
}

.social-list a{
	display:inline-block;
	margin:0 4px;
	font-size:22px;
}

#frmItem .price{
	font-size:28px;
}

#frmItem input{
	border:1px solid #ccc;
	display:inline-block;
	width:40px;
}

#frmItem input[type="submit"],#frmItem input[type="button"]{
	width:auto;
	background:#fff;
	color:#585858;
	border:none;
	padding:8px 30px;
	text-align: center;
	border:1px solid #585858;
	text-transform: uppercase;
	font-weight:600
}

#frmItem input[type="submit"]:hover,#frmItem input[type="button"]:hover{
	background: #64a3c2;
	border:#64a3c2;
	color:#fff
}

table.basket tr th:first-child{
	width:30px;
}

table.basket tr td.img-prod{
	width:120px;
}

table.basket tr td.img-prod img{
	width:100%
}

table.basket tr td.qnt-prod input{
	width:60px;
}

table.basket tr td.qnt-prod a{
font-size:14px;
}


@media (max-width:768px){
	

	h1{
		font-size:26px;
	}
	.px-10{
		padding-left:40px;
		padding-right:40px;
	}
	
	
	.lt-links {
		position: absolute;
		left: auto;
		top: 70px;
		text-align: left;
		right: 15px;
	}

	.phone {
		position: absolute;
		right: 15px;
		top: 10px;
		font-size: 16px;
	}

	.lt-links a {
		color: #000;
		display: block;
		font-size: 12px;
		text-transform: uppercase;
		padding: 0;
		margin: 0;
		line-height: 160%;
	}


	.navbar-light .navbar-toggler{
		font-size:16px;
		color:#000;
		padding:12px;
		margin-top:5px;
		margin-bottom:5px;
	}

	section {
		padding: 40px 15px;
	}

	.owl-carousel.h-carousel .owl-nav button.owl-prev{
		width:30px;
		left:-30px;
		color:#cceee0;
		font-size:30px;
	}

	.owl-carousel.h-carousel .owl-nav button.owl-next{
		width:30px;
		right:-30px;
		color:#cceee0;
		font-size:30px;
	}
	
	
	table.basket{
		font-size:12px;
	}
	
	.table td, .table th{
		padding:5px;
		line-height:16px;
	}
	
	table.basket tr td.qnt-prod a{
		font-size:12px;
		}

	.search-box{
		width:250px;
		padding:20px 0;
		left:auto;
		right:0;
	}

	.search-box.show-search{
		width:100%;
		padding:20px 0
	}

	table.basket tr td.img-prod {
		width: 50px;
	}

	
}


/* vip member */


#frmREG{width:306px;display:block;overflow:hidden; }
#frmREG fieldset{width:100%;display:block;padding:0;margin:0;border:0;overflow:hidden;}
#frmREG fieldset div{border-bottom:1px dashed #d6cec6;display:block;margin:0 0 10px 0;padding:0 0 5px 0;width:100%;overflow:hidden;}
#frmREG fieldset div.last{border:none;}
#frmREG fieldset div span{width:110px;line-height:30px;float:left;margin:0 10px 0 0;}
#frmREG fieldset div input{width:80px;padding:5px;border:1px solid #d6cec6;color:#001221;display:block;float:left;}
#frmREG fieldset div select{width:200px;padding:3px;border:1px solid #d6cec6;color:#001221;display:block;float:left;line-height:normal;}
#frmREG H4{display:inline;}
#frmREG fieldset input.send{width:70px;height:28px;line-height:28px;padding:0 0 0 0;margin:0 0 0 820px;font-size:18px;background:#9900cc;color:#fff; ;text-transform:uppercase;cursor:pointer;float:left;border:0; font-weight:600}
#col1{float:left;width:440px;}

#col2{float:left;width:310px;margin-left:10px;}
#col3{float:left;width:310px;margin-left:10px;}
.select-shape{width:100%;float:left;margin-left:10px;}
ul.selection-list{width:470px;padding-top:10px;padding-bottom:10px;}
.carat-wrapper{width:100%;float:left;margin-left:10px;padding:0;}
.weight-wrapper{width:100%;float:left;margin-left:10px;padding:0;}
.lab-wrapper{width:100%;float:left;margin-left:10px;padding:0;}
.price-wrapper{width:100%;float:left;margin-left:10px;padding:0;}
.clarity-wrapper{width:100%;float:left;margin-left:10px;padding:0;}
#select-list{width:100%;}
.section-vip-member{margin-bottom:20px;}
form#frmREG.form-reg-member{width:100%;overflow:hidden;display:block;}
form#frmREG.form-reg-member fieldset{display:block;overflow:hidden;border:0;margin:0 0 20px 0;}
/*
form#frmREG.form-reg-member .last-name{margin-left:50px;}
form#frmREG.form-reg-member #registrationFirstName{width:180px}
form#frmREG.form-reg-member #registrationLastName{width:180px}
form#frmREG.form-reg-member #registrationStreet1{width:180px;}
form#frmREG.form-reg-member #registrationStreet2{width:180px;}
form#frmREG.form-reg-member #registrationZipCode{width:50px;}
form#frmREG.form-reg-member span.city{margin-left:20px;width:30px}
form#frmREG.form-reg-member #registrationCity{width:180px;}
form#frmREG.form-reg-member .state-province{margin-left:20px;width:100px}
form#frmREG.form-reg-member #registrationState{width:180px;}
form#frmREG.form-reg-member .country{margin-left:50px;}
form#frmREG.form-reg-member #registrationCountry{width:180px;}
form#frmREG.form-reg-member #registrationEmail{width:540px;}
form#frmREG.form-reg-member #registrationCell{width:280px;}
form#frmREG.form-reg-member .enter-code{margin-left:50px;}
form#frmREG.form-reg-member #userInput{width:80px;margin-right:20px;display:inline;}
form#frmREG.form-reg-member #registrationUser{width:180px}
form#frmREG.form-reg-member .pass{margin-left:50px;}
form#frmREG.form-reg-member #registrationPassword{width:180px}
*/
form#frmREG.form-reg-member .fullRow{width:540px}
form#frmREG.form-reg-member .firstItem{width:180px;margin-right:60px;}
form#frmREG.form-reg-member .secondItem{width:180px}



@media (max-width:768px){
	form#frmREG.form-reg-member{width:100%;overflow:hidden;display:block;}
form#frmREG.form-reg-member fieldset#contactContent{display:block;overflow:hidden;border:0;margin:0 0 20px 0;padding:0;width:100%;}
form#frmREG.form-reg-member fieldset div{border-bottom:1px dashed #d6cec6;display:block;margin:0 auto 15px auto;overflow:hidden;padding:0 0 5px 0;width:100%;}
form#frmREG.form-reg-member fieldset div span{width:100%;display:block}
form#frmREG.form-reg-member fieldset input{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
form#frmREG.form-reg-member .last-name{margin-left:0;}
form#frmREG.form-reg-member #registrationFirstName{width:100%}
form#frmREG.form-reg-member #registrationLastName{width:100%}
form#frmREG.form-reg-member #registrationAddress{width:100%}
form#frmREG.form-reg-member #registrationZipCode{width:50px;}
form#frmREG.form-reg-member span.city{margin-left:0;width:100%}
form#frmREG.form-reg-member #registrationCity{width:120px;}
form#frmREG.form-reg-member .state-province{margin-left:0;width:100%}
form#frmREG.form-reg-member #registrationState{width:100%;}
form#frmREG.form-reg-member .country{margin-left:0;width:100%;}
form#frmREG.form-reg-member #registrationCountry{width:150px;}
form#frmREG.form-reg-member #registrationEmail{width:100%;}
form#frmREG.form-reg-member #registrationCell{width:100%;}
form#frmREG.form-reg-member .enter-code{margin-left:0;}
form#frmREG.form-reg-member #userInput{width:100%;margin-right:0;display:inline;}
form#frmREG.form-reg-member #registrationUser{width:100%}
form#frmREG.form-reg-member .pass{margin-left:0;}
form#frmREG.form-reg-member #registrationPassword{width:100%}
form#frmREG.form-reg-member fieldset input.send{margin:0;}

form#frmREG.form-reg-member fieldset input, form#frmREG.form-reg-member #registrationCountry { width:100% !important; }



	}


/* custom modal */



/*search */
.search-ico{
	width:36px;
	height:40px;
	line-height:40px;
	text-align: center;
	font-size:16px;
	color:#fff;
	background: #9079ab;
	cursor:pointer;
	display:inline-block
	
}

.search-wrapper{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:999999;
	background-color: rgba(146, 210, 184, 0.9);
}


form.search{
	position:absolute;
	width:1000px;
	margin-left:-500px
}

form.search input[type="search"]{
	width:calc(100% - 80px);
	border:none;
	border-bottom:1px solid #fff;
	color:#fff;
	background: none;
	font-size:20px;
	padding:15px;
	font-style: italic;
	box-shadow:none!important
}

button.search-submit{
	padding:15px;
	border:none;
	font-size:20px;
	color:#fff;
	background: none;
	
}

.close-search{
	position:absolute;
	right:30px;
	top:30px;
	z-index:100;
	color:#fff;
	font-size:30px;
	cursor:pointer;
	-moz-transform: rotate(0);
	-webkit-transform: rotate(0);
	-o-transform: rotate(0);
	-ms-transform: rotate(0);
	transform: rotate(0);
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

.close-search:hover{
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

.fa-times-circle{
	color:#fff
}


/*all */

.logo-nicole-bar{
	width:200px;
}

h1.toph{
	font-size:50px;
	padding:10px 0;
	margin-bottom:0;
}

.breadcrumb-catalog, .breadcrumb-catalog a{
	color:#7a7a7a;
	font-size:14px;
}

.search-box.w-100.show-search{
	right:0;
	top:0;
	z-index:99999
}

.page-item.active .page-link {
	z-index: 1;
	color: #fff;
	background-color: #64a3c2;
	border-color:#64a3c2
  }

  .page-link {
	position: relative;
	display: block;
	padding: .5rem .75rem;
	margin-left: -1px;
	line-height: 1.25;
	color: #64a3c2;
	background-color: #fff;
	border: 1px solid #dee2e6;
  }

  .page-link:hover {
	color: #64a3c2;
  }

  .bg-blue{
	  background:#64a3c2
  }

  .local-nav li{
	  border-bottom:1px solid #fff;
	  margin-bottom:0;
	  
  }

  .local-nav li a{
	  color:#fff;
	  padding:10px 20px;
	  display:block
  }

  .local-nav li a:hover, .local-nav li a.active{
	  background:#488CAE
  }



.wrapper-overlay{
	width:100%;
	position:fixed;
	left:0;
	top:0;
	z-index:100;
	display:none;
	background:url(../images/bg-grey.png);
	}

.popup-wrapper{
	display:none;
	background:url(../images/bg-grey.png);
	position:fixed;
	z-index:1000;
	left:0;
	top:0;
	width:100%;
	height:100%;
	overflow:hidden;
}  
	
	
.overlay{
	width:318px;
	background:#64a3c2;
	color:#000;
	padding:20px;
	display:block;
	margin:0 auto;
	border:1px solid #fff;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	overflow:hidden;
	position:absolute;
	left:50%;
	margin-left:-160px;
	z-index:1001;
	display:none;
	color:#333333;
	font-size:17px;
	}	
	
/*	
.overlay{
	width:310px;
	background:#efefef ;
	color:#fff;
	padding:30px 20px 0 20px;
	display:block;
	margin:0 auto;
	border:1px solid #fff;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	overflow:hidden;
	position:relative;
	
	}
*/

.overlay h3{
	color:#000;
	font-weight:500;
	font-family: 'Josefin Sans', sans-serif;
	font-size:30px;
	}

.overlay .close{
	width:30px;
	height:30px;
	position:absolute;
	right:0;
	top:0;
	cursor:pointer;
	display:block;
	font-size:30px;
	text-align:center;
	line-height:30px;
	color:#333;
	opacity:1;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:300;
	z-index:99
	}
	
	
form.newsletter input{
	width:268px;
	height:30px;
	padding:5px;
	display:block;
	margin:0 0 10px 0;
	font-family: 'Josefin Sans', sans-serif;
	color:#646464;
	font-size:16px;
	border:none;
	-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
	}
	
form.newsletter input.submit{
	height:40px;
	text-transform:uppercase;
	color:#fff;
	background:#66a48a;
	cursor:pointer;
	}
	
	
.sort-selection select, .sort-selection input { width:100%;}	

/* =========================================================
   Professional pagination styling for the shared product
   list pager (.item_cnt_nav .npage), used on both regular
   collection pages and the AI Search results.
   ========================================================= */
.item_cnt_nav{
	margin:18px 0 6px;
}

.item_cnt_nav .npage{
	display:inline-flex;
	align-items:center;
	gap:6px;
	flex-wrap:wrap;
}

.item_cnt_nav .npage a{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:40px;
	height:40px;
	padding:0 14px;
	border-radius:8px;
	background:#fff;
	border:1px solid #e2e2e2;
	color:#555;
	font-size:14px;
	font-weight:600;
	line-height:1;
	text-decoration:none;
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

.item_cnt_nav .npage a:hover{
	background:#eef6fa;
	border-color:#64a3c2;
	color:#2c7599;
	text-decoration:none;
}

.item_cnt_nav .npage a.active{
	background:#2c7599;
	border-color:#2c7599;
	color:#fff;
	cursor:default;
	box-shadow:0 3px 8px rgba(44,117,153,.35);
}

.item_cnt_nav .npage a.first1,
.item_cnt_nav .npage a.prev1,
.item_cnt_nav .npage a.next1,
.item_cnt_nav .npage a.last1{
	min-width:40px;
	width:40px;
	padding:0;
	background:#f6f6f6;
	border-color:#e2e2e2;
	color:#888;
	font-size:13px;
}

.item_cnt_nav .npage a.first1:hover,
.item_cnt_nav .npage a.prev1:hover,
.item_cnt_nav .npage a.next1:hover,
.item_cnt_nav .npage a.last1:hover{
	background:#2c7599;
	border-color:#2c7599;
	color:#fff;
}

/* Font Awesome renders as inline <svg class="svg-inline--fa"> on this site,
   with a global rule hardcoding every icon to #64a3c2. The pagination arrow
   icons need their own explicit overrides to follow the button state. */
.item_cnt_nav .npage a .svg-inline--fa{
	color:#888;
	-webkit-transition: color 200ms ease-in-out;
	transition: color 200ms ease-in-out;
}

.item_cnt_nav .npage a:hover .svg-inline--fa,
.item_cnt_nav .npage a.active .svg-inline--fa{
	color:#fff;
}

@media (max-width:576px){
	.item_cnt_nav .npage a{ min-width:34px; height:34px; padding:0 10px; font-size:13px; }
	.item_cnt_nav .npage a.first1,
	.item_cnt_nav .npage a.prev1,
	.item_cnt_nav .npage a.next1,
	.item_cnt_nav .npage a.last1{ min-width:34px; width:34px; }
}

/* ===== AI Search link inside header search box ===== */
.search-box .ai-search-link{
	width:auto;
	margin:10px auto 0;
	text-align:center;
}

.search-box .ai-search-link a.ai-search-trigger{
	display:inline-block;
	color:#fff;
	background:rgba(255,255,255,0.15);
	border:1px solid rgba(255,255,255,0.6);
	padding:3px 12px;
	font-size:11px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:.5px;
	border-radius:16px;
	-webkit-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}

.search-box .ai-search-link a.ai-search-trigger:hover{
	background:#faad1e;
	color:#fff;
	border-color:#faad1e;
}

.search-box .ai-search-link a.ai-search-trigger i{
	margin-right:4px;
}