@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&family=Lexend+Exa&family=Rubik:wght@300;400;500;700&display=swap');

.clear {clear: both;}

h4 {font-weight: 400; margin-top: 10px}

body {font-family: 'Rubik', sans-serif;}

.page-link,
a {color: #00265a}

.wrap {min-height: 95vh;}

.btn {font-family: 'Lexend Exa', sans-serif; text-transform: uppercase; letter-spacing: 0px; font-size: 13px; font-weight: 700}
.btn-lg {font-size: 17px; padding-top: 10px; padding-bottom: 10px}
.btn-primary {background: #002d62; border-color: #002d62}

.btn-secondary {background: #002d62; border-color: #002d62}
.btn-success {background: #1a772f;}
.btn-outline-light {border-radius: 9px;}

.btn-xs {padding: 5px; font-size: 10px;}

a {text-decoration: none !important; }
a:hover {color: #b9874d}

.spacer15 {height: 15px; clear: both;}
.spacer30 {height: 30px; clear: both;}
.spacer45 {height: 45px; clear: both;}
.spacer60 {height: 60px; clear: both;}
.spacer90 {height: 90px; clear: both;}
.gray-spacer{height: 30px; background: #efefef; width: calc(100% + 80px); margin-left: -40px;}

.divider60 {height: 60px; clear: both; margin: 0 0 60px; border-bottom: 1px solid #b9874d;}
.divider30 {height: 30px; clear: both; margin: 0 0 30px; border-bottom: 1px solid #b9874d;}
.divider15 {height: 15px; clear: both; margin: 0 0 30px; border-bottom: 1px solid #b9874d;}

.border-top {border-top:1px solid #b9874d;}
.border-bottom {border-bottom:1px solid #b9874d;}
.border-right {border-right:1px solid #b9874d;}
.border-left {border-left:1px solid #b9874d;}

.no-left-padding {padding-left: 0}
.no-top-padding {padding-top: 0}
.no-right-padding {padding-right: 0}
.no-bottom-padding {padding-bottom: 0}

body {background: #EFEFEF;}

.panel {background: #FFF; padding: 30px; border-radius: 4px; 
	-webkit-box-shadow: 3px 3px 5px 0px rgba(50, 50, 50, 0.03);
	-moz-box-shadow:    3px 3px 5px 0px rgba(50, 50, 50, 0.03);
	box-shadow:         3px 3px 5px 0px rgba(50, 50, 50, 0.03);
}

.panel h5 {font-size: 30px; padding-top: 20px;}
.card h5 {padding-top: 0; font-size: 22px;}
.card a {color: #222}
.card h6 {font-size: 20px; text-transform: uppercase; color: #444; margin-bottom: 20px; padding: 0}
.card em {padding: 5px 15px 0; display: block; color: #999}

#header {background: #FFF; padding: 15px 0;
		-webkit-box-shadow: 3px 3px 5px 0px rgba(50, 50, 50, 0.03);
	-moz-box-shadow:    3px 3px 5px 0px rgba(50, 50, 50, 0.03);
	box-shadow:         3px 3px 5px 0px rgba(50, 50, 50, 0.3);
	background: rgb(0,45,98);
background: linear-gradient(0deg, rgba(0,45,98,1) 8%, rgba(18,71,133,1) 91%, rgba(26,66,112,1) 100%);

}

#header .logo {height: 30px}
#header .title {display: inline-block; font-size: 20px; line-height: 30px; padding-left: 10px; top: 3px; position: relative; color: #FFF; margin: 8px 0 0}

#header .dropdown {display: inline-block;}

#message {display: inline-block; color: #FFF; margin-right: 10px; position: relative; z-index: 10; padding-left: 100px;}
#message .notification {position: absolute; background: #fe0808; width: 20px; height: 20px; line-height: 20px; border-radius: 100px; text-align: center; font-size: 10px; font-weight: 700; right: 0; display: block;}
#message i {font-size: 30px; line-height: 50px; display: inline-block; vertical-align: middle; margin-right: 15px; cursor: pointer}
#message .list {background: #FFF; display: block; width: 300px; position: absolute; min-height: 50px; right: 0; border-radius: 4px; color: #666; display: none;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.16);
	-moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.16);
	box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.16);
}
#message .list .message {padding: 10px; text-align: left; font-size: 13px; line-height: 17px; border-bottom: 1px solid #CCC; position: relative; display: block;}
#message .list .message .delete {position: absolute; right: 5px; top: 5px; color: red}
#message .list .message .author {font-weight: 700; color: #222}
#message .list .leave-message {padding: 10px;}
#message:focus-within .list,
#message:focus .list,
#message:hover .list {display: 		block;}
#message .list .view-all {text-align: center; display: block; padding: 5px 0 0; font-size: 13px; color: #444}

#message.all {padding: 0; border: none; width: 100%;}
#message.all .list {display: block; position: relative; box-shadow: none; border: none; left: auto; right: auto; top:  auto; width: 100%; padding-left: 0; border-top: 1px solid #CCC;}
#message.all .message {padding:20px 30px; width: 100%;}
#message.all .message .author {color: #0c3e79; font-size: 17px;}
#message.all .message .date {opacity: 0.5; padding: 4px; }
#message.all .message .content {font-size: 15px; line-height: 20px; width: 100%;}
#message.all .message .profile-thumb {width: 65px; height: 65px; object-fit: cover;}


#message.sidebar h4 {position: relative;}
#message.sidebar {padding: 0; border: none; width: 100%; display: block; margin: 0;}
#message.sidebar .notification {position: relative; color: #FFF !important; right: auto; top: -3px; display: inline-block;}
#message.sidebar .list {display: block; position: static; left: 0; margin: 0; padding: 0; background: transparent; border: none; box-shadow: none; width: 100%;}
#message.sidebar a.btn {font-size: 12px; border: none; white-space: nowrap;}
#message.sidebar .leave-message {padding: 0; }
#message.sidebar .list .message .delete {font-size: 10px; right: 0;}
#message.sidebar .list .message .delete:hover {background: transparent;}
#message.sidebar .list .message {background: #FFF; border: none; margin-bottom: 15px; border-radius: 10px; overflow: hidden}
#message.sidebar .list .message a {font-family: 'Rubik', sans-serif; display: inline; font-size: 12px; text-transform: none; letter-spacing: 0; font-weight: 700;}

#sub {padding: 30px 0;}
#sub {text-align: right;}
#sub a {color: #444444; padding-left: 25px; font-size: 18px;}
#sub a.highlight {color: #1a3c65;}

.login {margin-top: 40px; margin-bottom: 30px;}
.sign-up {margin-top: 60px;}

.subtitle {font-family: 'Fjalla One', sans-serif; font-size: 22px; padding: 10px 0 0; color: #002d62;}
.title {font-family: 'Lexend Exa', sans-serif; text-transform: uppercase; font-size: 38px; line-height: 50px; color: #999}

h2 {padding-top: 0; margin-top: 0; }
h5 {font-family: 'Fjalla One', sans-serif; font-size: 22px; color: #3679c8; text-transform: uppercase; padding: 0; margin: 0;}

#sidebar li {display: block; width: 100%; padding: 10px 0;}
#sidebar a {display: block; font-family: 'Fjalla One', sans-serif; font-size:19px; color: #444; font-weight: 200; padding: 5px 7px; position: relative; border-radius: 5px;  text-transform: uppercase; letter-spacing: 0.5px;}
#sidebar a i {opacity: 0.3; position: absolute; top: 18px; right: 0;}
#sidebar a:hover {background: #CCC; }
#sidebar .active a {background: #002d62; color: #FFF;}
#sidebar a.donate-link {border:2px solid #f76e3e; color: #f76e3e; display: inline-block;}

#sidebar h4 {font-size: 14px; text-transform: uppercase; color: #002d62; padding-left: 10px; font-weight: 700;}

#sidebar .quick-find {padding: 10px 0 20px;}
#sidebar .quick-find a,
#sidebar .quick-find label {display: inline-block; margin: 0; width: auto; padding: 3px 5px; margin: 0; border: 1px solid #AAA; border-radius: 5px; margin: 0 2px 10px; cursor: pointer; font-size: 11px; font-weight: 400}
#sidebar .quick-find a:hover,
#sidebar .quick-find label:hover {background: #CCC;}
#sidebar .quick-find a,
#sidebar .quick-find label {font-size: 11px; color: #666; font-weight: 400; font-family: 'Lexend Exa', sans-serif; text-transform: none; letter-spacing: 0; display: inline-block;}
#sidebar .quick-find label a:hover {background: transparent;}
#sidebar .quick-find label:hover a {color: #FFF}
/*#sidebar .quick-find label input {display: none;}*/
#sidebar .quick-find label.active {background: #AAA; color: #FFF;}


#quick-find-accordion > a {font-family: 'Rubik', sans-serif; text-transform: none; border-bottom: 1px solid #CCC; letter-spacing: 0; font-size: 15px; color: #444; border-radius: 0;}
#quick-find-accordion #quick-find {padding: 15px 0 30px;}

.breadcrumb {background: transparent; padding: 0; text-transform: uppercase; font-family: 'Fjalla One', sans-serif; color: #999; letter-spacing: 1px; line-height: 15px;}
.breadcrumb a {color: #666;}
.breadcrumb li {border-right: 2px solid #CCC; padding-right: 10px;  margin-right: 10px; height: 15px;}
.breadcrumb li:last-child {border-right: 0;}


.grid-view > span {font-size: 22px; color: #444; text-align: right; margin: 10px 0; display: block;}
.table td {vertical-align: middle; font-size: 13px; padding: 0.5rem}
.table thead th a,
.table thead th {color: #012D61; font-size: 12px; white-space: nowrap; text-transform: uppercase;}

.default-avatar {background: #CCC; line-height: 35px !important; width: 35px; text-align: center; display: block; border-radius: 100px; margin: 0 auto; display: block !important}
.default-avatar.large {width: 200px; height: 200px; line-height:200px !important; font-size: 150px; color: #efefef; object-fit: cover;}
.default-avatar.left {margin: 0;}

.image-container {max-width: 320px; margin: 0 auto; position: relative;}
.image-container .remove {position: absolute; right: 30px; top: 30px; background: red; width: 30px; border-radius: 100px; color: #FFF; height: 30px; line-height: 30px;}
.profile-pic {border-radius: 300px; max-width: 100%;  max-height: 320px;}
.profile-thumb {height: 35px; width: 35px; border-radius: 100px;}
.profile-thumb.default {background: #EEE; padding: 3px;}

.user-index .profile-thumb {width: 60px; height: 60px; object-fit: cover;}
.user-index .profile-thumb.default {filter: saturate(0); opacity: 0.4;}
.user-index .name {font-size: 20px; text-transform: uppercase; color: #333; font-weight: 500}
.user-index table a {color: #222}
.user-index table a:hover {text-decoration: underline !important; color: #3c7dca}
.user-index table .form-control {font-size: 13px;}
.user-index table label {display: none;}

.user-index .quick-search-field {padding: 22px !important}
.quick-search .btn {padding-top: 12px; padding-bottom: 12px;}

.user-view .default-avatar {margin-top: -150px;}
.user-view .default-avatar.default {padding: 20px; background: #002d62;}

.pagination {margin-top: 60px;}
.page-item.active .page-link {background: #002d62; border-color: #002d62}

.banner {max-width: calc(100% + 60px); max-height: 340px; width: calc(100% + 60px); margin-left: -30px; margin-top: -30px;  object-fit: cover;}

.jersey-number {width: 70px; height: 40px; transform: skew(-10deg); background: #EEE; text-align: center;  display: inline-block; margin-left: 15px; font-family: 'Fjalla One', sans-serif; color: #444; font-size: 25px; line-height: 40px;}
.jersey-number .inside {transform: skew(10deg);}

.position {display: inline-block; color: #444777; font-size: 20px; line-height: 40px; vertical-align: middle; font-family: 'Fjalla One', sans-serif; text-transform: uppercase;}

.user-index .jersey-number {font-size: 15px; line-height: 25px; height: 25px; width: 40px; background: #002d62; color: #FFF}

#content p {color: #444}

.industries {column-count: 5}
.industries.three-col {column-count: 3}
.industries .custom-control-label {display: block; font-size: 12px; padding-left: 0; line-height: 25px; display: inline-block;}
.industries label input {margin-right: 5px; margin-left: -20px; top: 3px; position: relative;}

.user-search .industries {font-size: 12px;}

.nowhitespace {white-space: nowrap;}
footer {font-family: 'Fjalla One', sans-serif; font-size:15px; color: #555; text-transform: uppercase; text-align: center;}

.select2-results__option {font-size: 12px;}
.select2-container--krajee-bs4 .select2-selection--multiple {min-height: 32px !important;}
.select2-container--krajee-bs4 .select2-selection--multiple .select2-selection__rendered {display: block;}
.select2-container--krajee-bs4 .select2-selection--single .select2-selection__placeholder {color: #444;}


.expand-advanced-search[aria-expanded="true"] {display: none}


.filter-header {text-transform: uppercase; color: #0c3f79; border-bottom: 1px  solid #0c3f79; margin-bottom: 10px; cursor: pointer; position: relative; font-size: 15px;}
.filter-header:after {content:"+"; position: absolute; right: 0;}
.filter-header[aria-expanded="true"]:after {content:"-"}

.collapse-fields {font-size: 12px;}
.collapse-fields select,
.collapse-fields input {font-size: 12px; padding: 5px;}


.collapse-fields .industries {column-count: 2}
.collapse-fields .industries .custom-control {height: 15px; min-height: 0; padding-left: 20px; cursor: pointer}
.collapse-fields .industries .custom-control-label {display: block; font-size: 11px; padding-left: 0; line-height: 0.8; display: inline-block; white-space: nowrap;}
.collapse-fields .industries input {margin-right: 2px; margin-left: -20px; top: -6px; position: relative; display: none;}
.collapse-fields .industries .custom-checkbox .custom-control-label::before {width: 10px; height: 10px; top: -2px; left: -15px}

.collapse-fields .can-help {font-size: 16px;}

.quick-search input {font-size: 22px; font-weight: 100; padding: 20px; height: 60px}