EVOLUTION-NINJA
Edit File: main.css
html, body{ margin: 0 !important; padding: 0 !important; font-size:14px !important; font-family: 'Lato', sans-serif!important ; overflow-x: hidden !important; } /*--------------------------------Login---------------------------------*/ /* .login{ background: url(../images/login-background.jpg)center center / cover no-repeat fixed; padding: 8%; height: 760px; } .login-form{ background-color: #fff; border-radius: 8px; text-align: center; padding: 20px; height: 490px; } .login-form h5{ color: #7ABFFF; font-weight: 600; margin: 20px 0; } .login-form .form-control{ border-left: 0; border-right: 0; border-top: 0; border-bottom: 2px solid #7ABFFF; } #user-icon{ position: absolute; left: 380px; top: 185px; } .login-form .form-control:focus{ border: 0!important; } .login-form button{ background-color:#7ABFFF; color: #fff; padding: 5px 30px; border-radius: 15px; margin-top: 30px; } @media only screen and (min-width:320px) and (max-width:640px){ #user-icon{ left: 252px; top: 125px; } .input-group-append{ margin-top: -30px!important; margin-left: 221px!important; } } .add img:hover{ background-color: lightgrey; border-radius: 50%; } */ /*===============================LOGIN===========================*/ .login-flow{ padding: 5% 3%; } .login-left img{ height: 489px; } .login-box{ box-shadow: 0px 0px 10px lightgrey; border-radius: 12px; } .login-right{ padding: 10px; } .txt-center{ text-align:center; color: #E44A24; } .login-right .form-control{ border-radius: 25px; } .login-right a{ color: #0065A3; } .login-right a:hover{ color: #0065A3; text-decoration: none; } .login-right .form-group{ margin-bottom: 0; } .login-right button{ background-color: #E44A24; border-radius: 25px; padding: 8px 25px; color: #fff; display: block; margin: 0 auto; margin-top: 0px; } .new-user a{ display: block; text-align: center; margin-top: 10px; color:#9B9B9B; font-weight: 600; } .new-user a:hover{ color:#0b5077; } .links{ text-align: center; margin-top: 5px; } .links img{ height: 25px; } #forgot a:hover{ color:#0b5077; font-weight: 600; } .w3-dropdown-content{ margin-left:-30px!important; padding: 10px!important; background-color:#EFF3FC!important; } .go-back-mob{ display: none; } @media only screen and (min-width:320px) and (max-width:640px){ .login-left img{ display: none; } /*.login-forgot{ margin-left: 18%!important; }*/ #eye-login{ margin-left: 240px!important; } .select-pat-mobile{ display: none; } #mob-edit{ padding: 5px 35px!important; } #del{ padding: 5px 35px!important; } .go-back-mob{ margin-top: 20px; margin-bottom: 20px; float: right; display:block; } .go-back-mob a { background-color: #00AEFF; color: #fff; padding: 10px 13px; border-radius: 15px; } } /*--------------------------GA-----------------------*/ .ga { box-shadow: 0px 0px 8px lightgrey; padding: 30px; } /*--------------------------------header-------------------------------*/ .header{ padding: 20px 15px; border-bottom: 2px solid #000; } #logo{ width: 70%; } .right-menu{ text-align:end; padding-top: 20px; padding-right:30px; } .right-menu ul{ list-style-type: none; padding-left: 0; padding-top: 15px; } .right-menu li{ display: inline-block; /* padding-right: 5%;*/ color: #000; font-weight: 600; cursor: pointer; padding-left: 20px; } /*==========================================Home-Left==============================*/ /*.add-patient{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 800px; }*/ .main{ padding: 2%; } .box{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; } .box h5{ color:#E34520; font-size: 15px; font-weight: normal; } .search{ display: flex; } .form-group{ margin-right: 20px; } .add{ margin:5px 0; } .add a:hover{ background-color:#1974A7; padding: 5px 10px; color:#fff!important; border-radius: 8px; } .add a{ color:#00549A!important; cursor: pointer; font-size: 15px; margin-left: 20px; font-weight: 600; } .add i{ color:#E65B39; } .add i:hover{ color:#fff!important; } .patient-list{ border: 1px solid lightgrey; height: 400px; border-radius: 8px; margin-top: 15px; padding: 12px; } .patient-list a{ color: #A7A7A7; } .patient-list a:hover{ text-decoration: none; color: #A7A7A7; } .form-check{ margin-top: 12px; color:#495057; } .patient-summary p{ border: 1px solid lightgrey; box-shadow: 0px 0px 3px lightgrey; padding: 8px; color: #495057; margin: 10px; border-radius: 8px; } .patient-summary span{ float: right; } @media only screen and (min-width:992px) and (max-width:1024px){ .search{ display: block!important; } .patient-summary p{ margin: 0!important; font-size: 12px; } } @media only screen and (min-width:641px) and (max-width:991px){ .search{ display: block!important; } .patient-summary p{ margin: 0!important; font-size: 12px; } } /*========================================TABS================================*/ .nav-tabs{ border-bottom: 2px solid #9E9E9E!important; } .nav-tabs { display: inline-flex; width: 100%; overflow-x: auto; border-bottom: 2px solid #DDD; -ms-overflow-style: none; /*// IE 10+*/ overflow: -moz-scrollbars-none;/*// Firefox*/} .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover { border-width: 0; } .nav-tabs>li>a { border: none; color: #666; } .nav-tabs>li.active>a, .nav-tabs>li>a:hover { border: none; color: #2499DB !important; background: transparent; text-decoration: none; } .nav-tabs>li.active>a::after, .nav-tabs>li:hover>a::after { transform: scale(1); } .tab-nav>li>a::after { background: #21527d none repeat scroll 0% 0%; color: #fff; } .tab-pane { padding: 15px 0; } /*.tab-content { padding: 20px }*/ .nav-tabs::-webkit-scrollbar { display: none; /*Safari and Chrome*/ } .card { background: #FFF none repeat scroll 0% 0%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); margin-bottom: 30px; display: block; } .nav>li>a { position: relative; display: block; padding: 10px 15px; font-weight: bold; color: #000!important; } .nav{ flex-wrap: inherit; } @media only screen and (min-width:320px) and (max-width:640px){ .nav-tabs{ background-color: #A6D6FC; /* flex-wrap: nowrap!important;*/ } .nav-tabs{ display: -webkit-box!important; } #new-head{ float: initial!important; } .nav-tabs>li.active>a, .nav-tabs>li>a:hover { border: 2px solid #000; color:#239BDA !important; background: transparent; text-decoration: none; } .nav-tabs a{ font-size: 10px; } .nav>li>a{ padding: 5px 7px; } .right-menu li{ padding-left: 10px; } } @media only screen and (min-width:992px) and (max-width:1024px){ } /*============================ADD PATIENT===============================*/ .add-patient .form-control{ border-radius: 15px; width: 80%; } #add-header{ border-bottom: 2px solid #379FFF; } .add-patient label{ color: #303030; font-weight: 600; } .tp{ padding: 5px 15px; border-radius: 50px; } .tp_hr{ width: 30px!important; } .tp_min{ width: 30px!important; } .mandat{ color: red!important; padding-left: 5px; font-size: 18px; font-weight: 600; } .heigh ul{ list-style-type: none; display: flex; padding-left: 0; } .heigh li{ display: inline-block; display: flex; } #hieght{ width:60%; margin-right: 8px; } .btn-save{ background-color: #2499DB!important; padding: 5px 45px!important; color: #fff!important; border-radius: 20px; border: 0; cursor: pointer; } .btn-close{ background-color: #0B5077!important; padding: 5px 45px!important; color: #fff!important; border-radius: 20px; border: 0; cursor: pointer; } /*=================================PATINET-DETAILS====================*/ .btn-edit{ background-color: #2499DB!important; padding: 5px 45px!important; color: #fff!important; border-radius: 20px; border: 0; cursor: pointer; } .btn-upload{ background-color: #B45803!important; padding: 5px 45px!important; color: #fff!important; border-radius: 20px; border: 0; cursor: pointer; } .btn-close{ background-color: #0B5077!important; padding: 5px 45px!important; color: #fff!important; border-radius: 20px; border: 0; cursor: pointer; } .pat-table{ margin-top: 15px; margin-bottom: 15px; border: 1px solid #E5E5E5; box-shadow: 0px 0px 3px lightgrey; } .pat-table2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .pat-table2 table{ margin-bottom: 0; } .pat-table thead{ background-color: #E2E2E2; } .pat-table tbody{ color: #828282; } .pat-table td{ color: #5f5c5c; font-weight: 600; } .bg-pat2{ background-color: #D7F0FF; width: 40%; } #patid{ width: 15%; } #patid1{ width: 15%; } #patid2{ width: 20%; } /*===============================================EDIT-PATIENT=============================*/ .edit-patient .form-control{ border-radius: 15px; width: 80%; } .edit-patient label{ color: #303030; font-weight: 600; } @media only screen and (min-width:320px) and (max-width:640px){ .heigh ul{ display: block!important; } .heigh li{ margin: 10px; } #patid{ width: auto; } #patid1{ width: auto; } #patid2{ width: auto; } #pre-pro{ width: auto!important; } #del{ padding: 5px 20px!important; } } /*=======================================HISTORY==============================*/ .history table{ border: 1px solid #E5E5E5; box-shadow: 0px 0px 3px lightgrey; } .history thead { background-color: #E2E2E2; } /*==============================================E-CONSENT=================================*/ .e-consent h5{ text-align: center; position: relative; } .e-consent h5::after{ position: absolute; content: ''; border-bottom: 2px solid #2499DB; width: 165px; top: 25px; left: 0; right: 0; margin: 0 auto; } .e-consent a{ margin-left: 8px; } .e-consent p{ text-align: center; color: #9B9B9B; font-size: 15px; margin: 15px 0!important; } .e-consent .custom-check{ display: flex; justify-content: center; } .custom-check .form-check{ margin-right: 25px; font-size: 15px; } .email-to-patient{ box-shadow: 0px 0px 5px lightgrey; padding: 10px; margin-top: 5%; } .email-to-patient h5{ text-align: center; } .text-patient{ width: 100%; height: 55px; border: 1px solid lightgrey; margin-bottom: 20px; } .text-patient input{ border: 0; width: 100%; height: 50px; } .email-to-patient button{ float: right; background-color: #2499DB; border: 0; padding: 5px 30px; border-radius: 20px; color: #fff; cursor: pointer; margin-top: 20px; } #consent-tag{ margin-bottom: 10px; } /*========================================ADD PREOP==================================*/ .add-preop{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 800px; } .add-preop h3{ font-weight: 600; border-bottom: 2px solid #379FFF; padding-bottom: 8px; margin-bottom: 12px; } .btn-add-preop{ background-color: #2499DB; color: #fff; border: 0; padding: 8px 75px; cursor: pointer; } .add-preop .form-control{ border-radius: 15px; width: 80%; } .add-preop label{ color:#4A4A4A; font-weight: 600; } #add-minimal{ display: flex; } #add-minimal input{ margin-top: 3px; } /* Switch 1 Specific Styles Start */ .box_1{ margin-right: 10px; } input[type="checkbox"].switch_1{ font-size: 12px; -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 3.5em; height: 1.5em; background: #ddd; border-radius: 3em; position: relative; cursor: pointer; outline: none; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } input[type="checkbox"].switch_1:checked{ background: #0ebeff; } input[type="checkbox"].switch_1:after{ position: absolute; content: ""; width: 1.5em; height: 1.5em; border-radius: 50%; background: #fff; -webkit-box-shadow: 0 0 .25em rgba(0,0,0,.3); box-shadow: 0 0 .25em rgba(0,0,0,.3); -webkit-transform: scale(.7); transform: scale(.7); left: 0; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } input[type="checkbox"].switch_1:checked:after{ left: calc(100% - 1.5em); } .togle{ display: flex; } .togle label{ margin-right: 15px; width: 60%; font-size: 12px; } .t-switch{ border: 1px solid lightgrey; border-radius: 8px; margin-bottom: 15px; padding: 8px; } .t-switch ul{ list-style-type: none; padding-left: 5px; } .t-switch li{ width: 31%; display: inline-block; } #spine{ color: red; } @media only screen and (min-width:320px) and (max-width:640px){ .add-preop{ width: auto!important; } .togle{ display: initial; } .t-switch li{ width: initial; display: initial; } .btn-procedure1{ width: 100%!important; } #surgery_option_input{ width: 280px!important; } #clear{ left: 285px!important; } .btn-procedure{ width: 100%!important; } #persentage_tage small{ display: none; } #persentage_tage1 small{ display: none; } #persentage_tage2 small{ display: none; } #persentage_tage3 small{ display: none; } #persentage_tage4 small{ display: none; } #persentage_tage5 small{ display: none; } } @media only screen and (min-width:641px) and (max-width:991px){ .add-preop{ width: auto!important; } } @media only screen and (min-width:992px) and (max-width:1024px){ .add-preop{ width: auto!important; } } /*============================== PRE-OP-DETAILS===========================*/ .pre-op-details .btn-delete{ background-color: #0B5077!important; padding: 5px 45px!important; color: #fff!important; border-radius: 20px; border: 0; cursor: pointer; } .preop-table{ margin-top: 15px; margin-bottom: 15px; border: 1px solid #E5E5E5; box-shadow: 0px 0px 3px lightgrey; } .preop-table thead{ background-color: #E0E0E0; } .preop-table thead th{ color: #2A2A2A!important; font-weight: 500; } .preop-table tbody td{ color: #5f5c5c; font-weight: 600; } #pre-op-head{ width: 20%; } .preop-table2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .preop-table2 table{ margin-bottom: 0; } /*====================================EDIT PRE-OP=========================*/ .edit-preop .form-control{ border-radius: 15px; width: 80%; } .edit-preop label{ color:#4A4A4A; font-weight: 600; } /*.edit-preop .t-switch{ border: 0; }*/ /*===================================PROCEDURE START==========================*/ .comb-spinal-epi{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 900px; margin-top: 20px; } .comb-spinal-epi h3{ font-weight: 600; border-bottom: 2px solid #379FFF; padding-bottom: 8px; margin-bottom: 12px; } .procedure-buttons{ padding: 3%; } .btn-procedure{ background-color: #2499DB!important; padding: 8px 45px!important; color: #fff!important; border: 0; cursor: pointer; width: 30%; border-radius: 5px; font-weight: 600; text-align: left; } .btn-procedure1{ background-color: lightgrey!important; padding: 8px 45px!important; color: #000!important; border: 0; cursor: pointer; width: 30%; border-radius: 5px; font-weight: 600; text-align: left; } .btn-procedure:hover{ text-decoration: none; } #spinal-epi .modal-lg{ max-width: 900px!important; } .comb-spinal-epi .form-control{ border-radius: 15px; width: 80%; } .comb-spinal-epi label{ color:#4A4A4A; font-weight: 600; } .comb-spinal-epi .modal-body{ padding: 2 rem!important; } .comb-spinal-epi button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } .human-skeleton button{ position: absolute; left: 397px; top: 41px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #c2-3{ position: absolute; left: 400px; top: 62px; padding: 0px 10px; cursor: pointer!important; } #c2-4{ position: absolute; left: 363px; top: 78px; padding: 0px 10px; cursor: pointer!important; } #c2-5{ position: absolute; left: 396px; top: 95px; padding: 0px 10px; cursor: pointer!important; /* background-color: red; color: #fff; */ } #c2-6{ position: absolute; left: 325px; top: 105px; padding: 0px 10px; cursor: pointer!important; } #c2-7{ position: absolute; left: 397px; top: 118px; padding: 0px 10px; cursor: pointer!important; } #c2-8{ position: absolute; left: 292px; top: 128px; padding: 0px 10px; cursor: pointer!important; } #c2-9{ position: absolute; left: 266px; top: 148px; padding: 0px 10px; cursor: pointer!important; } #c2-10{ position: absolute; left: 313px; top: 157px; padding: 0px 10px; cursor: pointer!important; } #c2-11{ position: absolute; left: 261px; top: 172px; padding: 0px 10px; cursor: pointer!important; } #c2-12{ position: absolute; left: 313px; top: 181px; padding: 0px 10px; cursor: pointer!important; } #c2-13{ position: absolute; left: 263px; top: 195px; padding: 0px 10px; cursor: pointer!important; } #c2-14{ position: absolute; left: 313px; top: 205px; padding: 0px 10px; cursor: pointer!important; } #c2-15{ position: absolute; left: 264px; top: 220px; padding: 0px 10px; cursor: pointer!important; } #c2-16{ position: absolute; left: 313px; top: 231px; padding: 0px 10px; cursor: pointer!important; } #c2-17{ position: absolute; left: 257px; top: 249px; padding: 0px 10px; cursor: pointer!important; } #c2-18{ position: absolute; left: 303px; top: 260px; padding: 0px 10px; cursor: pointer!important; } #c2-19{ position: absolute; left: 252px; top: 278px; padding: 0px 10px; cursor: pointer!important; } #c2-20{ position: absolute; left: 301px; top: 292px; padding: 0px 10px; cursor: pointer!important; } #c2-21{ position: absolute; left: 263px; top: 309px; padding: 0px 10px; cursor: pointer!important; } #c2-22{ position: absolute; left: 310px; top: 322px; padding: 0px 10px; cursor: pointer!important; } #c2-23{ position: absolute; left: 263px; top: 341px; padding: 0px 10px; cursor: pointer!important; } #c2-24{ position: absolute; left: 310px; top: 354px; padding: 0px 10px; cursor: pointer!important; } #c2-25{ position: absolute; left: 263px; top: 374px; padding: 0px 10px; cursor: pointer!important; } #c2-26{ position: absolute; left: 361px; top: 386px; padding: 0px 10px; cursor: pointer!important; } #proced-plus button{ border: 0; background: 0; cursor: pointer; background-color: #979797; color: #fff; border-radius: 50%; padding: 0 10px; margin: 0 5px; } .procedure-cse{ border: 1px solid lightgrey; padding: 10px; border-radius:8px; } .procedure-cse .pac-box{ background-color: transparent!important; } .analg-box{ border: 1px solid lightgrey; padding: 10px; border-radius:8px; } .tech-compli ul{ list-style-type: none; } .tech-compli li{ display: inline-block; margin-right: 10px; } .success-list{ list-style-type: none; padding-left: 0; } .success-list li{ display: inline-block; margin-right: 5px; } .sensor-table thead{ text-align: center; } #bg-t2{ background-color: red; } #bg-l1{ background-color: green; } .index-color ul{ list-style-type: none; } .index-color li{ display: inline-block; } .index-color span{ vertical-align: super; } .highest{ background-color: red; padding: 12px; } .lowest{ background-color: green; padding: 12px; } .duration ul{ list-style-type: none; padding-top: 15px; } .duration li{ display: inline-block; margin: 0 8px; width: 16%; } @media only screen and (min-width:320px) and (max-width:640px){ #edit-comb-spinal .modal-lg{ padding: 1rem; } #edit-epidural .modal-lg{ padding: 1rem; } #edit-csa-page .modal-lg{ padding: 1rem; } .comb-spinal-epi{ width: auto; } .human-skeleton button{ font-size: 5px; } .human-skeleton button{ left: 110px; } .duration li{ width: 80%; } #cse-tag h5{ position: relative; top: 164px; text-align: initial!important; } .spinal-tag{ position: relative; top: 15px!important; } /* #c1-2{ left: 141px!important; top: 25px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-3{ left: 141px!important; top: 37px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-4{ left: 121px!important; top: 48px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-5{ left: 141px!important; top: 58px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-6{ left: 100px!important; top: 64px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-7{ left: 140px!important; top: 71px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-8{ left: 77px!important; top: 77px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-9{ left: 64px!important; top: 88px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-10{ left: 91px!important; top: 95px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-11{ left: 61px!important; top: 102px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-12{ left: 91px!important; top: 110px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-13{ left: 61px!important; top: 117px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-14{ left: 91px!important; top: 125px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-15{ left: 62px!important; top: 132px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-16{ left: 91px!important; top: 141px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-17{ left: 58px!important; top: 150px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-18{ left: 85px!important; top: 158px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-19{ left: 55px!important; top: 167px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-20{ left: 84px!important; top: 176px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-21{ left: 62px!important; top: 186px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-22{ left: 90px!important; top: 194px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-23{ left: 62px!important; top: 206px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-24{ left: 90px!important; top: 213px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-25{ left: 58px!important; top: 225px!important; padding: 0px 7px!important; font-size: 5px!important; } #c2-26{ left: 117px!important; top: 233px!important; padding: 0px 7px!important; font-size: 5px!important; }*/ #c1-2{ /* left: 141px!important; top: 25px!important;*/ left: 133px!important; top: 65px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-3{ left: 134px!important; top: 93px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-4{ /*left: 121px!important; top: 48px!important;*/ left: 112px!important; top: 118px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-5{ /*left: 141px!important; top: 58px!important;*/ left: 131px!important; top: 141px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-6{ /* left: 100px!important; top: 64px!important;*/ left: 90px!important; top: 160px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-7{ /* left: 140px!important; top: 71px!important;*/ left: 132px!important; top: 177px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-8{ /*left: 77px!important; top: 77px!important;*/ left: 66px!important; top: 191px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-9{ /* left: 64px!important; top: 88px!important;*/ left: 55px!important; top: 216px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-10{ /*left: 91px!important; top: 95px!important;*/ left: 82px!important; top: 233px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-11{ /*left: 61px!important; top: 102px!important;*/ left: 50px!important; top: 253px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-12{ /* left: 91px!important; top: 110px!important;*/ left: 84px!important; top: 269px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-13{ /* left: 61px!important; top: 117px!important;*/ left: 52px!important; top: 285px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-14{ /* left: 91px!important; top: 125px!important;*/ left: 83px!important; top: 303px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-15{ left: 53px!important; top: 324px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-16{ /* left: 91px!important; top: 141px!important;*/ left: 82px!important; top: 341px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-17{ /*left: 58px!important; top: 150px!important;*/ left: 47px!important; top: 363px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-18{ left: 71px!important; top: 385px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-19{ left:43px!important; top: 406px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-20{ left: 70px!important; top: 428px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-21{ /*left: 62px!important; top: 186px!important;*/ left: 53px!important; top: 454px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-22{ /* left: 90px!important; top: 194px!important;*/ left: 83px!important; top: 474px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-23{ left: 53px!important; top: 501px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-24{ /*left: 90px!important; top: 213px!important;*/ left: 81px!important; top: 521px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-25{ /*left: 58px!important; top: 225px!important;*/ left: 48px!important; top: 552px!important; padding: 0px 7px!important; font-size:9px!important; } #c2-26{ /* left: 117px!important; top: 233px!important; padding: 0px 7px!important; font-size: 5px!important;*/ left: 105px!important; top: 567px!important; padding: 0px 7px!important; font-size: 9px!important; } /*.btn-procedure{ width: initial; } */ } @media only screen and (min-width:641px) and (max-width:991px){ .comb-spinal-epi{ width: auto!important; } .human-skeleton button{ left: 210px; } #c2-3{ left: 211px; } #c2-4{ left: 174px; } #c2-5{ left: 212px; } #c2-6{ left: 141px; } #c2-7{ left: 207px; } #c2-8{ left: 101px; } #c2-9{ left: 78px; } #c2-10{ left: 126px; } #c2-11{ left: 74px; } #c2-12{ left: 125px; } #c2-13{ left: 76px; } #c2-14 { left: 125px; } #c2-15{ left: 77px; } #c2-16{ left: 126px; } #c2-17{ left: 70px; } #c2-18{ left: 114px; } #c2-19{ left: 64px; } #c2-20{ left: 113px; } #c2-21 { left: 75px; } #c2-22 { left: 126px; } #c2-23{ left: 78px; } #c2-24 { left: 125px; } #c2-25 { left: 74px; } #c2-26 { left: 166px; } .btn-procedure{ width: initial; } } @media only screen and (min-width:992px) and (max-width:1028px){ .comb-spinal-epi{ width: auto!important; } .human-skeleton button{ left: 301px; } #c2-3{ left: 302px; } #c2-4{ left: 266px; } #c2-5{ left: 300px; } #c2-6{ left: 232px; } #c2-7{ left: 300px; } #c2-8{ left: 192px; } #c2-9{ left: 170px; } #c2-10{ left: 218px; } #c2-11{ left: 166px; } #c2-12{ left: 219px; } #c2-13{ left: 168px; } #c2-14{ left: 219px; } #c2-15{ left: 168px; } #c2-16{ left: 218px; } #c2-17{ left: 162px; } #c2-18{ left: 207px; } #c2-19{ left: 156px; } #c2-20{ left: 208px; } #c2-21{ left: 170px; } #c2-22{ left: 220px; } #c2-23{ left: 170px; } #c2-24{ left: 218px; } #c2-25{ left: 164px; } #c2-26{ left: 258px; } } /*------------------------------------EPIDURAL-----------------------------*/ .epidural{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 900px; margin-top: 20px; } .epidural h3{ font-weight: 600; border-bottom: 2px solid #379FFF; padding-bottom: 8px; margin-bottom: 12px; } .epidural .form-control{ border-radius: 15px; width: 80%; } .epidural label{ color:#4A4A4A; font-weight: 600; } .epidural button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } #c1-2{ position: absolute; left: 397px; top: 41px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } @media only screen and (min-width:320px) and (max-width:640px){ .epidural{ width: auto; } .epi-tag{ top:15px!important; } .csa-tag{ top: 35px!important; } } @media only screen and (min-width:641px) and (max-width:991px){ .epidural{ width: auto; } #c1-2{ left: 209px; } } @media only screen and (min-width:992px) and (max-width:1028px){ .epidural{ width: auto; } #c1-2{ left: 305px; } } /*---------------------------------------SPINAL----------------------------*/ .spinal{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 900px; margin-top: 20px; } .spinal h3{ font-weight: 600; border-bottom: 2px solid #379FFF; padding-bottom: 8px; margin-bottom: 12px; } .spinal .form-control{ border-radius: 15px; width: 80%; } .spinal label{ color:#4A4A4A; font-weight: 600; } .spinal button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .spinal{ width: auto; } } @media only screen and (min-width:641px) and (max-width:991px){ .spinal{ width: auto; } #c1-2{ left: 209px; } } @media only screen and (min-width:992px) and (max-width:1028px){ .spinal{ width: auto; } #c1-2{ left: 305px; } } /*---------------------------------------ADD-CSA----------------------------*/ .add-csa{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 900px; margin-top: 20px; } .add-csa h3{ font-weight: 600; border-bottom: 2px solid #379FFF; padding-bottom: 8px; margin-bottom: 12px; } .add-csa .form-control{ border-radius: 15px; width: 80%; } .add-csa label{ color:#4A4A4A; font-weight: 600; } .add-csa button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .add-csa{ width: auto; } .csa-tag{ top:15px!important; position:relative; } } @media only screen and (min-width:641px) and (max-width:991px){ .add-csa{ width: auto; } #c1-2{ left: 209px; } } @media only screen and (min-width:992px) and (max-width:1028px){ .add-csa{ width: auto; } #c1-2{ left: 305px; } } /*--------------------------------COMBINED SPINAL VIEW PAGE---------------------*/ .combined-spinal-view{ padding: 2%; } .combined-spinal-table1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .combined-spinal-table1 table{ margin-bottom: 0; } .combined-spinal-cont .card-body{ padding: 1rem !important; } .combined-spinal-cont p{ color: #5f5c5c; font-size: 15px; } .combined-spinal-cont .card-header h5{ font-size: 14px!important; } .combined-spinal-card1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .combined-spinal-card1 .card-header{ background-color: #D7F0FF; } .combined-spinal-card2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .combined-spinal-card2 .card-header{ background-color: #E2E2E2!important; } .combined-spinal-card2 ul{ list-style-type: none; padding-left: 0; } .combined-spinal-card2 li{ display: inline-block; width: 20%; } .combined-spinal-card2 span{ color: #5f5c5c; } .combined-spinal-table2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .combined-spinal-table2 thead{ background-color:#E2E2E2; } .combined-spinal-table2 td{ color: #5f5c5c; } .body-img{ box-shadow: 0px 0px 3px lightgrey; padding: 10px; margin-top: 15px; } .body-img p{ color: #000!important; } .bromo-img{ box-shadow: 0px 0px 3px lightgrey; padding: 10px; margin-top: 15px; } /*---------------------------------COMBINED SPINAL EDIT PAGE-------------------------*/ .edit-combined-spinal .form-control{ border-radius: 15px; width: 80%; } .edit-combined-spinal label{ color:#4A4A4A; font-weight: 600; } #edit-comb-spinal .modal-lg{ max-width: 900px!important; } .edit-combined-spinal button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } /*--------------------------------EPIDURAL VIEW PAGE----------------------------------*/ .epidural-view{ padding: 3%; } .epidural-table1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .epidural-table1 table{ margin-bottom: 0; } .epidural-cont .card-body{ padding: 1rem !important; } .epidural-cont p{ color: #5f5c5c; font-size: 15px; } .epidural-cont .card-header h5{ font-size: 14px!important; } .epidural-card1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .epidural-card1 .card-header{ background-color: #D7F0FF; } .epidural-card2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .epidural-card2 .card-header{ background-color: #E2E2E2!important; } .epidural-card2 ul{ list-style-type: none; padding-left: 0; } .epidural-card2 li{ display: inline-block; width: 20%; } .epidural-card2 span{ color: #5f5c5c; } .epidural-table2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .epidural-table2 thead{ background-color:#E2E2E2; } .epidural-table2 td{ color: #5f5c5c; } .epidural-sensor-table thead{ text-align: center; } /*-----------------------------------EPIDURAL EDIT PAGE-------------------*/ .edit-epidural-page .form-control{ border-radius: 15px; width: 80%; } .edit-epidural-page label{ color:#4A4A4A; font-weight: 600; } #edit-epidural .modal-lg{ max-width: 900px!important; } .edit-epidural-page button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } /*----------------------------------SPINAL VIEW PAGE------------------------*/ .add-spinal-view{ padding: 3%; } .view-spinal-table1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .view-spinal-table1 table{ margin-bottom: 0; } .view-spinal-cont .card-body{ padding: 1rem !important; } .view-spinal-cont p{ color: #5f5c5c; font-size: 15px; } .view-spinal-cont .card-header h5{ font-size: 14px!important; } .view-spinal-card1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .view-spinal-card1 .card-header{ background-color: #D7F0FF; } .view-spinal-card2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .view-spinal-card2 .card-header{ background-color: #E2E2E2!important; } .view-spinal-card2 ul{ list-style-type: none; padding-left: 0; } .view-spinal-card2 li{ display: inline-block; width: 20%; } .view-spinal-card2 span{ color: #5f5c5c; } .view-spinal-table2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .view-spinal-table2 thead{ background-color:#E2E2E2; } .view-spinal-table2 td{ color: #5f5c5c; } .view-sensor-table thead{ text-align: center; } /*------------------------------------------SPINAL EDIT PAGE------------------------*/ .edit-spinal-page .form-control{ border-radius: 15px; width: 80%; } .edit-spinal-page label{ color:#4A4A4A; font-weight: 600; } #edit-spinal-page .modal-lg{ max-width: 900px!important; } .edit-spinal-page button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } /*----------------------------------------CSA VIEW PAGE---------------------------*/ .add-csa-view{ padding: 3%; } .csa-view-table1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .csa-view-table1 table{ margin-bottom: 0; } .csa-view-cont .card-body{ padding: 1rem !important; } .csa-view-cont p{ color: #5f5c5c; font-size: 15px; } .csa-view-cont .card-header h5{ font-size: 14px!important; } .csa-view-card1{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .csa-view-card1 .card-header{ background-color: #D7F0FF; } .csa-view-card2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 20px; } .csa-view-card2 .card-header{ background-color: #E2E2E2!important; } .csa-view-card2 ul{ list-style-type: none; padding-left: 0; } .csa-view-card2 li{ display: inline-block; width: 20%; } .csa-view-card2 span{ color: #5f5c5c; } .csa-view-table2{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .csa-view-table2 thead{ background-color:#E2E2E2; } .csa-view-table2 td{ color: #5f5c5c; } .csa-view-sensor-table thead{ text-align: center; } /*------------------------------------------CSA EDIT PAGE------------------------*/ .edit-csa .form-control{ border-radius: 15px; width: 80%; } .edit-csa label{ color:#4A4A4A; font-weight: 600; } #edit-csa-page .modal-lg{ max-width: 900px!important; } .edit-csa button{ background-color: transparent; border: 1px solid lightgrey; padding: 5px 35px; border-radius: 15px; } /*===================================PROCEDURE END============================*/ /*================================ADD-PACU============================*/ .add-pacu{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 900px; } .add-pacu h3{ font-weight: 600; border-bottom: 2px solid #379FFF; padding-bottom: 8px; margin-bottom: 12px; } .add-pacu .form-control{ border-radius: 15px; width: 80%; } .add-pacu label{ color:#4A4A4A; font-weight: 600; } #id{ display: flex; } #id a{ margin-left: 8px; } #id button{ border: 0; background: 0; cursor: pointer; background-color: #979797; color: #fff; border-radius: 50%; width: 40px; margin: 0 5px; } #id span{ margin-right: 8px; } .pac-box{ background-color: #F2F2F2; border-radius: 5px; display: flex; padding: 8px; } .pac-box ul{ list-style-type: none; padding-left: 0; } .pac-box li{ display: inline-block; } .pac-box input{ width: 15%!important; } .pac-box .form-control{ width: 75%!important; margin-right: 5px; } .pac-box p{ font-size: 12px; } .pacu-1{ width:15%; } .pacu-1-x{ width: 40%; } @media only screen and (min-width:320px) and (max-width:640px){ .add-pacu{ width: auto!important; } .pac-box{ display:block!important; } .pacu-1{ width: initial!important; margin: 5px; } .pacu-1-x{ width: initial!important; } } @media only screen and (min-width:641px) and (max-width:991px){ .add-pacu{ width: auto!important; } } @media only screen and (min-width:992px) and (max-width:1024px){ .add-pacu{ width: auto!important; } } /*==========================================PACU DETAILS=========================*/ .pacu-details{ padding: 2%; } .pac-table{ box-shadow: 0px 0px 3px lightgrey; margin-top: 15px; } .pac-table thead{ background-color:#E2E2E2; } /*============================================EDIT PACU=======================*/ .edit-pacu .form-control{ border-radius: 15px; width: 80%; } /*================================ADD FOLLOW-UP=======================*/ .add-follow-up{ box-shadow: 0px 0px 10px lightgrey; padding: 15px; border-radius: 8px; width: 800px; } .add-follow-up h3{ font-weight: 600; border-bottom: 2px solid #379FFF; padding-bottom: 8px; margin-bottom: 12px; } .add-follow-up .form-control{ border-radius: 15px; width: 80%; } .add-follow-up label{ color:#4A4A4A; font-weight: 600; } .followup-box{ background-color: #F2F2F2; border-radius: 5px; padding: 10px; } .followup-box ul{ list-style-type: none; padding-left: 0; } .followup-box li{ display: inline-block; width: 30%; } .followup-box input{ margin: 0 10px; } .plus{ background-color: #777777; color: #fff; width: 8%; padding: 5px 10px; border-radius: 25%; margin-top: 10px; } .late{ list-style-type: none; padding-left: 0; } .late li{ display: inline-block; } .late h4{ font-size: 18px; font-weight: 600; margin-right: 10px; } #plus { color: #fff; background-color: #858585; border-radius: 50%; padding: 3px; margin: 5px 0 0 10px; } @media only screen and (min-width:320px) and (max-width:640px){ .add-follow-up{ width: auto!important; } #follow-up-late label{ font-size: 14px; width: 80%!important; } .lac .form-check{ padding-left: 50px; } } @media only screen and (min-width:641px) and (max-width:991px){ .add-follow-up{ width: auto!important; } } @media only screen and (min-width:992px) and (max-width:1024px){ .add-follow-up{ width: auto!important; } } /*============================FOLLOWUP DETAILS===================*/ .followup-details{ padding: 2%; } /*=====================================EDIT FOLLOW UP START=====================*/ .edit-followup .form-control{ border-radius: 15px; width: 80%; } /*=====================================EDIT FOLLOW UP END=====================*/ /*==============================FEEDBACK=========================*/ #feed-tabs{ border-bottom: none!important; } #feed-tabs a{ background-color: #2499DB!important; padding: 5px 45px!important; color: #fff!important; border: 0; cursor: pointer; margin-right: 20px; text-decoration: none; } .feedback-manual h3{ font-weight: 600; text-align: center; padding-bottom: 8px; margin-bottom: 12px; position: relative; } .feedback-manual h3::after{ position: absolute; content: ''; border-bottom: 2px solid #379FFF; width: 180px; top: 35px; left: 0; right: 0; margin: 0 auto; } .feed-card{ box-shadow: 0px 0px 3px lightgrey; margin: 15px; } .card-header{ background-color: #D6EFFE!important; } .card-header h4{font-weight: 600;color: #000;} .feed-card ul{ list-style-type: none; padding-left: 0; } .feed-card li{ display: inline-block; width: 15%; font-weight: 600; } #first-case{ width: 30%; } .card-info1 h6{ color: #000; font-size: 16px; font-weight: 600; } .card-info1 span{ color: #4A4A4A; margin-left: 20px; font-size: 14px; font-weight: 600; } .card-info1 li{ width: initial!important; font-weight:initial!important; } .card-info1 .form-check-inline{ margin: 15px 0 10px 20px; } .pt{ padding-top: 15px; } .card-info1 .form-control{ border-radius:15px; margin: 15px; } .btn-submit{ background-color: #2499DB!important; padding: 5px 45px!important; color: #fff!important; border-radius: 20px; border: 0; cursor: pointer; text-align: end; } @media only screen and (min-width:320px) and (max-width:640px){ .feed-card li{ width: inherit; display: inherit; } #first-case{ width: inherit; } #feed-tabs{ background-color: transparent!important; flex-wrap:initial!important; } /*#feed-tabs li{ margin-top: 30px; }*/ #feed-tabs button{ padding:1px 45px!important;; } } /*===================================== Edit-feedback================================*/ .questions{ margin: 20px 0; } .questions h5{ font-weight: 600; } .questions .card-body p{ margin-bottom: 0!important; } /*=======================================NEW CHANGES==============================*/ .patient-list p{ cursor: pointer; } .patient-list p:hover{ background-color: lightgrey; padding: 5px; border-radius: 8px; } .patient-list p:hover{ color: #000!important; } .tip{ font-size:16px; padding-left:4px; } .ptb{ padding-top: 10px; padding-bottom: 10px; } .bt{ border-top: 2px solid lightgrey; margin-top: 15px; } /*.tooltip1 { position: relative; display: inline-block; opacity: initial!important; background-color: #007BFF; border-radius: 50%; color: #fff; font-size: 8px; } .tooltip1 .tooltiptext { visibility: hidden; width: 150px; background-color: black; color: #fff; text-align: center; border-radius: 6px; padding: 5px 0; font-size: 10px; position: absolute; z-index: 1; top: 100%; left: 50%; margin-left: -60px; } .tooltip1:hover .tooltiptext { visibility: visible; } */ .tooltip { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip .right { min-width:350px; max-width:400px; top:260%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color:#fff; background-color:#1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip:hover .right { visibility:visible; opacity:1; } .tooltip .text-content { padding:10px 20px; } .tooltip i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip .right i { position:absolute; top:15%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip .right i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ #tip{ padding-left: 24%; margin-top: -18px; } .tooltip .right{ top: 82px; left: -32%; min-width: 198px; } .tooltip .right i{ top: -4%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip .right i::after{ top: 95%; } .tooltip h6{ font-size: 11px; text-align: left!important; } } /*-----------------------------------------------------------*/ .tooltip-1 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-1 .right-1 { min-width:277px; max-width:400px; /* top:50%;*/ top: 240%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-1:hover .right-1 { visibility:visible; opacity:1; } .tooltip-1 .text-content-1 { padding:10px 20px; } .tooltip-1 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-1 .right-1 i { position:absolute; /*top:50%;*/ top: 17%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-1 .right-1 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-1 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-1 .right-1{ top: 78px; left: -712%; min-width: 215px; } .tooltip-1 .right-1 i{ top: -8%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-1 .right-1 i::after{ top: 95%; } .tooltip-1 h6{ font-size: 11px; } } /*-----------------------------*/ .tooltip-2 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-2 .right-2 { min-width:250px; max-width:400px; top:130%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; /* color:#fff; background-color:lightgrey;*/ color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-2:hover .right-2 { visibility:visible; opacity:1; } .tooltip-2 .text-content-2 { padding:10px 20px; } .tooltip-2 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-2 .right-2 i { position:absolute; top:25%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-2 .right-2 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-2 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-2 .right-2{ top: 56px; left: -712%; min-width: 215px; } .tooltip-2 .right-2 i{ top: -8%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-2 .right-2 i::after{ top: 95%; } .tooltip-2 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-3 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-3 .right-3 { min-width:405px; max-width:400px; top:160%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; /* color:#fff; background-color:lightgrey;*/ color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-3:hover .right-3 { visibility:visible; opacity:1; } .tooltip-3 .text-content-3 { padding:10px 20px; } .tooltip-3 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-3 .right-3 i { position:absolute; top:25%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-3 .right-3 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-3 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-3 .right-3{ top: 69px; left: -810%; min-width: 250px; } .tooltip-3 .right-3 i{ top: -8%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-3 .right-3 i::after{ top: 95%; } .tooltip-3 h6{ font-size: 11px; text-align: left!important; } } /*----------------------------------*/ .tooltip-4 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; margin-top: 15px; } .tooltip-4 .right-4 { min-width:250px; max-width:400px; /* top:50%;*/ top: 180%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-4:hover .right-4 { visibility:visible; opacity:1; } .tooltip-4 .text-content-4 { padding:10px 20px; } .tooltip-4 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-4 .right-4 i { position:absolute; /*top:50%;*/ top: 17%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-4 .right-4 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-4 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-4 .right-4{ top: 78px; left: -712%; min-width: 215px; } .tooltip-4 .right-4 i{ top: -8%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-4 .right-4 i::after{ top: 95%; } .tooltip-4 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-5 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-5 .right-5 { min-width:250px; max-width:400px; /* top:50%;*/ top: 150%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-5:hover .right-5 { visibility:visible; opacity:1; } .tooltip-5 .text-content-5 { padding:10px 20px; } .tooltip-5 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-5 .right-5 i { position:absolute; /*top:50%;*/ top: 25%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-5 .right-5 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-5 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-5 .right-5{ top: 78px; left: -712%; min-width: 215px; } .tooltip-5 .right-5 i{ top: -8%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-5 .right-5 i::after{ top: 95%; } .tooltip-5 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-6 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-6 .right-6 { min-width:410px; max-width:400px; /* top:50%;*/ top: 380%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-6:hover .right-6 { visibility:visible; opacity:1; } .tooltip-6 .text-content-6 { padding:10px 20px; } .tooltip-6 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-6 .right-6 i { position:absolute; /*top:50%;*/ top: 15%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-6 .right-6 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-6 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-6 .right-6{ top: 135px; left: -712%; min-width: 215px; } .tooltip-6 .right-6 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-6 .right-6 i::after{ top: 95%; } .tooltip-6 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-7 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-7 .right-7 { min-width:491px; max-width:400px; /* top:50%;*/ top: 475%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-7:hover .right-7 { visibility:visible; opacity:1; } .tooltip-7 .text-content-7 { padding:10px 20px; } .tooltip-7 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-7 .right-7 i { position:absolute; /*top:50%;*/ top: 10%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-7 .right-7 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-7 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-7 .right-7{ top: 165px; left: -712%; min-width: 215px; } .tooltip-7 .right-7 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-7 .right-7 i::after{ top: 95%; } .tooltip-7 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-8 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-8 .right-8 { min-width:459px; max-width:400px; /* top:50%;*/ top: 380%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-8:hover .right-8 { visibility:visible; opacity:1; } .tooltip-8 .text-content-8 { padding:10px 20px; } .tooltip-8 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-8 .right-8 i { position:absolute; /*top:50%;*/ top: 10%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-8 .right-8 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-8 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-8 .right-8{ top: 130px; left: -712%; min-width: 215px; } .tooltip-8 .right-8 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-8 .right-8 i::after{ top: 95%; } .tooltip-8 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-9 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-9 .right-9 { min-width:380px; max-width:400px; /* top:50%;*/ top: 240%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-9:hover .right-9 { visibility:visible; opacity:1; } .tooltip-9 .text-content-9 { padding:10px 20px; } .tooltip-9 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-9 .right-9 i { position:absolute; /*top:50%;*/ top: 12%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-9 .right-9 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-9 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-9 .right-9{ top: 85px; left: -712%; min-width: 215px; } .tooltip-9 .right-9 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-9 .right-9 i::after{ top: 95%; } .tooltip-9 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-10 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-10 .right-10 { min-width:380px; max-width:400px; /* top:50%;*/ top: 230%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-10:hover .right-10 { visibility:visible; opacity:1; } .tooltip-10 .text-content-10 { padding:10px 20px; } .tooltip-10 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-10 .right-10 i { position:absolute; /*top:50%;*/ top: 17%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-10 .right-10 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-10 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-10 .right-10{ top: 75px; left: -1000%; min-width: 215px; } .tooltip-10 .right-10 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-10 .right-10 i::after{ top: 95%; } .tooltip-10 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-11 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-11 .right-11 { min-width:300px; max-width:400px; /* top:50%;*/ top: 230%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-11:hover .right-11 { visibility:visible; opacity:1; } .tooltip-11 .text-content-11 { padding:10px 20px; } .tooltip-11 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-11 .right-11 i { position:absolute; /*top:50%;*/ top: 17%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-11 .right-11 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-11 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-11 .right-11{ top: 67px; left: -835%; min-width: 215px; } .tooltip-11 .right-11 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-11 .right-11 i::after{ top: 95%; } .tooltip-11 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-12 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-12 .right-12 { min-width:300px; max-width:400px; /* top:50%;*/ top: 130%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-12:hover .right-12 { visibility:visible; opacity:1; } .tooltip-12 .text-content-12 { padding:10px 20px; } .tooltip-12 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-12 .right-12 i { position:absolute; /*top:50%;*/ top: 22%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-12 .right-12 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-12 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-12 .right-12{ top: 53px; left: -712%; min-width: 215px; } .tooltip-12 .right-12 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-12 .right-12 i::after{ top: 95%; } .tooltip-12 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-13 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-13 .right-13 { min-width:300px; max-width:400px; /* top:50%;*/ top: 230%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-13:hover .right-13 { visibility:visible; opacity:1; } .tooltip-13 .text-content-13 { padding:10px 20px; } .tooltip-13 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-13 .right-13 i { position:absolute; /*top:50%;*/ top: 22%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-13 .right-13 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-13 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-13 .right-13{ top: 80px; left: -700%; min-width: 215px; } .tooltip-13 .right-13 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-13 .right-13 i::after{ top: 95%; } .tooltip-13 h6{ font-size: 11px; } } /*----------------------------------*/ .tooltip-14 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-14 .right-14 { min-width:300px; max-width:400px; /* top:50%;*/ top: 160%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-14:hover .right-14 { visibility:visible; opacity:1; } .tooltip-14 .text-content-14 { padding:10px 20px; } .tooltip-14 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-14 .right-14 i { position:absolute; /*top:50%;*/ top: 22%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-14 .right-14 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-14 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-14 .right-14{ top: 56px; left: -730%; min-width: 215px; } .tooltip-14 .right-14 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-14 .right-14 i::after{ top: 95%; } .tooltip-14 h6{ font-size: 8px; } } /*----------------------------------*/ .tooltip-15 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-15 .right-15 { min-width:300px; max-width:400px; /* top:50%;*/ top: 80%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-15:hover .right-15 { visibility:visible; opacity:1; } .tooltip-15 .text-content-15 { padding:10px 20px; } .tooltip-15 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-15 .right-15 i { position:absolute; /*top:50%;*/ top: 33%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-15 .right-15 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-15 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-15 .right-15{ top: 50px; left: -695%; min-width: 215px; } .tooltip-15 .right-15 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-15 .right-15 i::after{ top: 95%; } .tooltip-15 h6{ font-size: 8px; } } /*----------------------------------*/ .tooltip-16 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-16 .right-16 { min-width:300px; max-width:400px; /* top:50%;*/ top: 85%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-16:hover .right-16 { visibility:visible; opacity:1; } .tooltip-16 .text-content-16 { padding:10px 20px; } .tooltip-16 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-16 .right-16 i { position:absolute; /*top:50%;*/ top: 35%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-16 .right-16 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-16 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-16 .right-16{ top: 10px; /* left: -695%;*/ min-width: 215px; } .tooltip-16 .right-16 i{ top: 49%; bottom: 100%; /* left: 57%;*/ margin-left:-18px; width:36px; height:18px; } .tooltip-16 .right-16 i::after{ top: 50%; left: 25px; } .tooltip-16 h6{ font-size: 10px; } } /*----------------------------------*/ .tooltip-17 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-17 .right-17 { min-width:300px; max-width:400px; /* top:50%;*/ top: 85%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-17:hover .right-17 { visibility:visible; opacity:1; } .tooltip-17 .text-content-17 { padding:10px 20px; } .tooltip-17 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-17 .right-17 i { position:absolute; /*top:50%;*/ top: 35%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-17 .right-17 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-17 h6{ text-align: justify!important; font-size: 15px; } /*=======================================CSE-IMG===================*/ #cse-btn{ position: absolute; left: 300px; top: 67px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn1{ position: absolute; left: 300px; top: 98px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn2{ position: absolute; left: 249px; top: 125px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn3{ position: absolute; left: 298px; top: 148px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn4{ position: absolute; left: 193px; top: 165px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn5{ position: absolute; left: 297px; top: 182px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn6{ position: absolute; left: 144px; top: 197px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn7{ position: absolute; left: 105px; top: 223px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn8{ position: absolute; left: 172px; top: 243px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn9{ position: absolute; left: 97px; top: 261px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn10{ position: absolute; left: 172px; top: 278px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn11{ position: absolute; left: 97px; top: 294px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn12{ position: absolute; left: 172px; top: 315px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn13{ position: absolute; left: 100px; top: 334px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn14{ position: absolute; left: 172px; top: 353px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn15{ position: absolute; left: 93px; top: 376px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn16{ position: absolute; left: 159px; top: 396px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn17{ position: absolute; left: 89px; top: 419px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn18{ position: absolute; left: 157px; top: 442px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn19{ position: absolute; left: 98px; top: 468px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn20{ position: absolute; left: 170px; top: 488px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn21{ position: absolute; left: 102px; top: 518px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn22{ position: absolute; left: 169px; top: 536px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn23{ position: absolute; left: 94px; top: 568px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn24{ position: absolute; left: 239px; top: 583px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn25{ position: absolute; left: 679px; top: 169px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn26{ position: absolute; left: 638px; top: 198px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn27{ position: absolute; left: 684px; top: 223px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn28{ position: absolute; left: 638px; top: 247px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn29{ position: absolute; left: 688px; top: 267px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn30{ position: absolute; left: 639px; top: 297px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn31{ position: absolute; left: 696px; top: 318px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn32{ position: absolute; left: 642px; top: 342px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn33{ position: absolute; left: 696px; top: 366px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn34{ position: absolute; left: 643px; top: 390px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn35{ position: absolute; left: 701px; top: 410px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn36{ position: absolute; left: 654px; top: 433px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn37{ position: absolute; left: 708px; top: 456px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn38{ position: absolute; left: 756px; top: 480px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn39{ position: absolute; left: 699px; top: 505px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn40{ position: absolute; left: 758px; top: 533px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #cse-btn41{ position: absolute; left: 698px; top: 554px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } @media only screen and (min-width:320px) and (max-width:640px){ /*#cse-btn{ left: 118px; top: 15px; padding: 0px 7px; font-size: 4px; } #cse-btn1{ left: 116px; top: 24px; padding: 0px 7px; font-size: 5px; } #cse-btn2{ left: 103px; top: 32px; padding: 0px 7px; font-size: 5px; } #cse-btn3{ left: 116px; top: 39px; padding: 0px 7px; font-size: 5px; } #cse-btn4{ left: 87px; top: 43px; padding: 0px 7px; font-size: 5px; } #cse-btn5{ left: 115px; top: 48px; padding: 0px 7px; font-size: 5px; } #cse-btn6{ left: 71px; top: 52px; padding: 0px 7px; font-size: 5px; } #cse-btn7{ left: 60px; top: 60px; padding: 0px 7px; font-size: 5px; } #cse-btn8{ left: 83px; top: 65px; padding: 0px 7px; font-size: 5px; } #cse-btn9{ left: 60px; top: 71px; padding: 0px 7px; font-size: 5px; } #cse-btn10{ left: 82px; top: 75px; padding: 0px 7px; font-size: 5px; } #cse-btn11{ left: 60px; top: 81px; padding: 0px 7px; font-size: 5px; } #cse-btn12{ left: 82px; top: 85px; padding: 0px 7px; font-size: 5px; } #cse-btn13{ left: 62px; top: 90px; padding: 0px 7px; font-size: 5px; } #cse-btn14{ left: 80px; top: 95px; padding: 0px 7px; font-size: 5px; } #cse-btn15{ left: 55px; top: 103px; padding: 0px 7px; font-size: 5px; } #cse-btn16{ left: 77px; top: 108px; padding: 0px 7px; font-size: 5px; } #cse-btn17{ left: 56px; top: 115px; padding: 0px 7px; font-size: 5px; } #cse-btn18{ left: 75px; top: 121px; padding: 0px 7px; font-size: 5px; } #cse-btn19{ left: 61px; top: 128px; padding: 0px 7px; font-size: 5px; } #cse-btn20{ left: 82px; top: 134px; padding: 0px 7px; font-size: 5px; } #cse-btn21{ left: 61px; top: 143px; padding: 0px 7px; font-size: 5px; } #cse-btn22{ left: 82px; top: 148px; padding: 0px 7px; font-size: 5px; } #cse-btn23{ left: 58px; top: 156px; padding: 0px 7px; font-size: 5px; } #cse-btn24{ left: 98px; top: 161px; padding: 0px 7px; font-size: 5px; } #cse-btn25{ left: 235px; top: 44px; padding: 0px 7px; font-size: 5px; } #cse-btn26{ left: 224px; top: 53px; padding: 0px 7px; font-size: 5px; } #cse-btn27{ left: 237px; top: 60px; padding: 0px 7px; font-size: 5px; } #cse-btn28{ left: 224px; top: 66px; padding: 0px 7px; font-size: 5px; } #cse-btn29{ left: 238px; top: 72px; padding: 0px 7px; font-size: 5px; } #cse-btn30{ left: 223px; top: 79px; padding: 0px 7px; font-size: 5px; } #cse-btn31{ left: 239px; top: 86px; padding: 0px 7px; font-size: 5px; } #cse-btn32{ left: 223px; top: 93px; padding: 0px 7px; font-size: 5px; } #cse-btn33{ left: 240px; top: 100px; padding: 0px 7px; font-size: 5px; } #cse-btn34{ left: 226px; top: 106px; padding: 0px 7px; font-size: 5px; } #cse-btn35{ left: 242px; top: 112px; padding: 0px 7px; font-size: 5px; } #cse-btn36{ left: 228px; top: 118px; padding: 0px 7px; font-size: 5px; } #cse-btn37{ left: 243px; top: 124px; padding: 0px 7px; font-size: 5px; } #cse-btn38{ left: 256px; top: 130px; padding: 0px 7px; font-size: 5px; } #cse-btn39{ left: 241px; top: 137px; padding: 0px 7px; font-size: 5px; } #cse-btn40{ left: 257px; top: 146px; padding: 0px 7px; font-size: 5px; } #cse-btn41{ left: 241px; top: 154px; padding: 0px 7px; font-size: 5px; } */ #cse-btn{ /*left: 118px; top: 15px; padding: 0px 7px; font-size: 4px;*/ left: 107px; top: 65px; padding: 0px 7px; font-size:9px; } #cse-btn1{ /* left: 116px; top: 24px; padding: 0px 7px; font-size: 5px;*/ left:107px; top: 95px; padding: 0px 7px; font-size:9px; } #cse-btn2{ /* left: 103px; top: 32px; padding: 0px 7px; font-size: 5px;*/ left:93px; top:116px; padding: 0px 7px; font-size:9px; } #cse-btn3{ /* left: 116px; top: 39px; padding: 0px 7px; font-size: 5px;*/ left:107px; top:139px; padding: 0px 7px; font-size:9px; } #cse-btn4{ /*left: 87px; top: 43px; padding: 0px 7px; font-size: 5px;*/ left:77px; top:159px; padding: 0px 7px; font-size:9px; } #cse-btn5{ /* left: 115px; top: 48px; padding: 0px 7px; font-size: 5px;*/ left:106px; top:176px; padding: 0px 7px; font-size:9px; } #cse-btn6{ /* left: 71px; top: 52px; padding: 0px 7px; font-size: 5px;*/ left:60px; top:190px; padding:0px 7px; font-size:9px; } #cse-btn7{ /* left: 60px; top: 60px; padding: 0px 7px; font-size: 5px;*/ left:53px; top:215px; padding: 0px 7px; font-size:9px; } #cse-btn8{ /*left: 83px; top: 65px; padding: 0px 7px; font-size: 5px;*/ left:74px; top:232px; padding: 0px 7px; font-size:9px; } #cse-btn9{ /* left: 60px; top: 71px; padding: 0px 7px; font-size: 5px;*/ left:52px; top:252px; padding: 0px 7px; font-size:9px; } #cse-btn10{ /* left: 82px; top: 75px; padding: 0px 7px; font-size: 5px;*/ left:73px; top:269px; padding: 0px 7px; font-size:9px; } #cse-btn11{ /* left: 60px; top: 81px; padding: 0px 7px; font-size: 5px;*/ left:52px; top:286px; padding: 0px 7px; font-size:9px; } #cse-btn12{ /* left: 82px; top: 85px; padding: 0px 7px; font-size: 5px;*/ left:73px; top:305px; padding: 0px 7px; font-size:9px; } #cse-btn13{ /*left: 62px; top: 90px; padding: 0px 7px; font-size: 5px;*/ left:52px; top:326px; padding: 0px 7px; font-size:9px; } /*#cse-btn14{ left: 80px; top: 95px; padding: 0px 7px; font-size: 5px; }*/ #cse-btn14{ left:72px; top:344px; padding: 0px 7px; font-size:9px; } #cse-btn15{ /* left: 55px; top: 103px; padding: 0px 7px; font-size: 5px;*/ left:48px; top:365px; padding: 0px 7px; font-size:9px; } #cse-btn16{ /* left: 77px; top: 108px; padding: 0px 7px; font-size: 5px;*/ left:63px; top:385px; padding: 0px 7px; font-size:9px; } #cse-btn17{ /* left: 56px; top: 115px; padding: 0px 7px; font-size: 5px;*/ left:42px; top:406px; padding: 0px 7px; font-size:9px; } #cse-btn18{ /* left: 75px; top: 121px; padding: 0px 7px; font-size: 5px;*/ left:60px; top: 429px; padding: 0px 7px; font-size:9px; } #cse-btn19{ /* left: 61px; top: 128px; padding: 0px 7px; font-size: 5px;*/ left:53px; top:455px; padding: 0px 7px; font-size:9px; } #cse-btn20{ /*left: 82px; top: 134px; padding: 0px 7px; font-size: 5px;*/ left:75px; top:474px; padding: 0px 7px; font-size:9px; } #cse-btn21{ /*left: 61px; top: 143px; padding: 0px 7px; font-size: 5px;*/ left: 53px; top: 500px; padding: 0px 7px; font-size: 9px; } #cse-btn22{ /* left: 82px; top: 148px; padding: 0px 7px; font-size: 5px;*/ left:74px; top:520px; padding: 0px 7px; font-size:9px; } #cse-btn23{ /* left: 58px; top: 156px; padding: 0px 7px; font-size: 5px;*/ left:50px; top:549px; padding: 0px 7px; font-size:9px; } #cse-btn24{ /* left: 98px; top: 161px; padding: 0px 7px; font-size: 5px;*/ left: 86px; top: 566px; padding: 0px 7px; font-size: 9px; } #cse-btn25{ /* left: 235px; top: 44px; padding: 0px 7px; font-size: 5px;*/ left:235px; top:160px; padding:0px 7px; font-size:9px; } #cse-btn26{ left: 224px; top:190px; padding: 0px 7px; font-size:9px; } #cse-btn27{ /*left: 237px; top: 60px; padding: 0px 7px; font-size: 5px;*/ left: 237px; top:217px; padding: 0px 7px; font-size:9px; } #cse-btn28{ /* left: 224px; top: 66px; padding: 0px 7px; font-size: 5px;*/ left:224px; top:237px; padding: 0px 7px; font-size:9px; } #cse-btn29{ /*left: 238px; top: 72px; padding: 0px 7px; font-size: 5px;*/ left:238px; top:257px; padding: 0px 7px; font-size:9px; } #cse-btn30{ /* left: 223px; top: 79px; padding: 0px 7px; font-size: 5px;*/ left:223px; top:289px; padding: 0px 7px; font-size:9px; } #cse-btn31{ /* left: 239px; top: 86px; padding: 0px 7px; font-size: 5px;*/ left:239px; top:306px; padding: 0px 7px; font-size:9px; } #cse-btn32{ /*left: 223px; top: 93px; padding: 0px 7px; font-size: 5px;*/ left:224px; top:332px; padding: 0px 7px; font-size:9px; } #cse-btn33{ /* left: 240px; top: 100px; padding: 0px 7px; font-size: 5px;*/ left:240px; top:355px; padding: 0px 7px; font-size:9px; } #cse-btn34{ /*left: 226px; top: 106px; padding: 0px 7px; font-size: 5px;*/ left: 226px; top:376px; padding:0px 7px; font-size:9px; } #cse-btn35{ /* left: 242px; top: 112px; padding: 0px 7px; font-size: 5px;*/ left:241px; top:397px; padding: 0px 7px; font-size:9px; } #cse-btn36{ /*left: 228px; top: 118px; padding: 0px 7px; font-size: 5px;*/ left:228px; top:417px; padding: 0px 7px; font-size: 9px; } #cse-btn37{ /* left: 243px; top: 124px; padding: 0px 7px; font-size: 5px;*/ left:242px; top:437px; padding: 0px 7px; font-size:9px; } #cse-btn38{ /* left: 256px; top: 130px; padding: 0px 7px; font-size: 5px;*/ left: 256px; top:463px; padding: 0px 7px; font-size:9px; } #cse-btn39{ /* left: 241px; top: 137px; padding: 0px 7px; font-size: 5px;*/ left:241px; top:484px; padding: 0px 7px; font-size:9px; } #cse-btn40{ /* left: 257px; top: 146px; padding: 0px 7px; font-size: 5px;*/ left: 257px; top:512px; padding: 0px 7px; font-size:9px; } #cse-btn41{ /* left: 241px; top: 154px; padding: 0px 7px; font-size: 5px;*/ left: 241px; top:534px; padding: 0px 7px; font-size:9px; } } /*==========================SPINAL-IMG====================*/ #spinal-btn{ position: absolute; left: 574px; top: 165px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn1{ position: absolute; left: 534px; top: 195px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn2{ position: absolute; left: 579px; top: 221px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn3{ position: absolute; left: 534px; top: 247px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn4{ position: absolute; left: 583px; top: 267px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn5{ position: absolute; left: 535px; top: 295px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn6{ position: absolute; left: 589px; top: 317px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn7{ position: absolute; left: 537px; top: 343px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn8{ position: absolute; left: 591px; top: 365px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn9{ position: absolute; left: 538px; top: 389px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn10{ position: absolute; left: 596px; top: 412px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn11{ position: absolute; left: 548px; top: 434px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn12{ position: absolute; left: 603px; top: 456px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn13{ position: absolute; left: 651px; top: 479px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn14{ position: absolute; left: 593px; top: 505px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn15{ position: absolute; left: 654px; top: 530px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-btn16{ position: absolute; left: 595px; top: 554px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } /*==========================SPINAL-IMG-NEW====================*/ #spinal-new-btn{ position: absolute; left: 236px; top: 165px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn1{ position: absolute; left: 188px; top: 195px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn2{ position: absolute; left: 230px; top: 221px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn3{ position: absolute; left: 185px; top: 247px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn4{ position: absolute; left: 235px; top: 267px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn5{ position: absolute; left: 185px; top: 291px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn6{ position: absolute; left: 242px; top: 317px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn7{ position: absolute; left: 190px; top: 343px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn8{ position: absolute; left: 243px; top: 365px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn9{ position: absolute; left: 178px; top: 389px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn10{ position: absolute; left: 239px; top: 412px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn11{ position: absolute; left: 181px; top: 434px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn12{ position: absolute; left: 257px; top: 459px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn13{ position: absolute; left: 305px; top: 485px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn14{ position: absolute; left: 247px; top: 505px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn15{ position: absolute; left: 304px; top: 530px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } #spinal-new-btn16{ position: absolute; left: 245px; top: 557px; padding: 0px 10px; cursor: pointer!important; font-size: 10px; } @media only screen and (min-width:320px) and (max-width:640px){ .human-skeleton img{ width: 55%; height: 600px; } #spinal-new-btn{ /* left: 72px; top: 62px;*/ left: 67px; top: 160px; font-size:9px; } #spinal-new-btn1{ /*left: 55px; top: 74px;*/ left: 47px; top: 187px; font-size:9px; } #spinal-new-btn2{ /* left: 71px; top: 85px;*/ left: 64px; top: 216px; font-size:9px; } #spinal-new-btn3{ /*left: 54px; top: 95px;*/ left: 45px; top: 237px; font-size:9px; } #spinal-new-btn4{ /* left: 74px; top: 103px;*/ left: 65px; top: 259px; font-size:9px; } #spinal-new-btn5{ /* left: 51px; top: 112px;*/ left: 45px; top: 282px; font-size:9px; } #spinal-new-btn6{ /* left: 75px; top: 120px;*/ left: 67px; top: 305px; font-size:9px; } #spinal-new-btn7{ /* left: 55px; top: 129px;*/ left: 47px; top: 328px; font-size:9px; } #spinal-new-btn8{ /*left: 73px; top: 139px;*/ left: 65px; top: 350px; font-size:9px; } #spinal-new-btn9{ /* left: 48px; top: 149px;*/ left: 37px; top: 374px; font-size:9px; } #spinal-new-btn10{ /* left: 72px; top: 158px; font-size: 6px;*/ left: 62px; top: 396px; font-size: 9px; } #spinal-new-btn11{ /* left: 56px; top: 166px;*/ left: 47px; top: 416px; font-size:9px; padding: 0px 6px; } #spinal-new-btn12{ /*left: 87px; top: 176px;*/ left: 82px; top: 443px; font-size:9px; padding: 0px 6px; } #spinal-new-btn13{ /*left: 106px; top: 186px;*/ left: 100px; top: 468px; font-size:9px; padding: 0px 6px; } #spinal-new-btn14{ /* left: 84px; top: 194px;*/ left: 79px; top: 489px; font-size:9px; padding: 0px 6px; } #spinal-new-btn15{ /* left: 106px; top: 203px;*/ left: 100px; top: 510px; font-size:9px; padding: 0px 6px; } #spinal-new-btn16{ /* left: 82px; top: 214px;*/ left: 74px; top: 539px; font-size:9px; padding: 0px 6px; } } /*=================================Cse-single=============================*/ #cse-single-btn{ position: absolute; top: 67px; padding: 0 10px; } #cse-single-btn-1{ position: absolute; top: 98px; padding: 0 10px; } #cse-single-btn-2{ position: absolute; top: 123px; left: 346px; padding: 0 10px; } #cse-single-btn-3{ position: absolute; top: 145px; left: 394px; padding: 0 10px; } #cse-single-btn-4{ position: absolute; top: 164px; left: 291px; padding: 0 10px; } #cse-single-btn-5{ position: absolute; top: 182px; left: 394px; padding: 0 10px; } #cse-single-btn-6{ position: absolute; top: 196px; left: 235px; padding: 0 10px; } #cse-single-btn-7{ position: absolute; top: 224px; left: 199px; padding: 0 10px; } #cse-single-btn-8{ position: absolute; top: 239px; left: 269px; padding: 0 10px; } #cse-single-btn-9{ position: absolute; top: 262px; left: 191px; padding: 0 10px; } #cse-single-btn-10{ position: absolute; top: 275px; left: 269px; padding: 0 10px; } #cse-single-btn-11{ position: absolute; top: 296px; left: 194px; padding: 0 10px; } #cse-single-btn-12{ position: absolute; top: 312px; left: 268px; padding: 0 10px; } #cse-single-btn-13{ position: absolute; top: 335px; left: 197px; padding: 0 10px; } #cse-single-btn-14{ position: absolute; top: 351px; left: 268px; padding: 0 10px; } #cse-single-btn-15{ position: absolute; top: 376px; left: 189px; padding: 0 10px; } #cse-single-btn-16{ position: absolute; top: 396px; left: 257px; padding: 0 10px; } #cse-single-btn-17{ position: absolute; top: 420px; left: 184px; padding: 0 10px; } #cse-single-btn-18{ position: absolute; top: 440px; left: 253px; padding: 0 10px; } #cse-single-btn-19{ position: absolute; top: 470px; left: 195px; padding: 0 10px; } #cse-single-btn-20{ position: absolute; top: 488px; left: 269px; padding: 0 10px; } #cse-single-btn-21{ position: absolute; top: 520px; left: 195px; padding: 0 10px; } #cse-single-btn-22{ position: absolute; top: 534px; left: 267px; padding: 0 10px; } #cse-single-btn-23{ position: absolute; top: 569px; left: 189px; padding: 0 10px; } #cse-single-btn-24{ position: absolute; top: 585px; left: 336px; padding: 0 10px; } @media only screen and (min-width:320px) and (max-width:640px){ /* #cse-single-btn{ top: 25px; left: 135px; } #cse-single-btn-1{ top: 38px; left: 135px; } #cse-single-btn-2{ top: 49px; left: 115px; } #cse-single-btn-3{ top: 58px; left: 135px; } #cse-single-btn-4{ top: 64px; left: 94px; } #cse-single-btn-5{ top: 72px; left: 134px; } #cse-single-btn-6{ top: 77px; left: 71px; } #cse-single-btn-7{ top: 89px; left: 58px; } #cse-single-btn-8{ top: 96px; left: 85px; } #cse-single-btn-9{ top: 103px; left: 54px; } #cse-single-btn-10{ top: 109px; left: 85px; } #cse-single-btn-11{ top: 117px; left: 55px; } #cse-single-btn-12{ top: 125px; left: 85px; } #cse-single-btn-13{ top: 133px; left: 55px; } #cse-single-btn-14{ top: 140px; left: 86px; } #cse-single-btn-15{ top: 150px; left: 52px; } #cse-single-btn-16{ top: 159px; left: 79px; } #cse-single-btn-17{ top: 168px; left: 49px; } #cse-single-btn-18{ top: 176px; left: 79px; } #cse-single-btn-19{ top: 186px; left: 56px; } #cse-single-btn-20{ top: 195px; left: 85px; } #cse-single-btn-21{ top: 206px; left: 55px; } #cse-single-btn-22{ top: 214px; left: 85px; } #cse-single-btn-23{ top: 225px; left: 53px; } #cse-single-btn-24{ top: 233px; left: 110px; }*/ #cse-single-btn{ /*top: 25px; left: 135px;*/ top: 64px; left: 126px; font-size: 9px; } #cse-single-btn-1{ /*top: 38px; left: 135px;*/ top: 95px; left: 126px; font-size: 9px; } #cse-single-btn-2{ /*top: 49px; left: 115px;*/ top: 119px; left: 107px; font-size: 9px; } #cse-single-btn-3{ /*top: 58px; left: 135px;*/ top: 142px; left: 125px; font-size: 9px; } #cse-single-btn-4{ top: 158px; left: 85px; font-size: 9px; } #cse-single-btn-5{ /* top: 72px; left: 134px;*/ top: 176px; left: 126px; font-size: 9px; } #cse-single-btn-6{ /* top: 77px; left: 71px;*/ top: 189px; left: 60px; font-size: 9px; } #cse-single-btn-7{ /* top: 89px; left: 58px;*/ top: 215px; left: 49px; font-size: 9px; } #cse-single-btn-8{ /* top: 96px; left: 85px;*/ top: 233px; left: 77px; font-size: 9px; } #cse-single-btn-9{ /*top: 103px; left: 54px;*/ top: 250px; left: 46px; font-size: 9px; } #cse-single-btn-10{ /* top: 109px; left: 85px;*/ top: 267px; left: 75px; font-size: 9px; } #cse-single-btn-11{ /*top: 117px; left: 55px;*/ top: 284px; left: 46px; font-size: 9px; } #cse-single-btn-12{ /* top: 125px; left: 85px;*/ top: 304px; left: 77px; font-size: 9px; } #cse-single-btn-13{ /*top: 133px; left: 55px;*/ top: 321px; left: 47px; font-size: 9px; } #cse-single-btn-14{ /* top: 140px; left: 86px;*/ top: 340px; left: 75px; font-size: 9px; } #cse-single-btn-15{ /* top: 150px; left: 52px;*/ top: 363px; left: 40px; font-size: 9px; } #cse-single-btn-16{ /* top: 159px; left: 79px;*/ top: 382px; left: 66px; font-size: 9px; } #cse-single-btn-17{ /* top: 168px; left: 49px;*/ top: 406px; left: 36px; font-size: 9px; } #cse-single-btn-18{ top: 427px; left: 64px; font-size: 9px; } #cse-single-btn-19{ top: 453px; left: 47px; font-size: 9px; } #cse-single-btn-20{ /*top: 195px; left: 85px;*/ top: 473px; left: 77px; font-size: 9px; } #cse-single-btn-21{ /* top: 206px; left: 55px;*/ top: 500px; left: 49px; font-size: 9px; } #cse-single-btn-22{ /*top: 214px; left: 85px;*/ top: 520px; left: 76px; font-size: 9px; } #cse-single-btn-23{ /* top: 225px; left: 53px;*/ top:555px; left:44px; font-size:9px; } #cse-single-btn-24{ /* top: 233px; left: 110px;*/ top: 565px; left: 98px; font-size: 9px; } } /*============================NEW=======================*/ #pacu-intra1 #pacu-intra{ min-width:421px!important; max-width:400px; } #pacu-i h6{ text-align:start!important; } /*===========================================LABOUR ANALGESIA==================================*/ #pre-pro{ width: 850px!important; } #labour-add{ box-shadow: 0px 0px 8px lightgrey; padding: 30px; } /*----------------------------------*/ .tooltip-20 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-20 .right-20 { min-width:427px; max-width:400px; /* top:50%;*/ top: 270%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-20:hover .right-20 { visibility:visible; opacity:1; } .tooltip-20 .text-content-20 { padding:10px 20px; } .tooltip-20 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-20 .right-20 i { position:absolute; /*top:50%;*/ top: 13%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-20 .right-20 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-20 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-20 .right-20{ top: 82px; left: -712%; min-width: 215px; } .tooltip-20 .right-20 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-20 .right-20 i::after{ top: 95%; } .tooltip-20 h6{ font-size: 11px; } } /*----------------------------------*/ /*----------------------------------*/ .tooltip-21 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-21 .right-21 { min-width:427px; max-width:400px; /* top:50%;*/ top: 270%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-21:hover .right-21 { visibility:visible; opacity:1; } .tooltip-21 .text-content-21 { padding:10px 20px; } .tooltip-21 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-21 .right-21 i { position:absolute; /*top:50%;*/ top: 13%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-21 .right-21 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-21 h6{ text-align: justify!important; font-size: 15px; } /*----------------------------------*/ .tooltip-22 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-22 .right-22 { min-width:470px; max-width:400px; /* top:50%;*/ top: 414%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-22:hover .right-22 { visibility:visible; opacity:1; } .tooltip-22 .text-content-22 { padding:10px 20px; } .tooltip-22 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-22 .right-22 i { position:absolute; /*top:50%;*/ top: 13%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-22 .right-22 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-22 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-21 .right-21{ top: 82px; left: -712%; min-width: 215px; } .tooltip-21 .right-21 i{ top: -3%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-21 .right-21 i::after{ top: 95%; } .tooltip-21 h6{ font-size: 11px; } } /*------------------------------New I ICON--------------------------------------*/ .tooltip-23 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-23 .right-23 { min-width:265px; max-width:400px; /* top:50%;*/ top: 150%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0px 0px 8px lightgrey;*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-23:hover .right-23 { visibility:visible; opacity:1; } .tooltip-23 .text-content-23 { padding:10px 20px; } .tooltip-23 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-23 .right-23 i { position:absolute; /*top:50%;*/ top: 22%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-23 .right-23 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-23 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-23 .right-23{ top: 80px; left: -712%; min-width: 160px; } .tooltip-23 .right-23 i{ top: 4%; bottom: 100%; left: 80%; margin-left: -18px; width: 36px; height: 18px; } .tooltip-23 h6{ text-align: left!important; } } /*----------------------------------*/ .tooltip-24 { display:inline-block; position:relative; text-align:justify; opacity: initial!important; } .tooltip-24 .right-24 { min-width:210px; max-width:400px; top:160%; left:100%; margin-left:20px; transform:translate(0, -50%); padding:0; /* color:#fff; background-color:lightgrey;*/ color: #fff; background-color: #1974A7; font-weight:normal; font-size:13px; border-radius:8px; position:absolute; z-index:99999999; box-sizing:border-box; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ visibility:hidden; opacity:0; transition:opacity 0.8s; } .tooltip-24:hover .right-24 { visibility:visible; opacity:1; } .tooltip-24 .text-content-24 { padding:10px 20px; } .tooltip-24 i{ color: #007BFF!important; font-size: 15px; padding-left: 5px; } .tooltip-24 .right-24 i { position:absolute; top:25%; right:100%; margin-top:-12px; width:12px; height:24px; overflow:hidden; } .tooltip-24 .right-24 i::after { content:''; position:absolute; width:12px; height:12px; left:0; top:50%; transform:translate(50%,-50%) rotate(-45deg); background-color:#1974A7; /* box-shadow:0 1px 8px rgba(0,0,0,0.5);*/ } .tooltip-24 h6{ text-align: justify!important; font-size: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ .tooltip-24 .right-24{ top: 69px; /* left: -810%; min-width: 250px;*/ left: -565%; min-width: 165px; } .tooltip-24 .right-24 i{ top: -8%; bottom: 100%; left: 57%; margin-left:-18px; width:36px; height:18px; } .tooltip-24 .right-24 i::after{ top: 95%; } .tooltip-24 h6{ font-size: 11px; } } /*----------------------------------*/ #labour-post-pro{ display: flex; width: 65%; height: 35px; } #labour-post-pro button{ border: 0; background: 0; cursor: pointer; background-color: #979797; color: #fff; border-radius: 50%; padding: 0 10px; margin: 0 5px; } #labour-post-pro input{ width: 50%; margin-left: 10px; } .sens-cont{ box-shadow: 0px 0px 5px lightgrey; padding: 20px; border-radius: 8px; margin-bottom: 10%; } .sens-cont p{ text-align: justify; color: #767676; } .ob-preop-li{ width: 32%!important; } #ga-input .form-control{ border-radius: 15px; } @media only screen and (min-width:320px) and (max-width:640px){ #labour-txt h2{ display: none; } #pre-pro{ width: auto!important; } }