﻿
.writings_L{
	float: left;
	width: 70%;
	margin-top: 20px;
	overflow: hidden;
	}

.writings_L.full{
	width: 100%;
		}

.writings_L table td{
	height: 20px;
	}


.writings_L ul li:hover img,.writings_L ul li a:hover,.writings_banner a:hover img,.writings_R_cnt a:hover img{

	-webkit-transform: scale(1)!important;
  -moz-transform: scale(1)!important;
  -ms-transform: scale(1)!important;
  -o-transform: scale(1)!important;
  transform: scale(1)!important;
	}
.writings_L > h1{
	width: 100%;
	float: left;
	background-image: url(../images/index_line1.png);
	background-repeat: no-repeat;
	background-position: center center;
	text-align: center;
	font-size: 24px;
	margin-bottom: 10px;
	margin-top: 5px;	
	}
.writings_L > h2{
	width: 100%;
	float: left;
	background-image: url(../images/index_line3.png);
	background-repeat: no-repeat;
	background-position: center center;
	text-align: center;
	font-size: 32px;
	margin-bottom: 10px;
	font-weight: normal;
	padding-bottom: 10px;
	padding-top: 10px;
	line-height:150%;
	}
.writings_L > h1 span,.writings_R_cnt h1 span,.writings_L > h2 span{
	background-color: #fff;
	padding-right: 10px;
	padding-left: 10px;
}
.writings_L > h1 img{
	margin-right: 10px;
	vertical-align: middle;
	margin-top: -10px;
}

.writings_R{
	float: right;
	width:342px;
	margin-top: 10px;
	}
.writings_icon{
	text-align: center;
	margin-top: 20px;
	margin-bottom: 50px;
	float: left;
	width: 100%;
	}

.writings_icon.mtfix{
	border-bottom:1px solid #e8e8e8;
	width: 96%;
	margin:25px auto 25px auto;
	padding-bottom:25px;
	float:none;
	}

.writings_icon input{
	text-align: center;
	width: 155px;
	padding-top: 7px;
	padding-bottom: 7px;
	border: none;
	background-color: #f3f3f3;
	color: #666;
	cursor: pointer;
	display: inline-block;
	margin: 0px;
	font-size: 14px;
}
.writings_icon input.active{
	background-color: #ffe43b;
	color: #000;
	}
.writings_icon input:nth-of-type(2){
	border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
	-webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
	}
.writings_icon input:nth-of-type(1){
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
	}
.writings_icon input:hover {
	filter: alpha(opacity=70);opacity:0.70; 
	text-decoration: none;
	line-height: normal;
}
.writings_R_cnt{
	border:1px solid #e8e8e8;
	box-sizing:border-box;
	width: 100%;
	margin-bottom: 30px;
	margin-top: 28px;
}
.writings_R_cnt.mt10{
	margin-top: 10px;
}
.writings_R_cnt.mt40{
	margin-top: 40px;
}


.writings_R_cnt h1{
	width: 100%;
	float: left;
	text-align: center;
	font-size: 18px;
	margin-bottom: 10px;
	background-color:#f8f8f8;
	height:28px;
	padding-top:10px;
}

.writings_R_cnt h1 span{
	background-color:transparent!important;
	padding:0!important;}

.writings_R_cnt ul{
	padding-right: 20px;
	padding-left: 20px;
	  
}
.writings_R_cnt img{
	width: 100%;
	margin-bottom: 10px;
	margin-top: 10px;
}	
.writings_R_cnt figcaption{
	width: 100%;
	margin-bottom: 20px;
}	
.writings_banner{
	box-sizing:border-box;
	border: 1px solid #e8e8e8;
	padding-top: 20px;
	padding-right: 20px;
	padding-left: 20px;
	width: 100%;
	text-align: center;
}
.writings_banner img{
	width: 100%;
	margin-bottom: 20px;
	  max-width: 320px;
}

@media (max-width: 1400px) {
	.writings_L{width: 70%;}
	.writings_R{width:300px;}
	}
@media (max-width: 1200px) {
	.writings_L{width: 65%;}
	.writings_R{width:30%;}
	}
