#page-availability {margin: 120px 0 0 0; background: #f7f7f7; color: #000;}
#page-availability h1 {font-size: 2.875em; font-weight: 300; margin: 0 0 40px 0;}
#page-availability h2 {font-size: 1.875em; font-weight: 300; margin: 0 0 40px 0;}
#page-availability h1:last-child, #page-availability h2:last-child {margin: 0;}
#page-availability .button-a {display: inline-block; vertical-align: middle; background: #f5af27; line-height: 54px; text-align: center;
	font-weight: bold; text-transform: uppercase; color: #000; font-size: 0.875rem; border: 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;
	-webkit-appearance: none;
}
#page-availability .button-a:hover {color: #fff;}
#page-availability .button-a:disabled {opacity: 0.5; pointer-events: none;}
#page-availability .full-width {width: 100%;}
#page-availability *::-webkit-input-placeholder {color: #000;}
#page-availability *::-moz-placeholder {color: #000;}
#page-availability *:-ms-input-placeholder {color: #000;}
#page-availability *:-moz-placeholder {color: #000;}

#page-availability .login-form {display: inline-block; vertical-align: middle; background: #fff; width: 520px; padding: 50px 70px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-box-shadow: 0 2px 15px 0 rgba(229, 229, 229, 0.5);
	box-shadow: 0 2px 15px 0 rgba(229, 229, 229, 0.5);
}
#page-availability .login-form .field {margin: 0 0 15px 0;}
#page-availability .login-form .field.submit {margin: 40px 0 0 0;}
#page-availability .login-form .input {width: 100%; height: 54px; border-bottom: solid 3px #f5af27; text-align: center; color: #000; font-size: 1.375em; font-weight: 300;
	-webkit-border-radius: 0; border-radius: 0; -webkit-appearance: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;		
}
#page-availability .login-form .input:focus {border-color: #000;}
#page-availability .login-form .error {color: red;}

#page-availability h1.before-search-content {margin: 0 0 50px 0;}
#page-availability .search-content {background: #e9e9e9;}
#page-availability .search-content-wrap {display: inline-block; vertical-align: middle; width: 940px;}

#page-availability .speaker-form {background: #fff; padding: 0 50px; height: 106px; transform: translateY(-103px);
	-webkit-box-shadow: 0 2px 15px 0 rgba(229, 229, 229, 0.5);
	box-shadow: 0 2px 15px 0 rgba(229, 229, 229, 0.5);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;		
}
#page-availability .speaker-form .field {text-align: left;}
#page-availability .speaker-form .speaker {width: calc(100% - 230px - 130px); padding: 0 30px 0 0;}
#page-availability .speaker-form .date {width: 230px; padding: 0 30px 0 0;}
#page-availability .speaker-form .action {width: 130px;}
#page-availability .speaker-form .input {width: 100%; height: 54px; border-bottom: solid 3px #f5af27; color: #000; font-size: 1.375em; font-weight: 300; cursor: pointer;
	-webkit-border-radius: 0; border-radius: 0; -webkit-appearance: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;		
}
#page-availability .speaker-form .input:focus {border-color: #000;}
#page-availability [name="dateSearch"] {background: #fff url(../images/icon-calendar.svg) no-repeat 0 center; padding: 0 0 0 36px;}

