@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700');
* {
	outline: 0!important;
}


/* Body Styling */

body {
	background: #333333;
	color: #ffffff;
	margin-bottom: 115px;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}


/* Headings Styling */

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
}


/* Header Styling */

.jumbotron {
	background: #8a8a8a;
	color: #ffffff!important;
	text-shadow: 2px 2px #333333;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.jumbotron a,
.jumbotron a:focus,
.jumbotron a:hover {
	color: inherit;
}


/* Theme Switch Styling */

.themes {
	height: 36px;
	margin-bottom: -25px;
}

.themes>.theme-switch {
	margin-right: -5px;
}

.themes>.theme-switch:last-of-type {
	margin-right: 0;
}

/* Category Styling */

#cat-viewing {
	margin-top: 10px;
	margin-bottom: -30px;
}


/* App Item Styling */

.app {
	-webkit-transition: all 0.75s ease-in-out;
	transition: all 0.75s ease-in-out;
}

.app-item {
	width: 100%;
	padding-top: 100%;
	background-color: #d8d8d8;
	background-size: 100%;
	background-position: center center;
	-webkit-transition: background-size 0.75s ease-in-out;
	transition: background-size 0.75s ease-in-out;
	margin: 0 auto 30px;
	position: relative;
	color: #e2e2e2;
}

.app-item:hover,
.app-item:focus,
.app-item:active {
	background-size: 150%;
}

