html { min-height: 100%; font-size: 10px; font-family: sans-serif; } body { font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif; font-weight: 400; overflow-x: hidden; overflow-y: auto; min-height: 100%; color: #333; } .fa { font-size: 90%; } .wrapper { min-height: 100%; position: relative; overflow: hidden; } .sidebar { position: fixed; top: 0; left: 0; min-height: 100%; width: 230px; z-index: 810; background-color: #222; /* color: #4B4B4B; */ color: #6D6D6D; } .profile p { font-size: 15px; text-transform: uppercase; margin-bottom: 0px; } .profile a{ color: rgb(112, 100, 172); transition-duration: 0.2s; font-size: 12px; } .profile a:hover{ color: rgba(112, 100, 172, 0.6); text-decoration: none; } .filter { position: relative; width: 100%; padding: 10px; } .filter ul { list-style: none; padding: 0; margin: 0; } .filter li { display: block; padding: 5px; margin-bottom: 10px; } .filter li:last-child{ text-align: right; } .filter li > label { display: block; float: left; background-color: #222; height: 16px; padding: 0px; /* color: #4B4B4B; */ color: #6d6d6d; font-size: 12px; overflow: hidden; font-weight: 400; text-transform: uppercase; letter-spacing: 0px; } .filter li > h3 { text-transform: uppercase; font-size: 18px; border-bottom: 1px solid; padding-bottom: 1px; margin-top: 5px; margin-bottom: 2px; } .filter input[type="text"] { width: 100%; display: block; outline: none; border: none; height: 25px; line-height: 25px; font-size: 16px; padding: 0; background-color: #4B4B4B; border-radius: 2px; color: #7B7B7B; font-size: 12px; padding: 5px; } .filter button { background-color: rgb(112, 100, 172); height: 25px; padding: 2px; font-size: 12px; width: 50%; border-radius: 2px; text-transform: uppercase; border: none; color: #c0c0c0; transition-duration: 0.2s; } .filter button:hover{ background-color: rgba(112, 100, 172, 0.8); } .filter tags-input { margin-top:20px; width: 100%; } tags-input .tags { width: 100%; background-color: #4B4B4B; border: none; border-radius: 2px; } tags-input .tags.focused, tags-input.ng-invalid .tags{ border: none; box-shadow: none; } tags-input .tags .tag-item { color: #c0c0c0; background-color: rgb(112, 100, 172); border: 1px solid rgb(112, 100, 172); border-radius: 4px; margin: 2px; padding: 0 5px; display: inline-block; float: left; font-size: 11px; height: 24px; line-height: 20px; } .content-wrapper { background-color: #fff; z-index: 800; margin-left: 230px; width: 100%; color: #202020; } .news-wrapper { width: 40%; float: left; padding: 0px; } .news-wrapper section { padding: 10px; } .news-wrapper section.even-news { background-color: #fcfcfc; } .news-wrapper section.odd-news { background-color: #f2f2f2; } ul.news-meta { padding: 0px; font-size: 12px; border-bottom: 1px solid rgba(0,0,0,0.05); padding-bottom: 3px; margin-bottom: 10px; } ul.news-meta li { display: inline; margin-right: 10px; } .article-wrapper { position:fixed; max-height:100%; overflow-y:auto; right:5px; width: 41%; } /* .summary { max-height: 35px; transition:0.5s;overflow-y:hidden;} .summary:hover { max-height: 999px; } */ .keywords { max-height: 40px; transition:0.5s;overflow-y:hidden;margin-bottom:10px; text-overflow: ellipsis;} .keywords:hover { max-height: 999px; } .tags { margin-bottom: 5px; } .tags .tag { display: inline-block; margin-right: 5px; font-size: 13px; } .tag .close { font-size: 14px; margin-left: 5px; }