@media (max-width: 800px) {
	.writings_L,.writings_R{width: 100%;}
	.writings_L{margin-top:0px;}
	.writings_L > h1{    
	margin-bottom: 0px;
    margin-top: 0px;}
	.writings_L > h2{padding-top: 0px;margin-bottom: 0px;}
	.writings_icon {    margin-bottom: 35px;}
	}
	@media (max-width: 768px) {
		.writings_R{  margin-top:0px;}
.writings_banner{
	margin-bottom: 20px;
}}
@media (max-width: 450px) {.writings_L > h1,.writings_L > h2{	background-image: none;}}
@media (max-width: 320px) {.writings_icon input{
	width: auto;
	padding-right: 15px;
	padding-left: 15px;
}}
/***************美味小學堂列表***********************************************************/

.school_list > li{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e8e8e8;
	margin-bottom: 50px;
	padding-bottom: 50px;
	float: left;position: relative;}
	

.school_list,.news {float: left;width: 100%;}
.school_list li a{
	display: block;

	
}
.school_list li figure,.news li figure{
	width: 40%;float: left; }
	
.school_list li figcaption,.news li figcaption{
	width: 60%;
	box-sizing:border-box;
	padding-left: 20px;
	float: left;
		
}

.news li figcaption h1{
	margin:0 0 10px 0;
	padding:0px;
	border:none;
	font-size:18px;
	
}

.news li figcaption p{
	margin:0 0 0 0;
	padding:10px 0;
	border-bottom:none;
	font-size:16px;
	 float:left;
	 width: 100%;
	
}

.news li figcaption p.withbo{
	margin:0 0 0 0;
	padding:10px 0;
	border-bottom:none;
	font-size:16px;
	 float:left;
	 width: 100%;
	 border-width: 0px 0px 1px;
    border-bottom-style: solid;
    border-bottom-color: rgb(238, 238, 238);
	
}

.news li figcaption p.nobo{
	margin:0 0 20px 0;
	padding:0;
	border-bottom:none;
	font-size:16px;
	float:left;
	width: 100%;
	
}

.news li figcaption p i{
	 font-style: italic!important;
	 font-size:14px;
	
	
}


.school_list li figcaption h1{
	font-size: 28px;
	color: #000;

}
.school_list li figure img,.news li figure img{width: 100%;}
.school_list li figcaption ul{
	margin-top: 10px;float: left;width: 100%;
}
.school_list li figcaption li{
	box-sizing:border-box;
	padding-left: 22px;
	float: left;
	color: #666;
	background-repeat: no-repeat;
	background-position: left 2px;
	display: inline-block;
	width: 50%;
	margin-top: 5px;
	margin-bottom: 5px;
}
.school_list li figcaption li:nth-of-type(1){
	background-image: url(../images/svg/class_1.svg);
	padding-right: 20px;
}

.school_list li figcaption li:nth-of-type(2){
	background-image: url(../images/svg/class_2.svg);
}

.school_list li figcaption li:nth-of-type(3){
	background-image: url(../images/svg/class_3.svg);
	padding-right: 18px;
}

.school_list li figcaption li:nth-of-type(4){
	background-image: url(../images/svg/class_4.svg);
}
.school_list li figcaption div a,.news li figcaption div a{

    float: right;
	height: 25px;
	width: 100px;
	background-color: #FFE43B;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	text-align: center;
	color: #000;
	padding-top: 7px;
	margin-bottom: 30px;
	margin-top: 20px;
	position: relative;
}
.school_list li figcaption div a::after,.news li figcaption div a::after{
	content: "";
	background-image: url("../images/svg/next.svg");
	background-image:  none\0;
	background-repeat: no-repeat;
	height: 27px;
	width: 10px;
	background-position: center center;
	top:1px;
	position: absolute;
	}
	

