.menubackground{
  margin: 0;
  width: 100%;
  height: 51px;
  float: left;
  background-color:#cf553e;
  margin-top:60px;
}

/*----------productHeader-START---------------*/
#MainWrap .productHeader{
  width: 100%;
  height: auto;
  float: left;
  padding: 60px 0 0 0;
  margin: 0;
  margin-top:0px;
  /*border-top:1px solid #b60006;*/
  box-sizing: border-box;
  /*background-image: url(../images/cayin_products/sm_header_bg.jpg);*/
  background-position:center center;
  background-repeat:no-repeat;
  background:white;
}

.productHeader .contents{
position:relative;
  width: 100%;
  height: auto;
  padding: 0;
  margin: 0px auto;
  box-sizing: border-box;
}

.tabletBackground{
display:none;
}
.mobileBackground{
display:none;
}

#MainWrap .productHeader .contents .mobileBackground{
display:none;
}

a{
	color: #e5a900;
	text-decoration: none;
}

/*----------prepared-START---------------*/
.prepared{
    margin: 0;
    width: 100%;
    height: auto;
    float: left;
    background-color: #fff;
    padding-top: 6%;    padding-bottom: 5%;
	color: #595959;
}

.prepared .contents {
    width: 55%;
    height: auto;
    margin: 0 22.5%;
    box-sizing: border-box;
}
.prepared .contents .box {
    width: 100%;
    height: auto;
    float: left;
    padding: 0px;
    text-decoration: none;
    box-sizing: border-box;
    text-align: center;
}

.prepared .contents .box ol {
    list-style-position: outside;
    list-style-type: decimal;
    margin: 2% 0 12% 0;
}

.prepared .contents .box ol li {
    margin: 0 0 2% 4%;
}

.prepared .contents .box h2{
    padding: 2% 0 1% 0;
}

.suggest{
    margin: 0 0 4% 0;
    width: 100%;
	text-align: left;
}


.case_contact_us {
	margin: 0px auto;
	width: 50%;
	height: 59px;
}
.case_contact_us_text {
	margin: 15px auto;
    text-align: center;
    text-decoration: none;
    display: block;
    padding: 8px;
    color: white;
    background: #e5a900;
    border: 0 none;
    border-radius: 35px;
    width: 70%;
}

.contact{
	float: left;
    margin: 0;
    width: 100%;
    height: auto;
}

.news_middle {
	background-color: #eeeeee;
    color: #595959;
    margin: 60px auto;
    width: 70%;
    padding: 0%;
}
.news_abt_cayin {
	display: block;
    padding: 40px;
    width: 55%;
	float: left;
	background-color: transparent;
}
.news_media_contact {
	display: block;
    padding: 40px;
    width: 30%;
	float: left;
	background-color: transparent;
}

ul.share-buttons{
  list-style: none;
  padding: 0;
}

ul.share-buttons li{
  display: inline;
  padding: 0 1%;
}


/*----------compatible-START---------------*/
.compatible{
    margin: 0;
    width: 100%;
    height: auto;
    float: left;
    background-color: #fff;
    padding-top: 0.5%;
    /* padding-bottom: 0; */
    color: #595959;
    text-align: center;
    padding-bottom: 4%;
}

.compatible .contents {
	width: 65%;
    height: auto;
    padding: 0 5px;
    margin: 5% 17.5%;
}

.compatible .contents h1{
	padding-bottom: 3%;
}


.compatible .contents .smpplayer, .compatible .contents .cmsserver{
    width: 100%;
    height: auto;
	float: left;
}

.compatible .contents .smpplayer .box, .compatible .contents .cmsserver .box {
    width: 29%;
    height: auto;
    float: left;
    margin: 1% 2%;
    padding: 20px;
    text-decoration: none;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 4%;
}

.compatible .contents .smpplayer .box:hover, .compatible .contents .cmsserver .box:hover{
opacity: 0.8;
}
.compatible .contents .smpplayer .box h2, .compatible .contents .cmsserver .box h2 {
    width: 100%;
    float: left;
    display: block;
    color: #e5a900;
    line-height: 1.5em;
    margin: 15px 0 10px 0;
    text-align: center;
    font-weight: 400;
}

.compatible .contents .smpplayer .box span, .compatible .contents .cmsserver .box span {
  width: 100%;
  float: left;
  display: block;
  color: #595959;
  text-align: center;
}

.compatible .contents .smpplayer .box a, .compatible .contents .cmsserver .box a {
 text-decoration:none;
 color:#e5a900;
}


/*----------finalButton2-START---------------*/
.finalButton2{
margin: 0;
width: 100%;
height: auto;
float: left;
background-color:#e7e7e7;
padding-top:1%;
padding-bottom:3%;
}

.finalButton2 .contents {
width: 500px;
height: auto;
padding: 0 5px;
margin: 5% auto;
box-sizing: border-box;
}

.finalButton2 .contents .box {
width: 96%;
height: auto;
float: left;
margin: 1% 2%;
padding: 20px;
text-decoration: none;
box-sizing: border-box;
text-align: center;
margin-bottom:10%;
}
.finalButton2 .contents .box h2 {
width: 100%;
float: left;
display: block;
color: #595959;
line-height: 1.5em;
margin: 15px 0 10px 0;
text-align: center;
}

