body{
    font-family: 'Open_Sans', "Microsoft JhengHei", "apple LiGothic Medium", Arial, Helvetica, sans-serif !important;
    margin: 0;
    font-size: 1.5em !important;
    color:#644f40;
    background-image: url(../images/top-bar-bg.jpg);
    background-color: #f4f4f4;
    background-repeat: no-repeat;
}
a{color:#f35329; text-decoration:underline; cursor: pointer;}
.otext{color:#f35329;}
.clear{ clear: both;}

h2 {padding: 15px 15px 0; line-height: 1.5em;}
p {padding: 0 15px; } img {max-width: 100%;}
.step-by-step img {display: block; margin: auto;}
.boxInfo {
    padding: 30px;
    margin: auto;
}

.innerTxt small {line-height: 1.5em;}
.boxInfo.graybg {background-color: #f1f1f1;}
.boxInfo .col2grid {  }
.boxInfo #order.col2grid {direction: rtl;}
.boxInfo .col2grid > div {display: inline-block;vertical-align: middle; width: 48%; margin: 0 0 2%;}
.boxInfo .innerTxt {padding: 0 30px;}
.boxInfo #order.col2grid > div {direction: ltr;}
.boxInfo h3 {
    color: #00a158;
    border-bottom: 1px solid #00a158;
    padding-bottom: 20px;
    margin-bottom: 20px;
    line-height: 1; text-align: center;
}
.boxInfo h3 span {
    position: relative;
    padding-left: 45px;
}
.boxInfo h3 span:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 35px;
    height: 35px;
}
.boxInfo h3.step1title span:before {
    background: url(https://www.openrice.com/info/how-to/images/OR-booking-offer/icon-3-1.png);
    background-size: cover;
}
.boxInfo h3.step2title span:before {
    background: url(https://www.openrice.com/info/how-to/images/OR-booking-offer/icon-3-2c.png);
    background-size: cover;
}
.boxInfo h3.step3title span:before {
    background: url(https://www.openrice.com/info/how-to/images/OR-booking-offer/icon-3-3.png);
    background-size: cover; width: 45px; left: -10px
}
.boxInfo h3.step4title span:before {
    background: url(https://www.openrice.com/info/how-to/images/OR-booking-offer/icon-3-4.png);
    background-size: cover;
}


.step-by-step img {display: block; margin: auto;}
#coupon .boxInfo.graybg {position: relative; padding: 30px 40px; margin: auto;}
#coupon .boxInfo.graybg:before {
    content: '';
    display: block;
    position: absolute;
    top: -20px;
    left: -21px;
    background: url(https://www.openrice.com/info/how-to/images/OR-restaurant-coupon/icon-2-1.png) no-repeat center center;
    background-size: cover;
    width: 60px;
    height: 105px;
}
p.boxHeadline {
    color: #00a158;
    text-align: center;
    border: 1px solid #00a158;
    padding: 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

@media (max-width: 768px) {
	.mt {
		margin-top: 10px
	}
	.mobi-step-bg {
		border-radius: 0px;
		background-color: #fff;
	}
	.border {
		border-radius: 10px;
		background-color: #fffbdc;
	}
}
@media (max-width: 640px) {
	h2 {font-size: 1.5em;}
	.innerTxt small {font-size:70%;}
	.boxInfo .innerTxt {padding:0;}
	.boxInfo .col2grid > div {width:100%;}
	 #coupon #mobile .step-by-step .clearfix:first-child img {padding-right:35px;}
}	#coupon #mobile .step-by-step img:nth-child(3), #coupon #mobile .step-by-step img:nth-child(4) {padding-left:35px;}
}