@charset "utf-8";
/* CSS Document */



#full-screen-background-image {
    z-index: -999;
    min-height: 100%;
    min-width: 1024px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 0;
}

.wrapper {
	width:100%;
	height:100%;
	}
.t-blue {
	color:#006bd0;
}
.t-red {
	color:#c80000;
}
.t-bk {
	color: #000;
}
.t-w {
	color: #fff;
}
.t-y {
	color: rgba(244,247,134,1.00);
}
.bg-w {
background-color: #fff;
}
.bg-bk {
background-color: #000;
}
h6 {
	font-family: "微軟正黑體", Arial;
	font-size: 21px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
h8 {
	font-family: "微軟正黑體", Arial;
	font-size: 18px;
	margin-top: 0px;
    margin-bottom: 0px;
}
.win {
	font-size: 35px;
	color: rgba(244,247,134,1.00);
	
}
h7 {
	font-family: "微軟正黑體", Arial;
	font-size: 36px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
h9 {
	font-family: "微軟正黑體", Arial;
	font-size: 24px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
.w-side {
	width:34%;
	display:inline-block;
	margin: 0; 
}
.w-side-2 {
	width: 48.5%;
	display:inline-block;
	margin: 0; 
}
.w-mid {
	width:30%;
	display:inline-block;
	margin: 0px 1%; 
}
a {
	color: #000;
	text-decoration: none;
}

a:hover {
	color: #000;
	text-decoration: underline;
}
.margin-20 {
	margin: 0px 5px; 
}

.before {
	background-image:url(../images/before_bg-b.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.after {
	background-image:url(../images/after_bg.jpg);
	background-repeat:no-repeat;
	background-position:center top;
}
.image {
    position: relative;
    width: 100%;
}
.block-in {
	display: inline-block;
	padding-left: 30px;
}
.vote {
	
	background-image:url(../images/voting_bg.jpg);
	background-position:  center;
	background-repeat: repeat-y;
	 height: 100%;
}
.result {
	background-image:url(../images/result_bg.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	visibility:visible;
	
}

.result-txt {
	top: 42%;
	left: 10.8%;
	position: absolute; 
}
.result-team {
	
	width:100%;
	position: absolute; 
}
.container {
	width:93%;
	margin: 0 auto;
	padding: 0px;
	height:auto;
	
}

.img-opacity {
	opacity: 0;
	
}
.before-img{
	content:url("../images/before-b.jpg");
	opacity: 0;
	
} 
.after-img{
	content:url("../images/after-b.jpg");
	opacity: 0;
}
.vote-top{
	background-image:url(../images/vote-top-b.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	background-size: 100%;

	
} 
.vote-img{
	content:url("../images/vote-img-b.jpg");
	width: 100%;
	
}
.btn-blue {
	background-color: #000;
	color:#006bd0;
}
.btn-blue:hover,
.btn-blue:focus,
.btn-blue.focus,
.btn-blue:active,
.btn-blue.active,
.open > .dropdown-toggle.btn-blue {
  color: #fff;
  background-color: #00274d;
  border-color: #00172c;
}
.btn-red {
	background-color: #000;
	color:#c80000;
}
.btn-red:hover,
.btn-red:focus,
.btn-red.focus,
.btn-red:active,
.btn-red.active,
.open > .dropdown-toggle.btn-red {
  color: #fff;
  background-color: #700000;
  border-color: #6e0000;
}
.result-img{
	content:url("../images/result.jpg");
	
} 

.result-img-blue{
	content:url("../images/blue-photo.jpg");
	position: absolute;
}
.result-img-red{
	content:url("../images/red-photo.jpg");
} 
/*body {
	background-color: rgba(84,146,35,1.00);
}*/

.v-1000 {
	visibility:visible;
}
.v-700, .v-500 {
	visibility: hidden;
	display:none;
}
@media (max-width: 1000px){

	
	
		.before, .after, .result  {
		background-image:none;
	}
	.img-opacity {
	opacity: 1;
	
	height:auto;
	width:100%;
}
.container {
	width: 100%;
	margin: 0 auto;
	padding: 0px;
}
h1 {
	font-family: "微軟正黑體", Arial;
	font-size: 200%;
	margin-top: 10px;
    margin-bottom: 0px;
}
h2 {
	font-family: "微軟正黑體", Arial;
	margin-top: 10px;
    margin-bottom: 0px;
}
h3 {
	font-family: "微軟正黑體", Arial;
	font-size: 140%;
	margin-top: 10px;
    margin-bottom: 0px;
}
.result-img-blue, .result-img-red {
	margin-top: 10px;
	width:90%;
}
}


@media (max-width: 700px){
	
	
		.v-700 {
	visibility:visible;
	display: block;
}
.v-1000, .v-500 {
	visibility: hidden;
	display:none;
}
	
	.before-img{
	/*content:url("../images/before-700.jpg");
	width: 100%;
	height:auto;
	opacity: 1;*/
	display:none;
} 
.after-img{
	/*content:url("../images/after-700.jpg");
	width: 100%;
	height:auto;
	opacity: 1;*/
	display:none;
}
.vote-top{
	display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(../images/vote-top-700.jpg) no-repeat;
  width: auto;
  height: auto;
  padding-left: 100%;

}
.vote-img{
	content:url("../images/vote-img-700.jpg");
}
.result-img{
	content:url("../images/result-blue-700.jpg");
	width: 100%;
	height:auto;
} 
.blue{
	content:url("../images/result-blue-700.jpg");
	width: 100%;
	height:auto;
}
.red{
	content:url("../images/result-red-700.jpg");
	width: 100%;
	height:auto;
}
.result-img-blue, .result-img-red {
	visibility:hidden;
}
.result-txt {
	top: 59%;
	left: 8%;
	position: absolute; 
}
.block-in {
	display:block;
	padding-left: 0px;
}
h8 {
	font-family: "微軟正黑體", Arial;
	font-size: 15px;
	margin-top: 0px;
    margin-bottom: 0px;
}
}
@media (max-width: 840px){
h6 {
	font-family: "微軟正黑體", Arial;
	font-size: 18px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
h7 {
	font-family: "微軟正黑體", Arial;
	font-size: 32px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
.w-side {
	width:32%;
	display:inline-block;
	margin: 0; 
}
.w-side-2 {
	width: 48.5%;
	display:inline-block;
	margin: 0; 
}

.w-mid {
	width:34%;
	display:inline-block;
	margin: 0px 1%; 
}		
	
}
@media (max-width: 645px){
h6 {
	font-family: "微軟正黑體", Arial;
	font-size: 16px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
h7 {
	font-family: "微軟正黑體", Arial;
	font-size: 29px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
.w-side {
	width:29%;
	display:inline-block;
	margin: 0; 
}
.w-mid {
	width:40%;
	display:inline-block;
	margin: 0px 1%; 
}		
	
}
@media (max-width: 500px){
			.v-500{
	visibility:visible;
	display: block;
}
.v-1000, .v-700  {
	visibility: hidden;
	display:none;
}
		.before-img{
	/*content:url("../images/before-500.jpg");
	width: 100%;
	height:auto;*/
	display:none;
} 
	.after-img{
	/*	content:url("../images/after-500.jpg");
	width: 100%;
	height:auto;*/
	display:none;
}
.vote-top{
		display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(../images/vote-top-500.jpg) no-repeat;
  width: auto;
  height: auto;
  padding-left: 100%;
} 
.vote-img{
	content:url("../images/vote-img-500.jpg");
}
.blue{
	content:url("../images/result-blue-500.jpg");
	width: 100%;
	height:auto;
}
.red{
	content:url("../images/result-red-500.jpg");
	width: 100%;
	height:auto;
} 
.result-txt {
	top: 59%;
	left: 5%;
}
.win {
	font-size: 35px;
	display:block;
	
}
h6 {
	font-family: "微軟正黑體", Arial;
	font-size: 13px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
h7 {
	font-family: "微軟正黑體", Arial;
	font-size: 18px;
	margin-top: 0px;
    margin-bottom: 0px;
	font-weight:bold;
}
.w-side {
	width:24%;
	display:inline-block;
	margin: 0; 
}
.w-mid {
	width:49%;
	display:inline-block;
	margin: 0px 1.5%; 
}

}