@font-face {
    font-family: pageFont;
    src: url("../fonts/pageFont.ttf");
}

@font-face {
    font-family: pageFontItalic;
    src: url("../fonts/pageFontItalic.ttf");
}

@font-face {
    font-family: titleFont;
    src: url("../fonts/titleFont.ttf");
}

.h{color: rgb(165,125,0);}
.title
{
	font-size:40px;
	font-family:titleFont; 
	color: rgb(165, 125, 0);
	margin:0px;
	line-height:18px;
}
.subtitle{color: white; font-family:pageFontItalic; font-size:18px;}

a {color:white; text-decoration:none;}
a.h:hover {color:white; text-decoration:none;}

.divider
{
	width: 54%;
   	background-size: cover;
    	background-image: url("../img/divider-med.png");
    	display:inline-block;
    	margin: 20px 0px 0px 23%;
}
td .divider{margin:0px;}

html
{
	height: 100%; 
	width: 100%;
	margin: 0px;
	padding: 0px;
	font-family: pageFont;
    	font-size: 13px;
    	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-smoothing: antialiased;
}
body
{
	background: top left;
	background-image: url("../img/fabric2.png");
	margin: 0px;
	padding: 0px;
	color: white;
}

.farewell-banner
{
    display:inline-block;
    float:right;
    vertical-align:top;
    margin-top: 13px;
    background-color: rgb(165, 125, 0);
    font-weight: bold;
    border: 3px solid black;
    border-top: 0px;
    border-radius: 0;
    width: 60%;
    margin-right: 4%;
    text-align: center;
    padding: 0 1% 15px 1%;
}
.navbar .farewell-banner p:hover { color: white; cursor:default;}
.thank-you
{
    font-family:titleFont;
    text-align: center;
    font-size: 80px;
    font-weight: 100;
    margin-top: 40px;
}

.logo
{
	width: 23%;
    	max-width: 245px;
    	height: 128px;
    	background: center center no-repeat;
    	background-image: url("../img/Logo-stretch.png");
    	margin: auto;
    	display: inline-block;
    	position: absolute;
    	left: 10%;
    	top: 8px;
    	padding: 0px 1% 0px 2%;
}
.navbar
{
	font-family: pageFontItalic;
	background-color: black;
	margin: 0px;
	height: 55px;
	border-bottom: solid white 4px;
}
.navbar p
{
    	display: inline-block;
    	margin: 0px;
    	font-size: 16px;
    	padding: 0px 2% 7px 2%;
    	cursor:pointer;
}
.navbar p.marked{background: center bottom no-repeat url("../img/underline-sm.png");}
.navbar p:hover, .sidebar a:hover{color:rgb(150,110,0);}

#links
{
	display: inline-block;
    	margin: 20px 0px 0px 40%;
    	width: 50%;
    	text-align: right;
}
#links-mobile{display:none;}

#corner-dec
{
	display: inline-block;
    	float: right;
    	margin:0px;
    	padding:0px;
    	background-image: url("../img/dec-1.png");
    	background-size:cover;
    	width: 50px;
    	height: 55px;
}
#logo-filler
{
	width:260px;
	margin-left:8%;
	display: inline-block;
}


.main
{
    	display: inline-block;
    	vertical-align: top;
    	background-color: rgba(0,0,0,0.55);
    	border-radius: 5px;
    	padding: 20px 2% 40px 2%;
    	margin-top: 150px; /*60px; or 135px; (for use with banner)*/
    	float: right;
    	width: 50%;
    	margin-right: 10%;
}
.mainWrapper
{
	overflow-y: auto;
    	display: inline-block;
    	width: 100%;
    	position: absolute;
    	top: 0px;
    	z-index: -3;
    	margin-top: 57px;
    	margin-bottom: 30px;
}
.mainWrapper::-webkit-scrollbar { 
    /*display: none;*/ 
}



