/*

Theme Name: Joe DiMaggio Children's Hospital (U18 Sports Medicine)

Theme URI: http://www.yourpracticeonline.net/

Description: This theme is completely compatible with WordPress 4.1.1

Author URI: http://www.yourpracticeonline.net/

Version: 4.2

*/

/* ------------------------------ Fonts CSS ------------------------------ */

@import url('fonts.css');
/* ------------------------------ Global CSS ------------------------------ */

body {
	margin: 0px;
	padding: 0px;
	overflow-y: scroll;
 *overflow-y:none;
}
img {
	border: 0px;
	max-width: 100%;
	vertical-align: middle;
}
p, h1, h2, h3, h4, h5, h6 {
	margin: 10px 0px;
	padding: 0px;
}
ul, ol {
	margin: 0px;
	padding: 0px;
}
ul {
	list-style: none;
}
a, a:hover {
	text-decoration: none;
	outline: none !important;
}
/* ------------------------------ General CSS ------------------------------ */

.hr {
	height: 10px;
}
.clear-float {
	clear: both;
}
.align-left {
	float: left;
}
.align-right {
	float: right;
	margin: 0px 0px 20px 20px;
}
.videoBorder {
	border: 4px solid #333;
	width: 90%;
	position: relative;
	margin: 10px auto;
	padding: 50% 0px 0px 0px;
}
.multiBorder {
	width: 90%;
	position: relative;
	margin: 10px auto;
	padding: 100% 0px 0px 0px;
}
.videoBorder iframe, .videoBorder embed, .multiBorder iframe, .multiBorder embed {
	top: 0px;
	position: absolute;
	width: 100.1%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	border: 0px !important;
}
/*------------------Rslides Styles-------------------------*/

.rslides {
	list-style: none outside none;
	margin: 0;
	padding: 0;
	position: relative;
	width: 100%;
}
.rslides > li {
	display: none;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
.rslides > li:first-child {
	display: block;
	float: left;
	position: relative;
}
.rslides img {
	border: 0 none;
	display: block;
	float: left;
	max-width: 100%;
}
#Interactivity {
	position: relative;
}
.intra-div {
	width: 100%;
	height: 100%;
}
.Intra-L, .Intra-R {
	position: absolute;
	z-index: 100;
	width: 2000px;
	height: 100%;
	padding: 0px;
}
.Intra-L {
	margin: 0px 0px 0px -2000px;
}
.Intra-R {
	margin: 0px 0px 0px 940px;
}
.Intra-Tabs {
	position: absolute;
	z-index: 200;
	margin: 0px;
	padding: 0px;
}
/* ------------------------------ Main CSS ------------------------------ */

#Container, section, #Content-Container, #Intra-Container, #Crediability-Container, footer, #Intra-Container-S, #Menu-Container, #Quicklinks-Container {
	width: 100%;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
	position: relative;
}
header, #Service-Container, #Service-tabs-Container, #Day-program-Container, #Program-Cancel-Container {
	width: 100%;
	margin: 0px;
	padding: 0px;
	position: relative;
}
#Header, #Main-Menu, #Mobile-Menu, #Header, #Interactivity, #Day-progran-Main, #Program-Cancel-Main, #Credibility, #Content-Main, #QuickLinks, #Footer, #Content-Main, #Service-Main {
	max-width: 940px;
	min-width: 300px;
	margin: 0px auto;
}
header .intra-div, #Content-Main .intra-div, #News-Hours .intra-div, #Cred-Social .intra-div, #QuickLinks .intra-div {
	display: table;
}
/*----------------Header Style------------------------*/

header {
	background: #00515d;
}
#Header {
	position: relative;
	height: 147px;
}
.logo {
	float: left;
	width: 42%;
	padding: 33px 0px 0px 0px;
}
.Social-Menu-Container {
	float: right;
	width: 45%;
	padding: 50px 0px 0px 0px;
}
.social-media {
	clear: both;
	width: 145px;
	font: normal 16px/32px 'questrialregular';
	float: right;
}
.social-media img {
	float: left;
	margin: 0px 10px 0px 0px;
}
.social-media a {
	color: #FFF;
}
/* -------------------- Menu Styles -------------------- */

