@charset "utf-8";
/* CSS Document */
body{margin:0; padding:0;  font-family:Arial, Helvetica, sans-serif;  font-size:14px; background-color:#000;background-image:url(../images/01_banner.jpg); background-repeat: no-repeat; }
a{color:#fff; text-decoration:none}
a:hover { color:red; } 
.menu2{ width:100%; float:left; margin-bottom:-100px; z-index:9999}
.nav{margin:auto; width:100%; padding-top:30px}

.menu{height:80px; width:100%; float:left; border-bottom:3px #7f4714 solid; background-color:rgba(0, 0, 0, 0.63); padding:10px 0 0 0}

.menu ul{ font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#fff; margin:auto}
.menu li{ float:left; list-style:none; background-image:url(../images/nav_arrow.jpg); background-repeat:no-repeat; background-position:right; padding:5px 20px}
.container{ width:1200px; margin:auto; background-color:rgba(0, 0, 0, 0.85) }
.wrapper1{width:100%; float:left; }

.footer{height:100px; width:100%; float:left; border-top:4px #7f4714 solid; background-color:black; color:grey; font-size:12px;/*padding-top:100px*/}
/*.footer{height:50px; width:100%; float:left; border-top:4px #7f4714 solid; background-color:rgba(0, 0, 0, 0.63);*//*padding-top:100px*/}
.footer_part_a{width:30%; float:left; color:#625c5a; padding:13px 0 0 0}
.footer_part_b{width:30%; color:#625c5a}
.ft_a{width:12%;  height:50px;  float:right;}
.ft_b{color:#d36c2c; text-align:right; width:60%;  float:left; padding:12px 0 0 0}


h1{color:#C90}

h2, #wysija-2 h4 {
color: #fff;
font-weight: normal;
font-family:Arial, Helvetica, sans-serif;
font-size: 10px;
text-transform: uppercase;

}

ul.circles_ul{ list-style:none; margin:0px auto; width:100px; position:absolute; z-index:9999; margin-top:-45%;}

h2.sky_bg{
	
color:red;	
	
	
}

.circles{
	size:20px !important;
	
	
	color: red !important;	
	
	
}


li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
margin-top: -15px;
background-color:#000000;
    border: 2px solid #666;
    -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
    /*float: left;*/
    height: 130px;
    list-style: none outside none;
    margin-left: -9px;
    overflow: hidden;
    /*position: static;*/
    text-align: center;

	
    width: 130px;
	-webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
	z-index:9999;
	background-position:0 -250px;
}
ul.circles_ul li.circles:first-child{ /*margin-left:0px;*/}
ul.circles_ul li.selected__{ border-color:#C28601; box-shadow:0 0 10px #000; z-index:99999 !important;-webkit-transform: scale(1.1);  
    -moz-transform: scale(1.1);  
    -ms-transform: scale(1.1);   
    -o-transform: scale(1.1);   
    transform: scale(1.1); /*background:url(images/gold-bg.jpg) center center no-repeat;*/
	background: #333333; /* Old browsers */ border-radius:50%;
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-radial-gradient(center, ellipse cover,  #333333 0%, #000000 100%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#333333), color-stop(100%,#000000)); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover,  #333333 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover,  #333333 0%,#000000 100%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover,  #333333 0%,#000000 100%); /* IE10+ */
background: radial-gradient(ellipse at center,  #333333 0%,#000000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#000000',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

	}
ul.circles_ul li.selected__ .sky_bg{ -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; width:100%; height:100%; background: #fff200;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZmYyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjN2M0ZTAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-radial-gradient(center, ellipse cover,  #fff200 0%, #7c4e00 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#fff200), color-stop(100%,#7c4e00));
background: -webkit-radial-gradient(center, ellipse cover,  #fff200 0%,#7c4e00 100%);
background: -o-radial-gradient(center, ellipse cover,  #fff200 0%,#7c4e00 100%);
background: -ms-radial-gradient(center, ellipse cover,  #fff200 0%,#7c4e00 100%);
background: radial-gradient(ellipse at center,  #fff200 0%,#7c4e00 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff200', endColorstr='#7c4e00',GradientType=1 );

}
ul.circles_ul li.selected__ .thumb{padding-top:66px;}
ul.circles_ul li.selected__ .sky_bg h2{ color:#603D00; text-shadow:0 0 2px #ffd404;}
ul.circles_ul li.selected__ img{ display:none;}
ul.circles_ul li .gold_rate_home { display:none;}
ul.circles_ul li.selected__ .gold_rate_home{ display:inherit}
ul.circles_ul li.selected__ .sky_bg .thumb{ padding-top:80px; color:#000; padding-bottom:-2px;}
ul.circles_ul li.selected__ .sky_bg .more_btn{ -moz-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; transition: all ease-out .5s; border:2px solid #603D00;  position:relative; padding:4px 20px; color:#603D00;text-shadow:0 0 2px #ffd404;}
ul.circles_ul li.selected__ .more_btn:hover{ border:2px solid #000; background:rbga(255,255,255,.5); text-decoration:none; color:#000; }



.banner {
/*height: 622px;*/
margin: 0px;
padding: 0px;
float:left;

}
.banner_inner {
height: 622px;
margin: 0px auto 0px 17%;
width:900px;
padding: 180px 0px 0px 0px;
color:#fff;

}
.banner_inner p { text-align:justify}


/*----start-responsive design-----*/

@media only screen and (max-width:6000px) and (min-width:1900px) {
	
	
/*
#menutop{margin-top:-530px}
#menutop_a{margin-top:-630px}
*/


	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 130px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 130px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.circles_ul {margin-top:-30% !important;} 







	
	
	
}



@media only screen and (max-width:1900px) and (min-width:1600px) {
/*
#menutop{margin-top:-530px}
#menutop_a{margin-top:-630px}
*/


	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 130px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 130px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.circles_ul {margin-top:-35% !important;} 






}
@media only screen and (max-width:1600px) and (min-width:1440px) {


	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 130px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 130px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.circles_ul {margin-top:-35% !important;} 



}



<!--My monitor starts here-->
@media only screen and (max-width:1440px) and (min-width:1366px) {

	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 130px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 130px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.circles_ul {margin-top:-60% !important;} 
		
}


@media only screen and (max-width:1366px) and (min-width:1280px) {

	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 130px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 130px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		
}
@media only screen and (max-width:1280px) and (min-width:1023px) {

	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 100px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 100px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		.cj_logo{width:180px}
		.circles_ul {margin-top:-45% !important;} 
		
		
}
@media only screen and (max-width:1024px) and (min-width:768px) {

	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 100px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 100px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.cj_logo{width:150px}
		.circles_ul {margin-top:-60% !important;} 
		
		
		
																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																








}







@media only screen and (max-width:768px) and (min-width:640px) {
	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 55px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 55px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.cj_logo{width:125px}
		.circles h2{ font-size:6px; padding-top:20px; color:white;}
		.thumb{display:none;}																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																	

}




@media only screen and (max-width:640px) and (min-width:480px) {
	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 40px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 40px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.cj_logo{width:125px}
		.circles h2{ font-size:5px; padding-top:20px; color:white;}
		.thumb{display:none;}
}
@media only screen and (max-width:480px) and (min-width:399px) {
	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 40px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 40px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.cj_logo{width:100px}
		
		.circles h2{ font-size:5px; padding-top:20px; color:white;}
		.thumb{display:none;}
		
		
}

@media only screen and (max-width:399px) and (min-width:320px) {
	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color:#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 40px;
			list-style: none outside none;
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 40px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
		}
		
		.cj_logo{width:100px}
		.circles h2{ font-size:5px; padding-top:20px; color:white;}
		.thumb{display:none;}
}
@media only screen and (max-width:320px) and (min-width:100px) {
	li.circles{ /*float:left; width:244px; height:244px; border:3px solid #202020; background:#000; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; margin-left:20px; list-style:none; overflow:hidden; text-align:center;*/
		margin-top: -15px;
		background-color::#000000;
			border: 2px solid #666;
			-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
			/*float: left;*/
			height: 40px;
			
			margin-left: -9px;
			overflow: hidden;
			/*position: static;*/
			text-align: center;
		
			
			width: 40px;
			-webkit-transition: all 200ms linear;
			-moz-transition: all 200ms linear;
			-o-transition: all 200ms linear;
			-ms-transition: all 200ms linear;
			transition: all 200ms linear;
			z-index:9999;
			background-position:0 -250px;
			
			
			
		}
		
		
		.cj_logo{width:100px;}
		.circles h2{ font-size:5px; padding-top:20px; color:white;}
		.thumb{display:none;}
		
		
}