.sidebar
{
	    display: inline-block;
    	vertical-align: top;
    	width: 23%;
    	max-width: 245px;
    	margin-left: 10%;
    	background-color: rgba(0,0,0,0.55);
    	border-radius: 5px;
    	padding: 85px 1% 20px 2%;
    	position: fixed;
    	z-index: -1;
}
.sidebar-mobile{display:none;}

.info
{
	width: 100%;
    	margin: 20px auto 20px auto;
}
.info p, .info h3
{
	margin: 0px 0px 2px 0px;
	font-weight:normal;
}
.info td {margin-top:5px;}
.info table{border-collapse:collapse;}
.info tr td:nth-of-type(1){width:95px;}

p.yelp-btn, p.fb-btn
{
	display: inline-block;
    	width: 60px;
    	height: 35px;
    	background: center center no-repeat url("../img/yelp_gold_sm.png");
    	padding-left:10px;
}
p.fb-btn{background-image: url("../img/fbLogo-sm.png"); width:35px; padding-left:36px;}
span.yelp-btn
{

    	line-height: 35px;
    	vertical-align: bottom;
}

.announcement-banner
{
    background-color: white;
    margin: -1px auto;
    margin-bottom: 15px;
    color: black;
    padding: 2% 2%;
    border-radius: 4px;
    width: 50%;
    float: right;
    margin-right: 10%;
    text-align: center;
}

.announcement-banner .title
{
    display: block;
    margin-bottom: 18px;
}


.shadow-left, .shadow-right
{
	position:absolute;
	top:0px;
	height:100%;
	width:40%;
	max-width:470px;
	background:top repeat-y;
	z-index:-10;
}
.shadow-left
{
	background-position-x: right;
	background-image:url("../img/shadow-left.png");
}
.shadow-right
{
	background-position-x: left;
	background-image:url("../img/shadow-right.png");
	right:0px;
}
.footer
{
	position:absolute;
	bottom:0px;
	width:100%;
	height:25px;
	text-align:center;
	background-color:rgb(0,0,0);
	border-top:1px solid white;
	margin:0px;
	padding-top: 8px;
    	font-family: pageFontItalic;
}

#home-rotator, #tailor-rotator, #jewelry-rotator
{
	width: 100%;
    	border: 1px solid;
    	margin: 16px 0px;
    	background-size:cover;
}

/*Home Page------------------------------------------------ */
#home-rotator{ background-image: url("../img/home.jpg");}
/*--------------------------------------------------------- */

/*Tailoring Page------------------------------------------------ */
#tailor-rotator{background-image: url("../img/thread1.jpg");}
/*--------------------------------------------------------- */

/*Contact Page--------------------------------------------- */
.contact table
{

}
.contact tr{vertical-align:top;}
.contact td{padding: 15px 12px 0px 0px;}
.contact td:nth-of-type(2){width:88%;}

.contact input[type="text"], .contact textarea
{
	width:100%;
	border-radius: 3px;
    	border: 1px rgb(150,150,150) solid;
    	background-color: rgba(150,150,150,0.5);
    	padding: 1px 3px 3px 3px;
}
.contact input[type="radio"]{margin-bottom:8px;}
.contact textarea{height:150px;}

.contact td p{margin:0px 0px 5px 0px;}

.submit-btn
{
	height:55px;
	width:120px;
	background: url("../img/submit-btn-sm.png") center center no-repeat;
	display:inline-block;
	margin-top:20px;
	cursor:pointer;
}
.submit-btn:hover{background-image:url("../img/submit-btn-hover-sm.png");}
.submit-btn:active{background-image:url("../img/submit-btn-click-sm.png");}

.failMsg, .successMsg
{
	display: inline-block;
	line-height: 3px;
	vertical-align:top;
	min-height: 35px;
    	margin-top: 35px;
}
.failMsg{color: rgb(255, 0, 0);}
#google-map{margin-top:15px; width:100%; border:2px solid white; border-radius:4px;}
/*--------------------------------------------------------- */


/*Jewelry Page--------------------------------------------- */
#jewelry-rotator{background-image: url("../img/jewelry.jpg");}