.Menu-Container {
	width: 100%;
	float: left;
	clear: both;
	margin: 20px 0px 0px 0px;
}
#access li {
	font: normal 18px/40px 'questrialregular';
	height: 40px;
	color: #fff;
	float: left;
	position: relative;
	background: url(images/menu-devider.png) no-repeat right center;
	text-align: center;
	width: 25%;
}
#access li:hover {
	background: url(images/menu-devider-hover.png) no-repeat right center;
}
#access li:last-child {
	background: none;
}
#access li a {
	display: block;
	color: #fff;
}
#access a:hover {
	color: #ffbdbb;
}
#access ul ul {
	position: absolute;
	z-index: 99999;
	display: none;
	left: 0px;
	padding: 7px 0px 0px 0px;
}
#access ul ul li {
	font: normal 14px/35px Arial, Helvetica, sans-serif;
	height: 35px;
	color: #ffffff;
	text-align: left;
	float: none;
	text-transform: none;
	border-bottom: 1px solid #384b64;
}
#access ul ul a {
	background: #1b2335;
	border: none;
	color: #ffffff;
	padding: 0px 0px 0px 15px;
}
#access ul ul a:hover {
	background: #2a3753;
	color: #ffffff;
}
#access ul ul ul {
	left: 100%;
	top: -1px;
	padding: 0px 0px 0px 7px;
}
#access ul li:hover > ul {
	display: block;
}
.menu li a:hover, .menu > li:hover > a, .menu li.current_page_item > a, .menu li.current-menu-item > a {
	background: #1b2335 !important;
	color: #fff !important;
}
.menu > li.current-menu-ancestor > a, .menu > li.current-page-ancestor > a {
	background: #1b2335 !important;
	color: #fff !important;
}
.menu ul li a:hover, .menu ul > li:hover > a, .menu ul li.current_page_item > a, .menu ul li.current-menu-item > a {
	background: #2a3753 !important;
	color: #fff !important;
}
.menu ul > li.current-menu-ancestor > a, .menu ul > li.current-page-ancestor > a {
	background: #2a3753 !important;
	color: #fff !important;
}
/* -------------------- Header Styles -------------------- */



#Intra-Container {
	width: 100%;
	margin: 0px;
	background: #f7f8be;
	padding: 0px;
	position: relative;
}
#Interactivity {
	height: 293px;
	position: relative;
}
#Interactivity ul, #Interactivity ul li {
	width: 100%;
	height: 100%;
}
#Intra-Container #Interactivity ul, #Intra-Container #Interactivity ul li {
	width: 100%;
	height: 100%;
}
#Intra-Container #Interactivity .banner1 {
	background: url(images/banner1.jpg) no-repeat 0px 0px;
	height: 100%;
}
#Intra-Container #Interactivity .banner1 .Intra-L {
	background: url(images/banner1-l.jpg) no-repeat right 0px;
}
#Intra-Container #Interactivity .banner1 .Intra-R {
	background: url(images/banner1-r.jpg) no-repeat left 0px;
}
#Interactivity ul, #Interactivity ul li {
	width: 100%;
	height: 100%;
}
#Intra-Container #Interactivity ul, #Intra-Container #Interactivity ul li {
	width: 100%;
	height: 100%;
}
#Intra-Container #Interactivity .banner1 {
	background: url(images/banner1.jpg) no-repeat 0px 0px;
	height: 100%;
}
#Intra-Container #Interactivity .banner1 .Intra-L {
	background: url(images/banner1-l.jpg) no-repeat right 0px;
}
#Intra-Container #Interactivity .banner1 .Intra-R {
	background: url(images/banner1-r.jpg) no-repeat left 0px;
}
#Intra-Container-S {
	width: 100%;
	margin: 0px;
	background: #f7f8be;
	padding: 0px;
	position: relative;
}
#Intra-Container-S #Interactivity {
	height: 230px;
	position: relative;
}
#Intra-Container-S #Interactivity ul, #Intra-Container-S #Interactivity ul li {
	width: 100%;
	height: 100%;
}
#Intra-Container-S #Interactivity .banner1 {
	background: url(images/banner1.jpg) no-repeat -1px -30px;
	height: 100%;
}
#Intra-Container-S #Interactivity .banner1 .Intra-L {
	background: url(images/banner1-l.jpg) no-repeat right -30px
}
#Intra-Container-S #Interactivity .banner1 .Intra-R {
	background: url(images/banner1-r.jpg) no-repeat left -30px;
}
/* -------------------- Banner Styles -------------------- */



