/* Fonts */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(http://fonts.gstatic.com/s/ptsans/v8/ATKpv8nLYAKUYexo8iqqrg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face {
  font-family: 'PT Serif Caption';
  font-style: normal;
  font-weight: 400;
  src: local('PT Serif Caption'), local('PTSerif-Caption'), url(http://fonts.gstatic.com/s/ptserifcaption/v8/7xkFOeTxxO1GMC1suOUYWb6cM-LMFQwoMtZfMYS1DLM.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

textarea {
    resize: none;
}

body { font-family: 'Raleway', serif; }
a { color: #777; }
a:hover { color: #FFF; }
a, a:hover, a:active { text-decoration: none; }

/* Global Classes */
.section { margin-bottom: 20px; }
img.div-wide { width: 100%; }

/* Header Section */ 
.navbar { margin-bottom: 0; background-color: #000; border-radius: 0; }
.navbar-nav { display: block; margin: 0 auto; text-align: center; white-space: nowrap; }
.navbar-nav li { padding: 0 20px; font-weight: bold; letter-spacing: 4px; }

.navbar-inverse .navbar-toggle .icon-bar { background-color: #9d9d9d; }
#global-header-logo-mobile { display: block; margin-top: 1px; text-align: center; vertical-align: top; }
#global-header-logo-mobile img { margin: 0 auto; height: 56px; vertical-align: top; padding-left: 59px; }

/* Elements Section */
.card { height: 260px; }
.card .inner {  display: table-cell; vertical-align: middle; padding: 0 10%; text-align: center; }
.card .inner img { width: 70%; }
.card .front, .card .back { display: table; }
.card .front:hover, .card .back:hover { cursor: pointer; }
.card .front { -moz-box-shadow: inset 0 0 8px #dfdfdf; -webkit-box-shadow: inset 0 0 8px #dfdfdf; box-shadow: inset 0 0 8px #dfdfdf;  }
.card .front:hover { -moz-box-shadow: inset 0 0 8px #a4a4a4; -webkit-box-shadow: inset 0 0 8px #a4a4a4; box-shadow: inset 0 0 8px #a4a4a4;  }
.card .front .inner { opacity: 0.3; }
.card .front .inner:hover { opacity: 1; }


#earth-element-card .back { -moz-box-shadow: inset 0 0 8px #cbe3c6; -webkit-box-shadow: inset 0 0 8px #cbe3c6; box-shadow: inset 0 0 8px #cbe3c6; }
#air-element-card .back { -moz-box-shadow: inset 0 0 8px #c6cde3; -webkit-box-shadow: inset 0 0 8px #c6cde3; box-shadow: inset 0 0 8px #c6cde3; }
#fire-element-card .back { -moz-box-shadow: inset 0 0 8px #e3c6c6; -webkit-box-shadow: inset 0 0 8px #e3c6c6; box-shadow: inset 0 0 8px #e3c6c6; }
#water-element-card .back { -moz-box-shadow: inset 0 0 8px #c6e3e1; -webkit-box-shadow: inset 0 0 8px #c6e3e1; box-shadow: inset 0 0 8px #c6e3e1; }


/* Showcase Slider */
.slider .item{ background: #333; text-align: center; }
.carousel .carousel-control { visibility: hidden; }
.carousel:hover .carousel-control { visibility: visible; }
.carousel-control.left, .carousel-control.right { background-image: linear-gradient(to right,rgba(0,0,0,.0001) 0,rgba(0,0,0,.0001) 100%); }
.carousel-control.left { left: 5%; }
.carousel-control.right { right: 5%; }

/* E-1 Section */
.stone-image { width: 39%; display: inline-block; text-align: center; }
.stone-image img { max-width: 100%; }
.stone-description { width: 55%; display: inline-block; vertical-align: middle; margin-right: 5%;}

#elements-carousel .carousel-control .glyphicon-chevron-left,
#elements-carousel .carousel-control .glyphicon-chevron-right,
#elements-carousel .carousel-control .icon-next,
#elements-carousel .carousel-control .icon-prev { top: 85%; }

#stones-carousel .carousel-control.right { right: 61%; left: auto; }
#stones-carousel .carousel-control .glyphicon-chevron-left,
#stones-carousel .carousel-control .glyphicon-chevron-right,
#stones-carousel .carousel-control .icon-next,
#stones-carousel .carousel-control .icon-prev { top: 85%; }

#e1-left .carousel-caption { bottom: 10%; }
#e1-right .carousel-indicators { display: none; }

.carousel-caption, .carousel-caption h3 { padding: 0; margin: 0; }
/* E-2 Section */
#accessories-carousel .carousel-control .glyphicon-chevron-left,
#accessories-carousel .carousel-control .glyphicon-chevron-right,
#accessories-carousel .carousel-control .icon-next,
#accessories-carousel .carousel-control .icon-prev { top: 15%; }

#e2-right .carousel-caption { top: 10%; color: #afafaf }
#e2-right .carousel-caption h3 { font-size: 16px; text-transform: uppercase; }

/* Footer */
.footer-wrapper {padding:60px 0; background:black}
footer { font-family: 'PT Serif Caption', serif; font-size: 12px; }
footer .row { /*background-color: black; padding: 60px 0;*/ }
footer .links { text-transform: uppercase; letter-spacing: 6px; }
footer .links li { margin-top: 10px; }
footer .copyright { /*float: right;*/ padding: 10px 0; }

/* About Page components */
.about.row { font-size: 12px; font-weight: bold; }
.about.row .copy, .about.row .image { box-shadow: 9px 10px 15px #615F5F; }
.about.row .copy { background-color: #fff; min-height: 462px; padding: 15px 20px; }
.about.row img { width: 100%;  }
.title-bar.row { padding: 2% 0; text-align: center; text-transform: uppercase; color: #cfe3ff; background-color: #000; }
.title-bar { padding: 2% 0; text-align: center; text-transform: uppercase; color: #cfe3ff; background-color: #000; }
.wrapper-box {overflow: hidden; background: #25282A; margin: 0 auto; padding: 20px 5px;}
#about-upper-section { padding: 0px 15px }
#about-upper-section > .wrapper-box { background: url('../images/about-c-row-one.jpg'); }
#about-upper-section > .copy { background-color: rgba(255, 255, 255, 0.9); }
#about-upper-section .image { padding-left:0; padding-right:0 }
#about-upper-section .copy.contact { background:#EAEAEA; }
#about-upper-section .copy .special { padding: 10px 0 20px; }
#about-lower-section { padding: 0px 15px; }
#about-lower-section .image { padding-left:0; padding-right:0 }
#about-lower-section .copy.special { background: url('../images/collection-pieces.png') no-repeat #fff 50% 60%;  }

@media (max-width: 767px) {
  .card .inner p { font-size: 10px; }
  .stone-description br { display: none; }

  #e1-left, #e2-left { margin-bottom: 20px; }
  #e1-left img, #e2-right img{ width: 100%; }
  #e1-left .carousel-caption { bottom: 20%; }
  #e1-left .carousel-indicators {bottom: 5%; margin-bottom: 0; }

  #stones-carousel .carousel-control.right { right: 66%; }

  footer .footer-wrapper { padding: 30px 0; }
  footer .footer-wrapper img { height: 46px; }
  footer a { font-size: 10px; }  
  footer .links li {    margin-top: 4px; }


}

@media (max-width: 450px) {
	#stones-carousel { min-height: 215px }
}

@media (min-width: 768px) {
  /* Header Section */ 
  .navbar-nav { margin: 0 auto; float: none; }
  .navbar-nav li { display: inline-block; float: none; text-transform: uppercase; }
  .nav>li { position: relative; }

  /* E-1 Section */
  #e1-left .carousel img { width: 100%; }
  #collection-showcase, #accessories-showcase { display: flex; }

}
@media (min-width: 1200px) {
  .container {
    width: 970px;
  }
}

/* 12. Contact Styles */

/*#contact {
	padding: 105px 0px 150px;
	background: none repeat scroll 0% 0% #FFF;
	display: table;
	width: 100%;
	position:relative;
}

#contact form {
	margin-top: 65px;
}*/

.contact-form input, .contact-form textarea {
	border: 2px solid #000;
	display: block;
	height: 65px;
	padding: 5px 20px;
	text-align: left;
	width: 100%;
	color: #000;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	font-family: Raleway;
	letter-spacing: 0.15em;
}

.contact-form input::-webkit-input-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form input:-moz-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form input::-moz-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form input:-ms-input-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form textarea::-webkit-input-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form textarea:-moz-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form textarea::-moz-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form textarea:-ms-input-placeholder {
	color: #000 !important;
	opacity: 1 !important;
}

.contact-form input:focus, .contact-form textarea:focus {
	text-transform: none;
	outline: 0;
}

.contact-form .row {
	margin: 0;
}

.contact-form .row .col-md-6 {
	padding: 0;
}

.contact-form .row .col-md-6:nth-child(1) input {
	border-right: 1px solid #000;
}

.contact-form .row .col-md-6:nth-child(2) input {
	border-left: 1px solid #000;
}

.contact-form textarea {
	border: 2px solid #000;
	border-top: none;
	height: 197px;
	padding: 25px 20px;
	margin-bottom: 30px;
}

#contact_form input:focus, #contact_form textarea:focus {
	outline: none;
}

.contact-form button {
	height: 57px;
	line-height: 53px;
	background: #fff;
}

.submit {
	margin: 50px auto;
	background: #333333;
}

.submit:focus {
	margin: 50px auto;
}

.statusMessage,.successmessage,.errormessage {
	display: none;
	margin: auto;
	width: 100%;
	height: auto;
	background: #fff;
	border: 1px solid #ddd;
	margin: 0 auto;
	padding: 30px;
}

.statusMessage p {
	margin: 0;
	color: #888;
}

.successmessage p {
	margin: 0;
	color: #888;
}

.success-ico {
	background: url(../images/success.png) no-repeat;
	width: 30px;
	height: 30px;
	float: left;
	margin-right: 15px;
	position: relative;
	top: -6px;
}

.error-ico {
	background: url(../images/error.png) no-repeat;
	width: 30px;
	height: 30px;
	float: left;
	margin-right: 15px;
	position: relative;
	top: 5px;
}

.errormessage p {
	margin: 0;
	color: #888;
}

.address {
	background: #000;
	padding: 5% 0;
}

.logo {
	font-weight: 600;
	padding-bottom: 12%;
}

.btn-center {
    display: table;
    margin: 0 auto;
}

.btn-big {
    padding: 0 80px;
}

.btn-1 {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    color: #000;
    letter-spacing: 0.15em;
    font-family: Raleway;
    border: 2px solid #000000;
    line-height: 46px;
    height: 50px;
    padding: 0 50px;
    display: table;
	margin-bottom:10px;
}

#about-e1{
	margin-top: 30px;
}

.item{
	/* padding:20px; */
}





