.accordion {width: 80%; margin: 0 auto; border-top: 1px solid #ccc;}

.accordion li {position: relative; list-style: none; border-bottom: 1px solid #ccc;}
.accordion li div.h {color: #fff; background-color: #444; display: none; padding: 25px;}

.accordion h3 {flex: 0 1 auto; width: 40%; padding: 9px 0 10px 10px; text-transform: none; font-size: 16px; font-weight: 600; color: #555;}
.accordion h4 {flex: 1 1 auto; width: 60%;padding: 10px; font-size: 15px; font-weight: 400; color: #555;}
.accordion p {font-size: 14px; line-height: 29px;}
div.h ul {margin: 0 0 10px 0; margin-left: 30px;}
div.h li {border: none; list-style-type: disc; font-size: 14px; line-height: 29px;}

.accordion a {width: 100%; cursor: pointer; user-select: none; font-size: 14px; font-weight: 600;}
.accordion a:after {position: absolute; top: 17px; right: 10px; content: " "; width: 8px; height: 8px;border-right: 1px solid #4a6e78; border-bottom: 1px solid #4a6e78;
		transform: rotate(-45deg);-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}
a.active1:after {border-right: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(45deg);
	-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

a.active1 h3 {color: #1892f9;}
a.active1 h4 {color: #fff; background-color: #444;}

.accordion1 {width: 86%; margin: 0 auto; border-top: 1px solid #ccc;}
.accordion1 li {position: relative; list-style: none; border-bottom: 1px solid #ccc;}
.accordion1 li div.h {display: none; padding: 25px; color: #fff; background-color: #444;}

.accordion1 h3 {flex: 0 1 40%; margin: 0; padding: 9px 0 5px 30px; text-transform: none; font-size: 15px; font-weight: 600; color: #555;}
.accordion1 h3 span {font-size: 13px; font-weight: 600; color: #555;}
.accordion1 h4 {margin: 0; padding: 0 0 20px 0; font-size: 16px; font-weight: 400;}
.accordion1 p {font-size: 14px; line-height: 29px;}

.accordion1 a {width: 100%; cursor: pointer; user-select: none;	font-size: 14px; font-weight: 600;}
.accordion1 a:before {position: absolute; top: 15px; left: 10px; content: " "; width: 8px; height: 8px; 
	border-right: 1px solid #4a6e78; border-bottom: 1px solid #4a6e78; transform: rotate(-45deg);
	-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}
a.active11:before {transform: rotate(45deg);-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

a.active11 h3 {color: #1892f9;}
.red_ball a.active11 h3 {color: #16a599;}

.comp, .comp-top {display: flex; flex-wrap: wrap; flex: 1 1 240px;}

.comp h5 {flex: 1 1 100px; margin: 0; padding: 10px; font-size: 14px; color: #555;}
.comp-top h5 {flex: 1 1 100px; font-size: 15px;  font-weight: 600; margin: 0; padding: 10px; color: #555;}
.comp h5 span {display: none;}
.comp h5.off {color: #ccc;}
.comp h5:before {display: inline-block; content: ""; margin: 0 0 0 25px; width: 10px; height:10px; border-radius: 50%; background-color: #1892f9;}
.comp h5.off:before {background-color: #ccc;}
.red_ball div.comp h5:before {display: inline-block;content: "";margin: 0 0 0 25px;width: 10px;height:10px;border-radius: 50%;background-color: #16a599;}
.red_ball div.comp h5.off:before {background-color: #ccc;}

@media screen and (max-width: 960px) {
.accordion h3 {width: 55%;}
.accordion h4 {width: 45%;}
}

@media screen and (max-width: 880px) {
.accordion1 h3 {flex: 1 1 20%;}
.comp h5 {flex: 1 1 20%; padding: 10px;}
.comp-top h5 {flex: 1 1 20%; margin: 0; padding: 10px; font-size: 15px; font-weight: 600; color: #555;}
}

@media screen and (max-width: 700px) {
.comp h5:before, .red_ball div.comp h5:before {margin: 0 0 0 5px;}
.verh {display: none;}
.accordion, .accordion1 {width: 96%;}
.accordion h3 {font-size: 15px;}
.accordion h4 {font-size: 14px; padding: 10px 20px 10px 10px;}
.accordion1 h3 {flex: 1 1 50%; font-size: 14px;}
.comp {flex: 1 1 50%; padding: 10px 5px 5px 0px;}
.comp h5 span {display: inline-block; font-weight: 400; padding: 0 0 0 10px;}
.comp h5 {flex: 1 1 100%; padding: 0 5px 5px 10px; font-size: 13px;}
}

@media screen and (max-width: 500px) {
.accordion {width: 90%;}
.accordion a:after {top: 12px;}
a.active1:after {border-right: 1px solid #333; border-bottom: 1px solid #333;}
.accordion h3 {width: 100%; padding: 5px 20px 7px 20px;}
.accordion h4 {width: 100%; padding: 0px 20px 10px 20px;}
a.active1 h4 {padding: 10px 20px 10px 20px; font-size: 15px;}
.accordion li div.h {padding: 0 20px 25px 20px;}
div.h ul {margin-left: 20px;}
div.h li {font-size: 14px; line-height: 26px; padding: 5px 0 5px 0;}
.accordion p {line-height: 26px;}
}

@media screen and (max-width: 400px) {
.accordion {width: 96%;}
.accordion1 a:before {left: 3px;}
.accordion1 h3 {flex: 1 1 100%; padding: 9px 0 0 24px;}
.comp {flex: 1 1 100%; padding: 10px 5px 5px 10px;}
}