.school_list li figcaption div a.aleft,.news li figcaption div a.aleft{

    float: left;
	height: 25px;
	width: 100px;
	background-color: #FFE43B;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	text-align: center;
	color: #000;
	padding-top: 7px;
	margin-bottom: 30px;
	margin-top: 20px;
	position: relative;
}
.school_list li figcaption div a.aleft::after,.news li figcaption div a.aleft::after{
	content: "";
	background-image: url("../images/svg/next.svg");
	background-image:  none\0;
	background-repeat: no-repeat;
	height: 27px;
	width: 10px;
	background-position: center center;
	top:1px;
	position: absolute;
	}


@media (max-width:900px) {.school_list li figcaption li{width: 100%;}}
@media (max-width: 800px) {
	.school_list li figure,.school_list li figcaption,.news li figure,.news li figcaption{width: 100%;}
	.school_list li figcaption li{width: 50%;}
	.school_list li figcaption,.news li figcaption{
	padding-left: 0px;
	padding-top: 20px;
	
}
.school_list li figcaption li:nth-of-type(1),.school_list li figcaption li:nth-of-type(3){padding-right: 0px;}
	}
@media (max-width: 768px) {
	.school_list li figcaption div a,.news li figcaption div a{margin-bottom: 15px;}
	.school_list > li{
	border-bottom-style: none;
	margin-bottom: 0px;
	padding-bottom: 0px;
margin-top: 15px;
    padding-top: 35px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #e8e8e8;
}
.school_list > li:nth-of-type(1){border-top-style: none;margin-top: 0px;
	padding-top: 0px;}
	.school_list li figcaption li:nth-of-type(1),.school_list li figcaption li:nth-of-type(3){padding-right: 20px;}
	}
@media (max-width: 414px) {
	.school_list li figcaption li{width: 100%;}
.school_list li figcaption li:nth-of-type(1),.school_list li figcaption li:nth-of-type(3){padding-right: 0px;}}

/***************美味小學堂詳細頁***********************************************************/
.school_detail h1{
	letter-spacing: 0em!important;
}
.school_detail h3{
	text-align: left;
	width: 100%;
	padding-top: 2px;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #000;
	font-size: 18px;
	font-weight: normal;
	color: #333;
	float: left;
}
.school_detail h3 span{
	line-height: 150%;
	width: 100%;
	padding-top:15px;
	padding-bottom: 15px;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000;
	border-bottom-color: #000;	
	float: left;
}
.school_detail figure{
	float: left;
	margin-top: 20px;
	width: 100%;
	margin-bottom: 20px;
}
.school_detail figure img{
	display:block;
	width:auto;
	margin:0 auto;
	float:none;
	height:auto;
}



.school_detail_dl{
	width: 100%;
	text-align: center;
}
.school_detail dt{
	display: inline-block;
	margin-left: 7px;
	margin-right: 7px;
}
.school_detail_dl2{
	float: left;
	width: 100%;
	margin-top: 20px;
	text-align:center;
}
.school_detail2 dt{
	display: inline-block;
	margin-right:12px;
}
.school_detail_CNT{
	float: left;
	width: 100%;
	margin-bottom: 100px;
	font-size: 16px;
	line-height: 200%;
}

.school_detail_CNT p{
	clear:both;
	line-height:1.5;
}

.school_detail_CNT h2{
	font-size:18px;
}

.school_detail_CNT h4{
	font-size:14px;
	line-height:1.5;
	font-style: italic;
}