.finalButton2 .contents .box span {
width: 100%;
float: left;
display: block;
color: #595959;
text-align: center;
}
.finalButton2 .contents .box .mylinks {
 float: left;
 margin-top:5%;
 text-decoration:none;
 color: #e5a900;
 width: 100%;
 display: block;
 text-align: center;
 cursor:pointer;
}

.finalButton2 .contents .box .mylinks a:hover {
text-decoration:underline;
}

.finalButton2 .contents .box a {
 text-decoration:none;
color:#e5a900;
}

/*--1680寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 1680px) {
.prepared .contents {
    width: 80%;
	margin: 0 10%;
}

.prepared .contents .box .box1{
	padding-top: 3%;
}

.compatible .contents{
    width: 80%;
	margin: 0 10%;
	padding-top: 5%;
}
	.news_abt_cayin {
		width: 53%;
	}
	.news_media_contact{
		width: 30%;
	}

}

/*--1366寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 1366px) {

.compatible .contents {
    width: 90%;
	margin: 0 5%;
}
.finalButton2 {
padding-bottom:1%;
}

.finalButton2 .contents {
width: 500px;
margin: 35px auto;
}

}

/*--1280寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 1280px) {
.redundancy .contents{
    width: 80%;
    margin: 0 10%;
}

.compatible {
	padding-top:4%;
}

.compatible .contents{
    width: 95%;
    margin: 0 2.5%;
}
	.news_middle {
		width: 90%;
	}
	.news_abt_cayin {
	    width: 50%;
	}

}

/*--1152寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 1152px) {
.prepared .contents{
    width: 70%;
    margin: 0 15%;
}

.compatible .contents .smpplayer .box, .compatible .contents .cmsserver .box {
min-height: 350px;
}

}

/*--1024寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 1024px) {
.pcBackground{
display:none;
}

.tabletBackground{
display:block;
}

.mobileBackground{
display:none;
}

.prepared {
    padding-bottom: 12%;
}

.prepared .contents {
	width: 90%;
    margin: 0 5%;
}

.compatible{
	padding-top:12%;
	padding-bottom:12%;
}

.compatible .contents{
	padding-top: 0;
}

.compatible .contents .smpplayer .box, .compatible .contents .cmsserver .box{
    min-height: 220px;
}

	.news_middle {
		width: 100%;
	}
		
	.news_abt_cayin {
	width: 85%;
    margin: 8% 7.5%;
    padding: 0;
	}
	
	.news_media_contact {
	width: 85%;
    margin: 0 7.5% 8% 7.5%;
    padding: 0;
	}
	
.finalButton2 {
padding-top:4%;
}

.finalButton2 .contents {
width: 500px;
}

.finalButton2 .contents .box {
width: 100%;
}
}


/*--768寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
.prepared .contents{
    width: 80%;
    margin: 0 10%;
    padding: 0;
}

.compatible .contents {

  }
.compatible .contents .smpplayer .box, .compatible .contents .cmsserver .box {
    width: 48%;
    margin: 1%;
    padding: 10px;
	margin-bottom:10%;
	min-height:	inherit;
  }
  

.compatible{
	padding-top:8.5%;
	padding-bottom:4%;
}
	.case_contact_us {
		width: 80%;
	}

	.case_contact_us_text {
		margin: 15px auto;
	}
	.news_middle {
		width: 100%;
		padding: 0;
	}
	.news_abt_cayin {
		float: none;
		padding: 8% 0 0 0;

	}
	.news_media_contact {
		float: none;
	padding: 0 0 8% 0;}
	
.finalButton2 .contents {
width: 500px;
margin: 20px auto;
}
.finalButton2 .contents .box {
width: 98%;
margin: 1%;
padding: 10px;
margin-bottom:10%;
}

.finalButton2{
padding-top:5%;
padding-bottom:6%;
}

.finalButton2 .contents .box {
width: 96%;
margin: 5% 2%;
padding: 10px;
min-height:225px;
}
		
}


/*--736寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 736px) {

}
/*--600寬開始--------------------------------------------------------------------------------*/
@media only screen and (max-width: 600px) {
		
#MainWrap .productHeader .pcBackground{
display:none;
}

#MainWrap .productHeader .tabletBackground{
display:none;
}

.mobileBackground{
display:block;
}

#MainWrap .productHeader .contents .mobileBackground{
display:block;
}	

.prepared .contents{
    width: 90%;
    margin: 0 5%;
    padding: 0;
}

.compatible{
padding-top:20%;
padding-bottom:10%;
  }

.compatible .contents {
    width: 90%;
    margin: 0 5%;
	padding: 0;
}

.compatible .contents h1 {
    padding-bottom: 0;
}

.compatible .contents .smpplayer .box, .compatible .contents .cmsserver .box {
    width: 90%;
    margin: 15% 5%;
    padding: 0;
  }

 .compatible .contents .smpplayer .box h2, .compatible .contents .cmsserver .box h2{
	margin: 0 0 10px 0;
 }

.compatible .contents .smpplayer .box img, .compatible .contents .cmsserver .box img{
	width:80%;
}

.finalButton2{
padding-top:10%;
padding-bottom:10%;
}

.finalButton2 .contents {
width: 100%;
margin: 20px auto;
}
.finalButton2 .contents .box {
width: 96%;
margin: 5% 2%;
padding: 10px;
min-height:225px;
}

.finalButton2 .contents .box:nth-child(4) {
margin-bottom:20%;
}
}