@import "subnetting.css";

/*https://codepen.io/Hatishk/pen/ZEMoNxR*/
.radio-item [type="radio"] {
	display: none;
}
.radio-item + .radio-item {
	margin-top: 15px;
}
.radio-item label {
	display: block;
	padding: 20px 60px;
	/* background: #1d1d42; */
	border: 2px solid rgb(117 117 117);
	border-radius: 8px;
	cursor: pointer;
	font-size: 18px;
	font-weight: 400;
	min-width: 250px;
	white-space: nowrap;
	position: relative;
	transition: 0.4s ease-in-out 0s;
}
.radio-item label:after,
.radio-item label:before {
	content: "";
	position: absolute;
	border-radius: 50%;
}
.radio-item label:after {
	height: 19px;
	width: 19px;
	border: 2px solid #0046d5;
	left: 19px;
	top: calc(50% - 12px);
}
.radio-item label:before {
	background: #0046d5;
	height: 20px;
	width: 20px;
	left: 21px;
	top: 32%;
	transform: scale(5);
	opacity: 0;
	visibility: hidden;
	transition: 0.4s ease-in-out 0s;
}
.radio-item [type="radio"]:checked ~ label {
	border-color: #0046d5;
}
.radio-item [type="radio"]:checked ~ label::before {
	opacity: 1;
	visibility: visible;
	transform: scale(1);
}

.td-nested-table {
    padding: 0;
}

.nested-table {
    border-collapse: collapse;
    width: 100%;
}

@media screen and (width >1024px) {
    .subnets-table td:nth-child(1) {
        text-align: left;
    }

    .level1 {
        text-align: center !important;
    }

    .level2 {
        text-align: right !important;
    }
}