.intra-main {
	left: 18%;
	position: absolute;
	top: 35px;
	width: 45%;
	z-index: 25;
}
#Intra-Container-S .intra-main {
	left: 27%;
	position: absolute;
	top: 50px;
	width: 75%;
	z-index: 25;
}
.intra-main h2 {
	font: normal 27px/31px 'ralewaybold';
	margin: 0px;
	padding: 0px;
	color: #f23a33;
	letter-spacing: 1px;
}
.intra-main p {
	font: normal 21px/26px 'Raleway-SemiBold';
	margin: 20px 0px 0px 0px;
	padding: 0px;
	color: #444444;
}
/*--------------------Day-program-Container Styles ----------*/



#Day-program-Container {
	position: relative;
}
#Day-progran-Main {
	position: relative;
}
#Day-progran-Main h1 {
	color: red !important;
	font: 30px/32px "Raleway-SemiBold";
	text-align: center;
}
.join-us {
	width: 80%;
	float: left;
	margin: -26px 0 0 15px;
	border-radius: 20px 0px 0px 20px;
	background: #f23a33;
	padding: 20px 0px 15px 40px;
	font: normal 23px/27px 'questrialregular';
	color: #FFF
}
.join-us h3 {
	font: normal 23px/27px 'questrialregular';
	color: #FFF;
	margin: 0px;
	padding: 0px;
	width: 59%;
	float: left;
}
.join-us p {
	font: normal 19px/23px 'questrialregular';
	color: #FFF;
	margin: 5px 0px 0px 0px;
	padding: 0px;
	width: 60%;
	float: left;
}
.online-form-section {
	width: 41%;
	float: right;
	position: relative;
	margin: -345px 0px 0px 0px;
	z-index: 98;
}
.online-head {
	font: normal 24px/28px 'Raleway-SemiBold';
	text-transform: uppercase;
	color: #f23a33;
}
.online-form {
	width: 77%;
	float: left;
	padding: 25px 7% 10px 5%;
	border-radius: 15px;
	margin: 20px 0px 0px 0px;
	background: #00515d;
}
.online-form ul {
	width: 100%;
	margin: 0px;
	padding: 0px;
}
.online-form li {
	width: 100%;
	margin: 0px 0px 16px 0px;
	height: 20px;
	background: #ffffff;
	color: #000;
	font: normal 12px/16px Verdana;
	padding: 5px 0px 5px 5px;
}
.online-form li.name {
	width: 92%;
	padding: 5px 0px 5px 30px;
	background: #ffffff url(images/joe-sprite.png) no-repeat 6px 5px;
}
.online-form li.phone {
	width: 92%;
	padding: 5px 0px 5px 30px;
	background: #ffffff url(images/joe-sprite.png) no-repeat 6px -55px;
}
.online-form li.email {
	width: 92%;
	padding: 5px 0px 5px 30px;
	background: #ffffff url(images/joe-sprite.png) no-repeat 6px -112px;
}
.online-form li input, .online-form li select {
	width: 99%;
	border: none;
	outline: none;
}
.online-form li select {
	background: url(images/down-arrow.png) no-repeat 98% 7px;
	-moz-appearance: none;
	cursor: pointer;
	text-indent: 0.01px;
	color: #757575;
	text-overflow: '';
}
.online-form li:last-child {
	background: none;
}
.online-form li input.submit, .online-form li input.reset {
	width: 80px;
	background: #e6221a;
	color: #FFF;
	margin: 0px 0px 0px 30px;
	height: 30px;
	font: normal 15px/20px Verdana;
	text-transform: uppercase;
	cursor: pointer;
}
.sports-injury-section {
	width: 57%;
	margin: 25px 0px 0px 0px;
	padding: 10px 0px 0px 10px;
	float: left;
}
.sports-injury-head {
	width: 93%;
	float: left;
	color: #000;
	padding: 0 0 0 6%;
	font: normal 19px/26px 'Raleway-Medium';
}
.sports-injury-list {
	float: left;
	margin: 10px 0px 0px 0px;
	width: 100%;
	clear: both;
}
.sports-injury-image {
	float: left;
	margin: 30px 15px 0 -50px;
	position: relative;
	width: 48%;
}
.sports-injury-image img {
	float: left;
}
.sports-injury-list-section {
	float: right;
	width: 55%;
	margin: 30px 0px 0px 0px;
}
.sports-injury-list-section ul, .sports-injury-list-section li {
	margin: 0px;
	padding: 0px;
}
.sports-injury-list-section li {
	margin: 0px 0px 7px 0px;
	float: left;
	width: 100%;
	border-radius: 6px;
	background: #4f4f4f;
	font: normal 18px/22px 'questrialregular';
}
.sports-injury-list-section li:hover {
	background: #542b2b;
}
.sports-injury-list-section li a {
	color: #FFF;
	display: block;
	padding: 10px 0px 10px 30px;
	background: url(images/right-arrow.png) no-repeat 10px 13px;
}
/*--------------#Program-Cancel--------------*/

