@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap'); body { font-family: 'Roboto', Helvetica, Arial, sans-serif; font-size: 0.8vw; line-height: 1.5; color: #000000; background-color: #f5f5f5; } input, button, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .subpage-common footer .more, .table--ivf-package tfoot td, .your-feedback form .rating-wrapper .order, .section-special-offer .doctors__about h2, .section-special-offer .slide__title--name { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small, .h1 small, .h2 small, .h3 small, .h4 small, .h5 small, .h6 small, h1 .small, h2 .small, h3 .small, h4 .small, h5 .small, h6 .small, .h1 .small, .h2 .small, .h3 .small, .h4 .small, .h5 .small, .h6 .small { font-weight: normal; line-height: 1; color: #777777; } h1, .h1, h2, .h2, h3, .h3, .table--ivf-package tfoot td, .your-feedback form .rating-wrapper .order, .section-special-offer .doctors__about h2, .section-special-offer .slide__title--name { margin-top: 1vw; margin-bottom: 0.5vw; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h1 .small, .h1 .small, h2 .small, .h2 .small, h3 .small, .h3 .small { font-size: 65%; } h4, .h4, h5, .h5, h6, .h6, .subpage-common footer .more { margin-top: 0.5vw; margin-bottom: 0.5vw; } h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small, h4 .small, .h4 .small, h5 .small, .h5 .small, h6 .small, .h6 .small { font-size: 75%; } h1, .h1, .your-feedback form .rating-wrapper .order { font-size: 2.24583333vw; } h2, .h2 { font-size: 1.825vw; } h3, .h3, .table--ivf-package tfoot td, .section-special-offer .doctors__about h2, .section-special-offer .slide__title--name { font-size: 1.60416667vw; } h4, .h4, .subpage-common footer .more { font-size: 1.27916667vw; } h5, .h5 { font-size: 1.04166667vw; } h6, .h6 { font-size: 1vw; } .btn-default, .btn-primary, .btn-success { color: #fff !important; background-color: #00a6eb; border-color: #00a6eb; transition: all 0.3s ease-in-out; } .btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active,.open .dropdown-toggle.btn-success, .btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active,.open .dropdown-toggle.btn-primary, .btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active,.open .dropdown-toggle.btn-default { color: #fff !important; background-color: #41bba6 !important; border-color: #41bba6 !important; } .btn-success.disabled,.btn-success[disabled],fieldset[disabled] .btn-success,.btn-success.disabled:hover,.btn-success[disabled]:hover,fieldset[disabled] .btn-success:hover,.btn-success.disabled:focus,.btn-success[disabled]:focus,fieldset[disabled] .btn-success:focus,.btn-success.disabled:active,.btn-success[disabled]:active,fieldset[disabled] .btn-success:active,.btn-success.disabled.active,.btn-success[disabled].active,fieldset[disabled] .btn-success.active, .btn-primary.disabled,.btn-primary[disabled],fieldset[disabled] .btn-primary,.btn-primary.disabled:hover,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary:hover,.btn-primary.disabled:focus,.btn-primary[disabled]:focus,fieldset[disabled] .btn-primary:focus,.btn-primary.disabled:active,.btn-primary[disabled]:active,fieldset[disabled] .btn-primary:active,.btn-primary.disabled.active,.btn-primary[disabled].active,fieldset[disabled] .btn-primary.active, .btn-default.disabled,.btn-default[disabled],fieldset[disabled] .btn-default,.btn-default.disabled:hover,.btn-default[disabled]:hover,fieldset[disabled] .btn-default:hover,.btn-default.disabled:focus,.btn-default[disabled]:focus,fieldset[disabled] .btn-default:focus,.btn-default.disabled:active,.btn-default[disabled]:active,fieldset[disabled] .btn-default:active,.btn-default.disabled.active,.btn-default[disabled].active,fieldset[disabled] .btn-default.active { background-color: #00a6eb !important; border-color: #00a6eb !important; } .btn-success .badge, .btn-primary .badge, .btn-default .badge { color: #fff; background-color: #00a6eb !important; } .progress { background-color: #00a6eb; } .bs-wizard > .bs-wizard-step > .bs-wizard-dot { background: #00a6eb; } .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot { background-color: #ffffff; } .bs-wizard > .bs-wizard-step > .bs-wizard-dot:after { background: #ffffff; } /* .bs-wizard > .bs-wizard-step .bs-wizard-stepnum {color: #000; font-size: 16px; margin-bottom: 5px;} .bs-wizard > .bs-wizard-step .bs-wizard-info {color: #000; font-size: 14px; font-weight:bold;} */ a { color: #00a4e8; text-decoration: none; transition: all 0.3s ease-in-out; } a:hover,a:focus { color: #000; text-decoration: none; } .header { font-size: 14px; position: fixed; top: 0; left: 0; width: 100%; background: #ffffff; z-index: 700; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-box-shadow: 0 10px 19px -4px rgba(0,0,0,0.2); -moz-box-shadow: 0 10px 19px -4px rgba(0,0,0,0.2); box-shadow: 0 10px 19px -4px rgba(0,0,0,0.2); } @media (max-width: 580px) { .header { position: absolute; } } .header .logo { width: 264px; padding-top: 7px; } @media (min-width: 1081px) and (max-width: 1380px) { .header .logo { width: 175px; } } @media (max-width: 1080px) { .header .logo { padding-top: 14px; width: 140px; } } .header .logo img { width: 100%; max-width: 100%; height: auto; position: relative; } @media (max-width: 580px) { .header .logo { width: 100%; text-align: center; } .header .logo img { width: 175px; } } .header .inner { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; height: 111px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } @media (max-width: 1380px) { .header .inner { height: 80px; flex-wrap: wrap; } } @media (min-width: 541px) and (max-width: 1080px) { .header .inner { height: 75px; } } @media (max-width: 580px) { .header .inner { height: auto; } } .header nav { font-size: 20px; margin-top: 40px; font-weight: 300; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } @media (min-width: 1081px) and (max-width: 1380px) { .header nav { margin-top: 21px; } } @media (max-width: 1080px) { .header nav { margin-top: 16px; } } @media (max-width: 580px) { .header nav { margin-bottom: 16px; width: 100%; } } @media (max-width: 380px) { .header nav { flex-wrap: wrap; } } .header nav .main-nav-header { display: inline-block; position: relative; -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; margin-right: 0; margin-left: 20px; padding-top: 4px; z-index: 9999; } .header nav .main-nav-header.open { position: fixed; right: 30px; top: 21px; } .header nav .main-nav-header button { border: 0; padding: 6px 0; background: transparent none; } .header nav .main-nav-header .icon-bar { display: block; width: 40px; height: 3px; background-color: #00a6eb; margin-bottom: 8px; } .header nav .main-nav-header .icon-bar:last-of-type { margin-bottom: 0; } .header nav .main-nav-header.open button { background-color: #ffffff; padding-left: 5px; padding-right: 5px; margin-right: -5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } @media (min-width: 1051px) { .header nav .main-nav-header { display: none; } } .header nav > ul.main-nav { list-style: none; margin-right: 30px; margin-left: 30px; margin-bottom: 0; padding-left: 0; } @media (min-width: 1051px) and (max-width: 1225px) { .header nav > ul.main-nav { margin-right: 10px; margin-left: 0; } } @media (max-width: 1050px) { .header nav > ul.main-nav { display: none; position: fixed; -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; top: 0; left: 0; right: 0; bottom: 0; margin-right: 0; margin-left: 0; padding-top: 20px; padding-left: 30px; padding-right: 30px; background-color: #00a6eb; overflow-y: auto; z-index: 100; } .header nav > ul.main-nav.open { display: block; } } .header nav > ul.main-nav > li { position: relative; display: inline-block; margin: 0 15px; padding-top: 5px; line-height: 1; } @media (max-width: 1500px) { .header nav > ul.main-nav > li { margin-top: 7px; } } @media (max-width: 1921px) { .header nav > ul.main-nav > li { padding-top: 10px; } } @media (min-width: 1051px) and (max-width: 1225px) { .header nav > ul.main-nav > li { margin: 7px 5px 0 5px; } } @media (max-width: 1050px) { .header nav > ul.main-nav > li { display: block; margin: 5px 0; } } .header li a { color: #000000; } .header nav > ul.main-nav > li > a { font-size: 20px; line-height: 1; } .header nav > ul.main-nav > li > a:hover { color: #00a6eb; } @media (max-width: 1500px) { .header nav > ul.main-nav > li > a { font-size: 16px; } } @media (max-width: 1050px) { .header nav > ul.main-nav > li > a { display: block; color: #ffffff; font-size: 30px; font-weight: 100; text-align: center; } .header nav > ul.main-nav > li > a:hover { color: #ffffff; text-decoration: underline; } } .header nav > ul.main-nav > li > ul { visibility: hidden; opacity: 0; position: absolute; left: 0; padding: 0; margin: 5px 0 0; -webkit-transition: all 0.25s ease-in; -moz-transition: all 0.25s ease-in; -o-transition: all 0.25s ease-in; transition: all 0.25s ease-in; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; list-style: none; } @media (max-width: 1050px) { .header nav > ul.main-nav > li > ul { position: static; display: none; } } .header nav > ul.main-nav > li > ul::before { content: ""; display: block; height: 3.125vw; width: 10px; margin-bottom: 0.36458333vw; -webkit-transform: scale(1,0.8); -moz-transform: scale(1,0.8); -ms-transform: scale(1,0.8); -o-transform: scale(1,0.8); transform: scale(1,0.8); -webkit-transition: -webkit-transform 0.5s ease-in; -moz-transition: -moz-transform 0.5s ease-in; -o-transition: -o-transform 0.5s ease-in; transition: transform 0.5s ease-in; background: url(https://www.city-fertility.com/images/belly-nav.svg) no-repeat; background-size: auto; -webkit-background-size: auto 100%; -moz-background-size: auto 100%; -o-background-size: auto 100%; background-size: auto 100%; z-index: 10; visibility: hidden; } .header nav > ul.main-nav > li:hover > ul { opacity: 1; visibility: visible; } .header nav > ul.main-nav > li:hover > ul::before { -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); transform: scale(1,1); visibility: visible; } @media (max-width: 1050px) { .header nav > ul.main-nav > li:hover > ul { display: block; } .header nav > ul.main-nav > li:hover > ul::before { display: none; } } .header nav > ul.main-nav > li > ul > li > a { display: block; color: #ffffff; background-color: #00a6eb; padding: 10px 27px; white-space: nowrap; font-size: 14px; font-weight: 500; line-height: 1.6; } .header nav > ul.main-nav > li > ul > li > a:hover { background-color: #1fbdff; } @media (max-width: 1050px) { .header nav > ul.main-nav > li > ul > li > a { white-space: normal; text-align: center; } .header nav > ul.main-nav > li > ul > li > a:hover { background-color: #00a6eb; text-decoration: underline; } } .header .buttons { padding-top: 7px; } .header .buttons .btn-contact-us { height: auto; padding: 7px 20px 7px; border: 1px solid #f9b718; background-color: #f9b718; -webkit-box-shadow: 1.4px 1.5px 8px 0 rgba(0,0,0,0.1); -moz-box-shadow: 1.4px 1.5px 8px 0 rgba(0,0,0,0.1); box-shadow: 1.4px 1.5px 8px 0 rgba(0,0,0,0.1); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 20px; line-height: 1; font-weight: 300; color: #ffffff; } @media (max-width: 1500px) { .header .buttons .btn-contact-us { font-size: 16px; } } @media (max-width: 440px) { .header .buttons .btn-contact-us span { display: none; } } .header .buttons .btn-contact-us:hover { background-color: transparent; color: #f9b718; } .header .buttons .btn-contact-us-call { background-color: #41bba6; border-color: #41bba6; margin-right: 5px; } .header .buttons .btn-contact-us-call:hover { color: #41bba6; } #my_account_frm { margin-top: 5px; margin-bottom: 0; padding-left: 0; padding-top: 0; padding-bottom: 0; } @media (max-width: 380px) { #my_account_frm { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; width: 100%; margin-left: 0; } #my_account_frm .btn-group { width: 100%; } #my_account_frm .btn-group a.btn.btn-default { width: 90%; } #my_account_frm .btn-group button { width: 10%; } } @media (max-width: 375px) { .header .buttons .btn-contact-us { padding-left: 15px; padding-right: 15px; } }