@charset "utf-8";
/* CSS Document */
* {
	margin:0;
	padding:0;
	border:0;
	transition: font-size 0.4s;
}
a {
	color:blue;
}
.clr{
	clear:both;
}
.red {
	color:red;
}
ul {
	list-style:none;
}
body {
	font-family:Arial, Helvetica, sans-serif;
	color:black;
	background:white;
}
.wrapper {
	max-width:790px;
	margin:0 auto;
}
#header {
	width:100%;
	background:#f4f4f4;
}
h1 {
	position:relative;
	font-size:24px;
	font-weight:normal;
	padding:5px 0;
	font-weight:bold;
	color:red;
}
h1:before {
	content:'';
	width:12px;
	height:20px;
	background:url('sprite.png') no-repeat -70px -27px;
	display:inline-block;
	vertical-align:middle;
	margin-right:10px;
}
h1 .pseudo {
	color:#ff0072;
}
h1 .geo {
	color:#00780b;
}
#wrap {
	background:black;
	padding:35px 5px; 
}
.box {
	border-radius:10px; 
	background:rgba(255,255,255,1); 
	box-shadow:0 0 10px rgba(0,0,0,0.25);
	padding:20px;
	margin:0 auto;
}
h2 {
	position:relative;
	font-size:43px;
	color:red;
	text-transform:uppercase;
	font-weight:bold;
	text-align:center;
}
h2:before {
	content:"";
	width:52px;
	height:52px;
	display:inline-block;
	vertical-align:top;
	background:url('sprite.png') no-repeat 0 0;
	margin-right:30px;
}
h2:after {
	content:"";
	width:52px;
	height:52px;
	display:inline-block;
	vertical-align:top;
	background:url('sprite.png') no-repeat 0 0;
	margin-left:30px;
}
h3 {
	font-size:33px;
	font-weight:bold;
	color:black;
	text-transform:uppercase;
	text-align:center;
}
#price {
	background:#f4f4f4;
	border-radius:4px;
	padding:0 20px 0 10px;
	margin:15px 0;
}
#logosCB {
	float:left;
	font-size:0;
	width:333px;
	text-align:center;	
	padding:5px 0;
}
#logosCB div{
	display:inline-block;
	vertical-align:middle;
	margin:4px;
}
#logoCB1 {
	width:58px;
	height:27px;
	background:url('sprite.png') no-repeat -52px 0;
}
#logoCB2 {
	width:46px;
	height:27px;
	background:url('sprite.png') no-repeat -110px 0;
}
#logoCB3 {
	width:45px;
	height:27px;
	background:url('sprite.png') no-repeat -156px 0;
}
#logoCB4 {
	width:46px;
	height:27px;
	background:url('sprite.png') no-repeat -201px 0;
}
#logoCB5 {
	width:45px;
	height:27px;
	background:url('sprite.png') no-repeat -247px 0;
}
#logoCB6 {
	width:45px;
	height:27px;
	background:url('sprite.png') no-repeat -292px 0;
}
#amount {
	float:right;
	line-height:46px;
	font-weight:bold;
	font-size:18px;
}
#amount .red {
	font-size:18px;
}
#content {
	font-size:0;
}
#left {
	display:inline-block;
	vertical-align:top;
}
#player {
	position:relative;
	width:322px;
	height:242px;
}
#player img {
	border:1px solid black ;
	box-sizing: border-box;
}
#player #play {
	position:absolute;
	width:100%;
	height:100%;
	background:url('play.png') no-repeat center center;
	z-index:2;
}
#player #play:hover {
	cursor:pointer;	
}
#infos {
	position:absolute;
	background:rgba(0,0,0,.5);
	left:0;
	bottom:0;
	font-size:16px;
	color:white;
	width:100%;
	padding:4px 10px;
	box-sizing:border-box;
}
#infosLeft {
	float:left;
	position:relative;
}
#infosLeft:before {
	content:'';
	width:9px;
	height:10px;
	background:url('sprite.png') no-repeat -82px -27px;
	display:inline-block;
}
#infosRight {
	float:right;
	text-align:right;
}
#cb {
	font-size:25px;
	color:#c8c8c8;
	text-align:center;
	text-transform:uppercase;
	padding-top:25px;
}
#cb strong {
	font-size:25px;
	color:#c8c8c8;
	font-weight:bold;
}
#form_content {
	display:inline-block;
	vertical-align:top;
	width:100%;
	max-width:458px;
	margin-left:10px;
}
#warning p {
	background:red;
	text-align:center;
	color:white;
	font-size:12px;
	color:white; 
	border-radius:3px;
	font-weight:bold;
	padding:4px 10px;
}
#warning:after {
	display:block;
	width:18px;
	height:9px;
	background:url('sprite.png') no-repeat -52px -27px;
	content:"";
	margin-left:330px;
}