#Program-Cancel-Container {
	border-top: 1px solid #ccc;
	clear: both;
	margin: 30px 0 0;
	position: relative;
	float: left;
}
#Program-Cancel-Main {
	padding: 20px 0 55px;
	margin: 0px auto 5px auto;
}
.pgm-cancel {
	float: left;
	width: 50%;
}
.pgm-cancel-head, .disability-head {
	font: bold 14px/18px Verdana;
	float: left;
	width: 100%;
}
.pgm-cancel ul {
	margin: 30px 0px 0px 0px;
	padding: 0px;
}
.pgm-cancel li {
	margin: 0px 0px 5px 0px;
	font: normal 13px/17px Verdana;
	width: 96%;
	background: url(images/left-arrow.png) no-repeat left 6px;
	padding: 0px 0px 0px 15px;
}
.pgm-cancel li a {
	font: normal 13px/17px Verdana;
	text-decoration: underline;
	color: #000000;
}
.Disabilities-act {
	display: table-cell;
	width: 50%;
}
.Disabilities-act ul {
	margin: 30px 0px 0px 0px;
	padding: 0px;
}
.Disabilities-act li {
	margin: 0px 0px 5px 0px;
	font: normal 13px/17px Verdana;
	width: 96%;
	background: url(images/left-arrow.png) no-repeat left 6px;
	padding: 0px 0px 0px 15px;
}
/* -------------------- Footer Styles -------------------- */

footer {
	position: relative;
	background: #00515d;
}
#Footer {
	position: relative;
	padding: 20px 0px;
	height: 50px;
}
.footer-copy-menu {
	width: 70%;
	float: left;
}
.footer-copy {
	float: left;
	width: 100%;
	color: #FFF;
	font: normal 15px/19px Verdana;
}
.footer-menu {
	width: 100%;
	clear: both;
	float: left;
	margin: 12px 0px 0px;
	color: #FFF;
	font: normal 13px/17px Verdana;
}
.footer-copy-menu a {
	color: #FFF;
}
.ypo-logo {
	float: right;
	width: 100px;
	margin: 25px 0px 0px 0px;
}
.slicknav_menu a, .slicknav_menu {
	display: none;
}
.RegistrationFee {
	font: 12px/17px Verdana;
	color: #fff;
}
.RegistrationFee span {
	color: #E6221A;
}
.sun-div {
  background: #000 none repeat scroll 0 0;
  display: none;
  height: 100%;
  left: 0;
  opacity: 0.5;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 99;
}
#sun-pop {
  border-radius: 5px;
  display: none;
  left: 30%;
  margin: 0;
  overflow: hidden;
  position: fixed;
  top: 5%;
  width: 40%;
  z-index: 999999;
  background:#ffffff;
  font:normal 12px/18px Verdana, Arial, Helvetica, sans-serif;
}
.pop-title {
  background: #00515D;
  padding: 15px;
  text-align: center;
}
.pop-text {
  padding: 10px 10px 20px 10px;
  font-weight:bold;
  font-style:italic;
  color:#000;
  font:bold 12px/16px Verdana, Arial, Helvetica, sans-serif;
}
.sun-button {
  color: #e73e51;
  cursor: pointer;
  font: 700 13px/13px Arial,Helvetica,sans-serif;
  height: 20px;
  position: absolute;
  right: 2px;
  text-align: center;
  top: 5px;
  width: 20px;
  z-index: 101;
}
.sun-close {
  border-radius: 4px;
  bottom: -2px;
  color: #e73e51;
  cursor: pointer;
  font: 400 15px/15px Arial,Helvetica,sans-serif;
  height: 25px;
  position: absolute;
  right: -10px;
  text-align: center;
  width: 70px;
  z-index: 101;
}
.mandatory {
	font: bold 10px Verdana, Arial, Helvetica, sans-serif;
	color: #FF8204;
}
/* ------------------------------ Media Screen:640 CSS ------------------------------ */

