*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

html{
	background:#223344;
	padding-bottom:25vh;
	overflow-y:scroll;
}

body{
	max-width:1920px;
	margin:0 auto;
	user-select:none;
}

.clear{clear:both;}

.ains{
	width:540px;
	margin:0 auto;
	.background:silver;
}

.cols{
	display:grid;
	grid-template-columns:200px 300px;
	grid-column-gap:36px;
}

.part{
	display:none;
}

.at{
	font-family:montserrat;
	font-size:17px;
	letter-spacing:1px;
	color:#ddd;
	text-align:left;
	margin-bottom:16px;
	cursor:pointer;
	position:relative;
}

.at::before{
	content:'';
	width:12px; height:12px;
	border-radius:50%;
	background:#ccc;
	position:absolute;
	left:-23px;
	top:4px;
}

.aact::before{
	background: darkorange;
}

.bt, .ct, .dt{
	font-family:montserrat;
	font-size:16px;
	letter-spacing:1px;
	line-height:25px;
	color:#ddd;
	text-align:left;
	margin-bottom:14px;
	cursor:pointer;
	position:relative;
}


.bname{
	font-family:montserrat;
	font-size:17px;
	font-weight:600;
	letter-spacing:1px;
	line-height:25px;
	color:#ddd;
	text-align:left;
	margin-left:-20px;
	margin-bottom:5px;
}

.bt::before,
.ct::before,
.dt::before{
	content:'';
	width:9px; height:9px;
	border-radius:50%;
	background:#ccc;
	position:absolute;
	left:-20px;
	top:8px;
}

.at:active,
.bt:active,
.ct:active,
.dt:active{
	bottom:2px;
}

.bact::before{
	background:darkorange;
}

@media only screen and (max-width: 740px){
	.ains{width:250px;}
	.cols{display:block;}
	.colb{margin-top:36px; border-top:2px dashed #ddd; padding-top:36px;}
}