/* .selector { */
	/* position: absolute; */
    /* left: 50%; */
    /* top: 50%; */
    /* width: 70%; */
    /* margin-top: -150px; */
    /* margin-left: -150px; */
    /* background: #ffffff; */
    /* background-size: 100%; */
    /* border-radius: 50%; */
    /* border: 8px solid #2568ef; */
/* } */

.selector {
position: relative;
    margin: auto;
    background: #ffffff;
    background-size: 100%;
    border-radius: 50%;
    border: 8px solid #2568ef;
	max-width: 400px;
}

.selector,
.selector button {
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
}

/* .selector button { */
    /* width: 90%; */
    /* height: 90%; */
    /* padding: 10%; */
    /* border-radius: 50%; */
    /* color: #3d4d60; */
    /* font-size: 20px; */
    /* cursor: pointer; */
    /* box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1); */
    /* transition: all .1s; */
    /* background: none; */
	/* border: 0; */
	/* margin: 5%; */
	/* line-height: 20px; */
/* } */

.selector button {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    color: #3d4d60;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 3px 3px rgb(0 0 0 / 10%);
    transition: all .1s;
    background: none;
    border: 0;
    overflow: hidden;
    line-height: 20px;
	font-weight: 600;
}

.selector button:hover { background: rgba(0, 0, 0, 0.1); }

.selector button:focus { outline: none; }

.selector ul {
	position: absolute;
    list-style: none;
    padding: 0;
    margin: 0;
    top: 50px;
    right: 50px;
    bottom: 50px;
    left: 50px;
    border-radius: 50%;
}

.selector li {
  position: absolute;
  width: 0;
  height: 100%;
  margin: 0 50%;
  -webkit-transform: rotate(-360deg);
  transition: all 0.8s ease-in-out;
}

.selector li input { display: none; }

.selector li input + label {
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 0;
  height: 0;
  line-height: 1px;
  margin-left: 0;
  background: #fff;
  border-radius: 50%;
  text-align: center;
  font-size: 1px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: none;
  transition: all 0.8s ease-in-out, color 0.1s, background 0.1s;
}

.selector li input + label:hover { background: #f0f0f0; }

/* .selector li input:checked + label { */
  /* background: #5cb85c; */
  /* color: white; */
/* } */

/* .selector li input:checked + label:hover { background: #449d44; } */

.selector.open li input + label {
	width: 70px;
    height: 70px;
    line-height: 62px;
    margin-left: 42px;
    box-shadow: 0 3px 3px rgb(0 0 0 / 50%);
    font-size: 14px;
    border: 3px solid #f4f7fb;
    background: #112b42f7;
}

.selector.open li input + label:hover {
	background-color: #0f50d2!important;
}

.selector li img {
  width: 50%;
  filter: brightness(0) invert(1);
}

.smallfont {
	font-size: 15px;
	font-weight: 100;
	padding: 0 15%;
	display: block;
}