.duck_box { background: #20dcb0; position: relative; width: 100%; float: left; box-shadow: 0 0 20px #ddd; margin: 15px 0 0; }
.radius_box.duck_box {margin-bottom: 30px;}
.duck_box h2 { color: var(--white); }
.duck_head { background: var(--white); padding: 40px 50px; border-radius: 35px 35px 0 0; }
.duck_btn { background: #20dcb0; color: var(--white); padding: 18px 40px; display: inline-block; font-weight: 600; border-radius: 7px; }
.duck_btn:hover { background: #000; color: var(--white); }
.duck_mid_sec { width: 100%; float: left; background: url(img/ducknowl/duck_bg.jpg) no-repeat; background-size: 100%; padding-bottom: 40px; }
.duck_mid_sec .web_des { position: relative; }
.duck_mid_sec .web_des:after { content: ''; position: absolute; left: -45px; top: 0; background: var(--white)f; box-shadow: 0 0 10px rgba(0, 0, 0, .3); width: 80px; height: 80px; border-radius: 7px; transform: rotate(10deg); -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); }
.duck_listing { margin: 50px 0 0; clear: both; }
.duck_listing li { position: relative; padding: 0 30px 10px 36px; }
.duck_listing li:before { content: ''; background: var(--white); border-radius: 100%; width: 12px; height: 12px; position: absolute; left: 0; top: 10px; }
.screenshot_full { width: 100%; float: left; margin: 30px 0 0; }
.screenshot_full img { width: 100%; border: 3px solid var(--white); }
.web_des { margin: 40px 0 0; width: 100%; }
@media (max-width:1200px){
	.duck_head { padding: 40px; }
	.duck_logo img { width: 250px; }
}
@media (max-width:767px){
	.duck_head { padding: 30px; border-radius: 25px 25px 0 0; }
	.duck_logo img { width: 200px;}
	.duck_mid_sec .web_des:after { opacity: .5; }
}
@media (max-width:575px){
	.duck_head { flex-direction: column; }
	.duck_btn { margin: 20px 0 0; }
}