@media screen and (max-width : 890px) {
.intra-main {
	left: 15%;
}
.intra-main h2 {
	font: 28px/31px "ralewaybold";
}
.intra-main p {
	font: 23px/31px "Raleway-SemiBold";
}
.online-form-section {
	width: 48%;
}
.online-head {
	font: 20px/24px "Raleway-SemiBold";
	text-align: center;
}
.online-form {
	margin: 20px 6px 0 0;
	padding: 25px 7% 10px 5%;
	float: right;
}
.sports-injury-section {
	width: 48%;
}
.pgm-cancel {
	width: 49%;
	padding: 0 0 0 5px;
}
.intra-main p {
	font: 23px/27px "Raleway-SemiBold";
	width: 85%;
	margin: 10px 0 0 0;
}
}

@media screen and (max-width : 768px) {
.join-us {
	border-radius: 20px;
	height: 75px;
	margin: 26px auto;
	width: 94%;
}
.join-us h3 {
	width: 95%;
}
.join-us p {
	width: 95%;
}
.online-form-section {
	clear: both;
	float: left;
	margin: 20px 0 0;
	width: 89%;
}
.online-form-section {
	margin: 20px 0 0;
	width: 100%;
}
.online-form {
	float: left;
	margin: 20px 6px 0 5px;
	padding: 25px 3% 10px;
	width: 93%;
}
.online-form li {
	float: left;
	margin: 0 7px 17px 0;
	width: 47%;
}
.online-form li.name, .online-form li.phone, .online-form li.email {
	width: 43.5%;
}
.online-form li select {
	font-size: 12px;
}
.sports-injury-section {
	width: 95%;
}
.sports-injury-head {
	padding: 0 0 0 2%;
	width: 93%;
}
.intra-main {
	left: 26%;
	width: 60%;
}
.sports-injury-image {
	float: left;
	margin: 50px 15px 0 0;
	position: relative;
	width: 36%;
}
}

@media screen and (max-width : 640px) {
#Header {
	height: 250px;
	position: relative;
}
.logo {
	float: none;
	padding: 33px 0 0;
	width: 300px;
	margin: 0px auto;
}
.intra-main {
	left: 45%;
	width: 60%;
}
.Social-Menu-Container {
	float: none;
	padding: 50px 0 0;
	width: 100%;
	margin: 0px auto;
}
.social-media {
	clear: both;
	float: none;
	font: 16px/32px "questrialregular";
	width: 145px;
	margin: 0px auto;
}
.online-form {
	float: none;
	margin: 20px auto;
	padding: 25px 10px 10px;
	width: 95%;
	height: 700px;
}
.online-form li select {
	font-size: 13px;
}
.online-form li {
	float: left;
	margin: 0 7px 17px 0;
	width: 99%;
}
.online-form li.name, .online-form li.phone, .online-form li.email {
	width: 95%;
}
#Day-program-Container {
	background: #fff none repeat scroll 0 0;
	position: relative;
}
.pgm-cancel {
	padding: 0 0 0 5px;
	width: 99%;
}
.Disabilities-act {
	float: left;
	width: 99%;
	padding: 0 0 0 5px;
}
.slicknav_menu a, .slicknav_menu {
	display: block;
}
}

@media screen and (max-width :480px) {
.intra-main, #Intra-Container {
	display: none;
}
.join-us {
	border-radius: 20px;
	float: none;
	height: 122px;
	margin: 15px auto 0px auto;
	padding: 20px 0 15px 10px;
	width: 96%;
}
.online-form-section {
	margin: 20px auto;
	width: 96%;
	clear: both;
	float: none;
}
.online-form li.name, .online-form li.phone, .online-form li.email {
	width: 91%;
}
.online-form li select {
	font-size: 13px;
}
.sports-injury-image {
	float: none;
	margin: 50px auto;
	position: relative;
	width: 300px;
}
.sports-injury-list-section {
	float: none;
	margin: 0px auto;
	width: 300px;
}
.footer-copy-menu {
	float: left;
	width: 100%;
}
.ypo-logo {
	float: right;
	margin: 25px 11px 10px 0;
	width: 100px;
}
}