.school_detail_CNT .author{
	width:86%;
	margin:0 auto;
}
.school_detail_CNT .author .box{
	border:1px solid #e8e8e8;
	padding:20px 36px;
	margin:30px 0;
	float:left;

}
.school_detail_CNT .author .box img{
	margin:0px!important;
	float:left;
	width:40%;
	height:auto;

}
.school_detail_CNT .author .box h2{
	float:left;
	width:58%;
	margin-left:2%;

}
.school_detail_CNT .author .box h4{
	float:left;
	width:58%;
	margin-left:2%;

}
.school_detail_CNT h5 a{
	color:#ff6600;}
	
.school_detail_CNT .author .box a{
	font-size:14px;
	color:#f60;
	padding:12px 0 12px 0;
	float:left;
	margin-left:2%;

}

.school_detail_CNT .author .box ul.ls_1{
  list-style: disc;
    margin: 1% 0 0 5%;
    padding: 0px;
    font-size: 14px;
    float: left;
    width: 55%;
}
.school_detail_CNT .author .box ul.ls_1 li{
    margin:0px;
	padding:0px;
	line-height:1.5;
}


.school_detail_CNT img.regu_1{
	float:left; 
	margin:5px 10px 0 0;
}


.school_detail_CNT img.middle_1{
	margin:10px auto; 
	display:block;
}
.school_detail_CNT p a{
	color:#ff6600;
}

.school_detail_CNT p a:hover{
	text-decoration:underline;
}

.school_detail_CNT.full{
	width: 70%;
	margin-left:auto;
	margin-right:auto;
	float:none;
	margin-top:20px;
}


.school_detail_CNT table td
{    border:1px solid #ccc!important;
	padding:5px!important;
}

.school_detail_CNT table td a{ color:#ff6600;}

.school_detail_CNT .twopics1{ width:80%; margin:20px auto;}
.school_detail_CNT .twopics1 ul li{ width:50%; display:block; float:left;}
.school_detail_CNT .twopics1 ul li img{ width:100%; height:auto; }
.school_detail_CNT .twopics1 p{ text-align:center; padding:8px 0;}
.school_detail_CNT .twopics_c{ padding:8px; text-align:center;}


.school_detail_CNT .twopics2{ width:80%; margin:20px auto;}
.school_detail_CNT .twopics2 ul li{ width:48%; display:block; float:left; margin:0 1%;}
.school_detail_CNT .twopics2 ul li img{ width:100%; height:auto; }
.school_detail_CNT .twopics2 p{ text-align:center; padding:8px 0;}

	
.school_detail_CNT .threepics1{ width:88%; margin:20px auto;}
.school_detail_CNT .threepics1 ul li{ width:31%; display:block; float:left; margin:0 1%;}
.school_detail_CNT .threepics1 ul li img{ width:100%; height:auto; }
.school_detail_CNT .threepics1 h5{ font-size:14px; padding:5px 0; line-height:1.5;}

@media (max-width: 1280px) {
	.school_detail_CNT.full{
	width: 90%;
	}
	
}

@media (max-width: 1024px) {
	.school_detail_CNT .author{
	width:100%;
	margin:0 auto;
}
.school_detail_CNT .author .box{
	border:1px solid #e8e8e8;
	padding:20px 36px;
	margin:10px 0;
	float:none;

}
.school_detail_CNT .author .box img{
	margin: 0px!important;
    float: none;
    width: 100%;
	height:auto;

}
.school_detail_CNT .author .box h2{
	float: none;
    width: 100%;
	margin:0px;

}
.school_detail_CNT .author .box h4{
	width:100%;
	margin:0px;
	padding: 5px 0;
    float: none;

}
.school_detail_CNT .author .box a{
	padding:12px 0 12px 0;
	float: none;
	margin:0;

}

.school_detail_CNT .author .box ul.ls_1{
   list-style: disc;
    margin: 0;
    padding: 5px 0 10px 20px;
    font-size: 14px;
    float: none;
    width: 100%;
}
.school_detail_CNT .author .box ul.ls_1 li{
    margin:0px;
	padding:0px;
	line-height:1.5;
}
.school_detail_CNT .twopics1{ width:100%; margin:20px auto;}
.school_detail_CNT .twopics1 ul li{ width:100%;}

.school_detail_CNT .twopics2{ width:100%; margin:20px auto;}
.school_detail_CNT .twopics2 ul li{ width:100%; margin:0; }

.school_detail_CNT .threepics1{ width:100%; margin:20px auto;}
.school_detail_CNT .threepics1 ul li{ width:100%; margin:0;}
.school_detail_CNT .threepics1 h5{ font-size:14px; padding:5px 0; line-height:1.5;}

}
	
@media (max-width: 768px) {
	 .school_detail_dl2{
	text-align: center;}
	.school_detail2 dt{
	margin-left: 7px;
	margin-right: 7px;
}

.school_detail_CNT.full{
	width: 100%;
	}

.school_detail_CNT{margin-bottom: 40px;}
.school_detail_CNT img{width: 100%; height:auto;}
.school_detail figure img{width: 100%; height:auto;}
.school_detail_CNT table{width: 100%; }
}



.menu_detail h3{
	text-align: center;
	width: 100%;
	padding-top: 2px;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #000;
	font-size: 18px;
	font-weight: normal;
	color: #333;
	float: left;
	margin-bottom:20px;
}
.menu_detail h3 span{
	line-height: 150%;
	width: 100%;
	padding-top:15px;
	padding-bottom: 15px;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000;
	border-bottom-color: #000;	
	float: left;
}

.menu_detail  figcaption h1{
	letter-spacing: 0em!important;
	background-image:none!important;
	font-size:18px!important;
	margin:0 0 15px 0!important;
	text-align:center;
}
.menu_detail  figcaption p{
	width:70%;
	font-size:16px;
	padding:20px 0;
	border-bottom:1px solid #eee;
	margin:0 auto;
}

.menu_detail  figcaption p .p_name_m{
	color:#333;
	font-size:20px;
}
.menu_detail  figcaption p i{
	font-style: italic!important;
	font-size:14px;
}

.menu_detail  figcaption ul{
	padding:0px;
	margin:20px auto;
	width:70%;
	font-style: italic!important;
}

.menu_detail  figcaption ul li{
	list-style:circle;
	padding:0px;
	margin:5px 0 5px 15px;
	
}


.menu_detail  figcaption img{ width: auto; margin:15px auto; display:block; height:auto;}

.menu_detail_dl{
	width: 100%;
	text-align: center;
	
}

.menu_detail_dl2{
	width: 180px;
	margin: 0 auto 15px auto;
	height:50px;
	clear:both;
	
}
.menu_detail_dl2 dt{
	width:60px;
	margin:0px!important;
	float:left;
	
}

.menu_detail_dl2 dt img{
	margin: 0 auto;
	display:block;
}
.menu_detail_CNT{
	float: left;
	width: 100%;
	margin-bottom: 100px;
	font-size: 16px;
	line-height: 200%;
}

.menu_detail_CNT img{
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
}
@media (max-width: 768px) { 

   .menu_detail_dl2{
	text-align: center;}
	.menu_detail2 dt{
	margin-left: 7px;
	margin-right: 7px;
}
.menu_detail_CNT{margin-bottom: 40px;}
.menu_detail  figcaption p{
	width:100%;
	font-size:16px;
	padding:20px 0;
	border-bottom:1px solid #eee;
	margin:0 auto;
}

.menu_detail  figcaption p i{
	font-style: italic!important;
	font-size:14px;
}

.menu_detail  figcaption ul{
	padding:0px;
	margin:20px auto;
	width:100%;
	font-style: italic!important;
}

.menu_detail  figcaption ul li{
	list-style:circle;
	padding:0px;
	margin:5px 0 5px 15px;
	
}


.menu_detail  figcaption img{ width: 100%; margin:15px auto; display:block;}



}



/***************3塊資訊***********************************************************/

.school_cnt1{
	width:100%;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	}
.school_cnt1 aside{
	width:98%;
	position: relative;
	margin-top: 10px;
	margin-bottom: 63px;
	margin-right: auto;
	margin-left: auto;
}
.school_cnt1 > h1{
	width: 100%;
	float: left;
	background-image: url(../images/index_line1.png);
	background-repeat: no-repeat;
	background-position: center center;
	text-align: center;
	letter-spacing: 4px;
	font-size: 24px;
	margin-bottom: 10px;
}
.school_cnt1 > h1 span{
	background-color: #fff;
	padding-right: 10px;
	padding-left: 10px;
}
.school_cnt1> h1 img{
	margin-right: 10px;
	vertical-align: middle;
	margin-top: -10px;
}

.school_cnt1 div p{
	padding: 0px;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	text-align: left;
}
.school_cnt1 div h1{text-align: left;}

.school_cnt1 div a:hover img{
	filter: alpha(opacity=100);
	opacity:1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

@media (max-width: 450px) { 

.school_cnt1 > h1{
	background-image: none;
	letter-spacing: 0px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #DADADA;
	padding-top: 40px;
}

}

/***************最新消息***********************************************************/

.news > li{
	margin-bottom: 50px;
	float: left;position: relative;}
.news > li.g_menu{
	width:100%;
	}
	
.news h1{
	text-align: left;
	width: 100%;
	padding-top: 2px;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #000;
	font-size: 18px;
	font-weight: normal;
	color: #333;
	float: left;
	margin-bottom: 40px;
}
.news h1 span{
	line-height: 150%;
	width: 100%;
	padding-top:15px;
	padding-bottom: 15px;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000;
	border-bottom-color: #000;	
	float: left;
}

.news p{
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
}




.news_dl{
float: left;
margin-top: 10px;
}
.news_dl dt{
	display: inline-block;
	margin-left: 10px;
}
@media (max-width: 768px) {
	.news > li {
    margin-bottom: 20px;}
	.news h1{    margin-bottom: 30px;}
	 }




.ribbon {
 font-size: 24px !important;
 /* This ribbon is based on a 16px font side and a 24px vertical rhythm. I've used em's to position each element for scalability. If you want to use a different font size you may have to play with the position of the ribbon elements */
 width: 96%;    
 position: relative;
 background-image:url(../images/ribbon_bg.png);
 background-repeat: repeat-x;
    background-position: center center;
 color: #fff;
 text-align: center;
 padding:0; /* Adjust to suit */
 margin: 80px auto 10px auto; /* Based on 24px vertical rhythm. 48px bottom margin - normally 24 but the ribbon 'graphics' take up 24px themselves so we double it. */
}


.ribbon:before, .ribbon:after {
 content: "";
 position: absolute;
 display: block;
 bottom: 0;
 border: 20px solid #000;
 z-index: -1;
}

.ribbon:before {
 left: -25px;
 border-left-color: transparent;
}
.ribbon:after {
 right: -25px;
 border-right-color: transparent;
}

.ribbon .ribbon-content{ background-color:#000; padding:0 20px;}
.ribbon .ribbon-content:before {
 left: 0;
 border-width: 1em 0 0 1em;
}
.ribbon .ribbon-content:after {
 right: 0;
 border-width: 1em 1em 0 0;
}

.store li{ width:20%; padding:0px; float:left; margin:0px;}
.store li a img{ margin:20px auto; display:block; width:90%;}
.store li p{ text-align:center; padding:0; margin:0px; font-size:16px;}


@media (max-width: 768px) {

.ribbon {
 font-size: 18px !important;
 /* This ribbon is based on a 16px font side and a 24px vertical rhythm. I've used em's to position each element for scalability. If you want to use a different font size you may have to play with the position of the ribbon elements */
 width: 86%;    
 position: relative;
 background-image:url(../images/ribbon_bg.png);
 background-repeat: repeat-x;
    background-position: center center;
 color: #fff;
 text-align: center;
 padding:0; /* Adjust to suit */
 margin: 80px auto 10px auto; /* Based on 24px vertical rhythm. 48px bottom margin - normally 24 but the ribbon 'graphics' take up 24px themselves so we double it. */
}


.ribbon:before, .ribbon:after {
 content: "";
 position: absolute;
 display: block;
 bottom: 0;
 border: 15px solid #000;
 z-index: -1;
}

.ribbon:before {
 left: -25px;
 border-left-color: transparent;
}
.ribbon:after {
 right: -25px;
 border-right-color: transparent;
}

.ribbon .ribbon-content{ background-color:#000; padding:0 20px;}
.ribbon .ribbon-content:before {
 left: 0;
 border-width: 1em 0 0 1em;
}
.ribbon .ribbon-content:after {
 right: 0;
 border-width: 1em 1em 0 0;
}

.store{ background-color:#063;}
.store li{ width:50%; padding:0px; float:left; margin:0px; }
.store li img{ width:80%; margin:10px auto; display:block; height:auto; }
.store li p{ text-align:center; padding:0; margin:0 0 5px 0; font-size:14px;}


	 }


.video-container {
 position: relative;
 padding-bottom: 56.25%;
 padding-top: 30px;
 height: 0;
 overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}