@import url("//hello.myfonts.net/count/2ecef6");

@font-face {
    font-family: 'avalonextra_light';
    src: url('/webfont/Avalon-Book-webfont.eot');
    src: url('/webfont/Avalon-Book-webfont.eot?#iefix') format('embedded-opentype'),
         url('/webfont/Avalon-Book-webfont.woff2') format('woff2'),
         url('/webfont/Avalon-Book-webfont.woff') format('woff'),
         url('/webfont/Avalon-Book-webfont.ttf') format('truetype'),
         url('/webfont/Avalon-Book-webfont.svg#avalonextra_light') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face 
{
	font-family: 'ProximaNovaA';
	src: url('/webfont/2ECEF6_0_0.eot');
	src: url('/webfont/2ECEF6_0_0.eot?#iefix') format('embedded-opentype'), url('/webfont/2ECEF6_0_0.woff2') format('woff2'),url('/webfont/2ECEF6_0_0.woff') format('woff'),url('/webfont/2ECEF6_0_0.ttf') format('truetype'),url('/webfont/2ECEF6_0_0.svg#wf') format('svg');
  font-weight: normal;
   font-style: normal;   
}
    
@font-face 
{
    font-family: 'AvalonMedium';
    src: url('/webfont/Avalon-DemiCond-webfont.eot');
    src: url('/webfont/Avalon-DemiCond-webfont.eot?#iefix') format('embedded-opentype'),
         url('/webfont/Avalon-DemiCond-webfont.woff2') format('woff2'),
         url('/webfont/Avalon-DemiCond-webfont.woff') format('woff'),
         url('/webfont/Avalon-DemiCond-webfont.ttf') format('truetype'),
         url('/webfont/Avalon-DemiCond-webfont.svg#avalonmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face 
{
    font-family: 'AvalonBold';
    src: url('/webfont/Avalon-Bold-webfont.eot');
    src: url('/webfont/Avalon-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/webfont/Avalon-Bold-webfont.woff2') format('woff2'),
         url('/webfont/Avalon-Bold-webfont.woff') format('woff'),
         url('/webfont/Avalon-Bold-webfont.ttf') format('truetype'),
         url('/webfont/Avalon-Bold-webfont.svg#avalonmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

.mq {display: none;}
.ja {margin: 7px; float: right; }

body
{
-webkit-text-size-adjust: none; 
margin: 0px;
padding: 0px; 
font-family: ProximaNovaA, AvalonMedium, Verdana, Arial, sans serif; 
font-size: 0.9em;
}

img { border: 0px; }

a {
  color: #777777;
  -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  transition:.5s;
}
a:hover { color:#69addc; }


input:focus, select:focus
{
	outline: none;
}


input[type=button], input[type=submit], input[type=password]
{
display: inline;
color: #69addc;
border: 0;
background-color: #292a36;
height: 40px;
  -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  transition:.5s;
}
input[type=button]:hover, input[type=submit]:hover, input[type=password]:hover { cursor: pointer; background-color: #131319; }

input[type=text], input[type=password], select
{
display: inline;
box-sizing: border-box;
height: 40px;
font-weight: bold;
background-color: #e4f3fd;
border: 1px solid #69addc;
padding: 0px;
}


select {
 -webkit-appearance: none;  /*REMOVES DEFAULT CHROME & SAFARI STYLE*/
 -moz-appearance: none;  /*REMOVES DEFAULT FIREFOX STYLE*/
  background: #e4f3fd url(/images/dropdown-arrow.png) no-repeat right center;
  background-size: 20px 10px; /*TO ACCOUNT FOR @2X IMAGE FOR RETINA */
  padding: 0px 20px 0px 10px;
}

input[type=text]:focus, input[type=submit]:focus, input[type=password]:focus, select:focus
{
background-color: #edf0f2;
border: 2px solid #69addc;
}

#header-panel { width: 100%; background-color: #333333; padding: 0px; margin: 0px; box-sizing: border-box; }
#header-panel-wrap { width: 1000px; margin: 0 auto; overflow: hidden; padding: 6px; box-sizing: border-box; }
#mobile-header-panel { overflow: hidden; width: 95%; box-sizing: border-box; margin: 0 auto; height: 50px; }
#mobile-header-panel > a.ja > img  {  margin-top: 5px; }

#dl-menu { margin: 0 auto; width: 95%; float: none; }
.dl-trigger { display: none; box-sizing: border-box; background-image: url(/images/menuicon.gif), url(/images/menubarbg.jpg); background-repeat: no-repeat, repeat-x; background-position:  15px 5px, 0px 0px; border: 1px solid #AAAAAA; padding: 8px; border-radius: 5px; vertical-align: middle; height: 32px; width: 95%; margin: 0 auto; cursor: pointer;}
#wrapper { width: 1000px; margin: 0 auto; padding: 0px; box-sizing: border-box; overflow: hidden; }
#nav-wrapper { width: 100%; text-align: center; margin-bottom: 10px; }
#productname { font-family: AvalonMedium; font-size: 1.25em; font-weight: normal; }

.reviewtitle { font-family: AvalonBold; }
.reviewpanel, .reviewpanel > div { margin: 15px 0px 15px 0px; padding: 0px; overflow: hidden; }
.reviewimage { float: right; display: inline-block; overflow: hidden; }
div.reviewfooter { padding-right: 70px; background-repeat: no-repeat; background-position: right; display: inline-block; }

#productgallerycontainer { display: inline-block; vertical-align: top; padding-top: 25px; float: left; border: 0px solid #000000; box-sizing: border-box; text-align: center; }
#productleftcontainer { display: inline-block; box-sizing: border-box; width: 480px; text-align: center; }
#productimagecontainer { display: inline-block; vertical-align: top; text-align: center;  border: 0px solid #000000; box-sizing: border-box; }
#productimagecontainer > a { display: inline-block; }
#productrightcontainer { display: inline-block; float: right; padding: 15px; background-color: #f7f8fb; width: 520px; text-align: justify; box-sizing: border-box;}
#productenhancedcontent { text-align: justify; box-sizing: border-box; padding: 15px; overflow: hidden; width: 100%; }

.crosspromoitem { display: inline-block; width: 30%; margin: 1%; vertical-align: top; }
.crosspromoitem > a { display: block; font-size: 13px; }
.crosspromoheader { font-family: AvalonBold; padding: 5px; }

#header-panel-wrap a, #header-panel-wrap a:hover, #header-panel-wrap a:focus { float: right; margin-left: 20px; color: #FFFFFF; text-decoration: none; font-size: 1em; line-height: 23px; }
#header-panel-wrap #freeship { float: left; padding-left: 23px; background-image: url(/images/freeshipicon.png); background-repeat: no-repeat; background-position: 0px 4px;}
#header-panel-wrap #shoppingbag { padding-right: 23px; background-image: url(/images/shoppingbagicon.png); background-repeat: no-repeat; background-position: right;}
#header-panel-wrap #myaccount { padding-right: 23px; background-image: url(/images/myaccounticon.png); background-repeat: no-repeat; background-position: right;}
#header-panel-wrap #searchlink { padding-right: 23px; background-image: url(/images/searchicon.png); background-repeat: no-repeat; background-position: right;}

#search-panel { display: none; width: 100%; padding: 10px; background-color: #555555; box-sizing: border: box; text-align: center; }

#banner_container {  display: none; margin: 0 auto; text-align: center; box-sizing: border-box; }
#banner_container > a { width: 95%; overflow: hidden; display: block; margin: 0 auto; position: relative; }
#banner_container > a > img { width: 100%; margin: 5px; }
#front-icons-wrapper { width: 1000px; margin: 0 auto; text-align: center; }
.front-icons { width: 32%; text-align: center; display: inline-block; margin: 1%; overflow: hidden;  }
.front-icons > a > img { width: 100%; }
.front-icon-tungsten-ring { width: 30%; }
.front-icon-tungsten-ring > a > img { width: 106.6%; margin-left: -3.3%; }
.front-intro { margin: 0 auto; text-align: justify; width: 700px; }

.wikipanel { margin: 0 auto; margin-top: 50px;  border-top-left-radius: 10px; border-top-right-radius: 10px; border: solid 1px #AAAAAA;  display: block; overflow: hidden; font-size: 18px; padding: 20px;}
.wikiblockimg { display: block; margin-left: auto; margin-right: auto; }

@media screen and (min-width: 1021px)
{
.dl-animate-in-1 { display: none; }
#nav-wrapper { margin: 0 auto; }
#nav-panel { list-style-type: none; padding: 0px; margin: 0 auto; float: none; display: inline-block; position: relative; }
#nav-panel > li { float: left; padding: 9px; line-height: 50px; }
#nav-panel > li > a { font-family: avalonextra_light; vertical-align: middle; text-decoration: none; color: #000000; font-size: 1.1em; } 
#nav-panel > li > a:hover { text-decoration: underline; }
#nav-panel > li > ul { position: absolute; float: left; display:none; z-index: 2000; box-shadow: 2px 2px 2px 2px #AAAAAA; width: 1000px; min-height: 200px; padding: 0px 130px 0px 130px; box-sizing: border-box; }
#nav-panel > li:hover { background-color: #f7f8fb; }
#nav-panel > li#logocell:hover { background-color: transparent; }
#nav-panel > li#logocell > a > img { vertical-align: middle; }
#nav-panel > li:hover > ul { display: block; top: 68px; left: 0px; background-color: #FFFFFF; }
.nav-sub-panel > li { display: inline-block; text-align: center; font-weight: bold; margin: 15px 15px; vertical-align: middle; }
.nav-sub-panel > li.dl-back { display: none; }
.nav-sub-panel > li > a:hover { opacity: 0.7; }
.nav-sub-panel > li > a > img { width: 150px; display: block; margin: 0 auto; }
.nav-sub-panel > li > a { color: #222222; }

.wikipanel { width: 800px; padding: 10px; }
}

.galleryitem { width: 200px; margin: 25px; display: inline-block; min-height: 270px; padding: 0px; box-sizing: border-box; border: 0px solid #AAAAAA; vertical-align: top; text-align: center; }
.galleryitem > h2 { margin-bottom: 7px; }
.galleryname { font-weight: normal; text-decoration: none; font-size: 14px; }
.galleryprice { font-family: AvalonBold; font-size: 14px; color: #000000; }

.footer-column li, .footer-column li a, .footer-column li a:hover, .footer-column li a:focus { text-decoration: none; font-size: 0.9em; display: block; } 
#footer { display: inline-block; width:100%;  clear: both; padding: 20px; box-sizing: border-box; background-color: #f7f8fb; margin-top: 20px; }
#footer-wrap, #lower-footer-wrap { width: 960px; margin: 0 auto; box-sizing: border-box; overflow: hidden; }
#lower-footer-wrap { border-top: 2px solid #69addc; padding-top: 20px; box-sizing: border-box;}
.footer-column { list-style-type: none; display: inline-block; vertical-align: top; padding-bottom: 10px; margin-right: 0px; }
.footer-header { font-weight: normal; font-family: AvalonBold; }
.footer-column li { line-height: 25px; }
#maillistpanel { width: 200px; float:right;  margin-right: 0px; }
#maillistform { text-align: right; display: inline; }
#maillistemail { width: 200px; float: right; margin: 2px; }
#maillistsubmit { float: right; margin: 2px;}

.wikih2 { margin-top: 0px; }

@media screen and (max-width: 1020px) {
#front-icons-wrapper { width: 100%; }
.front-icons > a > img { width: 100%; }
.front-icon-tungsten-ring > a > img { width: 106.6%; }
.front-intro { width: 95%; }

#search-panel { background-color: #FFFFFF; margin-bottom: 10px; }

.nav-sub-panel > li > a > img { display: none; }
#logocell {display: none; }
.galleryitem, .gallerypaging { width: 27%; margin: 20px 3% 20px 3%; }
.gallerypaging { width: 94%; }
.dl-trigger { display: block; }
#wrapper { width: 100%; }
#productgallerycontainer { padding-top: 0px; }
#productleftcontainer { width: 100%; }
#productrightcontainer { width: 100%; }

#footer-wrap, #lower-footer-wrap { width: 100%; box-sizing: border-box; }
#footer { padding: 0px; }
#maillistpanel { width: 100%; margin-top: 0px;}
#lower-footer-wrap { border: none; } 
.footer-column { display: block; clear: both; width: 100%; overflow: hidden; border-bottom: 2px #EEEEEE solid; padding-left: 0px; box-sizing: border-box; }
.footer-column li { float: left; padding-left: 20px; }
.nonmq { display: none; }
.mq { display: block; }
.ui-state-default, .ui-state-active  { font-size: 1em; }

.wikipanel { width: 90%; font-size: 16px;}
.wikiblockimg { width: 90%; }
.wikisideimg { width: 50%; margin: 0 5px; }
}

@media screen and (max-width: 750px) {

#slider1_container { display: none; }
#banner_container { display: block; }
.galleryitem , .gallerypaging { width: 40%; margin: 20px 5% 20px 5%; }
.gallerypaging { width: 90% }
}

@media screen and (max-width: 500px) {
.front-icons { width: 95%; }
.front-icon-tungsten-ring > a > img { width: 100%; margin-left: 0; }
input.optiontext { width: 100%; }
select.optionlist { width: 100%; }
#banner_container > a > img { width: 150%; margin-left: -25%; }
#productgallerycontainer { display: block; width: 100%; text-align: center; }
#productgallerycontainer .extraImages { display: inline; }
#productimagecontainer { display: block; width: 100%; }
#productcrosspromocontainer { display: none; }

.galleryitem, .gallerypaging { width: 80%; margin: 20px 10% 20px 10%; }
.gallerypaging { width: 80%; }
}




.ui-state-default, .ui-state-active
{
   font-family: AvalonBold;
   border-top: 3px solid #FFFFFF;
   padding-top: 5px;
   cursor: pointer;
   font-weight: normal;
   font-size: 0.8em;
   outline: none;
}

.ui-state-default,
.ui-widget-content .ui-state-default, 
.ui-widget-header .ui-state-default
{
   background-image: url('/images/accordion-icon.png');
   background-repeat: no-repeat;
   background-position: 0px 4px;
   padding-left: 20px;
}

.ui-state-active,
.ui-widget-content .ui-state-active, 
.ui-widget-header .ui-state-active
{
   background-image: url('/images/accordion-icon.png');
   background-repeat: no-repeat;
   background-position: 0px -21px;
   padding-left: 20px;
}

.productaccordion > div { margin: 15px; }
.productaccordion > span { display: block; }

#ordqty { text-align: center; }
.extraImages { display: block; }
.price { font-family: AvalonBold; font-size: 1.2em; display: block; line-height: 2.5em; }
.nonsalesprice { display: block; font-size: 1.2em; line-height: 2.5em; }
.availability { font-size: 1.2em; line-height: 2.5em; }
#orderForm { margin-top: 20px; margin-bottom: 20px; }
.optiontext, .optionlist { width: 400px; display: block; clear: both; margin: 0px 0px 20px 0px; }
.optiontype { display: block; font-size: 1.1em;  margin: 0px 0px 10px 0px; }
.productstyle { font-family: georgia; font-style: italic; }
.rmcpanel { border-radius: 10px; border: 1px solid #69addc; position: relative; min-height: 70px; margin: 15px; }
.rmcname { font-family: AvalonBold; display:inline-block;  position: absolute; top: 0px; font-size: 1.1em;  margin: -14px 0 0 10px;  background: #f7f8fb;  padding: 2px 10px 0px 10px;  }
.rmctable {display: table; }
.rmcrow {display: table-row; }
.rmccell {display: table-cell; padding: 5px 5px 5px 25px; }

.socialicon { display: inline-block; margin: 5px; background-image: url('/images/socialicons.png'); background-repeat: no-repeat; width: 32px; height: 32px; cursor: pointer;}
.socialicon:hover { opacity: 0.8; }
#facebookicon { background-position: 0px 0px; }
#twittericon { background-position: -32px 0px; }
#gplusicon { background-position: -64px 0px ; }
#pinteresticon { background-position: -96px 0px; }
#tumblricon { background-position: -128px 0px; }
#emailicon { background-position: -160px 0px ; }
#askquestionbutton { margin: 5px; color: #EEEEEE; background-color: #b4caea; width: 140px; display: block; padding: 6px; font-family: AvalonBold; text-align: center; cursor: pointer; }



            /* jssor slider bullet navigator skin 21 css */
            /*
            .jssorb21 div           (normal)
            .jssorb21 div:hover     (normal mouseover)
            .jssorb21 .av           (active)
            .jssorb21 .av:hover     (active mouseover)
            .jssorb21 .dn           (mousedown)
            */
            .jssorb21 {
                position: absolute;
            }
            .jssorb21 div, .jssorb21 div:hover, .jssorb21 .av {
                position: absolute;
                /* size of bullet elment */
                width: 19px;
                height: 19px;
                text-align: center;
                line-height: 19px;
                color: white;
                font-size: 12px;
                background: url(/images/b21.png) no-repeat;
                overflow: hidden;
                cursor: pointer;
            }
            .jssorb21 div { background-position: -5px -5px; }
            .jssorb21 div:hover, .jssorb21 .av:hover { background-position: -35px -5px; }
            .jssorb21 .av { background-position: -65px -5px; }
            .jssorb21 .dn, .jssorb21 .dn:hover { background-position: -95px -5px; }
            
            /* jssor slider arrow navigator skin 21 css */
            /*
            .jssora21l                  (normal)
            .jssora21r                  (normal)
            .jssora21l:hover            (normal mouseover)
            .jssora21r:hover            (normal mouseover)
            .jssora21l.jssora21ldn      (mousedown)
            .jssora21r.jssora21rdn      (mousedown)
            */
            .jssora21l, .jssora21r {
                display: block;
                position: absolute;
                /* size of arrow element */
                width: 55px;
                height: 55px;
                cursor: pointer;
                background: url(/images/a21.png) center center no-repeat;
                overflow: hidden;
            }
            .jssora21l { background-position: -3px -33px; }
            .jssora21r { background-position: -63px -33px; }
            .jssora21l:hover { background-position: -123px -33px; }
            .jssora21r:hover { background-position: -183px -33px; }
            .jssora21l.jssora21ldn { background-position: -243px -33px; }
            .jssora21r.jssora21rdn { background-position: -303px -33px; }
            
            
/*  Shopping Cart layout */
td.tablespacer
{
   border-bottom: 3px solid #DDDDDD;
}

 #popup_box { 
     display:none;
     position:absolute;   
     background:#FFFFFF;  
     text-align: center;
     z-index:100;
     margin-left: 15px;  
     
     border:1px solid #999999;      
     padding:15px;  
     font-size:15px;  
     -moz-box-shadow: 0 0 5px #DDDDDD;
     -webkit-box-shadow: 0 0 5px #DDDDDD;
     box-shadow: 0 0 5px #DDDDDD;
     
 }

 a.closeWindowX{
 cursor: pointer;  
 text-decoration:none;
 font-size: 10px;
 } 

 /* This is for the positioning of the Close Link */
 #popupBoxClose {
     font-size:15px;  
     line-height:15px;  
     right:5px;  
     top:5px;  
     position:absolute;  
     color:#6fa5e2;  
     font-weight:500;      
 }
 
 .engravingbox
 {
 	  width: 400px;
 	  margin: 0 auto;
 	  text-align: center;
 	  line-height: 50px;
 	  border: 1px solid #DDDDDD;
 	  border-radius: 5px;
 	  padding: 15px;
 	  margin-bottom: 20px;
 }
/* End Shopping Cart layout */