/*
CSS Credit: http://www.templatemo.com/
*/

body {
	margin: 0;
	padding: 0;
	line-height: 1.5em;
	font-family: Verdana, Arial, san-serif;
	font-size: 1em;
	color: #DCDDE0;
	background: #000;
}

a:link, a:visited { color: ;
	text-decoration: none;
	font-weight: bold;
	color: #FFFFFF;
} 
a:active, a:hover { color: ; text-decoration: underline;}

p {
	margin: 0em;
	padding: 0em;
}

img {
	margin: 0em;
	padding: 0em;
	
}
ul.a {
    list-style-type: circle;
	font-size: 0.75em;
	font-style:normal;
	font-weight: 700;
}


.cleaner {
	clear: both;
	width: 100%;
	height: 1px;
	font-size: 0em;	
}

.cleaner_with_height {
	clear: both;
	width: 100%;
	height: 30px;
	font-size: 0em;	
}

.cleaner_with_width {
	float: left;
	width: 20px;
	height: 30px;
	font-size: 0em;	
}

.buy_now_button a{
	clear: both;
	text-align: center;
	display: block;
	width: 100px;
	padding: 4px 0 5px 0;
	margin-bottom: 10px; 
	background: url(images/btn_02.jpg) no-repeat;
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
}

.detail_button a{
	clear: both;
	text-align: center;
	display: block;
	width: 100px;
	padding: 4px 0 5px 0;
	margin-bottom: 10px; 
	background: #000;
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
}

#container{
	width: 960px;
	margin: 0 auto;
	padding: 0 0.625em;
	background: #1c1c1b url(images/bg.jpg) repeat-y;
}


/* menu */

#menu {
	clear: both;
	width: 960px;
	height: 45px;
	background: url(images/menu_bg.jpg) no-repeat;
}

#menu ul {
	padding: 10px;
	margin: 0;
	list-style: none;
}

#menu ul li{
	display: inline;
}

#menu ul li a{
	float: left;
	padding: 0 20px;
	font-size: 1em;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	color: #969547;
}

#menu li a:hover, #menu li .current{
	color: #FD5A37;
}

/* end of menu*/

/* header */
#header h1{
	clear:none ;
	width:auto ;
	font-size: 2.5em;
	height: 1.35em ;
	padding: 1.25em;
	line-height: 1.35em;
	background: #000;
}
#header h2{
	clear:none ;
	width:auto ;
	font-size: 2em;
	height: 1.25em ;
	padding: 1.25em;
	line-height: 1.25em;
	background: #000;
}
#header h3{
	clear:none ;
	width:auto;
	font-size: 1.75em;
	height: 1.25em ;
	padding: 1.25em;
	line-height: 1.25em;
	background: #000;
}
#header h4{
	clear:none ;
	width:auto ;
	font-size: 1.5em;
	height: 1.222222em ;
	padding: 1.25em;
	line-height: 1.22222em;
	background: #000;
}
#header h5{
	clear:none ;
	width:auto;
	font-size: 1.25em;
	height: 1.222222em ;
	padding: 1.25em;
	line-height: 1.22222em;
	background: #000;
}
#header h6{
	clear:none ;
	width:auto ;
	font-size: 1.125em;
	height: 1.222222em ;
	padding: 1.25em;
	line-height: 1.22222em;
	background: #000;
}

#header a,a:hover {
	color: #FD5A37;
}


/* end of header */


/* content */
#content {
	clear: both;
	width: 920px;
	padding: 20px;
}

#content #content_left {
	float: left;
	width: 215px;
	padding: 10px;
	background-color: #171716;
	border: 1px solid #212120;
}

#content #content_right {
	float: right;
	width: 670px;
}


#content_left .content_left_section{
	clear: both;
	padding-bottom: 10px;
	margin-bottom: 20px;
}

.content_left_section h1 {
	font-size: 1em;
	color: #cbc750;
	padding: 0 0 5px 0;
	margin: 0 0 10px 0;
	border-bottom: 1px dotted #cbc750;
}

.content_left_section ul {
	padding: 0;
	margin: 0;
}

.content_left_section ul li{
	padding: 0 0 3px 10px;	
	list-style: none;
}

.content_left_section ul li a{
	font-weight: normal;
	text-decoration: none;
	color: #969547;
}

.content_left_section li a:hover, .content_left_section li .current{
	color: #fcf88e;
}





#content_right .product_box {
	float: left;
	width: 303px;
	height: 210px;
	padding: 10px;
}

#content_right h1 {
	padding: 10px;
	margin: 0 0 20px 0;
	font-size: 1em;
	color: #cbc750;
	background: #03F;
}

#content_right h2 {
	padding: 0 0 0 0;
	margin: 0 0 20px 0;
	font-size: 0.75em;
	color: #e6e154;
}