#page-availability .result-message > div {display: inline-block; vertical-align: middle; font-size: 1.125rem; position: relative; line-height: 21px; text-align: left; padding: 0 30px;}
#page-availability .result-message > div:before {content: " "; display: block; background: #000; width: 21px; height: 21px; position: absolute; left: 0; top: 1px;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
#page-availability .result-message .success:before {background: #11bc4d url(../images/icon-check.svg) no-repeat center center;}
#page-availability .result-message .error:before {background: #ee350e url(../images/icon-x.svg) no-repeat center center;}
#page-availability .result-message > div p {line-height: 130%;}
#page-availability .result-message-below > div {display: inline-block; vertical-align: middle; width: 480px; margin: 20px 0 0 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#page-availability .result-message-below p {font-size: 0.813rem; color: #797979; line-height: 130%;}
#page-availability .result-speaker {padding: 25px 35px; background: #fff; margin: 40px 0 0 0; text-align: left;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
#page-availability .result-speaker .action {width: 160px;}
#page-availability .result-speaker .meta {display: block; width: calc(100% - 160px - 20px); font-size: 0; color: #000;}
#page-availability .result-speaker .meta .image {display: inline-block; vertical-align: top; width: 106px; height: 106px; background: no-repeat center top / cover;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
#page-availability .result-speaker .meta .align {display: inline-block; vertical-align: top; width: calc(100% - 106px); line-height: 106px; padding: 0 0 0 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#page-availability .result-speaker .meta .name {display: block; font-size: 2rem; font-weight: 300;}
#page-availability .result-speaker .meta .tagline {display: block; font-size: 0.875rem; color: #4a4a4a; line-height: 125%; margin: 6px 0 0 0;}

#page-availability .related-speakers {flex-wrap: wrap; justify-content: center; width: calc(100% + 30px); margin: 0 0 0 -15px;}
#page-availability .related-speaker {background: #fff; width: calc(33.33333% - 30px); padding: 30px 40px; margin: 50px 15px 0 15px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
#page-availability .related-speaker .meta {display: block; color: #000;}
#page-availability .related-speaker .image {display: inline-block; vertical-align: middle; background: no-repeat center top / cover; width: 106px; height: 106px;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
#page-availability .related-speaker .name {display: block; font-weight: bold; text-transform: uppercase; font-size: 0.75em; line-height: 125%; margin: 15px 0 0 0;}
#page-availability .related-speaker .tagline {display: block; font-size: 0.813em; color: #4a4a4a; line-height: 130%; margin: 10px 0 0 0; min-height: 64px; overflow: hidden;}
#page-availability .related-speaker .more {display: block; line-height: 44px; border: solid 2px #f5af27; text-align: center; margin: 15px 0 0 0;
	font-weight: bold; text-transform: uppercase; color: #000; font-size: 0.875rem;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;
	-webkit-appearance: none;
}
#page-availability .related-speaker a:hover .more {border-color: #000;}
#page-availability .related-speaker .button-a {line-height: 48px; margin: 15px 0 0 0;}

#page-availability #speaker-result {margin: -100px 0 0 0;}
#page-availability #loading {margin: 50px 0 0 0;}

@media screen and (max-width : 990px) {
	#page-availability {margin: 0;}
	
	#page-availability .search-content-wrap {width: 100%;}
	
	#page-availability .related-speaker {padding: 30px 35px;}
}

@media screen and (max-width : 767px) {
	#page-availability .speaker-form {display: block; height: auto; padding: 25px 35px;}
	#page-availability .speaker-form .field {width: 100% !important; padding: 0 !important;}
	#page-availability .speaker-form .field + .field {margin: 25px 0 0 0;}
	
	#page-availability .result-speaker .flex-row {display: block;}
	#page-availability .result-speaker .meta {width: 100%;}
	#page-availability .result-speaker .action {width: 100%; margin: 25px 0 0 0;}
	
	#page-availability .related-speaker {padding: 20px;}
}

@media screen and (max-width : 640px) {
	#page-availability .related-speakers {width: 100%; margin: 0;}
	#page-availability .related-speakers {display: block;}
	#page-availability .related-speaker {width: 100%; margin-left: 0; margin-right: 0;}
	#page-availability .related-speaker + .related-speaker {margin: 40px 0 0 0;}
	#page-availability .related-speaker .tagline {min-height: 10px; overflow: visible;}
}

@media screen and (max-width : 600px) {
	#page-availability h1 {font-size: 1.75em;}
	
	#page-availability .login-form {padding: 50px; width: 100%;}
}

@media screen and (max-width : 540px) {
	#page-availability .result-message-below > div {width: 100%; padding: 0 30px; text-align: left;}
}

@media screen and (max-width : 480px) {
	#page-availability .login-form {padding: 50px 20px; width: 100%;}
}

@media screen and (max-width : 374px) {
	#page-availability .result-speaker .meta .align {width: 100%; padding: 20px 0 0 0;}
}