#Banner-Container, #Education-Container, #Happy-Container, #Welcome-Container { width: 100%; margin: 0px; padding: 0px; position: relative; } #Services, #Doctor, #CentreSection { max-width: 1200px; min-width: 300px; margin: 0px auto; padding: 0px; position: relative; } /* ----- Banner CSS ----- */ #Banner-Container { background: #181817; } /*#Banner-Container video { max-width: 100%; width: 100%; object-fit: cover; z-index: 0; height: 100%; }*/ #Banner { max-width: 100%; min-width: 300px; margin: 0px auto; padding: 0px; position: relative; } .BannerContent { max-width: 1200px; min-width: 300px; margin: 0px auto; padding: 0px; position: relative; } .BannerVideo { max-width: 1400px; min-width: 300px; margin: 0px auto; padding: 0px; position: relative; } /*.Banner{ height: 720px; }*/ #Banner-Container .banner1 { background: url(/images/slider1-bg.jpg) no-repeat center bottom #000; } #Banner-Container .banner2 { background: url(/images/slider2-bg.jpg) no-repeat center bottom #000; } #Banner-Container .banner3 { } #Banner { height: 720px; } #Banner video { width: 100%; } /* .banner1 { background: url(/images/slider1-bg.jpg) no-repeat left bottom; } .banner1 .theme-L, .banner1 .theme-R { background: #000; } .banner2 { background: url(/images/slider2-bg.jpg) no-repeat left bottom; } .banner2 .theme-L, .banner2 .theme-R { background: #000; } .banner3 { background: url(/images/slider3-bg.jpg) no-repeat left bottom; } .banner3 .theme-L { background: url(/images/slider3-bg-l.jpg) no-repeat right bottom; } .banner3 .theme-R { background: url(/images/slider3-bg-r.jpg) no-repeat left bottom; }*/ /* Banner Content CSS */ .banContent { position: absolute; width: 55%; min-width: 300px; right: 5px; top: 260px; padding: 10px; text-align: right; } .banHead { text-transform: uppercase; font: 800 58px/65px "Montserrat", sans-serif; color: #fff; } .banHead span { font: 400 16px/20px "Montserrat", sans-serif; display: block; color: #fff; text-transform: initial; padding: 2px 5px; vertical-align: super; text-shadow: 0 0 5px #000, 0 0 20px #000, 0 0 10px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 110px #000; } .banTabs { position: absolute; z-index: 9; left: 50%; bottom: 10px; transform: translateX(-50%); } .banTabs li { width: 15px; height: 15px; margin: 1px 2px; display: inline-block; vertical-align: top; } .banTabs li a { width: 100%; height: 100%; display: block; border-radius: 100%; border: 1px solid #cc1a00; } .banTabs li a:hover, .banTabs li.Banner_here a { background: #cc1a00; } .banTabs li span { display: none; } #CentreSection { background: url(/images/center-bg.jpg) no-repeat 0px 0px; min-height: 1032px; } #CentreSection .theme-L { background: url(/images/center-bg-l.jpg) no-repeat right 0px; } #CentreSection .theme-R { background: url(/images/center-bg-r.jpg) no-repeat left 0px; } .carousel { text-align: center; font: 400 19px/28px "Montserrat", sans-serif; color: #fff; padding: 20px 0 0 0; width: 80%; margin: 0 auto; } .searchPlayer { width: 250px; height: 68px; background: url(/images/search-player-icon.png) no-repeat 0px 0px; position: relative; left: 0; right: 0; margin: 0 auto 20px auto; top: 40px; } .playerList { width: 720px; margin: 75px auto 55px auto; } .playerList #frm_search .ui-autocomplete-loading { background: #161616 url("/images/loading-new-latest.gif") calc(100% - 30px) center no-repeat !important; } /*.playerList #frm_search input[type="text"] { width: 100%; padding: 9px 15px; margin: 5px 0 22px 0; display: inline-block; border: 1px solid #c41901; background: url(/images/search-icon-w.png) calc(100% - 73px) center no-repeat; border-radius: 45px; font: 400 15px/20px "Montserrat", sans-serif; color: #fff; height: 56px; } .playerList #frm_search input[type="text"] { width: 90%; height: 64px; position: relative; background: url("/images/search-icon-w.png") calc(100% - 73px) center no-repeat !important; padding: 15px 15px 15px 30px; }*/ .ui-widget.ui-widget-content { border: 1px solid #404040 !important; border-radius: 20px; background: #404040; color: #fff; text-transform: uppercase; width: 702px !important; } #ui-id-2.ui-widget.ui-widget-content{ width: 400px !important; border: 1px solid #dddddd; background: #ffffff; color: #333333; border-radius: 0px; text-transform: uppercase; } .ui-state-disabled { color: #fff !important; } .playerList #frm_search input[type="text"]::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #fff; text-transform: uppercase; opacity: 1; } .playerList #frm_search input[type="text"]::-moz-placeholder { /* Firefox 19+ */ color: #fff; text-transform: uppercase; } .playerList #frm_search input[type="text"]:-ms-input-placeholder { /* IE 10+ */ color: #fff; text-transform: uppercase; } .playerList #frm_search input[type="text"]:-moz-placeholder { /* Firefox 18- */ color: #fff; text-transform: uppercase; } .playerList #frm_search input[type="text"]::placeholder { color: #fff; text-transform: uppercase; } #playerName { font: 300 14px/52px "Montserrat", sans-serif; background: none; border: none; color: #fff; width: 98%; padding: 14px 0px 14px 15px; text-transform: uppercase; letter-spacing: 1px; } .sportsIntra { position: absolute; right: 0; top: 58px; padding: 100px 100px 100px 240px; border-radius: 15px; background: url(/images/injuries-bg.jpg) no-repeat 0px center #000; } .sportsIntra h1 { color: #fff; font: 800 58px/62px "Montserrat", sans-serif; text-transform: uppercase; padding-bottom: 55px; } .Interactivity { position: relative; } .sportsIntra h1 span { font: 200 20px/24px "Montserrat", sans-serif; display: block; letter-spacing: 1.6px; } .sportsIntra ul li { font: 400 16px/16px "Montserrat", sans-serif; display: inline-block; vertical-align: top; text-align: center; color: #fff; text-transform: uppercase; position: relative; } .sportsIntra ul li:last-child { margin: 0px 0px 0px 50px; } .sportsIntra ul li:last-child::after { background: #404040; position: absolute; content: ''; left: -26px; top: 18px; height: 175px; width: 1px; } .sportsIntra ul li:hover { color: #cc1800; } .sportsIntra img { padding-bottom: 15px; } .sportsHero { position: absolute; width: 666px; height: 666px; background: #cc1a00; border-radius: 15px; } .hero { background: url(/images/hero-img.png) no-repeat 0px 0px; width: 242px; height: 694px; top: 55px; left: 180px; position: absolute; z-index: 2; } .sportsTxt { font: 800 115px/85px "Montserrat", sans-serif; color: #ab1802; text-transform: uppercase; /* writing-mode: sideways-lr; */ /* text-orientation: mixed; */ position: absolute; left: 135px; z-index: 1; bottom: 20px; transform-origin: left; transform: rotate(-90deg) translate(-10%, 39%); } .heroTabs ul li { position: absolute; } .heroTabs ul li a { display: block; width: 20px; height: 20px; background: #cc1a00; border-radius: 50%; border: 3px solid #fff; } .heroTabs ul li a:hover { background: #000; } .tab1 { left: 82px; top: 10px; } .tab2 { left: 106px; top: 106px; } .tab3 { right: 55px; top: 105px; } .tab4 { top: 140px; left: 55px; } .tab5 { top: 185px; right: 30px; } .tab6 { right: 1px; top: 236px; } .tab7 { top: 312px; left: 55px; } .tab8 { left: 7px; top: 332px; } .tab9 { top: 387px; right: 85px; } .tab10 { top: 475px; left: 80px; } .tab11 { top: 530px; right: 59px; } .tab12 { top: 635px; left: 33px; } .tab13 { right: 44px; top: 630px; } .IntraMain { width: 242px; height: 694px; } .IntraMain .rslides .slider { width: auto; height: auto; } .heroTabs ul li { position: absolute; z-index: 999; } .IntraHero li a { font: 600 14px/14px "Montserrat", sans-serif; background: #fff; color: #cc1800; text-transform: uppercase; padding: 11px 25px; min-width: 90px; display: block; } #IntraHero0 { left: -20px; top: 6px; } #IntraHero1 { top: 100px; left: -106px; } #IntraHero2 { top: 98px; left: 192px; } #IntraHero3 { top: 130px; left: -46px; } #IntraHero4 { top: 179px; left: 219px; } #IntraHero5 { top: 230px; left: 244px; } #IntraHero6 { top: 302px; left: -132px; } #IntraHero7 { top: 322px; left: -168px; } #IntraHero8 { top: 381px; left: 165px; } #IntraHero9 { top: 464px; left: -85px; } #IntraHero10 { top: 518px; left: 188px; } #IntraHero11 { top: 625px; left: -107px; } #IntraHero12 { top: 626px; left: 201px; } .nodisplay { font: 600 24px/24px "Montserrat", sans-serif; display: none; position: relative; z-index: 1; color: #fff; background: rgba(214, 78, 60, 0.9); width: 58px; height: 58px; border-radius: 50%; border: 3px solid #fff; left: -22px; top: -22px; padding: 11px 0px 0px 0px; text-align: center; } .IntraHero_here .nodisplay { display: block; } .IntraHero li a::after { width: 20px; height: 36px; position: absolute; left: -19px; content: ''; top: 0px; background: url(https://assets.yourpractice.online/2910/hero-hover-left-bg.png) no-repeat 0px 0px; } #IntraHero0 a::after { right: 78%; } #IntraHero1 a::after { right: 88%; } #IntraHero6 a::after { right: 87%; } #IntraHero7 a::after { right: 87%; } #IntraHero9 a::after { right: 86%; } #IntraHero11 a::after { right: 84%; } #IntraHero2 a::after, #IntraHero4 a::after, #IntraHero5 a::after, #IntraHero8 a::after, #IntraHero10 a::after, #IntraHero12 a::after { left: 100%; } #IntraHero10 a { display: block; width: 130px; padding: 11px 25px; } #IntraHero10 a::after { top: 0px; } .shoulderHero a:after, .armHero a:after, .elbowHero a:after, .thighHero a:after, .calfHero a:after, .ankleHero a:after { display:none; } /*#IntraHero2 a::after { left: 30%; } #IntraHero4 a::after { left: 44%; } #IntraHero5 a::after { left: 36%; } #IntraHero8 a::after { left: 39%; } #IntraHero10 a::after { left: 32%; } #IntraHero12 a::after { left: 38%; }*/ /* new css for search box */ /* Container for the search box */ .search-container { position: relative;/*display: flex; align-items: center;*/ } /* Textbox styling */ .search-container input[type="text"] { width: 100%; padding: 9px 15px; /*margin: 5px 0 22px 0;*/ display: inline-block; border: 1px solid #c41901; /*background: url(/images/search-icon-w.png) calc(100% - 30px) center no-repeat;*/ border-radius: 45px; font: 400 15px/20px "Montserrat", sans-serif; color: #fff; height: 56px; outline: none; } .search-container button { position: absolute; background-color: transparent; border: none; cursor: pointer; transition: opacity 0.3s ease; opacity: 1; position: absolute; top: 33px; right: 21px; transform: translateY(-50%); background-color: transparent; font-size: 24px; height: 60px; width: 60px; } .search-container .placeholder-text { position: absolute; left: 15px; top: 17px; color: #aaa; font-size: 16px; transition: 0.3s ease; pointer-events: none; } .search-container input:focus + .placeholder-text, .search-container input:not(:placeholder-shown) + .placeholder-text, .search-container .placeholder-text.move-up { top: -26px; font-size: 14px; color: #fff; font-family: "Montserrat", sans-serif; } .search-container button:focus { outline: none; } #keywords-error { color: red; display: none; padding-left: 19px; position: absolute; } #frm_search button { font-size: 0; } @media screen and (max-width: 1400px) { #Banner { height: 698px; } } @media screen and (max-width: 1200px) { #Banner { height: 617px; } } @media screen and (max-width: 1190px) { .banContent { width: 60%; top: 300px; padding: 10px; text-align: right; } .banHead { font: 800 45px/50px "Montserrat", sans-serif; } } @media screen and (max-width: 1100px) { .sportsHero { position: relative; margin: 0px auto; } .sportsIntra { position: static; padding: 100px 0px; text-align: center; } #Banner-Container .banner1 { background-position: left bottom; } #Banner-Container .banner2 { background-position: left bottom; } #Banner-Container .banner3 { background-position: 50% bottom; } .BannerVideo video { width: 100%; } #Banner { height: auto; } } @media screen and (max-width: 640px) { #Banner-Container { padding-top: 0px; } .banHead { font: 800 28px/36px "Montserrat", sans-serif; } .banContent { width: 90%; top: 35px; transform: none; text-align: center; margin: 0px auto; left: 0; right: 0; padding: 0; } #Banner ul li { background-size: 100% auto; } #Banner-Container ul li { background-size: 100% auto; } .banner1 { background-position: 55px bottom; } .banner2 { background-position: 100px bottom; } .banner3 { background-position: center bottom; } .playerList { width: 85%; } .sportsHero { width: 90%; margin-bottom: 60px; } .sportsTxt { font: 800 98px/72px "Montserrat", sans-serif; left: 100px; } #Banner { display: none; } } @media screen and (max-width: 600px) { .search-container input[type="text"] { font-size: 14px; padding: 8px 36px 8px 8px; } .search-container button { font-size: 14px; right: 8px; } .search-container .placeholder-text { font-size: 14px; } .hero { left: 100px; scale: 85%; } .sportsIntra { padding: 50px 0px; } .sportsIntra h1 { font: 800 36px/36px "Montserrat", sans-serif; } .sportsIntra h1 span { font: 200 13px/18px "Montserrat", sans-serif; } .sportsIntra ul li { width: 160px; font: 400 17px/22px "Montserrat", sans-serif; } .sportsIntra ul li span { display: block; } .sportsIntra ul li:last-child::after { top: 14px; height: 115px; } .banHead span { font: 300 11px/20px "Montserrat", sans-serif; } .ui-widget.ui-widget-content { width: 88% !important; } .hero { left: 90px; scale: 70%; top: 0px; } .sportsHero { height: 570px; } .IntraHero li a::after { left: -19px; } #IntraHero2 a::after, #IntraHero4 a::after, #IntraHero5 a::after, #IntraHero8 a::after, #IntraHero10 a::after, #IntraHero12 a::after { left: 99%; } } @media screen and (max-width: 550px) { #Banner-Container { display: block; } .carousel { font-size:14px; line-height: 20px; } } @media screen and (max-width: 480px) { .searchPlayer { top: 4px; } .playerList { margin-top: 8px; } } @media screen and (max-width: 410px) { .sportsIntra h1 { font: 800 34px/34px "Montserrat", sans-serif; } .sportsIntra h1 span { font: 200 11px/18px "Montserrat", sans-serif; } .sportsIntra ul li { width: 120px; font: 400 15px/18px "Montserrat", sans-serif; } .sportsIntra ul li:last-child::after { height: 95px; } .hero { left: 32px; scale: 55%; top: -90px; } .sportsTxt { font: 800 63px/72px "Montserrat", sans-serif; } .sportsHero { height: 430px; } }