#content_right h3 {
	padding: 0;
	margin: 0 0 20px 0;
	font-size: 1.2em;
	color: #85391f;
}

#content_right ul {
	margin: 0 0 20px 0;
	padding: 0 0 0 20px;
	list-style: none;
}

#content_right li {
	padding: 0 0 3px 0;
}

#content_right .image_panel {
	float: left;
	width: 100px;
	margin-right: 20px;
}

#content_right p {
	text-align: justify;
	padding: 0 0 8px 0;
}

.product_box h1 span {
	font-weight: bold;
	font-size: x-small;
}

.product_box img {
	float: left;
	margin-right: 20px;
	border: width="0 px" color=#fcf88e;
	border-color: #000;
	border-width: 0px;
}

.product_box .product_info {
	float: left;
	width: 180px;
}

.product_info p {
	margin-bottom: 15px;
}

/* end of content */

/* footer */
#footer {
	clear: both;
	width: 100%;
	padding: 20px 0px 20px 0;
	text-align: center;
	border-top: 0px solid;
	color: #ffffff;
	background-color: #000;
}

#footer a{
	color: #fff;
	font-weight: bold;
}
/* end of footer */


@-webkit-keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 25% {
   opacity:1;
 }
 33% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-moz-keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 25% {
   opacity:1;
 }
 33% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-o-keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 25% {
   opacity:1;
 }
 33% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-5-keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 25% {
   opacity:1;
 }
 33% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 25% {
   opacity:1;
 }
 33% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

#cf4a {
  position:relative;
  height: 181px;
  max-width:322px;
  margin:0 auto;

}
#cf4a img {
  position:absolute;
  left:0;
}

#cf4a img {
  -webkit-animation-name: cf4FadeInOut;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 18s;

  -moz-animation-name: cf4FadeInOut;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count: infinite;
  -moz-animation-duration: 18s;

  -o-animation-name: cf4FadeInOut;
  -o-animation-timing-function: ease-in-out;
  -o-animation-iteration-count: infinite;
  -o-animation-duration: 18s;
  
  -5-animation-name: cf4FadeInOut;
  -5-animation-timing-function: ease-in-out;
  -5-animation-iteration-count: infinite;
  -5-animation-duration: 18s;

  animation-name: cf4FadeInOut;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-duration: 18s;
}
#cf4a img:nth-of-type(1) {
  -webkit-animation-delay: 15s;
  -moz-animation-delay: 15s;
  -o-animation-delay: 15s;
  -5-animation-delay: 15s;
  animation-delay: 15s;
}
#cf4a img:nth-of-type(2) {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -o-animation-delay: 12s;
  -5-animation-delay: 12s;
  animation-delay: 12s;
}
#cf4a img:nth-of-type(3) {
  -webkit-animation-delay: 9s;
  -moz-animation-delay: 9s;
  -o-animation-delay: 9s;
  -5-animation-delay: 9s;
  animation-delay: 9s;
}
#cf4a img:nth-of-type(4) {
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
  -o-animation-delay: 6s;
  -5-animation-delay: 6s;
  animation-delay: 6s;
}

#cf4a img:nth-of-type(5) {
  -webkit-animation-delay: 3s;
  -moz-animation-delay: 3s;
  -o-animation-delay: 3s;
  -5-animation-delay: 3s;
  animation-delay: 3s;
}
div#slider {
	Display: Block;
	Position: Relative;
	width: 100%;
	Margin: 0 auto;
	max-width: 1000px;
}
div#slider figure {
	Display: Block;
	position:  absolute;
	width: 100%;
	padding: 0;
	font-size: 0em;
	text-align: left;
}
div#slider figure img {
	width: 14.2857%;
	margin: auto;
	height: auto;
	float: left;
}

div#slider {
	width: 80%;
	max-width: 800px;
	overflow: hidden; 
}
@keyframes slidy { 
	0%  { left: 0%; }
	14% { left: 0%; }
	15% { left: -100%; }
	29% { left: -100%; }
	30% { left: -200%; }
	44% { left: -200%; } 
	45% { left: -300%; }
	59% { left: -300%; }
	60% { left: -400%; } 
	74% { left: -400%; }
	75% { left: -500%; }
	89% { left: -500%; } 
	90% { left: -600%; }
	100% { left: -600%; }
}
div#slider figure {
	position: relative;
	width: 700%;
	margin: 0;
	padding: 0;
	font-size: 0em;
	left: 0;
	text-align: left;
	animation: 40s slidy infinite;  
}

