/* CSS Document */

.scrollbar-type-0 ::-webkit-scrollbar {
	width: 6px;
}
.scrollbar-type-0 ::-webkit-scrollbar-thumb {
	background-color: #CE352C !important;
	background-color: transparent;
}
.scrollbar-type-0 ::-webkit-scrollbar-track {
	background-color: transparent;
}
*, *:before, *:after {
	box-sizing: border-box;
}
body {
	background-color: #cfcfcf;
	background-image: -webkit-linear-gradient(white, #cfcfcf);
	background-image: -o-linear-gradient(white, #cfcfcf);
	background-image: linear-gradient(white, #cfcfcf);
	background-attachment: fixed;
}

.container5vm {margin: 0 5vh;}


nav .mif-menu {
	background: rgba(60,60,60,1.00);
	color: white;
	border-radius: 50%;
	font-size: 3.25vh;
	line-height: 5vh;
	height: 5vh;
	width: 5vh;
	text-align: center;
}


figure.cover { position:relative;padding:0;margin:0;}
figure.cover img{ 
	object-fit: cover;
    width: 100%;
    height: 50vh;
	border-radius: 0;
}

figure.cover figcaption{ 
 	position: absolute;
	top:15vh;
	width:100%;
	z-index: 1;
	text-shadow: 0px 0px 3.25vh #000000;
}
figure.cover>div{ 
 	position: absolute;
	bottom:0;
	right: 5vh;
	width:calc(100% - 5vh);
	z-index: 1;
	text-align: right;
}

figure>img {
	border-radius: 50%;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
body>figure:hover>img {
	filter:brightness(50%);
}
figure>figcaption {
	position: absolute;
	top: 50%;
	width: 100%;
	margin: -3.6vh auto auto auto;
	z-index: 1;
	color: white;
	text-shadow: 0px 0px 3.25vh #000000;
}



img.bg-blue-filter {
	    filter: invert(27%) sepia(200%) saturate(200%) hue-rotate(173deg) brightness(91%) contrast(90%);
}
img.bg-blue-filter:hover {
	    filter: none;
}

.bg-blue {
	background-color: #36A9E1!important;
}
.bg-red {
	background-color: #E6332A!important;
}
.bg-orange {
	background-color: #F39200!important;
}
.bg-yellow {
	background-color: #FCEA10!important;
}
.bg-lime {
	background-color: #95C11F!important;
}
.bg-green {
	background-color: #008D36!important;
}
.bg-purple {
	background-color: #7558c6!important;
}
.bg-magenta {
	background-color: #bd49ae!important;
}
	
	
	
.circle-container {
	position: relative;
	margin: 0 auto; /*OPTIONAL MARGIN*/
}
/*#008d36*/
.circle-frame {
	width: 100%;
	height: 100%;
	background: radial-gradient( ellipse at center, #36a9e1 0%, #36a9e1 70%, rgba(255,255,255,0) 70.3% );
	position: relative;
	margin: 0;
	color: white;
}	

	
.circle-container.blue .circle-frame {
	background: radial-gradient( ellipse at center, #36A9E1 0%, #36A9E1 70%, rgba(255,255,255,0) 70.3% );
}
.circle-container.red .circle-frame {
	background: radial-gradient( ellipse at center, #E6332A 0%, #E6332A 70%, rgba(255,255,255,0) 70.3% );
}
.circle-container.orange .circle-frame {
	background: radial-gradient( ellipse at center, #F39200 0%, #F39200 70%, rgba(255,255,255,0) 70.3% );
}
.circle-container.yellow .circle-frame {
	background: radial-gradient( ellipse at center, #FCEA10 0%, #FCEA10 70%, rgba(255,255,255,0) 70.3% );
}
.circle-container.lime .circle-frame {
	background: radial-gradient( ellipse at center, #95C11F 0%, #95C11F 70%, rgba(255,255,255,0) 70.3% );
}
.circle-container.green .circle-frame {
	background: radial-gradient( ellipse at center, #008D36 0%, #008D36 70%, rgba(255,255,255,0) 70.3% );
}
.circle-container.purple .circle-frame {
	background: radial-gradient( ellipse at center, #7558c6 0%, #7558c6 70%, rgba(255,255,255,0) 70.3% );
}
.circle-container.magenta .circle-frame {
	background: radial-gradient( ellipse at center, #bd49ae 0%, #bd49ae 70%, rgba(255,255,255,0) 70.3% );
}

.circle-container.circle-10  {
	width: 10vh;
	height: 10vh;
}	
	
.circle-container.circle-20  {
	width: 20vh;
	height: 20vh;
}	
.circle-container.circle-30  {
	width: 30vh;
	height: 30vh;
}
.circle-container.circle-40  {
	width: 40vh;
	height: 40vh;
}
	
.circle-container.circle-50  {
	width: 50vh;
	height: 50vh;
}		
.circle-container.circle-60  {
	width: 60vh;
	height: 60vh;
}	
.circle-container.circle-66  {
	width: 66vh;
	height: 66vh;
}	
.circle-container.circle-80  {
	width: 80vh;
	height: 80vh;
}

.circle-content {
	height: 100%;
	font-size: 2.35vh;
	line-height: 2.8vh;
    	text-align: center;
    	text-align-last: center;
}
.circle-leader {
	height: 100%;
	font-size: 4.35vh;
	line-height: 4.8vh;
	font-style: italic;
}
.circle-frame::before {
	content: "";
	width: 50%;
	height: 100%;
	float: left;
	shape-outside: polygon( 0 0, 98% 0, 50% 6%, 23.4% 17.3%, 6% 32.6%, 0 50%, 6% 65.6%, 23.4% 82.7%, 50% 94%, 98% 100%, 0 100% );
	shape-margin: 4%;
}
.circle-content::before {
	content: "";
	width: 50%;
	height: 100%;
	float: right;
	shape-outside: polygon( 2% 0%, 100% 0%, 100% 100%, 2% 100%, 50% 94%, 76.6% 82.7%, 94% 65.6%, 100% 50%, 94% 32.6%, 76.6% 17.3%, 50% 6% );
	shape-margin: 4%;
}
