/*  GENERAL STYLING  ============================================================================= */
.stonesetting h1, .stonesetting h2, .stonesetting h3, .stonesetting h4, .stonesetting h5, .stonesetting p { margin: 1em;}
.stonesetting h1, .stonesetting h2, .stonesetting h3 { text-align:center;}
.stonesetting {font-family: Helvetica Neue,Helvetica,Arial,sans-serif; }
.stonesetting .topheader { background-color: #f7f4f4;position: relative; min-height: 250px }
.stonesetting .vidsect { background-color: #fafafa; }
.stonesetting h1{ font-size: 50px; font-weight: bold;margin: 0 0;}
.stonesetting h2{ font-size: 25px; font-weight: normal;    margin: 10% 0 3% 0;}
.stonesetting .vidsect h2{ font-size: 25px; font-weight: normal;    margin: 3% 0 3% 0;}
.stonesetting h3{ font-size: 18px; font-weight: bold}
.stonesetting h4{ font-size: 20px; font-weight: bold}
.stonesetting p { font-size: 15px; font-weight: normal; color: #797979}
.stonesetting .sswrap { 
	max-width: 1000px; position: relative;
		margin: 0px auto;top: -4.25em; background-color: #ffffff;    padding: 1% 3%;}
.stonesetting .sswrapend { 
	max-width: 1000px; position: relative;
		margin: 0px auto;top: 0; background-color: #ffffff;    padding: 1% 3%;}
.stonesetting img { width: 100%;}

.stonesetting .artbg, .stonesetting .artbgalt  { 
	border: 1px solid #f7f4f4;
	background-color:#f7f4f4;
   -moz-box-shadow:    0px 5px 5px rgba(68, 68, 68, 0.1);
   -webkit-box-shadow:  0px 5px 5px rgba(68, 68, 68, 0.1);
    box-shadow:          0px 5px 5px rgba(68, 68, 68, 0.1);
	padding: 0 0 15px 0;
}
.stonesetting .artbg a, .stonesetting .artbgalt a { padding:20px; color: #000000; font-size: 16px; font-weight: bold; text-decoration: underline;}
.stonesetting .artbg { 
min-height: 400px;
}
 .artbgalt { 
	min-height: 200px;
}
.stonesetting .slick-dots li button:before {
    font-family: 'slick';
    font-size: 16px;
    line-height: 19px;
    position: absolute;
    top: 0;
    left: 0;
    width: 16px;
    height: 16px;
    content: '•';
    text-align: center;
    opacity: 0.25;
    color: #f7f4f4;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border-radius: 20px;
}
.stonesetting .slick-dots li.slick-active button:before {
    opacity: 1;
    color:  #ccc !important;
}
.stonesetting .slick-dots button {
    border: 2px solid #ccc;
    border-radius: 34px;
    padding: 8px;
    background-color: #f7f4f4;
    font-size: 0;
    line-height: 0;
    display: block;
    width: 15px;
    height: 15px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    background: transparent;
}

.stonesetting .artbg a { padding:20px; color: #000000; font-size: 16px; font-weight: bold; text-decoration: underline;}

.stonesetting .txbody h2,.stonesetting .txbody h3, .txbody p  {  text-align: left; padding: 0 5px;}
.stonesetting .rlcat h3 { float: left; padding: 0 10px; width:40%;display: inline-block}
.stonesetting .rlcat a {  float: right; padding: 0 10px; width:34%; display: inline-block; text-align: right;margin: 20px 5px 0 0}
.stonesetting .rlcat {padding: 0;}
.stonesetting .prodslide .prodbox { width:33%;}
.stonesetting .prodslide img {
    display: block !important;
    margin: 0 2% 0 0 !important;
    padding: 0 !important;
    float: left !important;
	width: auto !important;
}
.stonesetting .prodslide a, .stonesetting .prodslide p {
    float: right;
    display: block;
    font-size: 12px;
	width: 58%;
    padding: 0;
    margin: 6px 0;
}

 .stonesetting .slider {
    width: 96%;
    margin: 0 auto;
    }
.prodslide { width:98%}
.stonesetting .slick-dots li {
    width: 24px !important;
}

 .stonesetting .slick-slide {
      margin: 10px 20px;
    }

.stonesetting .slick-slide img {
      width: 100%;
    }

.stonesetting  .slick-prev:before,
.stonesetting  .slick-next:before {
      color: black;
    }


.stonesetting  .slick-slide {
      transition: all ease-in-out .3s;
      opacity: 1;
    }
    
.stonesetting  .slick-active {
      opacity: 1;
    }

.stonesetting  .slick-current {
      opacity: 1;
    }



/*  SECTIONS  ============================================================================= */

.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

.span_2_of_2 {
	width: 100%;
}

.span_1_of_2 {
	width: 49.2%;
}
.span_3_of_3 {
	width: 100%; 
}

.span_2_of_3 {
	width: 66.13%; 
}

.span_1_of_3 {
	width: 32%; 
}
.span_4_of_4 {
	width: 100%; 
}

.span_3_of_4 {
	width: 74.6%; 
}

.span_2_of_4 {
	width: 49.2%; 
}

.span_1_of_4 {
	width: 23.8%; 
}

/*  GROUPING  ============================================================================= */


.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */


/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

@media only screen and (max-width: 850px) {
.span_1_of_3 {
    width: 31%;
}
.stonesetting .rlcat h3, .stonesetting .rlcat a { float: none; text-align: center;padding: 5px 0; width:100%;display: inline-block; margin: 0;}


	}
@media only screen and (max-width: 560px) {
	.hideme { display:none;}
	.col { 
		margin: 1% 0 1% 0%;
	}
	.span_2_of_2 {
		width: 100%; 
	}
	.span_1_of_2 {
		width: 100%; 
	}
		.span_3_of_3 {
		width: 100%; 
	}
	.span_2_of_3 {
		width: 100%; 
	}
	.span_1_of_3 {
		width: 100%;
	}
		.span_4_of_4 {
		width: 100%; 
	}
	.span_3_of_4 {
		width: 100%; 
	}
	.span_2_of_4 {
		width: 100%; 
	}
	.span_1_of_4 {
		width: 100%; 
	}
}