div#gallery-w-captions {
	width: 80%;
	overflow: hidden;
}
figure { margin: 0; }
figure.slider {
	position: relative;
	width: 700%;
	font-size: 0em;
	animation: 40s slidy infinite; 
}
figure.slider figure { 
	width: 14.28%;
	display: inline-block;
	position: inherit; 
}
figure.slider img {
	width: 100%;
	height: auto;
}
figure.slider figure figcaption {
	position: relative;
	bottom: 0;
	background: rgba(0,0,0,0.3);
	color: #DCDDE0;
	width: 100%;
	word-wrap: break-word;
	font-size: 0.75em;
	padding: .1rem;
}
div#slider_PortraitIMG {
	Display: Block;
	Position: Relative;
	width: 90%;
	Margin: 0 auto;
	max-width: 800px;
}
div#slider_PortraitIMG figure {
	Display: Block;
	position:  absolute;
	width: 100%;
	padding: 0;
	font-size: 0em;
	text-align: left;
}
div#slider_PortraitIMG figure img {
	width: 14.2857%;
	margin: auto;
	height: auto;
	float: left;
}

div#slider_PortraitIMG {
	width: 90%;
	max-width: 600px;
	overflow: hidden; 
}
@keyframes slidy { 
	0%  { left: 0%; }
	14% { left: 0%; }
	15% { left: -100%; }
	29% { left: -100%; }
	30% { left: -200%; }
	44% { left: -200%; } 
	45% { left: -300%; }
	59% { left: -300%; }
	60% { left: -400%; } 
	74% { left: -400%; }
	75% { left: -500%; }
	89% { left: -500%; } 
	90% { left: -600%; }
	100% { left: -600%; }
}
div#slider_PortraitIMG figure {
	position: relative;
	width: 700%;
	margin: auto;
	padding: 0;
	font-size: 0em;
	left: 0;
	text-align: left;
	animation: 40s slidy infinite;
}



#photos {
  /* Prevent vertical gaps */
  line-height: 0;
   
  -webkit-column-count: 4;
  -webkit-column-gap:   0px;
  -moz-column-count:    4;
  -moz-column-gap:      0px;
  column-count:         4;
  column-gap:           0px;  
}

#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}
@media (max-width: 1200px) {
  #photos {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
}
@media (max-width: 400px) {
  #photos {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
}
#PhotoBanner_container {
 width: 100%;
 overflow: hidden;
 margin: 30px auto;
 background: black;
}
PhotoBanner_header {
 width: 800px;
 margin: 10px auto;
}
 
PhotoBanner_header h1 {
 text-align: center;
 font: 100 2em/1.0 Helvetica, Verdana, sans-serif;
 color: white;
 
}
 
PhotoBanner_header p {
 font: 100 1em/1.0 Helvetica, Verdana, sans-serif;
 text-align: justify;
}
 
/*photobanner*/
 
.photobanner {
 height: 255px;
 width: 12000px;
 margin-top:10px;
 margin-bottom: 0px;
}

 
.photobanner img {
 -webkit-transition: all 0.5s ease;
 -moz-transition: all 0.5s ease;
 -o-transition: all 0.5s ease;
 -ms-transition: all 0.5s ease;
 transition: all 0.5s ease;
}
 
.photobanner img:hover {
 -webkit-transform: scale(1.4);
 -moz-transform: scale(1.4);
 -o-transform: scale(1.4);
 -ms-transform: scale(1.4);
 transform: scale(1.4);
 cursor: pointer;
 
 -webkit-box-shadow: 0px 0px 0px rgba(0,0,0,0);
 -moz-box-shadow: 0px 0px 0px rgba(0,0,0,0);
 box-shadow: 0px 0px 0px rgba(0,0,0,0);
}



	
 /*keyframe animations*/ 
.first {
 -webkit-animation: bannermove 78s linear infinite;
    -moz-animation: bannermove 78s linear infinite;
     -ms-animation: bannermove 78s linear infinite;
      -o-animation: bannermove 78s linear infinite;
         animation: bannermove 78s linear infinite;
}
 
@keyframes bannermove {
 0% {
    margin-left: 0px;
 }
 100% {
    margin-left: -11500px;
 }
 
}
 
@-moz-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -11500px;
 }
 
}
 
@-webkit-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -11500px;
 }
 
}
 
@-ms-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -11500px;
 }
 
}
 
@-o-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -11500px;
 }
 
 .photobanner {
 height: 233px;
 margin-bottom: 10px;
}
#icon-links {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}

@media only screen and (min-width: 768px) { <<<large
#logo-1 { display: block; }
#logo-2 { display: none; }
}
@media only screen and (min-width: 480px) and (max-width: 767px) { <<<medium
#logo-1 { display: none; }
#logo-2 { display: block; }
}

@media only screen and (max-width: 479px) { <<<small
#logo-1 { display: none; }
#logo-2 { display: block; }
}