@font-face {
	font-family: 'USArmyWeb Light';
	src: url('../css/USArmyWeb-Light.eot');
	src: url('../css/USArmyWeb_Light/USArmyWeb-Light.eot?#iefix') format('embedded-opentype'),
		 url('../css/USArmyWeb-Light.woff2') format('woff2'),
		 url('../css/USArmyWeb-Light.woff') format('woff'),
		 url('../css/USArmyWeb-Light.ttf') format('truetype');
}

.list-type3{
	margin: 0 auto;
	width: 500px;
	height: 280px;
	overflow-y: scroll;
	color: #000000;
	background-color: hsla(0,0%,0%,0.50);
	
}
.list-type3 li, .list-type3 a{
float:left;

height:35px;
line-height:35px;
position:relative;
font-size:12px;
margin-bottom: 5px;
font-family: "USArmyWeb Light";
transition: background-color 1.5s ease;
}
.list-type3 a{
padding:0 20px 0 12px;
background:#000000;
color:#FFD530;
text-decoration:none;
-moz-border-radius-bottomright:4px;
-webkit-border-bottom-right-radius:4px;
border-bottom-right-radius:4px;
-moz-border-radius-topright:4px;
-webkit-border-top-right-radius:4px;
border-top-right-radius:4px;
}

.list-type3 a:before{
content:"";
float:left;
position:absolute;
top:0;
left:-12px;
width:0;
height:0;
border-color:transparent #ffd530 transparent transparent;
border-style:solid;
border-width: 18px 12px 18px 0;
}

.list-type3 a:after{
content:"";
position:absolute;
top:15px;
left:0;
float:left;
width:6px;
height:6px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
background:#fff;
-moz-box-shadow:-1px -1px 2px #ffd530;
-webkit-box-shadow:-1px -1px 2px #ffd530;
box-shadow:-1px -1px 2px #ffd530;
}
.list-type3 a:hover{
background:#555555;
}

.list-type3 a:hover:before{
border-color:transparent #FFFFFF transparent transparent;
}

@media screen and (max-width: 768px) {
	.list-type3{
		margin: 0 auto;
		height: 280px;
		overflow-y: scroll;
		color: #000000;
		background-color: hsla(0,0%,0%,0.50);
		width:100%;
	}
}