/*Drupal 8 styling since migration*/
body,
span {
	font-family: 'Roboto', sans-serif !important;
	line-height: 1.8 !important;
	font-size: 16px !important;
}

p {
	color: #333333;
}

h1, 
h2, 
h3, 
h4, 
h5, 
h6  {
	font-weight: bold !important;
}

h1 a, 
h2 a, 
h3 a, 
h4 a, 
h5 a, 
h6 a {
	color: #337ab7;
}

h1, h2 {
	color: #57729d;
	font-size: 30px;
}

h4 {	
	color: #57729d;
	font-size: 22px;
}

h6 {
	font-size: 18px !important;
}

label {
	font-weight: bold;
}

header[role=banner] {
	background: url("../images/header-bg.jpg") no-repeat center center;
	background-size: cover;
	padding: 40px 0px;
}

video {
  width: 100%;
  height: auto;
}

div[aria-label="Status message"] {
    color: #325e1c;
    border-color: #c9e1bd #c9e1bd #c9e1bd transparent;
    background-color: #f3faef;
	padding: 15px;
	margin-bottom: 15px;
}

div[role=alert] {
	color: #734c00;
    border-color: #f4daa6 #f4daa6 #f4daa6 transparent;
    background-color: #fdf8ed;
	padding: 15px;
	margin-bottom: 15px;
}

/*Tabs are the edit/delete menus of node content menu*/
#block-tabs ul {
	margin-bottom: 15px;
	padding: 0px;
}

#block-tabs ul li {
	display: inline-flex;
	list-style-type: none;
	margin-bottom: 15px;
	border: 1px solid lightgray;
	padding: 0px 15px;
	border-right: none;
}

#block-tabs ul li:last-child {
	border: 1px solid lightgray;
}

/*Admin styling for manager roles*/
.pager ul {
	display: inline-flex;
	list-style-type: none;
}

.pager ul li{
	margin-right: 15px;
}

.more-link {
    background-color: #27b34b;
    color: white;
    border-radius: 3px; 
    margin-bottom: 15px !important;
    width: 161px;
    text-align: center;
}

.more-link:hover {
	background-color: #20923d;
	color: white;
	text-decoration: none;
}

.btn-success {
	background-color: #27b34b !important;
}

.btn-primary {
	background-color: #1072ba !important;
}

.blue-text {
	color: #57729d;;
}

.green-text {
	color: #27b34b;
}

.h2 {
	font-size: 26px;
	font-weight: bold;
}

.front-image {
	width: 110px;
	height: auto;
}

.blue-top-bar {
	border-top: 10px solid #c1cee1;
}

.front-border {
	border-right: 1px solid lightgray;
	border-left: 1px solid lightgray;
	border-bottom: 1px solid lightgray;
}

.main-menu {
	text-align: center;
	padding: 15px 0px;
}

.main-menu ul li{
	display: inline;	
	margin-right: 20px;
}

.main-menu ul li a {
	color: white;
	font-size: 20px;
	padding-bottom: 10px;
}

.main-menu ul li a:hover {
	text-decoration-color: #27b34b;
}

#block-mainmenu-3 ul li a {
	color: white!important;
}

.block-title {
	text-transform: uppercase;	
}

/*Forms*/
#user-register-form input[type="submit"]{
	background-color: #27b34b;
	border: none;
	margin-top: 15px;
	padding: 0px 15px;
	color: white;
	border-radius: 5px;
}

textarea,
input[type="text"],
input[type="email"],
input[type="password"],
select  {
	width: 100%;
}

input,
#user-register-form select {
	display: block;
}

input {
	margin-bottom: 15px;
}

input[type="checkbox"],
input[type="radio"] {
	display: inline-block;
	margin-left: 5px;
}

details {
	border: 1px solid lightgray;
	border-radius: 5px;
}

summary[role="button"],
.create-account-instructions {
	background-color: #f5f5f5;
    border-color: #ddd;
    padding: 10px;
}

#user-register-form label {
	margin: 0px;
}

/*For block elements on the resources pages.*/
#edit-tid--wrapper .js-form-item {
	white-space: nowrap;
}

