.main-box{background:#ffdb05;background:-moz-linear-gradient(45deg,transparent 0,#ffdb05 10px),-moz-linear-gradient(135deg,transparent 30px,#ffdb05 10px),-moz-linear-gradient(225deg,transparent 0,#ffdb05 10px),-moz-linear-gradient(315deg,transparent 30px,#ffdb05 10px);background:-o-linear-gradient(45deg,transparent 0,#ffdb05 10px),-o-linear-gradient(135deg,transparent 30px,#ffdb05 10px),-o-linear-gradient(225deg,transparent 0,#ffdb05 10px),-o-linear-gradient(315deg,transparent 30px,#ffdb05 10px);background:-webkit-linear-gradient(45deg,transparent,#ffdb05 10px),-webkit-linear-gradient(145deg,transparent 20px,#ffdb05 0),-webkit-linear-gradient(225deg,transparent,#ffdb05 10px),-webkit-linear-gradient(325deg,transparent 20px,#ffdb05 0);background-position:0 100%,100% 100%,100% 0,0 0;-moz-background-size:50% 50%;-webkit-background-size:50% 50%;background-size:50% 50%;background-repeat:no-repeat;transition:all .5s;height:270px;width:270px}.main-box:after{background:-webkit-linear-gradient(45deg,transparent,#000 10px),-webkit-linear-gradient(135deg,transparent 40px,#000 0),-webkit-linear-gradient(225deg,transparent,#000 10px),-webkit-linear-gradient(315deg,transparent 40px,#000 0);background-position:0 100%,100% 100%,100% 0,0 0;-moz-background-size:50% 50%;-webkit-background-size:50% 50%;background-size:50% 50%;background-repeat:no-repeat;height:260px;width:260px}.content-main-box{background:-webkit-linear-gradient(45deg,transparent,transparent 10px),-webkit-linear-gradient(135deg,transparent 40px,transparent 0),-webkit-linear-gradient(225deg,transparent,transparent 10px),-webkit-linear-gradient(315deg,transparent 40px,transparent 0);background-position:0 100%,100% 100%,100% 0,0 0;-moz-background-size:50% 50%;-webkit-background-size:50% 50%;background-size:50% 50%;width:calc(100% - 10px)}.content-main-box img{object-fit:cover;clip-path:polygon(10% 0,100% 0,100% 85%,90% 100%,0 100%,0 15%)}.border-main-box{--b:3px;--c:#0000 25%,#ffdb05 0;background:conic-gradient(from 180deg at top 4px right 4px,var(--c)) 100% 0,conic-gradient(from 0deg at bottom 4px left 4px,#0000 25%,#ffdb05 0) 0 100%;background-size:80px 80px;background-repeat:no-repeat;transition:.6s;height:200px;width:200px}@media screen and (width <= 768px){.main-box{background:-moz-linear-gradient(45deg,transparent 0,#ffdb05 10px),-moz-linear-gradient(135deg,transparent 30px,#ffdb05 10px),-moz-linear-gradient(225deg,transparent 0,#ffdb05 10px),-moz-linear-gradient(315deg,transparent 30px,#ffdb05 10px);background:-o-linear-gradient(45deg,transparent 0,#ffdb05 10px),-o-linear-gradient(135deg,transparent 30px,#ffdb05 10px),-o-linear-gradient(225deg,transparent 0,#ffdb05 10px),-o-linear-gradient(315deg,transparent 30px,#ffdb05 10px);background:-webkit-linear-gradient(45deg,transparent,#ffdb05 10px),-webkit-linear-gradient(135deg,transparent 20px,#ffdb05 0),-webkit-linear-gradient(225deg,transparent,#ffdb05 10px),-webkit-linear-gradient(315deg,transparent 20px,#ffdb05 0);background-position:0 100%,100% 100%,100% 0,0 0;-moz-background-size:50% 50%;-webkit-background-size:50% 50%;background-size:50% 50%;background-repeat:no-repeat;height:190px;width:190px}.main-box:after{background:-webkit-linear-gradient(45deg,transparent,#000 10px),-webkit-linear-gradient(135deg,transparent 20px,#000 0),-webkit-linear-gradient(225deg,transparent,#000 10px),-webkit-linear-gradient(315deg,transparent 20px,#000 0);background-position:0 100%,100% 100%,100% 0,0 0;-moz-background-size:50% 50%;-webkit-background-size:50% 50%;background-size:50% 50%;background-repeat:no-repeat;height:180px;width:180px}.content-main-box img{clip-path:polygon(18% 0,100% 0,100% 82%,82% 100%,0 100%,0 18%)}.border-main-box{background-size:50px 50px;height:155px;width:155px}}@media screen and (width < 640px){.main-box{background:-moz-linear-gradient(45deg,transparent 0,#ffdb05 10px),-moz-linear-gradient(135deg,transparent 30px,#ffdb05 10px),-moz-linear-gradient(225deg,transparent 0,#ffdb05 10px),-moz-linear-gradient(315deg,transparent 30px,#ffdb05 10px);background:-o-linear-gradient(45deg,transparent 0,#ffdb05 10px),-o-linear-gradient(135deg,transparent 30px,#ffdb05 10px),-o-linear-gradient(225deg,transparent 0,#ffdb05 10px),-o-linear-gradient(315deg,transparent 30px,#ffdb05 10px);background:-webkit-linear-gradient(45deg,transparent,#ffdb05 10px),-webkit-linear-gradient(135deg,transparent 20px,#ffdb05 0),-webkit-linear-gradient(225deg,transparent,#ffdb05 10px),-webkit-linear-gradient(315deg,transparent 20px,#ffdb05 0);background-position:0 100%,100% 100%,100% 0,0 0;-moz-background-size:50% 50%;-webkit-background-size:50% 50%;background-size:50% 50%;background-repeat:no-repeat;height:160px;width:160px}.main-box:after{background:-webkit-linear-gradient(45deg,transparent,#000 10px),-webkit-linear-gradient(135deg,transparent 20px,#000 0),-webkit-linear-gradient(225deg,transparent,#000 10px),-webkit-linear-gradient(315deg,transparent 20px,#000 0);background-position:0 100%,100% 100%,100% 0,0 0;-moz-background-size:50% 50%;-webkit-background-size:50% 50%;background-size:50% 50%;background-repeat:no-repeat;height:150px;width:150px}.border-main-box{background-size:50px 50px;height:125px;width:125px}}