/* * Layout St Georges Hospital */ /***Setup***/ html,body {width:100%; height:100%; margin:0px; padding:0px; overflow-x:hidden;} body {background-color:#fff; font-size:100%; font-weight:normal; font-family:Verdana, Helvetica, sans-serif; color:#14204B; height:auto;} div {display:block; position:relative; /* Setting all divs to relative */ z-index:2; /* Reserve z-index 1 in case you want to position elements below */} .clearfix:after {content:"."; visibility:hidden; display:block; height:0;} .clearChild:after {content:" "; visibility:hidden; display:block; height:0; clear:both;} ::selection {background:#14204B; color:#ffffff;} ::-moz-selection {background:#14204B; color:#ffffff;} *:focus {outline:0;} input {position: relative; z-index: 100000;} #EditableDateField264 { float: left; } #EditableDateField265 { float: right; } #EditableDateField264, #EditableDateField265 { width: 40%; } img {border:none; height:auto;} .error { color: red !important; float: right; } /* STRUCTURE */ .outer {width:100%;} .inner {width:100%; width:-webkit-calc(100% - 90px); width:calc(100% - 90px); max-width:1280px; margin:0px auto; position:relative;} @media all and (max-width:800px){ .inner {width:96%;} } /* HEADER */ #header {z-index:999; height:auto; padding:46px 0px 30px 0px; background-color:#fff; position: relative; } #logo {float:left; padding:0px; clear:both;} #logo img {width:90%; height:auto; display:block; padding:0px; margin:0px;} .search-social {position: absolute; right: 150px; top: 40px; float:right; overflow:hidden; height:36px; margin:0px; /*width:40%; */ text-align:right;} .search-social form {display:inline-block; width:auto; max-width:100%; vertical-align:top;} .search-social #Search {width:245px; float:left;} .search-social input[type=text] {width:229px; padding:9px 8px; border:0px; background-color:#F6F6F3; font-family:Georgia, Arial, Helvetica, sans-serif; font-size:14px; font-size:0.875em; font-style:italic; color:#999A80; border-top-right-radius:0px; border-bottom-right-radius:0px;} .search-social input[type=submit] {overflow:hidden; float:left; width:35px; height:35px; margin:0px; padding:0px; border-radius:0px; border:none; background:url(../images/search-btn.png) left top #F6F6F3; text-indent:-999px; border-top-right-radius:7px; border-bottom-right-radius:7px;} .search-social input[type=submit]:hover {background:url(../images/search-btn.png) left bottom #F6F6F3;} .search-social .fb {display:inline-block; width:35px; height:35px; margin:0px; padding:0px; background:url(../images/fb-icon.png) center top no-repeat #F6F6F3; border-radius:7px;} .search-social .fb:hover {background-position:center bottom;} @media all and (max-width:1100px){ #logo {clear:none;} .search-social {} } @media all and (max-width:750px){ #header {padding:30px 0px 30px 0px;} .search-social {float:right; overflow:visible; width:35px; height:35px; position:relative;} .search-social fieldset {position:absolute; right:0px; top:0px; width:35px; height:35px; overflow:hidden;} .search-social:hover fieldset {width:280px;} .search-social #Search {width:0px; overflow:hidden; position:absolute; left:0px; top:0px;} .search-social:hover #Search {width:245px;} .search-social input[type="text"] {width:180px;} #SearchForm_SearchForm_action_results {position:absolute; right:0px; top:0px; z-index:20;} .search-social .fb {display:none;} #logo {float:left; width:240px; margin:0px;} } #nav > li.mobile-only {display:none;} #nav {margin:0px; padding:60px 150px 0px 50px; text-align:right; float:right;} #nav > li {display:inline; margin:0px 0px 0px 15px; text-transform:uppercase; position:relative; list-style:none; padding:0px;} #nav > li > a {padding:0px 0px 2px 0px; font-size:13px; color:#999A80; text-decoration:none;} #nav > li:hover > a, #nav > li.current > a, #nav > li.section > a {border-bottom:1px #14204B dotted; color:#14204B;} .subNav {text-align:center; display:none; width:170px; padding:10px 0px 0px 0px; margin:0px 0px 0px 50%; position:absolute; left:-85px; top:100%; background:url(../images/dropMenuBG.png) left top no-repeat;} #nav > li:hover .subNav {display:block;} .subNav > li {list-style:none; border-left:1px solid #e9ebe5; border-right:1px solid #e9ebe5; width:162px; padding:0px 3px; margin:0px; background:#fff;} .subNav > li > a {text-align:left; display:block; padding:8px 17px 8px 10px; margin:0px; text-transform:uppercase; text-decoration:none; background:#fff; color:#515a78; /*color:#999a80; */ font-size:10px; line-height:13px; font-family:Verdana, sans-serif; background-position: 0 center; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .subNav > li:hover > a, .subNav > li.current > a, .subNav > li.section > a {background:url(../images/dropMenuIcon.png) 144px center #f9f9f7 no-repeat; color:#515a78;} .subNav > li.last {border-bottom:1px solid #e9ebe5;} @media all and (max-width:1250px){ #nav > li > a {font-size:12px;} } @media all and (max-width:1100px){ #nav {margin:0px; padding:25px 0px 0px 0px; width:100%;} } @media all and (max-width:750px){ #nav {float:right; width:30px; margin:20px 0px 0px 0px; overflow:hidden; padding:0px; clear:right;} #nav > li {display:none; float:none; padding:0px; background:none; margin:0px; text-align:left;} #nav > li.mobile-only {display:block;} #nav > li.mobile-only a {display:block; width:30px; height:30px; background:url(../images/menuButton.png) left top no-repeat;} } #infoButtonsWrap {position:absolute; right:0px; top:226px; z-index:200;} .bannerIcons {float:right; clear:both; padding:0px; margin:0px 0px 6px 0px; position:relative; text-decoration:none;} .bannerIcon {background-color:#e9ebe5; position:relative; z-index:3; background-position:top center; border-top-left-radius:7px; border-bottom-left-radius:7px; padding:0px; margin:0px; float:right; width:36px; height:36px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .bannerIconText {position:absolute; z-index:2; white-space:nowrap; background:#131f4c; color:#FFF; padding:11px 14px 10px 12px; font-family:Georgia, Arial, Helvetica, sans-serif; font-size:14px; line-height:15px; font-style:italic; border-top-left-radius:7px; border-bottom-left-radius:7px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .bannerIcons:hover .bannerIcon {background-position:bottom center; background-color:#131f4c; border-radius:0px;} .bannerIcons:hover .bannerIconText {right:36px !important;} .InfoPageIcon .bannerIcon {background-image:url(../images/icons/banner-info.png);} .MapPageIcon .bannerIcon {background-image:url(../images/icons/banner-map.png);} .NewsPageIcon .bannerIcon {background-image:url(../images/icons/banner-news.png);} .ContactPageIcon .bannerIcon {background-image:url(../images/icons/banner-mail.png);} @media all and (max-width:800px){ #infoButtonsWrap {display:none;} } /* GENERAL PAGE */ #generalTopBanner {width:100%; height:192px; padding:0px; margin:40px 0px 25px 0px; position:relative; overflow:hidden;} #generalTopBanner img {display:block; position:absolute; top:0px; left:0px; right:0px; min-width:1900px; min-height:192px;} #generalTopBanner span {position:absolute; width:490px; height:165px; bottom:0px; right:0px; background:url(../images/general-TopBannerLines.png) no-repeat;} #generalContentWrap {padding:0px; margin:25px auto 0px; position:relative; z-index:99;} #mainLeft {float:left; width:77.6%; padding:0px; margin:0px;} #breadcrumbs {width:100%; padding:0px 0px 22px 0px; margin:0px; font-size:13px; line-height:14px; color:#999A80; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} #breadcrumbs a {color:#14204B; text-decoration:none;} #breadcrumbs a:hover {text-decoration:underline;} .splitColContent {padding:10px 0px 0px 0px; /*-moz-column-count:2; -webkit-column-count:2; column-count:2; -moz-column-gap:20px; -webkit-column-gap:20px; column-gap:20px; */} .splitColContent.clearChild ul ul {margin-bottom: 0;} .videoBox {float:right; padding:0px 0px 30px 30px; width:410px; height:231px;} #accordion {margin:50px 0px 0px 0px; padding:0px; position:relative; border-bottom:1px dotted #14204B;} #accordion .accordion-section {padding:0px; margin:0px; position:relative; overflow:hidden;} #accordion .accordion-section h3 {border-top:1px dotted #14204B; border-bottom:none; padding:20px 25px 20px 25px; margin:0px; display:block; position:relative; background:#fff; cursor:pointer; transition:all 0.3 ease;} #accordion .accordion-section-open h3 {background:#e0e1e4;} #accordion .accordion-arrow {width:39px; height:39px; position:absolute; right:25px; top:50%; margin-top:-19px; transition:all 0.3s ease; background:url(../images/accordion-arrows.png) top left no-repeat;} #accordion .accordion-section-open .accordion-arrow {background-position:left bottom;} #accordion .accordion-content {height:0px; overflow:hidden; padding:0px; margin:0px;} #accordion .accordion-content-inner {padding:25px 25px 25px 25px; margin:0px; background:#f9f9f7;} #accordion .accordion-section h3.Green:hover { background: rgba(71,162,121,0.2); } #accordion .accordion-section-open h3.Green, #accordion .accordion-section-open h3.Green:hover { background: rgba(71,162,121,0.6); } #accordion .accordion-section h3.Dark.Green:hover { background: rgba(140,166,62,0.2); } #accordion .accordion-section-open h3.Dark.Green, #accordion .accordion-section-open h3.Dark.Green:hover { background: rgba(140,166,62,0.6); } #accordion .accordion-section h3.Light.Green:hover { background: rgba(74,166,170,0.2); } #accordion .accordion-section-open h3.Light.Green, #accordion .accordion-section-open h3.Light.Green:hover { background: rgba(74,166,170,0.6); } #accordion .accordion-section h3.Purple:hover { background: rgba(89,85,133,0.2); } #accordion .accordion-section-open h3.Purple, #accordion .accordion-section-open h3.Purple:hover { background: rgba(89,85,133,0.6); } #accordion .accordion-section h3.Blue:hover { background: rgba(63,130,161,0.2); } #accordion .accordion-section-open h3.Blue, #accordion .accordion-section-open h3.Blue:hover { background: rgba(63,130,161,0.6); } #accordion .accordion-section h3.St.Georges.Blue:hover { background: rgba(19,31,76,0.2); } #accordion .accordion-section-open h3.St.Georges.Blue, #accordion .accordion-section-open h3.St.Georges.Blue:hover { background: rgba(19,31,76,0.6); } #galWrap {width:100%; padding:35px 0px 0px 0px; margin:0px;} #galWrap .galImage {display:inline-block; vertical-align:top; width:18.7%; padding:1.6%; margin:0px 1.40% 20px; position:relative; background:#d8d9cf; opacity:0.7; text-decoration:none; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #galWrap .galImage:hover {opacity:1;} .galImage img {display:block; width:96.4%; width:-webkit-calc(100% - 6px); width:calc(100% - 6px); height:auto; padding:0px; margin:0px; border:3px solid #fff;} .galImage .galMag {opacity:0; display:block; position:absolute; width:62px; height:57px; left:50%; top:50%; margin:-57px 0px 0px -31px; background:url(../images/galImage-Magne.png) left top no-repeat; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .galImage:hover .galMag {opacity:1;} .galImage .galTitle {display:block; font-size:14px; line-height:16px; padding:8.6% 0px 4px 0px; color:#14204B; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} @media all and (max-width:1050px){ #galWrap .galImage {width:27%; margin:0px 1.3% 20px;} .galImage .galTitle {font-size:12px;} } @media all and (max-width:650px){ #galWrap .galImage {width:43%;} } #sideColWrap {float:right; width:18.4%; padding:0px; margin:0px; position:relative;} #sideMenu {width:100%; padding:0px 0px 40px 0px; margin:0px;} #sideMenu h4 {font-size:18px; line-height:19px; color:#14204B; padding:10px 0px 10px 32px; margin:0px 0px 12px 0px; background:url(../images/sideMenuIcon.png) left center no-repeat; border-top:1px dotted #14204B; border-bottom:1px dotted #14204B; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic;} #sideMenu ul {background:#fff; padding:0px 0px 40px 0px; margin:0px; display:block;} #sideMenu li {display:block; padding:0px 0px 7px 0px; margin:0px; list-style:none;} #sideMenu a {display:block; text-decoration:none; padding:0px; margin:0px; font-size:13px; line-height:17px; color:#14204B; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} #sideMenu a:hover, #sideMenu li.current a {color:#999A80;} #generalSideBanner {width:100%; position:relative; padding:0px;} #generalSideBanner img {display:block; width:100%; height:auto;} #generalSideBanner span {width:100%; height:81px; position:absolute; right:0px; bottom:0px; background:url(../images/general-SideBannerLines.png) right bottom no-repeat;} @media all and (max-width:650px){ #sideColWrap {display:none;} #mainLeft {width:100%;} } #general-banner-wrap #homeBannersWrap, #general-banner-wrap .eachBanner, #general-banner-wrap .bannerColourArea, #general-banner-wrap .bannerImage, #general-banner-wrap .bannerImage img{ height: 230px; } #general-banner-wrap .bannerText{ padding:35px 0px 0px 0px; } /* HOME PAGE */ #homeContent {width:90%; margin:30px auto 0px auto; max-width:1280px; border-bottom:2px dotted #9CA1B4; padding:0px;} #homeContent div {-moz-column-count:2; -webkit-column-count:2; column-count:2; -moz-column-gap:20px; -webkit-column-gap:20px; column-gap:20px;} #HomePage #quotes, #MainSectionPage #quotes {margin:40px 0px 0px 0px;} #homeBanners {} #homeBannersWrap {width:100%; height:433px; overflow:hidden;} .eachBanner {width:100%; height:433px; float:left;} #general-banner-wrap #homeBannersWrap.auto, #general-banner-wrap #homeBannersWrap.auto .eachBanner {height:auto;} .bannerColourArea {float:left; width:50%; margin:0px -80px 0px -80px; padding:0px 80px 0px 80px; height:433px; overflow:hidden; background:#A32A2C; border-bottom-right-radius:10px; transform:skewX(-10deg); -webkit-transform:skewX(-10deg); -ms-transform:skewX(-10deg); position:relative; z-index:2;} .bannerText {width:570px; float:right; transform:skewX(10deg); -webkit-transform:skewX(10deg); -ms-transform:skewX(10deg); padding:25px 0px 0px 0px;} .bannerTextAlt {padding:50px 0px;} .bannerText h1, .bannerTextAlt h1, .bannerText h3, .bannerText p, .homeBannerbtn {color:#fff; text-decoration:none; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} .bannerText h1, .bannerTextAlt h1, .bannerText h3 {font-size:30px; line-height:40px; padding:0px 0px 20px 0px; margin:0px;} .bannerText p {border-top:2px dotted #fff; border-bottom:2px dotted #fff; padding:20px 15px 20px 15px; font-size:15px; line-height:26px;} .homeBannerbtn {font-size:18px; line-height:19px; padding:12px 0px 0px 0px; width:292px; height:37px; text-align:center; margin:30px 0px 0px -11px; background:url(../images/bannerBtn.png) left top no-repeat; display:inline-block;} .homeBannerbtn.medium {font-size:18px; line-height:19px; padding:10px 0px 0px 0px; width:240px; height:40px; text-align:center; margin:30px 0 0 10px; background:url(../images/bannerBtn-medium.png) left top no-repeat; display:inline-block;} .bannerImage {width:50%; padding:0px; height:433px; overflow:hidden; margin:0px; float:right; position:relative; z-index:1;} .bannerImage img {display:block; width:100%; position:absolute; left:0px; right:0px; top:0px; bottom:0px; min-heighht:433px; min-width:950px;} #bannerNav {position:absolute; bottom:5px; left:20px; font-size:35px; line-height:35px; color:#FFFFFF;} #bannerNav span {margin:0px 7px 0px 0px; opacity:0.6; cursor:pointer;} #bannerNav span:hover, #bannerNav span.cycle-pager-active {opacity:0.9;} #homeTiles {width:100%; max-width:1280px; padding:30px 0px 30px 0px; margin:0px auto; position:relative;} #homeTiles h2, #homeTiles h4 {text-align:center; margin:0px; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic;} #homeTiles h2 {font-size:36px; line-height:37px; padding:0px 0px 5px 0px; color:#999a80;} #homeTiles h4 {font-size:16px; line-height:17px; padding:0px; color:#49547b;} #homeTilesWrap {padding:35px 0px 0px; border-top:2px dotted #9ca1b4; border-bottom:2px dotted #9ca1b4; margin:25px 0px 0px 0px; text-align:center; position:relative;} #homeTilesInner {margin:0px auto; width:100%;} .eachTileBox {vertical-align:top; display:inline-block; width:244px; /*height:375px;*/ height:500px; margin:0px 4px 35px; border-bottom:10px solid #962527; text-decoration:none; overflow:hidden;} .eachTileBox img {display:block; padding:0px; margin:0px; width:100%; height:auto;} .eachTileBoxContent {height:256px; display:block; background:#f0f0ec; border-top-left-radius:10px; transform:skewY(-10deg); -webkit-transform:skewY(-10deg); -ms-transform:skewY(-10deg); padding:25px 0px 45px 0px; /*margin:-30px 0px 0px 0px;*/ margin:-30px 0px -25px;} .eachTileBoxText {width:84.4%; display:block; margin:0px auto; transform:skewY(10deg); -webkit-transform:skewY(10deg); -ms-transform:skewY(10deg);} #homeTiles .eachTileBoxText h2 {color:#131f4c; font-size:20px; line-height:22px; text-align:left; padding:10px 0px 10px 0px;} .eachTileBoxText p {color:#5f6785; padding:10px 0px 10px 0px; margin:0px; border-top:2px dotted #9e9f87; border-bottom:2px dotted #9e9f87; font-size:14px; line-height:22px; text-align:left;} #sectionTilesInner .eachTileBox.square{ height:100%; } .square .eachTileBoxContent{ height: auto; min-height: 155px; border-top-left-radius:10px; transform:none; -webkit-transform:none; -ms-transform:none; padding:25px 0px 30px 0px;} .square .eachTileBoxContent .eachTileBoxText{ transform:none; -webkit-transform:none; -ms-transform:none; padding: 20px 0 20px 0;} .square .eachTileBoxText p { min-height: 45px; } .homeTileArrows {position:absolute; left:0px; top:50%; margin-top:-28px; width:12px; height:57px; background:url(../images/homeTilesArrow.png) left top no-repeat; opacity:0.4; cursor:pointer; display:none;} #homeTileNext {left:auto; right:0px; background-position:right top;} .homeTileArrows:hover {opacity:0.8;} #homeBoxes {width:95%; margin:35px auto; max-width:1280px; padding:35px 0px; border-top:2px dotted #9ca1b4; border-bottom:2px dotted #9ca1b4;} .home-bottom-box {float:left; width:21.4%; margin:0px 1% 0px 0px; padding:1.4%; background-color:#f0f0ec; border-bottom:4px solid #999a80; position:relative; z-index:3; text-decoration:none; color:inherit;} .latest-news, .home-bottom-box.last {margin-right:0px;} .view-all-newsTop {display:block; text-decoration:none; padding:0px; margin:0px;} .home-bottom-box-title {text-decoration:none;} .home-bottom-box h2 {padding:0px 0px 13px 0px; margin:0px; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic; color:#131f4c; font-size:30px; border-bottom:2px dotted #a5a68f;} .home-bottom-box p {margin:0px 0px 15px 0px; font-size:14px; line-height:20px; padding:15px 0px 15px 0px; border-bottom:2px dotted #a5a68f; color:#5f6785;} .home-bottom-box > img {display:block; margin:0px 0px 15px 0px; width:100%;} .home-bottom-box > .moreBtns {float:left; margin:0px 0px 0px 0px; padding:0px; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic; font-size:16px; font-size:17px; color:#999A80; text-decoration:none;} .home-bottom-box > .moreBtns:hover {color:#121F4E;} .home-bottom-box > .view-all-news {margin:0px 0px 0px 11.7%;} @media all and (max-width:1450px){ #homeTilesInner {width:100%;} } @media all and (max-width:1350px){ .home-bottom-box > .view-all-news {margin:0px 0px 0px 20px; float:left;} .eachTeamRotateText {bottom:auto; top:20px;} } @media all and (max-width:1320px){ #intro {width:100%; width:-webkit-calc(100% - 90px); width:calc(100% - 90px); margin:0px auto; padding:60px 0px 18% 0px;} #intro .columns {width:100%;} #teamRotate {width:60%;} .eachTeamRotateText {width:100%; top:0px; left:-50%;} .eachTeamRotate img {width:70%; left:30%;} #homeTilesWrap {padding:35px 0px 0px 0px;} } @media all and (max-width:1250px){ #homeTilesInner {width:90%;} } @media all and (max-width:1180px){ .bannerColourArea {width:60%;} .bannerImage {width:40%;} } @media all and (max-width:1050px){ #intro {width:100%; width:-webkit-calc(100% - 90px); width:calc(100% - 90px); margin:0px auto; padding:20px 0px 12% 0px;} .eachTeamRotateText {width:75%; top:auto; bottom:15px; left:-60%;} .eachTeamRotateText h4 {font-size:14px; line-height:18px; background:url(../images/home-rotatorQuote-small.png) center top no-repeat; padding:18px 0px 10px 0px;} .bannerText {margin-right:-30px;} } @media all and (max-width:950px){ .home-bottom-box > .view-all-news {margin:15px 0px 0px 0px; clear:both;} #teamRotateLines {display:none;} .eachTeamRotate img {width:80%; left:20%;} .middle-bar-upper h2 {font-size:20px; line-height:26px; margin:0px 0px 10px 0px;} .middle-bar-upper p {font-size:12px; line-height:18px; margin:0px 0px 15px 0px;} .middle-bar-upper a {font-size:16px; line-height:24px; white-space:nowrap; margin:0px 20px 5px 0px; display:inline-block;} } @media all and (max-width:900px){ .bannerColourArea {width:100%; transform:skewY(0deg); -webkit-transform:skewY(0deg); -ms-transform:skewY(0deg); margin:0px; padding:0px; border-radius:0px;} .bannerText {transform:skewY(0deg); -webkit-transform:skewY(0deg); -ms-transform:skewY(0deg);} .bannerImage {display:none;} .bannerText {float:none; margin:0px auto; width:90%;} .bannerText h1, .bannerText h3 {font-size:23px; line-height:33px;} .bannerText p {padding:10px 15px;} } @media all and (max-width:850px){ #homeTiles {padding:30px 0px 0px;} #homeTilesWrap {border-bottom:none;} .home-bottom-box {width:40%; margin:0px 3.6% 30px;} .home-bottom-box.last {clear:both;} } @media all and (max-width:750px){ #intro h1 {font-size:32px; line-height:36px; margin:0px 0px 20px 0px;} #homeBoxes {padding:15px 0px 0px; margin:15px auto;} .home-bottom-box {width:90%; margin:0px 0px 20px 0px; padding:4% 4% 4% 4%;} .home-bottom-box h2 {font-size:26px; line-height:28px; border-bottom:none; padding:0px;} .home-bottom-box p {display:none;} .home-bottom-box .moreBtns {display:none;} } @media all and (max-width:650px){ #homeTilesWrap {padding:35px 0px;} #homeTilesInner {width:244px; margin:0px auto;} .homeTileArrows {display:block;} .eachTileBox {margin:0px;} .eachTeamRotate img {width:100%; left:30%;} .middle-bar-lower {background-image:none;} .middle-bar-lower h2 {font-size:19px; line-height:20px;} #services {padding:30px 0px 0px 0px;} } @media all and (max-width:550px){ #intro {padding:20px 0px 0px 0px;} #intro .subheading, #intro .columns {display:none;} .middle-bar-upper p {font-size:10px; line-height:16px;} .middle-bar-upper a {font-size:12px; line-height:18px;} .eachTeamRotate img {width:120%; left:10%;} } @media all and (max-width:400px){ #bannerNav {display:none;} .square .eachTileBoxContent{ height: auto; min-height: auto; } } /* MAIN SECTION PAGE */ #sectionBanners {} #sectionBannersWrap {width:100%; height:433px; overflow:hidden;} .sectionBannerbtn {color:#fff; text-decoration:none; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} .sectionBannerbtn {font-size:18px; line-height:19px; padding:12px 0px 0px 0px; width:292px; height:37px; text-align:center; margin:30px 0px 0px -11px; background:url(../images/bannerBtn.png) left top no-repeat; display:block;s} #mainContentArea {width:90%; margin:45px auto 20px; max-width:1280px; -webkit-column-gap:80px; -moz-column-gap:80px; column-gap:80px; -webkit-column-count:2; -moz-column-count:2; column-count:2;} #sectionTiles {width:90%; max-width:1280px; padding:30px 0px 0px 0px; margin:0px auto; position:relative;} #sectionTiles h2, #sectionTiles h4 {text-align:center; margin:0px; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic;} #sectionTiles h2 {font-size:36px; line-height:37px; padding:0px 0px 5px 0px; color:#999a80;} #sectionTiles h4 {font-size:16px; line-height:17px; padding:0px; color:#49547b;} #sectionTilesWrap {padding:35px 0px 0px; border-top:2px dotted #9ca1b4; border-bottom:2px dotted #9ca1b4; margin:25px 0px 0px 0px; text-align:center; position:relative;} #sectionTilesInner {margin:0px auto; width:100%;} #sectionTilesInner .eachTileBox {width:309px; height:384px; margin:0px 4px 35px; border-bottom:10px solid #962527; text-decoration:none; overflow:hidden;} #sectionTiles .eachTileBoxText h2 {color:#131f4c; font-size:20px; line-height:22px; text-align:left; padding:10px 0px 10px 0px;} @media all and (max-width:1450px){ #sectionTilesInner {width:70%;} } @media all and (max-width:1350px){ } @media all and (max-width:1320px){ #sectionTilesWrap {padding:35px 0px 0px 0px;} } @media all and (max-width:1200px){ #sectionTilesInner {width:90%;} } @media all and (max-width:1180px){ } @media all and (max-width:1050px){ } @media all and (max-width:950px){ } @media all and (max-width:900px){ } @media all and (max-width:850px){ #sectionTiles {padding:30px 0px 0px;} #sectionTilesWrap {padding:35px 0px 15px 0px;} } @media all and (max-width:800px){ #sectionTilesInner .eachTileBox {width:100%; margin:0px 0px 20px 0px; border-radius:10px; height:auto;} #sectionTilesInner .eachTileBox img {display:none;} #sectionTilesInner .eachTileBoxContent {padding:4% 4% 4% 4%; transform:skewY(0deg); -webkit-transform:skewY(0deg); -ms-transform:skewY(0deg); border-radius:0px; margin:0px;} #sectionTilesInner .eachTileBoxText {transform:skewY(0deg); -webkit-transform:skewY(0deg); -ms-transform:skewY(0deg); padding:0px;} #sectionTilesInner .eachTileBoxText h2 {text-align:center; font-size:18px; line-height:20px;} #sectionTilesInner .eachTileBoxText p {display:none;} } @media all and (max-width:700px){ #mainContentArea {-webkit-column-gap:0px; -moz-column-gap:0px; column-gap:0px; -webkit-column-count:1; -moz-column-count:1; column-count:1;} } @media all and (max-width:650px){ #sectionTilesWrap {padding:35px 0px;} #sectionTilesInner {margin:0px auto;} } /* Directory Map */ #directory {overflow: hidden; margin-top: 50px;} #directoryContainer {float: left; width: 60%; min-width: 600px; height: 430px; border: 1px solid #C6C5B6; margin: 0 0 15px 0; padding: 0 0 5px 0;} #directoryMap {background: url(../images/mapFullBG.png) no-repeat 0 0; width: 600px; height: 430px; margin: 0 auto;} #directoryMap div {background: #D0CFC2; position: absolute; z-index: 1; border: 1px solid #C6C5B6;} #directoryMap div.arrow, #directoryMap div.arrow.hover {background: url(../images/map-arrow.png) no-repeat 0 0; width: 15px; height: 51px; border: 0;} #ar1 {top: 3px; left: 320px} #directoryMap div#ar2 {height: 23px; top: 225px; left: 280px;} #directoryMap div.label, #directoryMap div.label.hover {background: none; border: 0;} #directoryMap div.hover {background-color: #14204B; border-color: #14204B;} #directoryMap div span {position: absolute; top: 50%; left: 50%; margin: -18px 0 0 -18px; width: 36px; height: 36px; font-family: Georgia, Arial, sans-serif; font-size: 18px; line-height: 36px; text-align: center;} #directoryMap div span.number {line-height: 28px;} #directoryMap div.hover span {color: #fff;} #directoryMap div span.circle {background: #EEEEEA; border: 1px solid #FFFFFF; -webkit-border-radius: 18px; border-radius: 18px;} #directoryMap div.hover span.circle {color: #14204B;} #directoryMap div span.gold {color: #888971;} .label {position: absolute; font-family: Georgia, Arial, sans-serif; font-size: 13px; line-height: 13px;} .label.lLR {top: 20px; left: 370px;} .label.lHME {top: 250px; left: 246px; text-align: center;} .label.lHS {bottom: 10px; left: 240px;} #aLC, #aCP {width: 74px; height: 93px; top: 50px; left: 130px;} #aCP {top: 155px;} #directoryMap div#aMC, #directoryMap div#aHC {/*background: url(../images/map-1.png) no-repeat 0 0; */ width: 66px; height: 78px; top: 65px; left: 50px;} #directoryMap div#aMC {top: 170px;} /* #directoryMap div.hover#a1, #directoryMap div.hover#a5 {background-position: 0 -88px;}*/ #directoryMap div#aCWW {background: url(../images/map-2.png) no-repeat 0 0; width: 123px; height: 59px; top: 182px; left: 228px; border: 0;} #directoryMap div.hover#aCWW {background-position: 0 -59px;} #directoryMap div#aCWW span {left: 42%;} #directoryMap div#aDS {background: url(../images/map-3.png) no-repeat 0 0; width: 108px; height: 91px; top: 93px; left: 373px; border: 0;} #directoryMap div.hover#aDS {background-position: 0 -91px;} #directoryMap div#aDS span {left: 69%; top: 32%;} #aCCC {width: 44px; height: 114px; top: 115px; left: 498px;} #directoryMap div#aCRG {background: url(../images/map-x.png) no-repeat 0 0; width: 110px; height: 120px; top: 68px; left: 314px; border: 0;} #directoryMap div.hover#aCRG {background-position: 0 -120px;} #directoryMap div#aCRG span {left: 36%; top: 60%;} #directoryMap div.aP {background: #A6A795; border-color: #9A9B86;} #aP1, #aP2 {width: 37px; height: 45px; top: 55px; left: 315px;} #aP2 {top: 65px; left: 502px;} #directoryMap div#aP3 {background: none; width: 31px; height: 31px; bottom: 67px; left: 413px; border: 0;} #directoryMap div#aP3.hover span {color: #14204B;} #aP4, #aP5 {width: 8px; height: 70px; top: 310px; left: 409px;} #aP5 {left: 441px;} #directoryMap div.aD {background: #EBEBE6; border-color: #E0E1D9;} #directoryMap div.aD.hover, #directoryMap div.aP.hover {background: #14204B; border-color: #14204B;} #aD1 {width: 56px; height: 58px; top: 64px; left: 241px;} #directoryMap div#aD2 {width: 74px; height: 41px; top: 137px; left: 232px;} #directoryMap div#aD3 {/*background: url(../images/map-d.png) no-repeat 0 0; */ width: 142px; height: 111px; top: 164px; left: 350px;} /* #directoryMap div.hover#aD3 {background-position: 0 -121px;}*/ #directoryList{float: right; width: 30%;} @media all and (max-width:980px){ #directoryList {width: 20%;} } @media all and (max-width:880px){ #directoryContainer {width: 99%;} #directoryList {clear: both; float: none; width: 100%;} } #directoryList ul {margin: 10px 0 0 0;} #directoryList li {font-family: Georgia, Arial, sans-serif; list-style: none; padding: 0 0 5px 40px; border-bottom: 1px dotted #14204B;} #directoryList li span {display: block; float: left; margin-left: -40px;} #directoryList li a {text-decoration: none;} #directoryList li a:hover, #directoryList li a.hover {color: #999980;} #directoryContent p {font-family: Georgia, Arial, sans-serif; color: #999980;} #mapArea {width: 560px; padding: 40px;} #mapArea ul, #mapArea p {font-family: Georgia, serif; font-size: 12px; line-height: 19px; margin: 0 0 20px 0; color: #999A80;} #mapArea a, #mapArea ul li span.right a {color: #14204B; text-decoration: underline;} #mapArea a, #mapArea span.right, #mapArea ul li span.right, #mapArea ul li span.right a {color: #14204B;} #mapArea ul li {list-style: disc; margin: 0 0 7px 15px;} #mapArea ul li span.right {float: right; width: 200px; text-align: left;} #mapArea h2 {font-family: Georgia, serif; font-style: italic; font-size: 28px; margin: 0 0 20px 0; padding: 0 0 5px 0; border-bottom: 1px dotted #14204B;} #mapArea h3 {font-family: Georgia, serif; font-style: italic; font-size: 16px; margin: 0 0 7px 0;} /* SPECIALIST PAGE */ #specialistSearchWrap {padding:0px; margin:0px; z-index:3;} #specialistSearchWrap .Actions {display:none;} #specialistSearchWrap .chzn-container {z-index:10; width:90% !important;} #specialistSearchWrap .chzn-single {cursor:pointer; font-size:25px; line-height:26px; height:40px; padding:8px 3.6% 0px; width:100%; border-radius:7px; border:none; font-style:italic; color:#fff; font-family:Georgia,"Times New Roman",Times,serif; box-shadow:none; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #specialistSearchWrap .chzn-single span {height:31px;} #specialistSearchWrap .chzn-container:hover .chzn-single {background:#F8F9F7; color:#999A80;} fieldset #SpecialistAreas, fieldset #Specialists {float:left; width:45%; padding:0px; margin:0px; position:relative; z-index:4;} fieldset #Specialists {float:right; z-index:3;} #specialistsAreasCont, #specialistsCont {position:relative; padding:20px 0px 0px 0px;} #specialistsAreasContWrap, #specialistsContWrap {width:100%; display:block; padding:0px; margin:0px;} #specialistsAreasContWrap .eachSpecialistArea, #specialistsContWrap .eachSpecialist {padding:0px; /*margin:0px 1.16% 20px; */ margin:0px 0px 20px; display:inline-block; vertical-align:top; list-style:none; width:22%;} #specialistsAreasContWrap .eachSpecialistArea {margin-right:3%;} #specialistsAreasContWrap .eachSpecialistArea:nth-child(4n+4) {margin-right:0%;} .eachSpecialistArea a, .eachSpecialist a {float:left; width:92%; padding: 6% 4.5%; margin:0px; position:relative; background:#f8f9f7; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .eachSpecialistArea a, .eachSpecialist a {text-decoration:none;} li.eachSpecialist a {min-height:95px; text-decoration:none;} #specialistsAreasContWrap .eachSpecialistArea a {min-height:115px; text-decoration:none;} .specialistLeft {float:left; padding:0px; margin:0px; width:32.69%; /* height:136px; */} .specialistLeft img {width:100%; height:auto;} .specialistRight {float:right; padding:0px; margin:0px; width:61.3%;} .eachSpecialistArea h4, .eachSpecialist h4 {font-size:19px; padding:0px 0px 10px 0px; margin:0px 0px 20px 0px; line-height:21px; font-style:italic; color:#14204B; border-bottom:1px dotted #14204B; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .eachSpecialistArea a:hover h4, .eachSpecialist a:hover h4 {color:#fff; border-color:#fff;} .viewProf {height:14px; line-height:13px; display:block; padding:3px 0px 3px 20px; margin:0px; background:url(../images/specialistArrow.png) left bottom no-repeat; color:#999A80; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .eachSpecialist:hover {z-index:100;} .eachSpecialistArea:hover a, .eachSpecialist:hover a {background:#14204B;} .eachSpecialist:hover .specialistRight h4 {border-bottom:2px dotted #fff;} .eachSpecialist:hover .viewProf {background-position:left bottom;} @media all and (max-width:1050px){ #specialistsContWrap .eachSpecialist {/*margin:0px 0px 20px; */ width:31%;} #specialistsAreasContWrap .eachSpecialistArea {/*margin:0px 0px 20px; */ width:30%;} #specialistsAreasContWrap .eachSpecialistArea:nth-child(4n+4){ margin-right:3%;} #specialistsAreasContWrap .eachSpecialistArea:nth-child(3n+3){ margin-right:0%;} } @media all and (max-width:900px){ #specialistSearchWrap .chzn-single {font-size:18px;} } @media all and (max-width:700px){ #specialistsContWrap .eachSpecialist {width:100%;} #specialistsAreasContWrap .eachSpecialistArea {width:100%;} #specialistsAreasContWrap .eachSpecialistArea {margin-right:0%;} #specialistsAreasContWrap .eachSpecialistArea:nth-child(4n+4){ margin-right:0%;} .eachSpecialistArea a {min-height:0;} } @media all and (max-width:650px){ fieldset #SpecialistAreas, fieldset #Specialists {width:100%; margin:5px 0px;} } #specialistPagination {padding:10px 10px 10px 10px; margin:20px 0px 0px 0px; background:#F8F9F7; text-align:center; display:none;} #specialistPagination:after {content:" "; visibility:hidden; display:block; height:0; clear:both;} #specialistPagination .first_link, #specialistPagination .last_link {display:none;} #specialistPagination .page_link {text-decoration:none; font-size:23px; line-height:24px; color:#999A80; display:inline-block; padding:0px; margin:0px 5px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #specialistPagination .page_link:hover, #specialistPagination .active_page {color:#14204B;} #specialistPagination .previous_link, #specialistPagination .next_link {float:left; text-decoration:none; font-size:31px; line-height:32px; color:#14204B; padding:0px 0px 0px 25px; background:url(plugins/pajination/pagination-arrow.png) left center no-repeat; opacity:0.5; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #specialistPagination .next_link {float:right; background-position:right center; padding:0px 25px 0px 0px;} #specialistPagination .previous_link:hover, #specialistPagination .next_link:hover {opacity:1;} /* SPECIALIST POP UP */ #specialistPop {width:900px; padding:20px;} #specialistLeft {float:left; width:455px; padding:0px; margin:0px;} #specialistClinicLogo {display:block; padding:0px; margin:0px 0px 40px 0px;} #specialistLeft h2 {font-size:39px; line-height:41px; padding:0px 0px 35px 0px; margin:0px; font-style:italic; font-weight:normal; color:#999A80;} #specialistRight {float:right; width:355px; padding:0px 0px 0px 60px; border-left:2px dotted #14204B;} #specialistRight img {padding:0px 0px 35px 0px; margin:0px; display:block;} #specialistRight h4 {color:#999A80; padding:0px 0px 35px 0px; margin:0px; font-size:30px; line-height:33px;} #specialistRight span.clearChild span {width:50%; padding:0px; margin:0px; float:left;} #specialistLeft h5, #specialistRight h5 {color:#14204B; font-style:italic; font-size:16px; line-height:17px; padding:0px 0px 5px 0px; margin:0px;} @media all and (max-width:1000px){ #specialistPop {width:92%; padding:4%;} #specialistLeft, #specialistRight {width:100%; float:left; border:none; padding:0px;} #specialistClinicLogo {width:100%; max-width:300px; margin:0px 0px 20px 0px;} #specialistLeft h2 {font-size:24px; line-height:28px; padding:0px 0px 10px 0px;} #specialistPop hr {margin:5px auto 10px auto;} #specialistPop p {padding:0px 0px 10px 0px;} #specialistRight img {width:100%; height:auto; margin:0px; max-width:200px; padding:0px 0px 15px 0px;} #specialistRight h4 {font-size:24px; line-height:28px; padding:0px 0px 10px 0px;} } @media all and (max-width:500px){ #SpecialistsPage #fancybox-wrap {width:87% !important;} #SpecialistsPage #fancybox-content {width:95% !important; width:-webkit-calc(100% - 20px) !important; width:calc(100% - 20px) !important;} #specialistRight span.clearChild span {width:100%;} } /* BLOG PAGE */ .blogSummary {padding:0px 0px 0px 0px; border-bottom:1px dotted #14204B; margin:0px 0px 20px 0px;} .postTitle a {text-decoration:none;} a.blogmore {padding:0px 0px 0px 14px; height:14px; background:url(../images/specialist-viewArrow.png) left top no-repeat; text-decoration:none;} a.blogmore:hover {text-decoration:underline;} /* VIDEO GALLERY */ #galWrap .galVideo {display:inline-block; vertical-align:top; width:18.7%; padding:1.6%; margin:0px 1.40% 20px; position:relative; background:#d8d9cf; opacity:0.7; text-decoration:none; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #galWrap .galVideo:hover {opacity:1;} .galVideo img {display:block; width:96.4%; width:-webkit-calc(100% - 6px); width:calc(100% - 6px); height:auto; padding:0px; margin:0px; border:3px solid #fff;} .galVideo .galMag {opacity:0; display:block; position:absolute; width:62px; height:57px; left:50%; top:50%; margin:-57px 0px 0px -31px; background:url(../images/galImage-Magne.png) left top no-repeat; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .galVideo:hover .galMag {opacity:1;} .galVideo .galTitle {display:block; font-size:14px; line-height:16px; padding:8.6% 0px 4px 0px; color:#14204B; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} @media all and (max-width:1050px){ #galWrap .galVideo {width:27%; margin:0px 1.3% 20px;} .galVideo .galTitle {font-size:12px;} } @media all and (max-width:650px){ #galWrap .galVideo {width:43%;} } /* SEARCH PAGE */ .eachResult {width:100%; border-bottom:1px dotted #14204B; padding:0px 0px 15px 0px; margin:0px 0px 15px 0px;} .eachResult a {text-decoration:none;} .eachResult a h4 {color:#999A80;} .eachResult p {padding:0px 0px 15px 0px; margin:0px;} .eachResult .readMoreLink {font-size:14px; line-height:15px; color:#999A80; padding:0px 0px 0px 14px; background:url(../images/service-links.png) left center no-repeat; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} .eachResult .readMoreLink:hover {color:#14204B;} /* TEAM MEMBERS PAGE */ #teamMembers {width:92%; padding:4%; max-width:800px;} .eachTeamMember {display:inline-block; width:260px; margin:0px 15px 30px; vertical-align:top;} .eachTeamMember p {word-wrap:break-word;} .teamSplitter {display:block; padding:0px; margin:0px 0px 40px 0px;} @media all and (max-width:850px){ .eachTeamMember {width: 230px;} } /* CONTACT PAGE */ .contactLeft {width:45%; float:left; padding:0px; margin:0px;} .map {width:45%; float:right; padding:0px; margin:0px; height:400px;} @media all and (max-width:850px){ .map {margin-right:0px !important; width:100%;} } /* EMPLOYEES PAGE */ #employeesCont .eachEmployee {display:inline-block; vertical-align:top; width:26%; margin:0px 3% 20px 0px; padding:2% 2% 2% 2%; text-decoration:none; background:#F8F9F7; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #employeesCont .eachEmployee:hover {background:#14204B;} #employeesCont .eachEmployee h4 {font-size:19px; padding:0px 0px 10px 0px; margin:0px 0px 20px 0px; line-height:21px; font-style:italic; color:#14204B; border-bottom:1px dotted #14204B; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #employeesCont .eachEmployee h4 span {display:block; font-size:0.5em;} #employeesCont .eachEmployee:hover h4 {color:#fff;} @media all and (max-width:1000px){ #employeesCont .eachEmployee {width:42%;} } @media all and (max-width:600px){ #employeesCont .eachEmployee {width:90%;} } /* EMPLOYEES POP UP */ #employeePop {width:700px; padding:30px; background:#fff;} #employeePopInner {} #employeePop h3 {clear:none;} #empProfileImg {float:right; padding:0px 0px 30px 30px; margin:0px; background:#fff;} @media all and (max-width:800px){ #employeePop {width:92%;} } /* FOOTER */ #extraNav {padding:20px 0px 0px 0px; display:none;} #extraNav h4 {padding:12px 0px; margin:0px 0px 13px 0px; font-size:16px; line-height:20px; color:#14204B; border-top:1px #14204B dotted; border-bottom:1px #14204B dotted; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic;} #extraNav ul {padding:0px; margin:0px;} #extraNav li {padding:0px 0px 5px 0px; margin:0px;} #extraNav li a {text-decoration:none; color:#999A80; text-transform:uppercase; font-size:10px; line-height:15px;} #extraNav li a:hover {color:#14204B;} @media all and (max-width:750px){ #extraNav {display:block;} } #quotes {background:#edeee9; margin:80px 0px 0px 0px; positon:relative; z-index:999;} #HomePage #quotes {margin:10px 0px 0px 0px;} #quotes .inner {max-width:900px; width:98%; margin:0px auto; position:relative; text-align: center} #quotes p {width:57%; float:none; margin:0 auto; padding:85px 0px 40px 0; background-image:url(../images/quotes.png); background-repeat:no-repeat; background-position:center 80%; text-align:center; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic; font-size:32px; font-size:2rem; color:#999A80; line-height:34px;} #quotes p span {font-size:40px;} #quotes span.names {display:inline-block; width:57%; float:none; clear:right; margin:0 auto; padding:0 0 35px 0; text-align:center; font-family:Georgia, Arial, Helvetica, sans-serif; font-size:12px; line-height:14px;} .quote-person {position:absolute; bottom:0px;} @media all and (max-width:850px){ #quotes {display:none;} } #newsletterWrap {background:#fff; position:relative;} #backToTop {width:47px; position:absolute; z-index:3; text-align:center; right:20px; bottom:70px; font-size:16px; line-height:17px; padding:28px 0px 0px 0px; text-decoration:none; opacity:0.7; background:url(../images/backToTopArrow.png) center top no-repeat; color:#14204b; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic;} #backToTop:hover {opacity:1;} #newsletter {padding:70px 0px 70px; max-width:830px;} #newsletter h3 {font-size:32px; line-height:37px; padding:10px 0px 10px 92px; margin:0px auto 20px auto; color:#14204b; font-family:Georgia, Arial, Helvetica, sans-serif; background:url(../images/newsletter-logo.jpg) left top no-repeat; font-style:italic;} #newsletter h3 span {/* font-size:31px; font-family:Verdana, Helvetica, sans-serif; font-style:normal; */} #newsletter p {font-size:16px; line-height:20px; font-family:Georgia, Arial, Helvetica, sans-serif; text-align:center; padding:15px 0px 25px 0px;} #newsletter form, #newsletter fieldset {width:100%; padding:0px; margin:0px; background:none; border:none;} #newsletter fieldset {width:83%; float:left;} #newsletter div.text {float:left; width:37%; padding:0px; margin:0 2% 0 0;} #newsletter div.email {float:left;} #newsletter div.question {width: 20%;} #newsletter div.text input {padding:15px 4%; margin:0px; width:92%; border:none; border-radius:5px; background:#f6f7f5; color:#999a80; font-size:18px; line-height:19px; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} #newsletter div.text.question input {padding: 15px 8%;} #newsletter div.Actions {float:right; width:16%; padding:0px; margin:0px;} #newsletter div.Actions input {background:none; border:1px solid #a6abbc; text-transform:none; border-radius:5px; width:98%; color:#999a80; font-size:20px; line-height:21px; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic; padding:12px 0px 11px 0px; margin:0px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #newsletter div.Actions input:hover {background:#a6abbc; color:#fff;} #newsletter div.Actions:after {content:"";} @media all and (max-width:1000px){ #backToTop {right:50%; margin-right:-23px; bottom:10px;} } @media all and (max-width:850px){ #backToTop {right:50%; margin-right:-23px; bottom:10px;} #newsletterWrap {margin:20px 0px 0px 0px;} } @media all and (max-width:780px){ #newsletter h3 {text-align:center; line-height:43px;} #newsletter h3 span {display:block; font-size:18px;} #newsletter h3 .spacer {display:none;} #newsletter .sub-heading {display:none;} } @media all and (max-width:650px){ #newsletter {padding:20px 0px 70px 0px;} #newsletter fieldset {width:100%;} #newsletter div.text, #newsletter div.email, #newsletter div.Actions {width:100%; float:left; margin:0px 0px 10px 0px;} #newsletter div.text.question input {padding: 15px 4%;} } @media all and (max-width:350px){ #newsletter h3 {padding-left:60px;} } #footer {background:#fff; border-top:1px #14204B dotted; padding:55px 0px 45px 0px;} .footer-links {float:left; width:50%; padding:0px; margin:0px 4% 0px 0px;} #footer h4 {padding:12px 0px; margin:0px 0px 13px 0px; font-size:16px; line-height:20px; color:#14204B; border-top:1px #14204B dotted; border-bottom:1px #14204B dotted; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic;} #footer ul {padding:0px; margin:0px;} #footer li {padding:0px 0px 5px 0px; margin:0px;} #footer li a {text-decoration:none; color:#999A80; text-transform:uppercase; font-size:10px; line-height:15px;} #footer li a:hover {color:#14204B;} .footer-contacts {float:right; width:41%; padding:0px; margin:0px;} .footer-contacts h4 a {float:right; padding:0px 0px 0px 11px; margin:4px 0px 0px 0px; font-size:12px; line-height:13px; color:#999A80; text-decoration:none; background:url(../images/footer-contactArrow.png) left center no-repeat;} .footer-contacts h4 a:hover {color:#14204B;} .footer-contacts h6 {font-size:12px; font-weight:bold; padding:0px 0px 12px 0px; margin:0px; color:#14204B;} .footer-contacts p {font-size:11px; line-height:19px; color:#14204B; padding:0px 0px 13px 0px; margin:0px;} .footer-contacts a {color:inherit; text-decoration:none;} .footer-contacts a:hover {text-decoration:underline;} #footerContatcLeft {float:left; width:45%; padding:0px 4% 0px 0px; margin:0px; border-right:1px dotted #14204B;} #footerContatcRight {float:right; width:45%; padding:0px; margin:0px;} #footerInfoButtonsWrap {width:100%; padding:30px 0px 0px 0px; margin:0px; text-align:center; clear:both; display:none;} #footerInfoButtonsWrap .bannerIcons {float:none; display:inline-block; padding:0px; margin:0px 10px; position:relative; text-decoration:none;} #footerInfoButtonsWrap .bannerIcon {background-color:#e9ebe5; position:relative; z-index:3; background-position:top center; border-radius:7px; padding:0px; margin:0px; float:right; width:36px; height:36px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;} #footerInfoButtonsWrap .bannerIcons:hover .bannerIcon {background-position:bottom center; background-color:#131f4c; border-radius:7px;} #footerCopyright {background:#EDEEE9; padding:20px 0px 20px 0px; margin:0px; text-align:center;} #footerCopyright p {font-size:10px; line-height:20px; padding:0px; margin:0px; color:#abac96;} #footerCopyright a {color:inherit; text-decoration:none; white-space:nowrap;} #footerCopyright a:hover {text-decoration:underline; color:#14204B;} @media all and (max-width:950px){ .footer-links {width:95%; margin:0px 2% 20px 2%;} .footer-contacts {width:100%;} } @media all and (max-width:800px){ #infoButtonsWrap {display:none;} #footer {padding:25px 0px;} #footerInfoButtonsWrap {display:block;} } @media all and (max-width:750px){ .platoSpacer {display:none;} .platoLink:before {content:'\A'; white-space:pre;} } @media all and (max-width:600px){ .footer-links {width:100%; margin:0px 0px 20px 0px; display:none;} #footerMenu {display:block;} #footerMenu li {padding:0px; margin:0px;} #footerMenu li a {display:block; color:#14204B; background:#F0F0EC; padding:15px 10px; font-size:16px; line-height:17px; border-bottom:1px solid #999A80;} #footerMenu li a:hover, #footerMenu li a.current, #footerMenu li a.section {background:#14204B; color:#fff;} #footerContatcLeft {width:100%; padding:0px 0px 20px 0px; border:none;} #footerContatcRight {width:100%;} } /* MAIN SECTION PAGE */ #sectionBanners {} #sectionBannersWrap {width:100%; height:433px; overflow:hidden;} .sectionBannerbtn {color:#fff; text-decoration:none; font-style:italic; font-family:Georgia, Arial, Helvetica, sans-serif;} .sectionBannerbtn {font-size:18px; line-height:19px; padding:12px 0px 0px 0px; width:292px; height:37px; text-align:center; margin:30px 0px 0px -11px; background:url(../images/bannerBtn.png) left top no-repeat; display:block;s} #mainContentArea {width:90%; margin:45px auto 20px; max-width:1280px; -webkit-column-gap:80px; -moz-column-gap:80px; column-gap:80px; -webkit-column-count:2; -moz-column-count:2; column-count:2;} #sectionTiles {width:90%; max-width:1280px; padding:30px 0px 0px 0px; margin:0px auto; position:relative;} #sectionTiles h2, #sectionTiles h4 {text-align:center; margin:0px; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic;} #sectionTiles h2 {font-size:36px; line-height:37px; padding:0px 0px 5px 0px; color:#999a80;} #sectionTiles h4 {font-size:16px; line-height:17px; padding:0px; color:#49547b;} #sectionTilesWrap {padding:35px 0px 0px; border-top:2px dotted #9ca1b4; border-bottom:2px dotted #9ca1b4; margin:25px 0px 0px 0px; text-align:center; position:relative;} #sectionTilesInner {margin:0px auto; width:100%;} #sectionTilesInner .eachTileBox {width:309px; height:384px; margin:0px 4px 35px; border-bottom:10px solid #962527; text-decoration:none; overflow:hidden;} #sectionTiles .eachTileBoxText h2 {color:#131f4c; font-size:20px; line-height:22px; text-align:left; padding:10px 0px 10px 0px;} @media all and (max-width:1450px){ #sectionTilesInner {width:70%;} } @media all and (max-width:1350px){ } @media all and (max-width:1320px){ #sectionTilesWrap {padding:35px 0px 0px 0px;} } @media all and (max-width:1200px){ #sectionTilesInner {width:90%;} } @media all and (max-width:1180px){ } @media all and (max-width:1050px){ } @media all and (max-width:950px){ } @media all and (max-width:900px){ } @media all and (max-width:850px){ #sectionTiles {padding:30px 0px 0px;} #sectionTilesWrap {padding:35px 0px 15px 0px;} } @media all and (max-width:800px){ #sectionTilesInner .eachTileBox {width:100%; margin:0px 0px 20px 0px; border-radius:10px; height:auto;} #sectionTilesInner .eachTileBox img {display:none;} #sectionTilesInner .eachTileBoxContent {padding:4% 4% 4% 4%; transform:skewY(0deg); -webkit-transform:skewY(0deg); -ms-transform:skewY(0deg); border-radius:0px; margin:0px;} #sectionTilesInner .eachTileBoxText {transform:skewY(0deg); -webkit-transform:skewY(0deg); -ms-transform:skewY(0deg); padding:0px;} #sectionTilesInner .eachTileBoxText h2 {text-align:center; font-size:18px; line-height:20px;} #sectionTilesInner .eachTileBoxText p {display:none;} } @media all and (max-width:700px){ #mainContentArea {-webkit-column-gap:0px; -moz-column-gap:0px; column-gap:0px; -webkit-column-count:1; -moz-column-count:1; column-count:1;} } @media all and (max-width:650px){ #sectionTilesWrap {padding:35px 0px;} #sectionTilesInner {margin:0px auto;} #event-banner-wrap {display: none;} } /* events */ .eventsPage { font-family: Georgia, 'Times New Roman', serif; line-height: 1.5; } .eventsPage h4 { font-style: italic; border-top: 1px dotted #14204B; border-bottom: 1px dotted #14204B; padding: 5px 0; margin: 0 0 25px 0; } .eventsPage ul { margin: 0 0 5px 0; } .eventsPage ul li { font-size: 12px; padding: 0 0 15px 0; } .eventsPage a.viewProf { text-decoration: none; font-style: italic; } .eventsPage a.viewProf:hover, #register a.viewProf:hover { color: #14204B; } #sideColWrap a.viewProf { margin-bottom: 15px; } #event-banner-wrap {} #eventBannersContainer { width: 100%; overflow: hidden; } #eventBannersContainer img { width: 100%; } .typography h2.gold { font-size: 40px; font-style: italic; margin: 15px 0 25px 0; color: #999A80; } .speaker { overflow: hidden; border-bottom: 1px dotted #14204B; margin: 0 0 30px 0; } .speaker .speaker-photo { float: left; margin: 0 30px 30px 0; } .typography .speaker h3 { padding: 0; border-bottom: none; clear: none; } .typography .speaker h4 { font-size: 14px; font-style: italic; margin: 0 0 15px 0; color: #14204B; } #register a.viewProf, .event a.viewProf { font-family: Georgia, 'Times New Roman', serif; font-size: 16px; height:16px; line-height:18px; display:inline-block; padding:3px 0px 3px 20px; margin:0px; background:url(../images/specialistArrow.png) left bottom no-repeat; color:#999A80; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease; text-decoration: none; font-style: italic; z-index: 9999; } .event { position: relative; float: left; background: #F8F9F7; padding: 3%; width: 42%; margin: 15px 4% 15px 0; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease; } .event.eol { margin-right: 0; } .event:hover { background: #14204B; } .typography .event:hover h3 { color: #fff; } .typography .event:hover p { color: #fff; } .typography .event:hover p.date { border-color: #fff; color: #fff; } @media all and (max-width:750px){ .event { width: 94%; margin-right: 0; } } .typography .event h3 { position: relative; font-size: 28px; font-style: italic; border-bottom: none; margin: 0; color: #999A80; z-index: -9; } .typography .event p { position: relative; font-size: 11px; line-height: 17px; z-index: -9; } .typography .event p.date { font-family: Georgia, 'Times New Roman', serif; font-size: 14px; font-style: italic; padding: 10px 0; margin: 0 0 20px 0; border-bottom: 1px dotted #14204B; border-top: 1px dotted #14204B; } .typography a.block { position: absolute; display: block; width: 100%; top: 0; left: 0; bottom: 0; z-index: -1; } /* User Forms - */ #UserDefinedForm .optionset ul li, #BirthingForm .optionset ul li { width: 48%; display: inline-block; } .middleColumn ul#Form_Form_EditableRadioField73 li, .middleColumn ul#Form_Form_EditableRadioField78 li { width: 30%; display: inline-block; } .middleColumn ul#Form_Form_EditableRadioField213 li { width: 22%; display: inline-block; } #UserDefinedForm .typography .right, #BirthingForm .typography .right { text-align: left; } #UserDefinedForm .typography div.left, #UserDefinedForm .typography div.right, #BirthingForm .typography div.left, #BirthingForm .typography div.right{ width: 48%; margin: 0; } #UserDefinedForm .typography div.left, #BirthingForm .typography div.left { float: left; } #EditableRadioField61, #EditableRadioField70 { width: 48%; padding-top: 28px; } #UserDefinedForm h5, #BirthingForm h5 { font-weight: normal; font-size: 18px; line-height: 18px; color: #999A80; padding: 0px 0px 15px 0px; margin: 0px; font-style: italic; font-family: Georgia,"Times New Roman",Times,serif; } #EditableCheckbox90, #EditableCheckbox129 { margin-top: -25px; margin-bottom: 25px; } .page-patient-information #sectionTilesInner .eachTileBox{ border-bottom: 0px; border-top: 10px solid #962527; } /* Eyecare Subsite */ .eyecareContent{ padding: 20px 0 !important; margin-bottom: 20px !important; } .eyecareContent h1, .eyecareContent h3 {text-align:center; margin:0px; font-family:Georgia, Arial, Helvetica, sans-serif; font-style:italic; border: none;} .eyecareContent h1 {font-size:36px; line-height:37px; padding:0px 0px 5px 0px; color:#999a80;} .eyecareContent h3 {font-size:16px; line-height:17px; padding:20px 0; color:#49547b; border: none;} .eyeIntroWrap{ width: 100%; width:90%; max-width:1280px; padding:30px 0px 30px 0px; margin:0px auto; position:relative; margin-bottom: 30px; } .eyeIntro{ width: 72%; min-height: 500px; border-bottom: 10px solid #018FB6; /*margin-right: 20px;*/ float: left; background: #f0f0ec; } .eyeIntro .leftImage{ width:30%; background-color: #f1f1f1; float: left; min-height: 500px; background-repeat: no-repeat; background-size: cover; margin-right: 30px; } .eyeIntro .rightContent{ float: left; width: 60%; } .eyeIntro .rightContent h2{ font-size: 30px; font-style: italic; padding: 20px 0 10px; border-bottom: 2px dotted #9e9f87; margin-bottom: 20px; } .eyeIntro .rightContent p{ } .eyeIntro .rightContent a.link{ color: #14204B; font-family:Georgia, Arial, Helvetica, sans-serif; font-style: italic; text-decoration: none; padding-top: 20px; display: block; border-top: 2px dotted #9e9f87; margin-bottom: 30px; font-size: 16px; } .eyeSidebar{ width: 25%; float: right; } .eyeSidebar .eachTileBox{ height: 500px !important; margin: 0; width: 100%; border-color: #018FB6; } .eyeSidebar .eachTileBox:hover .link{ color: #14204B; } .eyeSidebar h2{ color: #131f4c; font-size: 28px; font-style: italic; line-height: 30px; text-align: left; padding: 10px 0px 10px 0px; } .eyeSidebar .eachTileBox .link{ font-size: 16px; padding-top: 10px; font-style:italic; color: #999A80; display: inline-block; } #homeTiles .eachTileBoxText{ text-align: left; } #homeTiles .eachTileBoxText .link{ display: inline-block; margin-top: 15px; color: #9e9f87; font-style: italic; font-size: 17px; } #homeTiles .eachTileBoxText .link:hover, #homeTiles .eachTileBox:hover .link{ color: #14204B; } #homeTiles .eachTileBox{ border-color: #018FB6; height: 470px; } #homeTiles .eachTileBox .eachTileBoxContent{ height: 226px; } #mini-logo{ position: absolute; right: 0; top: 20px; } #backtosg{ position: absolute; top: 41px; right: 450px; padding:6px 15px; display: inline-block; color: #9e9f87; border: 1px solid #9e9f87; border-radius: 4px; text-decoration: none; } #backtosg:hover{ color: #14204B; border-color: #14204B; } @media all and (max-width:950px){ #backtosg{ position: absolute; top: 90px; right:150px; } .eyeIntro{ width: 100%; margin-bottom: 30px; height: 100%; min-height: 100%; float: none; } .eyeIntro .leftImage{ display: none; } .eyeIntro .rightContent{ width: 100%; float: none; } .eyeIntro .rightContent h2, .eyeIntro .rightContent p, .eyeIntro .rightContent a{ margin-left: 30px; margin-right: 30px; } .eyeSidebar{ width: 100%; float: none; } .eyeSidebar .eachTileBox{ height: 100% !important; } .eyeSidebar .eachTileBox img{ display: none; } .eyeSidebar .eachTileBox .eachTileBoxContent{ border-top-left-radius: 0px; transform: none; -webkit-transform: none; -ms-transform: none; } .eyeSidebar .eachTileBox .eachTileBoxContent .eachTileBoxText{ border-top-left-radius: 0px; transform: none; -webkit-transform: none; -ms-transform: none; width: 100%; padding-top: 30px; } .eyeSidebar .eachTileBox .eachTileBoxContent .eachTileBoxText h2, .eyeSidebar .eachTileBox .eachTileBoxContent .eachTileBoxText p, .eyeSidebar .eachTileBox .eachTileBoxContent .eachTileBoxText .link{ margin-left: 30px; margin-right: 30px; } } @media all and (max-width:700px){ #backtosg, .search-social{ display: none; } #mini-logo{ display: none; } } @media all and (max-width:600px){ #backtosg, .search-social{ display: none; } #mini-logo{ display: none; } /*#mini-logo{ right: 110px; top: 27px; } #mini-logo img{ width: 70%; }*/ }