ncdownloader/css/style.css

.action-item {
	position: relative;
}

a {
	color          : #337ab7;
	text-decoration: none;
}

a:hover,
a:focus {
	color          : #23527c;
	text-decoration: underline;
}

a:focus {
	outline       : 5px auto -webkit-focus-ring-color;
	outline-offset: -2px;
}

#ncdownloader-form-wrapper input {
	display: block;
}

div .number {
	background   : none repeat scroll 0 0 #5f5853;
	border-radius: 999px;
	color        : #FFFFFF;
	display      : inline-block;
	font-size    : 15px;
	font-style   : italic;
	height       : 20px;
	line-height  : 20px;
	margin-right : 10px;
	padding      : 0 8px;
}

#ncdownloader-form-wrapper input[type=text] {
	padding: 0px 5px;
	width  : 100%;
}

#ncdownloader-table-data .table-cell {
	padding-left: 4px;
}

.icon-power {
	background-image: url('../img/power.svg');
}

.icon-purge {
	background-image: url('../img/trash.svg');
}
.icon-unpause {
	background-image: url('../img/play.svg');
}
#ncdownloader-action-links-container {
	position: relative;
}

#ncdownloader-action-links-container ul {
	background-color: #ededed;
}

#ncdownloader-action-links-container .action-link-item a:hover {
	background-color: #c2afaf;
}

#ncdownloader-message-banner.success,
.message-banner.success {
	color           : #3c763d;
	background-color: #dff0d8;
	border-color    : #d6e9c6;
	width           : fit-content;
}

#ncdownloader-message-banner.error,
.message-banner.error {
	color           : #a94442;
	background-color: #f2dede;
	border-color    : #ebccd1;
	width           : fit-content;
}



.action-links {
	/*visibility: hidden;*/
	display         : none;
	position        : absolute;
	background-color: #f1f1f1;
	min-width       : 60px;
	box-shadow      : 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index         : 9999;
}

.action-link-item a {
	color          : black;
	padding        : 6px 6px;
	text-decoration: none;
	display        : block;
}

.app-ncdownloader,
#ncdownloader-content {
	width: 100%;
}

.ncdownloader-content-wrapper {
	width      : 100%;
	padding-top: 0.3em;
}

#ncdownloader-form-wrapper {
	width: 100%;
}


#ncdownloader-table-content {
	width: 100%;
}

.app-ncdownloader #app-content #app-content-wrapper {
	flex-wrap: wrap;
}

#app-content-wrapper #ncdownloader-table-content thead>tr {
	height          : 30px;
	background-color: #eee;
}

#app-content-wrapper #ncdownloader-table-content thead>tr>th {
	font-style   : italic;
	font-weight  : bold;
	padding      : 2px 0 2px 5px;
	border-bottom: 1px solid #ddd;
	text-align   : left;
}

#ncdownloader-table-content thead.table-heading th {
	border-left: 1px solid rgb(216, 202, 202);
}

#app-content-wrapper #ncdownloader-table-content .table-cell {
	border-bottom: 1px solid #9d9595;
	border-left  : 1px solid #eee;

}

.app-navigation-entry-bullet {
	background-color: rgb(80, 80, 173);
}

.notinstalled {
	color: red;
}

@media only screen and (min-width: 800px) {}

@media only screen and (max-width: 1024px) {
	#ncdownloader-form-wrapper {
		position  : relative;
		margin-top: 2em;
	}
}


/* from bootstrap */
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
	position   : absolute !important;
	width      : 1px !important;
	height     : 1px !important;
	padding    : 0 !important;
	margin     : -1px !important;
	overflow   : hidden !important;
	clip       : rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border     : 0 !important;
}

@-webkit-keyframes spinner-border {
	to {
		transform: rotate(360deg)
			/* rtl  :ignore */
		;
	}
}

@keyframes spinner-border {
	to {
		transform: rotate(360deg)
			/* rtl  :ignore */
		;
	}
}

.spinner-border {
	display           : inline-block;
	width             : 2rem;
	height            : 2rem;
	vertical-align    : -0.125em;
	border            : 0.25em solid currentColor;
	border-right-color: transparent;
	border-radius     : 50%;
	-webkit-animation : 0.75s linear infinite spinner-border;
	animation         : 0.75s linear infinite spinner-border;
}

.spinner-border-sm {
	width       : 1rem;
	height      : 1rem;
	border-width: 0.2em;
}

@-webkit-keyframes spinner-grow {
	0% {
		transform: scale(0);
	}

	50% {
		opacity  : 1;
		transform: none;
	}
}

@keyframes spinner-grow {
	0% {
		transform: scale(0);
	}

	50% {
		opacity  : 1;
		transform: none;
	}
}

.spinner-grow {
	display          : inline-block;
	width            : 2rem;
	height           : 2rem;
	vertical-align   : -0.125em;
	background-color : currentColor;
	border-radius    : 50%;
	opacity          : 0;
	-webkit-animation: 0.75s linear infinite spinner-grow;
	animation        : 0.75s linear infinite spinner-grow;
}

.spinner-grow-sm {
	width : 1rem;
	height: 1rem;
}

@media (prefers-reduced-motion: reduce) {

	.spinner-border,
	.spinner-grow {
		-webkit-animation-duration: 1.5s;
		animation-duration        : 1.5s;
	}
}