/*Registration form*/
.description {
	font-size: 14px;
	color: #777777;
}
/*login navigation*/
.login-menu {
	background-color: #27b34b;
	padding: 10px;
	color: white !important;
	width: 200px;
	float: left;
	margin-right: 15px;
	border-radius: 5px;
	text-align: center;
	text-decoration: none;
}

.bg-green {
	background-color: #27b34b;
}

.bg-green:hover {
	background-color: #20923d;
	text-decoration: none;
}

.login-logout {
	border: 1px solid #27b34b;
	background-color: transparent;
}

/* About */
.about-h2 {
	border: 1px solid #c1cee1;
	background-color: #fafafa;
	box-shadow: 0 1px 6px #c1cee1;
	font-weight: bold;
	padding: 10px;
}

.about-bg-gray-1 {
	background-color: #efefef;
}

.about-bg-gray-2 {
	background-color: #f3f3f3;
}

.video-container {
	width: 50%;
	margin: 0 auto;
	padding-top: 40px;
}

.negative-m {
	margin-top: -15px;
}
/*courses page*/
.border-r-5 {
	border-radius: 5px;
}

.courses-icon {
	width: 50px;
	margin-right: 10px;
}

.course-computer {
	border: 1px solid #7ca5d1;
}

.course-finger {
	border: 1px solid #808080;
}

.course-guy {
	border: 1px solid #EC9A37;
}

.course-cert {
	border: 1px solid #27B67B;
}

.equal-container {
  display: flex;
  width: 100%;
}

.equal {
  flex: 1;
  padding: 16px;
}

.line-height-1 {
	line-height: 1;
}

.course-thumbnails img,
.course-right-region img,
.media__image {
	width: 100%;
	height: auto;
}

.img-thumbnail-custom img {
	padding: .25rem;
	background-color: #fff;
	border: 1px solid #dee2e6;
	border-radius: .25rem;
	max-width: 100%;
	height: auto;
}

.img-thumbnail-custom img:hover {
	transform: scale(1.01);
	transition: all 0.5s ease;
	overflow: hidden;
}

.rotate:hover {
	transform: rotateZ(360deg);
	transition: 1s ease;
}

.course-left-region,
.course-middle-region {
	padding: 0px 15px;
}

#superfish-course-catalog {
	float: none;
	height: 40px;
}

#superfish-course-catalog li {
	width: 100%;
}

.at-a-glance {
	background-color: #f5f5f5;
	padding: 15px;
	border: 1px solid lightgray;
	border-radius: 5px;
	margin-bottom: 15px;
}

.course-btn,
.course-btn a,
.course-btn a:hover {
	color: white;
	font-weight: bold;
	text-decoration: none;
	width: 100% !important;
	margin-bottom: 15px;
}

.label-success {
	background-color: #5cb85c;
	color: white;
	padding: 5px;
	border-radius: 3px;
	font-weight: bold;
}

.pdf {
	background-image: url("/themes/custom/mostcenter/images/pdf-icon.png") no-repeat center center;
}

.courses-title {
	border-bottom: 1px solid lightgray;
	margin-bottom: 15px;
}

.courses-title span {
	font-size: 26px !important;
	font-weight: bold;
	text-transform: uppercase;
	line-height: normal !important;
}

#edit-field-tags-target-id {
	margin-bottom: 15px;
}

.form-checkboxes {
	clear: both;
}

.remove-link h2 a {
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	color: black;
	font-size: 18px;
}

.file a {
	word-wrap: break-word;
}

.slick__arrow button {
	background-color: white;
	border: 1px solid lightgray;
}

/*This removes the carrot icon from the details element*/
details summary::-webkit-details-marker {
  display:none;
}

/*case stories pages/* */
.before-photo-image {
	width: 50%;
	float: left;
	margin-right: 15px;
}

.map-image-before img {
	width: 48%;
	float: left;
	margin-right: 10px;
	height: auto;
}

.map-image-after img {
	width: 48%;
	float: left;
	height: auto;
}

.after-photo-image img {
	width: 50%;
	float: left;
}

.bg-off-white {
    background-color: #f8f8f8;
    padding: 15px;
}

