.block-accompagnement .circle {
	width: 100%;
	height: auto;
	padding-top: calc(100% - 28px);
	position: relative;
	border-radius: 100%;
	border-width: 14px;
	border-style: solid;
	border-color: #697e87;

	transform: rotate(-45deg);

	-webkit-transition: 250ms ease;
	-moz-transition: 250ms ease;
	-o-transition: 250ms ease;
	transition: 250ms ease;
}

.block-accompagnement .circle[data-id = "1"] {
	border-top-color: #FAB900;
}

.block-accompagnement .circle[data-id = "2"] {
	border-right-color: #00AA95;
}

.block-accompagnement .circle[data-id = "3"] {
	border-left-color: #04BAEE;
}

.block-accompagnement .circle[data-id = "4"] {
	border-bottom-color: #824a6e;
}

.block-accompagnement .circle .content {
	position: absolute;
	top:-14px;
	left:-14px;
	width: calc(100% + 28px);
	height: calc(100% + 28px);

	transform: rotate(45deg);
}

.block-accompagnement .circle .content::before {
	content:"";
	width: 8px;
	height: 120%;
	position: absolute;
	top:-10%;
	left:calc(50% - 4px);
	background: #2F3C4D;
	z-index: 1;
}

.block-accompagnement .circle .content::after {
	content:"";
	width: 120%;
	height: 8px;
	position: absolute;
	left:-10%;
	top:calc(50% - 4px);
	background: #2F3C4D;
	z-index: 1;
}

.block-accompagnement .circle .content .logo {
	width: 30%;
	height: 30%;
	border-radius: 100%;
	/*background: #fff;*/
	position: absolute;
	top:35%;
	left:35%;
	z-index: 2;
}

.block-accompagnement .circle .content .logo img {
	width: 50%;
}

.block-accompagnement .circle .content .element {
	width: 50%;
	height: 50%;
	position: absolute;
	cursor: pointer;
}

.block-accompagnement .circle .content .top-left {
	top:0;
	left:0;
}

.block-accompagnement .circle .content .top-right {
	top:0;
	right:0;
}

.block-accompagnement .circle .content .bottom-left {
	bottom:0;
	left:0;
}

.block-accompagnement .circle .content .bottom-right {
	bottom:0;
	right:0;
}

.block-accompagnement .circle .content .picto {
	width: 60%;
	height: 60%;
	border-radius: 100%;
	position: absolute;
	color:#fff;

	-webkit-transition: 250ms ease;
	-moz-transition: 250ms ease;
	-o-transition: 250ms ease;
	transition: 250ms ease;
}

.block-accompagnement .circle .content .picto img {
	width: 50%;
}

.block-accompagnement .circle .content .picto .text {

	font-family: "Open Sans";
	font-weight: 400;
	text-transform: uppercase;
	font-size: 18px;
	width: 160%;
	text-align: center;
	position: absolute;
	left:-30%;
}

.block-accompagnement .circle .content .top-left .picto {
	top:0;
	left:0;
	background: #FAB900;
}

.block-accompagnement .circle .content .top-left .picto .text {
	top:-40px;
}

.block-accompagnement .circle[data-id = "1"] .content .top-left .picto {
	color: #FAB900;

	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.block-accompagnement .circle .content .top-right .picto {
	top:0;
	right:0;
	background: #00AA95;
}

.block-accompagnement .circle .content .top-right .picto .text {
	top:-40px;
}

.block-accompagnement .circle[data-id = "2"] .content .top-right .picto {
	color: #00AA95;

	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.block-accompagnement .circle .content .bottom-left .picto {
	bottom:0;
	left:0;
	background: #04BAEE;
}

.block-accompagnement .circle .content .bottom-left .picto .text {
	bottom:-40px;
}

.block-accompagnement .circle[data-id = "3"] .content .bottom-left .picto {
	color: #04BAEE;

	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.block-accompagnement .circle .content .bottom-right .picto {
	bottom:0;
	right:0;
	background: #824a6e;
}

.block-accompagnement .circle .content .bottom-right .picto .text {
	bottom:-40px;
}

.block-accompagnement .circle[data-id = "4"] .content .bottom-right .picto {
	color: #d27cb3;

	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