/* FORM */
#form {
	position:relative;
	padding:15px 0;
}
#form:after {
	content:'';
	background:url('sprite.png') no-repeat -337px 0;
	width:49px;
	height:41px;
	position:absolute;
	bottom:15px;
	left:60px;
}
.form {
	font-size:0;
}
dl {
	font-size:0;
}
dt,dd {
	display:inline-block;
	vertical-align:middle;
	padding-bottom:10px;
}
dt {
	width:48%;
	font-size:16px;
	color:#343434;
	text-align:right;
	line-height:20px;
	padding-right:2%;
}
dd {
	width:50%;
}
.form_input {
	font-size:16px;
	border:1px solid #909090;
	border-radius:3px;
	width:99%;
	height:27px;
	text-indent:10px;
	padding:2% 0;
}
.p_form_input {
	font-size:16px;
	border:1px solid #909090;
	border-radius:3px;
	height:27px;
	text-indent:10px;
	width:76px;
	padding:2% 0;
}
select {
	font-size:16px;
	border:1px solid #b1a793;
	border-radius:3px;
	padding:4px 0 4px 0;
	margin-right:4px;
	padding:2%;
}
.p_cond {
	text-align:center;
}
.p_cond,
.p_cond a {
	font-size:11px;
	color:#7a7a7a;
	text-decoration:none;
	font-weight:300;
}
#button {
	text-align:right;
	padding-top:30px;
}
.submit {
	display:inline-block;
	width:247px;
	height:41px;
	background:url('btn.gif') repeat-x;
	border:1px solid #008b24;
	text-align:center;
	color:white;
	border-radius:3px;
	font-size:26px;
	text-decoration:none;
	font-weight:bold;
	text-transform:uppercase;
	text-shadow:-1px -1px 0 rgba(0,0,0,.3);
	line-height:41px;
	transition:none;
}
.submit:hover {
	background-position:0 bottom;
}
.ccard {
	display:inline-block;
	vertical-align:middle;
	margin-left:10px;
}
#thumbs {
	text-align:center;
	padding:20px 0;
}
#thumbs .wrapper {
	font-size:0;
}
.thumb {
	display:inline-block;
	vertical-align:top;
	width:16%;
	margin:0.2%;
	position:relative;
}
.thumb img {
	width:100%;
	height:auto;
}

#cond {
	 padding:20px 0; 
}
#cond p {
	font-size:11px;
	text-align:justify;
	color:#9a9a9a;
	padding:0 10px;
}
#cond p a {
	color:inherit; 
}

/*STYLECD*/
.highlight form input, .highlight form select { background-color:red; color:#fff  }
#form { width:100%; height:auto; margin:0 auto; margin-top:0; }
dt {
	display:inline-block; float:none; height:auto; line-height:inherit; width:48%;
	font-size:16px;
	color:#343434;
	text-align:right;
	line-height:20px;
	padding-right:2%;
}
dd {
	float:none; width:50%; height:auto;
}
.form_input {
	border:1px solid #909090; background-color:#fff; color:#3F3E3E; width:99%; height:27px;
	font-size:16px;
	border-radius:3px;
	text-indent:10px;
	padding:2% 0;
}
.p_form_input {
	float:none; width:76px;	border:1px solid #909090;
	font-size:16px;
	border-radius:3px;
	height:27px;
	text-indent:10px;
	padding:2% 0;
}
#cond p {
	background:none;
	font-size:11px;
	text-align:justify;
	color:#9a9a9a;
	padding:0 10px;
}
#cond p a {
	color:inherit; 
}
.p_cond, .p_cond a, .p_cond strong, .p_cond span { font-size:11px; color:#7A7A7A; }

@media screen and (max-width:860px) {
	h1 {
		font-size:18px;
		text-align:center;
	}
	h2 {
		position:relative;
		font-size:22px;
	}
	h2:before {
		position:absolute;
		top:0;
		left:0;
	}
	h2:after {
		position:absolute;
		top:0;
		right:0;
	}
	h3 {
		font-size:18px;
	}
	#wrap {
		padding:15px 5px; 
	}
	#logosCB,
	#amount {
		width:100%;
		float:none;
		text-align:center;
		line-height:30px;
	}
	#warning:after {
		margin:0 auto;
	}
	#content {
		text-align:center;
	}
	#form_content {
		display:block;
		margin:20px 0 0 0;
		width:100%;
		max-width:100%;
	}
	#warning {
		padding:4px 0;
	}
	#warning p {
		font-size:18px;
	}
	#player {
		width:100%;
		max-width:322px;
		height:auto;
	}
	#player img {
		width:100%;
		height:auto;
	}
	dt,dd {
		display:block;
		text-align:left;
	}
	dt {
		width:100%;
		font-size:14px;
		font-weight:bold;
		line-height:auto;
		text-align:left;
		padding:0;
	}
	dd {
		width:100%;
	}
	#button {
		text-align:center;
	}
	.submit {
		width:100%;	
	}
	.p_cond {
		text-align:left;
	}
	#form:after {
		display:none;
	}
}

@media screen and (max-width:500px) {
	h2 {
		font-size:17px;
	}
	h2:before {
		display:none;
	}
	h2:after {
		display:none;
	}
	h3 {
		font-size:12px;
	}
	#amount,
	#amount .red {
		font-size:12px;
	}
	#cb {
		font-size:18px;
	}
	#cond p {
		font-size:10px;
	}
	#warning p {
		font-size:12px;
	}
	#infos {
		font-size:12px;
	}
}