.app-inner,
.app-overlay,
.app-disabled,
.app-prevent-click {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.app-inner {
	text-align: center;
	z-index: 2;
	opacity: 0;
	outline-offset: -3px;
	outline: 5px solid rgba(226, 226, 226, 0)!important;
	padding: 0;
	-webkit-transition: all 0.75s ease-in-out;
	transition: all 0.75s ease-in-out;
}

.app-item:hover .app-inner,
.app-item:focus .app-inner,
.app-item:active .app-inner {
	opacity: 1;
	outline-offset: -15px;
	outline: 5px solid #e2e2e2!important;
	padding: 15px;
}

.app-overlay {
	background: linear-gradient(-45deg, #34495e 0%, #cc6055 100%);
	opacity: 0.15;
	-webkit-transition: all 0.75s ease-in-out;
	transition: all 0.75s ease-in-out;
}

.app-item:hover .app-overlay,
.app-item:focus .app-overlay,
.app-item:active .app-overlay {
	opacity: 0.45;
}

.app-disabled {
	background: rgba(0, 0, 0, 0.3);
	z-index: 1;
}

.app-item .app-prevent-click {
	z-index: 100;
	visibility: visible;
	-webkit-transition-property: visibility;
	-webkit-transition-property: visibility;
	transition-property: visibility;
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
	-webkit-transition-delay: 0.15s;
	transition-delay: 0.15s;
	-webkit-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

.app-item:hover .app-prevent-click,
.app-item:focus .app-prevent-click,
.app-item:active .app-prevent-click {
	visibility: hidden;
}

.app-title,
.app-actions,
.app-info {
	height: 33%;
	padding: 10px;
}

.app-title {
	text-shadow: 2px 2px #333333;
	margin: 0;
	width: 100%;
	display: table;
}

.app-title span {
	display: table-cell;
	vertical-align: middle;
}

.app-actions {
	padding: 10px 0;
}

.app-actions div {
	display: table;
}

.app-actions div span {
	display: table-cell;
	vertical-align: middle;
}

.app-view,
.app-more {
	height: 100%;
	padding: 0 10px;
	color: #e2e2e2;
	background: rgba(0, 0, 0, 0);
	text-shadow: 2px 2px #8a8a8a;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.app-actions>.app-more,
.app-actions>.app-view {
	background: rgba(51, 51, 51, 0.25);
}

.app-actions>a>.app-more,
.app-actions>a>.app-view {
	background: rgba(51, 51, 51, 0.5);
}

.app-actions>a>.app-more:hover,
.app-actions>a>.app-view:hover {
	background: rgba(51, 51, 51, 0.75);
}

.disabled-icon {
	color: #c1c1c1;
}

.app-info {
	/*text-shadow: 2px 2px #333333;*/
	display: table;
	width: 100%;
	outline-offset: -3px;
	outline: 3px solid rgba(226, 226, 226, 0)!important;
	-webkit-transition: all 0.75s ease-in-out;
	transition: all 0.75s ease-in-out;
}

.app-item:hover .app-info,
.app-item:focus .app-info,
.app-item:active .app-info {
	outline-offset: -8px;
	outline: 3px solid #e2e2e2!important;
}

.app-info span {
	display: table-cell;
	vertical-align: middle;
}

.app-hidden {
	width: 0;
	padding: 0;
	overflow: hidden;
}


/* Footer Styling */

footer {
	background: #8a8a8a;
	color: #ffffff;
	font-weight: 700;
	position: fixed;
	bottom: 0;
	width: 100%;
	padding: 20px;
	z-index: 2;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}


/* Back To Top Button Styling */

.btp,
.back {
	position: fixed;
	bottom: 0;
	margin: 0;
	border-radius: 5px 5px 0 0;
	border-width: 2px;
	border-bottom-width: 0;
	font-size: 2em;
	padding-bottom: 0;
	padding-top: 4px;
	background: #8a8a8a;
	color: #ffffff;
	border-color: #333333;
	-webkit-box-shadow: 0 0 10px #333333;
	box-shadow: 0 0 10px #333333;
	text-shadow: 2px 2px #333333;
	z-index: 3;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.btp:hover,
.back:hover {
	background: #333333;
	text-shadow: 2px 2px #8a8a8a;
	cursor: pointer;
}

.btp {
	right: 55px;
}

.back {
	left: 55px;
}

.btp.btp-hidden {
	opacity: 0;
	-webkit-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.btp {
	opacity: 1;
}

.btp span i,
.back span i {
	height: 30px;
	width: 30px;
	text-align: center;
}

.tooltip.top>.tooltip-arrow {
	border-top-color: #333333;
}

.tooltip.left>.tooltip-arrow {
	border-left-color: #333333;
}

.tooltip.bottom>.tooltip-arrow {
	border-bottom-color: #333333;
}

.tooltip.right>.tooltip-arrow {
	border-right-color: #333333;
}

.tooltip>.tooltip-inner {
	background-color: #333333;
}


/* Awesome Social Buttons Styling */

.AwesomeSocial .widget-title {
	display: none;
}

.fb-awesome-social,
.tw-awesome-social,
.github-awesome-social {
	background: #333333;
	color: #323232;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.fb-awesome-social:hover,
.tw-awesome-social:hover,
.github-awesome-social:hover {
	color: #333333!important;
}

.fb-awesome-social:hover {
	background: #3b5998;
}

.tw-awesome-social:hover {
	background: #00aced;
}

.github-awesome-social:hover {
	background: #ffffff;
}


/* Separators */

.vert-sep {
	display: inline-block;
	background: #ffffff;
	width: 1px;
	height: 30px;
	vertical-align: middle;
	margin: 0 5px 0 10px;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.horiz-sep {
	background: #ffffff;
	width: 100%;
	max-width: 300px;
	height: 1px;
	margin: 10px auto;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

main .horiz-sep {
	margin: 30px auto;
}


/* Padding & Margin Styling */

.pd0 {
	padding: 0;
}

.pdl0 {
	padding-left: 0;
}

.pdr0 {
	padding-right: 0;
}

.pdb10 {
	padding-bottom: 10px;
}

.mgt10 {
	margin-top: 10px;
}

.mgb30 {
	margin-bottom: 30px;
}

.mgr-5 {
	margin-right: -5px;
}


/* Modal Styling */

.modal-content {
	background: #8a8a8a;
	color: #ffffff;
	border-color: #8a8a8a;
	border-radius: 0;
	border-width: 2px;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.modal-header,
.modal-footer {
	border: none!important;
	text-shadow: 2px 2px #333333;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.modal-header .close {
	font-size: 40px;
	color: #ffffff;
	text-shadow: 2px 2px #333333;
	opacity: 1;
	font-weight: 400;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.modal-header .close:hover {
	text-shadow: 2px 2px #8a8a8a;
}

.modal-header a {
	color: #ffffff;
}

.modal-header h1 {
	margin-top: 0;
}

.modal-header h1 .fa {
	margin-right: 10px;
}

.modal-header h2 {
	margin-top: 0;
	font-size: 20px;
}

.modal-header h2 .fa {
	margin-left: 3px;
	margin-right: 25px;
}

.modal-header h5 {
	margin-top: 0;
}

.modal-header h5 .fa {
	margin-left: 3px;
	margin-right: 30px;
}

.modal-body {
	background: #ffffff;
	color: #333333;
}


/* Default Button Styling */

.btn-default {
	font-weight: 700;
	padding: 10px 30px;
	border-radius: 0;
	border-width: 2px;
	color: #ffffff!important;
	background-color: #8a8a8a;
	border-color: #333333;
	text-shadow: 2px 2px #333333;
	-webkit-transition: all 0.45s ease-in-out;
	transition: all 0.45s ease-in-out;
}

.btn-default.btn-cat,
.btn-default.btn-theme {
	border-color: #8a8a8a;
	padding: 6px 12px;
}

.jumbotron .btn-default.btn-theme {
	border-color: #333333;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.btn-default.active:hover,
.btn-default.active:focus,
.btn-default.active:active,
.open .dropdown-toggle.btn-default {
	color: #ffffff;
	background-color: #333333;
	border-color: #333333;
	text-shadow: 2px 2px #8a8a8a;
}

.btn-teal:active,
.btn-teal.active,
.open .dropdown-toggle.btn-teal {
	background-image: none;
}

.btn-teal.disabled,
.btn-teal[disabled],
fieldset[disabled] .btn-teal,
.btn-teal.disabled:hover,
.btn-teal[disabled]:hover,
fieldset[disabled] .btn-teal:hover,
.btn-teal.disabled:focus,
.btn-teal[disabled]:focus,
fieldset[disabled] .btn-teal:focus,
.btn-teal.disabled:active,
.btn-teal[disabled]:active,
fieldset[disabled] .btn-teal:active,
.btn-teal.disabled.active,
.btn-teal[disabled].active,
fieldset[disabled] .btn-teal.active {
	background-color: #8a8a8a;
	border-color: #333333;
}

.btn-teal .badge {
	color: #333333;
	background-color: #ffffff;
}


/* Media Queries */

@media all and (max-width:991px) {
	body {
		margin-bottom: 0;
		position: relative;
		min-height: 100vh;
	}
	body.admin-bar {
		min-height: calc(100vh - 32px);
	}
	footer {
		position: absolute;
	}
	.modal img {
		max-width: 300px;
		margin: 0 auto;
	}
}

@media all and (max-width:782px) {
	body.admin-bar {
		min-height: calc(100vh - 46px);
	}
}

@media all and (max-width:767px) {
	.jumbotron {
		padding-bottom: 48px;
	}
}

@media screen and (max-width: 600px) {
	#wpadminbar {
		position: fixed;
	}
}
