/*.contactMain { padding:40px 0 40px 0px; }*/ #Need { min-height: 400px; } .table-cell.conL { width: 583px } .conImg { position: relative; left: -90px; width: 672px } .formsTab.resp-tabs-list .resp-tab-active span, .table-cell.conL span.textMainBold { display: block } .contactDetails { padding: 34px 0 0 } .textMain h1 { padding: 0 0 20px } .table-cell.conR { padding: 0 0 0 75px } .ibji-chicago-orthopedic-knee-care-treatment-page .table-cell.conR { padding: 0 0 0 15px; } .formsTab, .textMain .contactDetails p { padding: 20px 0 } .table-cell.conL .contactDetails p a, .table-cell.conR p a { font-weight: 600 } .textMain .contactTabs { font-size: 0; padding: 60px 0 8px } .textMain .contactTabs li { background: 0 0; width: 25%; min-width: 260px; font: 900 18px/25px Avenir, Helvetica, Arial, sans-serif; display: inline-block; vertical-align: top; -webkit-transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; transition: .3s; padding: 30px 0 } .textMain .contactTabs li a { display: block; padding: 52px 26px 90px 40px; color: #111; text-decoration: none; width: 250px; height: 250px; border: 4px solid #e2e2e2; -webkit-transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; transition: .3s } .textMain .contactTabs li a:hover { background: #00853f; color: #fff; border: 4px solid #00853f } .contactForm { padding: 30px 0 0 } :root:root:root:root:root .cog-form legend, :root:root:root:root:root .cog-label, :root:root:root:root:root .is-required .cog-label, html .cog-form legend, html .cog-label, html .is-required .cog-label { font: 600 15px/20px Avenir, Helvetica, Arial, sans-serif!important; padding: 10px 0 } .contactForm input[type=email], .contactForm input[type=tel], .contactForm input[type=text], html .cog-cognito--styled .el-input__inner, html .cog-cognito--styled input[type=text], html .cog-input .el-textarea__inner { padding: 10px; margin: 0; background: 0 0; border: 1px solid #ccc!important; border-radius: 5px!important; font: 400 18px/20px Avenir, Helvetica, Arial, sans-serif!important } html .cog-checkable .el-radio__label.el-radio__label { font: 600 18px/20px Avenir, Helvetica, Arial, sans-serif!important } .contactForminput[type=submit], html .cog-cognito--styled .cog-button--primary { padding: 10px 50px!important; margin: 7px 0 0!important; background: #00853f!important; font: 500 18px/20px Avenir, Helvetica, Arial, sans-serif!important; color: #fff; border: 0!important; border-radius: 0!important; text-transform: uppercase!important } :root:root:root:root:root .cog-html :last-child a, html .cog-html :last-child a { font: 500 18px/20px Avenir, Helvetica, Arial, sans-serif!important; color: #007dc3!important } :root:root:root:root:root .cog-html :first-child, html .cog-html :first-child { font: italic 400 14px/18px Avenir, Helvetica, Arial, sans-serif!important } ::-webkit-input-placeholder { color:#8b8a8a } :-moz-placeholder { color:#8b8a8a; opacity:1 } ::-moz-placeholder { color:#8b8a8a; opacity:1 } :-ms-input-placeholder { color:#8b8a8a } ::-ms-input-placeholder { color:#8b8a8a } ::placeholder { color:#8b8a8a } .formsTab .resp-tabs-list { padding: 30px 0 0; font-size: 0px } .formsTab .resp-tab-item { font: 500 42px/44px Albra, Helvetica, Arial, sans-serif; width: 50%; margin: 0; padding: 0; background: 0 0; display: inline-block; vertical-align: top } .formsTab .resp-tab-item a { max-width: 250px; min-width: 250px; min-height: 250px; padding: 40px; display: block; text-decoration: none; transition: background-color .2s ease-in-out, color .2s ease-in-out } .formsTab .resp-tab-item:first-child a { background-color: #9fcbed; color: #fff } .formsTab .resp-tab-item:last-child a { background-color: #f6f7f8; color: #000 } .formsTab .resp-tab-item:hover a { background: #007dc3; color: #fff } .formsTab li.resp-tab-item.resp-tab-active a { background: #00853f; color: #fff } .formsTab.resp-tabs-list li span { font: 400 18px/18px Avenir, Helvetica, Arial, sans-serif; display: none; padding: 20px 0 0 } .formDiv { height: 500px } .strugglePage h2 { padding-bottom: 40px; } .strugglePage ul li { display: inline-block; vertical-align: top; padding: 15px 0px 15px 0px; background: none; min-height: auto; } .strugglePage span { float: left; margin: 0px 30px 0px 0px; width: 100px; } .ibji-chicago-orthopedic-knee-care-treatment-page .needMain h2 { font: 500 39px/50px Albra, Helvetica, Arial, sans-serif; }#label-firstname-d5638c41-b768-44ca-b9f5-bc0319b3087d, .hs-form-d5638c41-b768-44ca-b9f5-bc0319b3087d_c8994802-89e7-481f-9009-d15ccfe96592 .hs-form-field label:not(.hs-error-msg) {font: 600 15px/20px Avenir, Helvetica, Arial, sans-serif !important;}.inputs-list.multi-container li {display: inline-block;width: 70px;}.hs-form * {font: 600 15px/20px Avenir, Helvetica, Arial, sans-serif !important;}.hbspt-form fieldset label {font-weight: 600 !important;}@media screen and (max-width:1061px) { .textMain .contactTabs { padding: 80px 0 8px } .textMain .contactTabs li { width: 25%; min-width: auto; padding: 0 10px; margin: 10px 0 } .textMain .contactTabs li a { width: 100%; height: 225px; padding: 52px 30px 90px } } @media screen and (max-width:1017px) { .table-cell.conR { padding: 0 0 0 40px } } @media screen and (max-width:965px) { .conImg { position: static; left: 0; width: 100% } .table-cell.conL { width: 50% } .textMain .contactTabs li a { height: 192px; padding: 29px 20px 95px } } @media screen and (max-width:877px) { .textMain .contactTabs li a { height: 176px } } @media screen and (max-width:767px) { .conTable.table-div.flex { display: flex!important; flex-direction: column; margin: 0 auto!important } .conTable.table-div.flex>.flex1 { order: 2 } .conTable.table-div.flex>.flex2 { order: 1 } .table-cell.conL { width: 100% } .conImg { display: none } .table-cell.conR { padding: 0 } /*.contactDetails, .contactMain { padding: 50px 0 0 }*/ .textMain .contactTabs { padding: 40px 0 8px } .textMain .contactTabs li { width: 50% } .textMain .contactTabs li a { height: 120px; padding: 30px 20px } .ibji-chicago-orthopedic-knee-care-treatment-page .table-cell.conR { padding: 0 0 0 0px; } } @media screen and (max-width:560px) { .textMain .contactTabs li { width: 100% } .textMain .contactTabs { padding: 20px 0 8px } .textMain .contactTabs li a { width: 100%; height: auto; padding: 30px 16px } .ibji-chicago-orthopedic-knee-care-treatment-page .textMain h1 { font: 500 30px/34px Albra, Helvetica, Arial, sans-serif; } .ibji-chicago-orthopedic-knee-care-treatment-page .contactDetails { padding: 0px; } .ibji-chicago-orthopedic-knee-care-treatment-page .needMain h2 { font: 500 35px/42px Albra, Helvetica, Arial, sans-serif; } .strugglePage span { margin: 5px 20px 45px 0px; } } @media screen and (max-width:390px) { .ibji-chicago-orthopedic-knee-care-treatment-page .textMain h1 { font: 500 28px/34px Albra, Helvetica, Arial, sans-serif; } .hTag2, .textMain .serHead, .textMain h2, .textMain h3.hTag2, .textMain h4.hTag2 { font: 500 27px/37px Albra, Helvetica, Arial, sans-serif; } .strugglePage ul li { font:400 16px/28px Avenir, Helvetica, Arial, sans-serif; } }