.box-parent {
	display: inline-block;
	position: relative;
}
.box {
	width: 100px;
	height: 100px;
	border: 1px solid var(--global-font-title);
	opacity:0.5;
}
.box.circle{
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
}
.box.rectangle{
	width: 150px;
}

.circle-image-pattern .shape
{
	position: relative;
	height: 450px;
	width: 450px;
	background-image: url(http://192.168.1.230/wp_themes/latest/qreate_marketing/wp-content/uploads/2021/06/10-3.jpg);
	background-repeat: no-repeat;
	background-size: 40% 100%;
	border-radius: 50%;
	background-attachment: fixed;
	transition: 0.5s;
	background-position: center right;
}

.circle-image-pattern .shape::before
{
	content: "";
	position: absolute;
	top:50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	width: 230px;
	height: 230px;
	background-color:var(--global-body-lightcolor);
}
@media(max-width:1250px){
	.circle-image-pattern{display: none;}
}