.case-story-image-gallery img {
	width: 47%;
	height: auto;
	float: left;
	margin: 5px;
}

/*Bold the first div of the bold-label in the case stories page.*/
.bold-label > div:nth-of-type(1),
.key-project-facts > div:nth-of-type(2),
.key-project-facts legend span {
	font-weight: bold;
	font-size: 18px !important;
}

.key-project-facts legend {
	position: relative;
    top: 20px;
}

/*videos page*/
.col-equal {
	width: 47%;
	height: auto;
	margin: 5px;
}

.black,
.black a {
	color: black;
}

.bg-purple {
	background-color: #33333f;
}

.bg-purple p{
	background-color: #33333f;
	padding: 10px;
	color: white;
}

.author-photo img {
	width: 50%;
	height: auto;
	float:left;
	margin-right:10px; 
}

.author-name {
	font-size: 22px;
    font-weight: bold;
    color: #27b34b;
}

.youtube-container iframe {
	width: 100%;
	height: 410px;
}

.hr {
	border-bottom: 1px solid lightgray;
	margin-bottom: 35px;
}

.clearfix {
	clear: both;
}

.video-additional-information {
	margin-bottom: 15px;
    border-radius: 5px;
    padding: 15px;
    background-color: rgba(124, 165, 209, 0.2);
}

/*resources page*/
.lightgray-bg {
	border-radius: 15px;
	padding: 7px;
	background-color: #E7ECF3;
}

.resource-icons {
	display: block;
	height: 70px;
	margin: 0 auto;
}

.resources-left {
	width: 35%;
	padding: 0px 15px;
}

.resources-right {
	width: 65%;
	padding: 0px 15px;
}

.resources-content {
	float: right;
	width: 70%;
}

.resources-block {
	float: left;
	width: 25%;
}

#views-exposed-form-resources-block-1 .js-form-item label {
	font-weight: bold;
}

/* Styling applied to Drupal 8. 2/27/20 */

#edit-tid--wrapper .js-form-item {
	display: flex;
	white-space: normal;
  }
  
  .js-form-type-radio input {
	position: relative;
	top: 8px;
  }
  
  .js-form-type-radio label {
	white-space: normal;
	margin-left: 10px;
  }
  
  /* end 2/27/20 updates */

/*features page*/
.featured-video {
	width: 30%;
    float: left;
	margin-top: 15px;
	padding: 0px;
}

.featured-video img {
	width: 100%;
	height: auto;
}

.featured-body {
    width: 60%;
    float: left;
    margin-top: 8px;
    padding: 0px 15px;
    margin-bottom: 30px;
}

.featured-sidebar {
	width: 20%;
	float: left;
}

.hide-body {
	display: none;
}

/*Contact Us Page*/
#webform-submission-contact-us-node-69-add-form {
	padding: 15px;
	border: 1px solid lightgray;
	border-radius: 5px;
}

#webform-submission-contact-us-node-69-add-form input,
#webform-submission-contact-us-node-69-add-form textarea {
	width: 100%;
}

#webform-submission-contact-us-node-69-add-form select,
#webform-submission-contact-us-node-69-add-form textarea {
	display: block;
	margin-bottom: 15px;
}

#webform-submission-contact-us-node-69-add-form input[type="submit"] {
	display: block;
	width: auto;
	margin-top: 15px;
}

#webform-submission-contact-us-node-69-add-form label,
.key-project-facts > div:first-child {
	font-weight: bold;
}

.submit-case-story,
.submit-case-story a,
.submit-case-story a:hover {
	background-color: #ec9c37;
	padding: 5px 0px;
	font-weight: bold;
	color: #fff;
	border-radius: 5px;
	width: 187px;
	margin: 20px 0px;
	text-decoration: none;
	text-align: center;
}

input[data-drupal-selector="edit-reset"] {
	border: 1px solid lightgray;
	padding: 10px;
	margin: 20px 0px;
	border-radius: 5px;
	background-color: white;
}

thead,
thead a {
	cursor: pointer;
    color: #fff;
    background-color: #678fc3;
    font-size: 16px;
    margin-top: 20px;
}