.jewelry_thumb
{
	display:inline-block;
	width:20%;
	min-width:60px;
	background-size:cover;
	outline:1px solid white;
	margin:10px;
	cursor:pointer;
}
.jewelry_thumb:hover{outline:3px solid white;}

#j1{background-image:url("../img/jewelry_thumb/jewel_1_tb.jpg");}
#j2{background-image:url("../img/jewelry_thumb/jewel_2_tb.jpg");}
#j3{background-image:url("../img/jewelry_thumb/jewel_3_tb.jpg");}
#j4{background-image:url("../img/jewelry_thumb/jewel_4_tb.jpg");}
#j5{background-image:url("../img/jewelry_thumb/jewel_5_tb.jpg");}
#j6{background-image:url("../img/jewelry_thumb/jewel_6_tb.jpg");}
#j7{background-image:url("../img/jewelry_thumb/jewel_7_tb.jpg");}
#j8{background-image:url("../img/jewelry_thumb/jewel_8_tb.jpg");}
#j9{background-image:url("../img/jewelry_thumb/jewel_9_tb.jpg");}
#j10{background-image:url("../img/jewelry_thumb/jewel_10_tb.jpg");}
#j11{background-image:url("../img/jewelry_thumb/jewel_11_tb.jpg");}
#j12{background-image:url("../img/jewelry_thumb/jewel_12_tb.jpg");}
#j13{background-image:url("../img/jewelry_thumb/jewel_13_tb.jpg");}
#j14{background-image:url("../img/jewelry_thumb/jewel_14_tb.jpg");}
#j15{background-image:url("../img/jewelry_thumb/jewel_15_tb.jpg");}
#j16{background-image:url("../img/jewelry_thumb/jewel_16_tb.jpg");}
#j17{background-image:url("../img/jewelry_thumb/jewel_17_tb.jpg");}
#j18{background-image:url("../img/jewelry_thumb/jewel_18_tb.png");}
#j19{background-image:url("../img/jewelry_thumb/jewel_19_tb.png");}
#j20{background-image:url("../img/jewelry_thumb/jewel_20_tb.png");}
#j21{background-image:url("../img/jewelry_thumb/jewel_21_tb.png");}
#j22{background-image:url("../img/jewelry_thumb/jewel_22_tb.png");}
#j23{background-image:url("../img/jewelry_thumb/jewel_23_tb.png");}
#j24{background-image:url("../img/jewelry_thumb/jewel_24_tb.jpg");}
#j25{background-image:url("../img/jewelry_thumb/jewel_25_tb.jpg");}
#j26{background-image:url("../img/jewelry_thumb/jewel_26_tb.jpg");}
#j27{background-image:url("../img/jewelry_thumb/jewel_27_tb.jpg");}

#light_wrap
{
	position:fixed;
	width:100%;
	height:100%;
	background-color: rgba(150, 150, 150, 0.6);
	text-align:center;
	display:none;
	z-index:5;
}
#jewel_light
{
	position:relative;
	background-size:cover;
	width:85%;
	height:85%;
	border:10px solid white;
	margin:4% auto;
}
.close-btn
{
	position: absolute;
    	top: -20px;
    	right: -20px;
    	height: 50px;
    	width: 50px;
    	background: center center no-repeat url("../img/close-btn.png");
    	cursor: pointer;
}
/*--------------------------------------------------------- */

/*Tuxedo Page--------------------------------------------- */

.tuxedo_thumb
{
	display:inline-block;
	width:29%;
	min-width:60px;
	background-size:cover;
	outline:1px solid white;
	margin:10px;
	cursor:pointer;
}
.tuxedo_thumb:hover{outline:3px solid white;}

#t1{background-image:url("../img/tuxedo/C1032.jpg");}
#t2{background-image:url("../img/tuxedo/C1015.jpg");}
#t3{background-image:url("../img/tuxedo/C1037.jpg");}
/*--------------------------------------------------------- */

.construction
{
	height:250px;
	width:250px;
	margin: auto;
	background-image: url("../img/construction.png");
}
.construction-message
{
	margin-top:30px;
	text-align: center;
}