td a {
	color: #678fc3;
}

/*Login form*/ 
#edit-name--description {
	margin-bottom: 15px;
}

#user-login-form label {
	margin: 0px;
}

#user-login-form #edit-submit {
	font-weight: 400;
	color: #007bff;
	text-decoration: none;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	background-color: transparent;
	border: 1px solid #dee2e6 !important;
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: .25rem;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	float: left;
	margin-right: 15px;
}

/*footer*/
.umd-logo-footer {
	width: 108px; 
	padding: 0px 15px;
}

.footer-bg-color {
	background-color: #e6e8e7;
}

.social {
	display: flex;
	justify-content: flex-end;
}

.copyright {
	padding: 0px;
}

/* Appears on case story page */
.gm-legend {
    z-index: 100;
    position: absolute;
    bottom: 20px;
    right: 10px;
    background-color: white;
    padding: 10px;
}

/* this style exists currently in style.css. mobile hamburger menu on main navigation */
/* main menu / hamburger menu / responsive menu */
.hamburger-menu-gmap-button {
    display: none;
    width: 100%;
    height: 35px;
    background-image: url('/sites/default/themes/custom/mostcenter/images/ham-menu.png');
    background-repeat: no-repeat;
}

/* This is for the "apply" button on resources pages since the autosubmit feature is failing. */
input[data-drupal-selector='edit-submit-resources'] {
    background-color: #27b34b;
    border: none;
    color: white;
    padding: 5px 20px;
    border-radius: 5px;
}

/* fix the labels on resources pages where the label text extends past containing div. */
#edit-tid--wrapper .js-form-item,
#views-exposed-form-case-stories-map-testing-page-1 .js-form-item {
    display: flex;
    white-space: normal;
}

.js-form-type-radio input {
    position: relative;
    top: 8px;
}

.js-form-type-radio label {
    white-space: normal;
    margin-left: 10px;
}

/* break the words in the table so that it is more responsive on case stories table */
.table td a {
	word-break: break-all;
}

/* case story type filter button */
.case-stories-submit input[type='submit'] {
	background-color: #20923d;
    text-decoration: none;
    color: white;
    border: none;
    padding: 5px 14px;
    border-radius: 5px;
	margin-top: 5px;
	margin-bottom: 20px;
}

.search-by-keyword {
	margin-bottom: 25px;
}

.search-by-keyword form {
	display: flex;
	margin-bottom: 15px;
}

.search-by-keyword input[type="submit"] {
	color: #fff;
    background-color: #337ab7;
    border: 2px solid #2e6da4;
    margin: 4px;
    position: relative;
    top: 36px;
    left: -5px;
    border-radius: 0px 5px 5px 0px;
    padding: 1px 10px;
}

#views-exposed-form-case-stories-map-testing-case-story-search-feature input[type="submit"] {
    background-color: #20923d;
    text-decoration: none;
    color: white;
    border: none;
    padding: 5px 14px;
    border-radius: 5px;
    margin-top: 5px;
    margin-bottom: 20px;
}

/* case stories filters for all browsers */
#views-exposed-form-case-stories-map-testing-page-1,
#views-exposed-form-case-stories-page-1 {
	width: 100%
}

#views-exposed-form-case-stories-page-1 details,
#views-exposed-form-case-stories-map-testing-page-1 details {
	float: left;
	width: 16.666%;
}

#views-exposed-form-case-stories-page-1 details summary,
#views-exposed-form-case-stories-map-testing-page-1 summary {
	background-color: #678fc3;
	color: white;
	padding: 10px;
}

#views-exposed-form-case-stories-page-1 details label,
#views-exposed-form-case-stories-map-testing-page-1 details label {
	font-size: 12px;
	font-weight: normal;
	position: relative;
    top: -4px;
    left: 5px;
}

#views-exposed-form-case-stories-page-1 details .form-checkboxes,
#views-exposed-form-case-stories-map-testing-page-1 .form-checkboxes {
	margin-top: 5px;
	padding: 10px;
}

.submit-case-story,
#views-exposed-form-case-stories-page-1 .form-actions input,
#views-exposed-form-case-stories-map-testing-page-1 .form-actions input {
	clear: both;
}

#edit-submit-case-stories {
	color: #fff;
    background-color: #337ab7;
    border: 2px solid #2e6da4;
    border-radius: 5px;
    padding: 1px 10px;
}

#views-exposed-form-case-stories-page-1 input[type="submit"],
#views-exposed-form-case-stories-map-testing-page-1 input[type="submit"] {
	background-color: #20923d;
	text-decoration: none;
	color: white;
	border: none;
	padding: 5px 14px;
	border-radius: 5px;
	margin-top: 0px;
	margin-bottom: 20px;
	position: relative;
	top: 10px;
}

#views-exposed-form-case-stories-page-1 input[data-drupal-selector="edit-reset"],
#views-exposed-form-case-stories-map-testing-page-1 input[data-drupal-selector="edit-reset"] {
	background-color: white;
    border: 1px solid #333;
    color: #333;
}


/* user profile styling */
@media screen and (max-width: 960px) {
	/*/courses page layout override the 3 column layout*/
	.ds-3col > .group-left,
	.ds-3col > .group-middle,
	.ds-3col > .group-right {
		width: 100%;
		margin-bottom: 15px;
	}
	.course-right-region {
		display: flex;
	}
	.course-right-region .img-thumbnail-custom {
		margin-right: 15px;
	}
	.courses-icon {
		width: 16px;
	}
	.featured-body {
		width: 49%;
	}
}

@media screen and (max-width: 870px) {
	.main-menu {
		text-align: left;
		padding: 15px 0px;
	}

	.main-menu ul li{
		display: block;	
		margin-right: 20px;
	}
	#views-exposed-form-case-stories-page-1 details,
	#views-exposed-form-case-stories-map-testing-page-1 details {
	width: 50%;
	}
}


@media screen and (max-width: 990px) {
	#views-exposed-form-case-stories-page-1 details,
	#views-exposed-form-case-stories-map-testing-page-1 details {
	width: 50%;
	}
}

@media screen and (max-width: 768px) {
	.video-container {
		width: 100%;
	}
	/*/courses page layout override the 3 column layout*/
	.ds-3col > .group-left,
	.ds-3col > .group-middle,
	.ds-3col > .group-right,
	.resources-left,
	.resources-right,
	.resources-block,
	.resources-content {
		width: 100%;
		margin-bottom: 15px;
	}
	.course-right-region {
		display: flex;
	}
	.course-right-region .img-thumbnail-custom {
		margin-right: 15px;
	}
	.courses-icon {
		width: 40px;
	}
	#views-exposed-form-case-stories-page-1 .form-item {
		width: 100%;
	}
	.main-menu {
		text-align: left;
		padding: 15px 0px;
	}

	.main-menu ul li{
		display: block;	
		margin-right: 20px;
	}
	#views-exposed-form-case-stories-map-testing-page-1 {
        display: block;
	}
	#views-exposed-form-case-stories-map-testing-page-1 details {
		width: 100%;
		margin-bottom: 5px;
	}
	.featured-video {
		width: 100%;
		float: left;
		margin-top: 15px;
	}
	
	.featured-body {
		width: 100%;
		float: left;
		margin-top: 8px;
		padding: 0px;
		margin-bottom: 30px;
	}
}

@media screen and (max-width: 468px) {
	.col-equal {
		width: 100%;
	}
	#views-exposed-form-case-stories-page-1 .form-item {
		width: 100%;
	}
	.main-menu {
		text-align: left;
		padding: 15px 0px;
	}

	.main-menu ul li{
		display: block;	
		margin-right: 20px;
	}
	#views-exposed-form-case-stories-map-testing-page-1 {
        display: block;
	}
	#views-exposed-form-case-stories-map-testing-page-1 details {
		width: 100%;
		margin-bottom: 5px;
	}
	.featured-video {
		width: 100%;
		float: left;
		margin-top: 15px;
	}
	
	.featured-body {
		width: 100%;
		float: left;
		margin-top: 8px;
		padding: 0px 15px;
		margin-bottom: 30px;
	}
}