*, *::before, *::after { box-sizing: border-box; } .SaleNotification { display: none;} p { font-size:1.3rem; } @media screen and (max-width: 1540px) { p { font-size:1.1rem; } } .btn-brick.on { background: var(--theme-gradient2); color: #fff; } .small { font-size: 85%; } .smaller { font-size: 75%; } .oxbridge-rescue h2 { font-size:2rem; } /* sticky child pgnav ---------------------------------------- */ #SubNavSticky { position:fixed; z-index:200; background: rgba(3, 20, 33, 0.9); width: 100%; text-align: center; -webkit-transition: all 0.15s ease-out; transition: all 0.15s ease-out;} .SlimLine #SubNavSticky {transform:translateY(-50px);} #SubNavSticky .SubNavStickyInner{ margin: auto;width: auto; display:inline-block; } #SubNavSticky ul { list-style: none; margin:0; padding:0; white-space: nowrap;} #SubNavSticky li { display:inline-block;margin:0; padding:0; } #SubNavSticky a { display: block; padding: 14px; color: white; text-decoration: none; font-size: 14px;} #SubNavSticky a:hover { color:var(--theme-color2); } #SubNavSticky a.on { color:var(--theme-color2); } #SubNavSticky .StickyDropBtn { display: none; padding:8px; font-size: 16px;} #SubNavSticky .StickyDropBtn:after {content:"\F107"; font-family:FontAwesome;padding-left: 0.5em;} #SubNavSticky.isStickyNavDropOn .StickyDropBtn {display: none; } #SubNavSticky.isStickyNavDropOn .SubNavStickyInner {display:none ; width:100%; box-shadow: 0 5px 8px rgba(0,0,0,0.3) ; } #SubNavSticky.isStickyNavDropOn ul {} #SubNavSticky.isStickyNavDropOn li {background: white; display: block;} #SubNavSticky.isStickyNavDropOn li a {color: #2d2d2d; border-bottom: 1px solid #f3f3f3; width: 96%; margin: auto;} #SubNavSticky.isStickyNavDropOn.isStickyNavDropXpanded .SubNavStickyInner {display:inline-block; } #SubNavSticky.isStickyNavDropXpanded .StickyDropBtn:after {content:"\F106"; } /*@media screen and (max-width: 560px) { #SubNavSticky .StickyDropBtn { padding: 14px; font-size: 14px;} #SubNavSticky a { padding: 12px; font-size: 12px;} }*/ #why-cloudlearn, #how-it-works, #what-you-get, #faqs { position: absolute; margin-top: -70px; } #contact-form { position: absolute; margin-top: -120px; } .oxbridge-rescue .intro-header { padding: 6rem 0; } .oxbridge-rescue .intro-header h4 { background:#e8e8e8; padding: 0.5rem 1rem; color: #ff4d01; font-size: 1.3rem; width: auto; display: inline-block; border-radius: 8px; margin-bottom:1.8rem; } .oxbridge-rescue .intro-header .flex-container { flex-wrap: nowrap; justify-content: space-between; align-items: center; } .oxbridge-rescue .intro-header .flex-container .text-area { width:47%; } .oxbridge-rescue .intro-header .flex-container .image-area { width:47%; } .oxbridge-rescue .intro-header .flex-container .image-area .main-image { border-radius:2rem; overflow: hidden; } .oxbridge-rescue .intro-header .flex-container .image-area .main-image img { display: block; width: 100%; } .oxbridge-rescue .intro-header .flex-container .image-area .trust-pilot { margin-top: 2rem; } .oxbridge-rescue .intro-header .flex-container .image-area .trust-pilot p { color:#a9a9a9; text-align: center; padding-bottom: 1.7rem; } .oxbridge-rescue .intro-header .flex-container .text-area h1 { } .oxbridge-rescue .intro-header .flex-container .text-area p { } .oxbridge-rescue .intro-header .flex-container .text-area .buttons { margin: 2rem 0 3rem; } .oxbridge-rescue .intro-header .flex-container .text-area .buttons a.btn-brick { font-size: 1.3rem; } .oxbridge-rescue .intro-header .flex-container .text-area .buttons a.more-link { color: var(--theme-color1); text-decoration: none; margin-left: 2rem; font-size: 1.3rem; } .oxbridge-rescue .intro-header .flex-container .text-area .buttons a.more-link:hover { color: var(--theme-color2); } .oxbridge-rescue .intro-header .flex-container .text-area .buttons a.more-link .fa { color: var(--theme-color2); text-decoration: none; } .oxbridge-rescue .intro-header .flex-container .text-area ul { font-size: 1.3rem; list-style: none; padding: 0; } .oxbridge-rescue .intro-header .flex-container .text-area ul li { margin: 0 .3em 1em 2em; line-height: 1.1; } .oxbridge-rescue .intro-header .flex-container .text-area ul li:before { content: '\f00c'; color: var(--theme-color2); font-family: 'FontAwesome'; float: left; margin-left: -1.5em; } @media screen and (max-width: 1540px) { .oxbridge-rescue .intro-header .flex-container .text-area ul { font-size: 1.1rem; } } @media screen and (max-width: 1000px) { .oxbridge-rescue .intro-header { padding: 6rem 0 3rem; } .oxbridge-rescue .intro-header .flex-container { flex-wrap: wrap; } .oxbridge-rescue .intro-header .flex-container .text-area { width:100%; } .oxbridge-rescue .intro-header .flex-container .image-area { width:100%; margin-top: 2rem; } .oxbridge-rescue .intro-header .flex-container .text-area .buttons { margin: 1rem 0 1.6rem; } } @media screen and (max-width: 528px) { .oxbridge-rescue .intro-header { padding: 3rem 0; } } .oxbridge-rescue .why-switch { padding: 6rem 0; background: #fafafa; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; } .oxbridge-rescue .why-switch .flex-container { flex-wrap: nowrap; justify-content: space-between; } .oxbridge-rescue .why-switch .flex-container .left-side { width:47%; } .oxbridge-rescue .why-switch .flex-container .right-side { width:47%; } .oxbridge-rescue .why-switch .flex-container .left-side ul { list-style: none; margin: 0; padding: 0; } .oxbridge-rescue .why-switch .flex-container .left-side ul li { padding:1rem 1.4rem 1rem 3.2rem; margin: 0 0 1rem 0; background:#e8e8e8; font-size: 1.3rem; border-radius: 8px; font-weight: 600; } .oxbridge-rescue .why-switch .flex-container .left-side ul li:before { content: '\f00d'; color: #ff4d01; font-family: 'FontAwesome'; float: left; margin-left: -1.5em; } .oxbridge-rescue .why-switch .flex-container .right-side h3 { } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container { flex-wrap: wrap; justify-content: space-between; column-gap: 1rem; } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile { width:calc(50% - 1rem); margin-bottom: 2rem; background: var(--theme-color2); border-radius:1.2rem; padding: 1rem 1.4rem; } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile .ico-wrap { border-radius:50%; background:#fff; width:50px; height: 50px; padding:0.6rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1.3rem; } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile .ico-wrap img { display: block; width:100%; height: auto; } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile h4 { color: var(--theme-color5); } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile p { color: #fff; } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile a { color: #fff; text-decoration: underline; } .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile a:hover { color: var(--theme-color5); text-decoration: underline; } @media screen and (max-width: 1540px) { .oxbridge-rescue .why-switch .flex-container .left-side ul li { font-size: 1.1rem; } } @media screen and (max-width: 1000px) { .oxbridge-rescue .why-switch { padding: 3rem 0 ; } .oxbridge-rescue .why-switch .flex-container { flex-wrap: wrap; } .oxbridge-rescue .why-switch .flex-container .left-side { width:100%; } .oxbridge-rescue .why-switch .flex-container .right-side { width:100%; } .oxbridge-rescue .why-switch .flex-container .left-side ul li { line-height: 1.2; } .oxbridge-rescue .why-switch .flex-container .right-side h3 { margin-top:2rem; } } @media screen and (max-width: 560px) { .oxbridge-rescue .why-switch .flex-container .right-side .flex-container .usp-tile { width:100%; margin-bottom:1rem; } } .oxbridge-rescue .how-to-switch { padding: 6rem 0; } .oxbridge-rescue .how-to-switch .flex-container { flex-wrap: nowrap; justify-content: space-between; } .oxbridge-rescue .how-to-switch .flex-container .step-tile { width:calc(25% - 1rem); margin-bottom: 2rem; background:#18425f; border-radius:1.2rem; padding: 1.6rem 1.4rem 1rem; color: #fff; } .oxbridge-rescue .how-to-switch .flex-container .step-tile h4 { color: #fff; } .oxbridge-rescue .how-to-switch .flex-container .step-tile p { color: #fff; } .oxbridge-rescue .how-to-switch .flex-container .step-tile .number-wrap { border-radius:50%; background:var(--theme-color2); width:50px; height: 50px; padding:1rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; font-size:1.4rem; color: #fff; font-weight: 800; } .oxbridge-rescue .how-to-switch .buttons { } .oxbridge-rescue .how-to-switch .buttons a.btn-brick { font-size: 1.3rem; } .oxbridge-rescue .how-to-switch .buttons a.more-link { color: var(--theme-color1); text-decoration: none; margin-left: 2rem; font-size: 1.3rem; } .oxbridge-rescue .how-to-switch .buttons a.more-link:hover { color: var(--theme-color2); } .oxbridge-rescue .how-to-switch .buttons a.more-link .fa { color: var(--theme-color2); text-decoration: none; } @media screen and (max-width: 1000px) { .oxbridge-rescue .how-to-switch { padding: 3rem 0; } .oxbridge-rescue .how-to-switch .flex-container { flex-wrap: wrap; } .oxbridge-rescue .how-to-switch .flex-container .step-tile { width:calc(50% - 1rem); } } @media screen and (max-width: 560px) { .oxbridge-rescue .how-to-switch .flex-container .step-tile { width:100%; margin-bottom:1rem; } .oxbridge-rescue .how-to-switch .buttons a.more-link { display: none; } } .oxbridge-rescue .comparrison { padding: 6rem 0; background: #fafafa; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; } /* Table */ .oxbridge-rescue .comparrison .compare-wrap{ width: 100%; overflow-x: auto; } .oxbridge-rescue .comparrison .compare-table{ width: 100%; border-collapse: collapse; font-size: 1.1rem; line-height: 1.45; } .oxbridge-rescue .comparrison .compare-table thead th{ color: #3e3e43; font-weight: 800; text-align: left; padding: 12px 14px; border-bottom: 1px solid #3e3e43; } .oxbridge-rescue .comparrison .compare-table thead th:nth-child(2){ color:#ff4d01; } .oxbridge-rescue .comparrison .compare-table thead th:nth-child(3){ color: var(--theme-color2); } .oxbridge-rescue .comparrison .compare-table tbody th, .oxbridge-rescue .comparrison .compare-table tbody td{ padding: 12px 14px; border-bottom: 1px solid #e5e7eb; vertical-align: top; text-align: left; } .oxbridge-rescue .comparrison .compare-table tbody th{ font-weight: 600; color: #3e3e43; width: 28%; } .oxbridge-rescue .comparrison .compare-table tbody td:nth-child(2){ color: #4b5563; } .oxbridge-rescue .comparrison .compare-table tbody td:nth-child(3){ color: #4b5563; } @media screen and (max-width: 1000px) { .oxbridge-rescue .comparrison { padding: 3rem 0; } } @media screen and (max-width: 780px) { .oxbridge-rescue .comparrison .compare-table{ font-size:0.8rem; } .oxbridge-rescue .comparrison .compare-table thead th{ padding: 10px 8px; } .oxbridge-rescue .comparrison .compare-table tbody th, .oxbridge-rescue .comparrison .compare-table tbody td{ padding: 10px 8px; } } .oxbridge-rescue .rescure-plan { padding: 6rem 0; } .oxbridge-rescue .rescure-plan .flex-container { flex-wrap: nowrap; justify-content: space-between; } .oxbridge-rescue .rescure-plan .flex-container .left-side { width:calc(70% - 2rem); background: #fafafa; border: 1px solid #e5e5e5; border-radius:1.2rem; padding: 2rem; } .oxbridge-rescue .rescure-plan .flex-container .right-side { width:30%; background: #fafafa; border: 1px solid #e5e5e5; border-radius:1.2rem; padding: 2rem; } .oxbridge-rescue .rescure-plan .flex-container .left-side ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 1rem; } .oxbridge-rescue .rescure-plan .flex-container .left-side ul li { padding: 1rem 1.4rem 1rem 2.8rem; margin: 0 0 1rem 0; font-size: 1.3rem; border-radius: 8px; background:#18425f; color: #fff; } .oxbridge-rescue .rescure-plan .flex-container .left-side ul li:before { content: '\f00c'; color: var(--theme-color2); font-family: 'FontAwesome'; float: left; margin-left: -1.5em; } .oxbridge-rescue .rescure-plan .buttons { margin-top: 1rem; } .oxbridge-rescue .rescure-plan .buttons a.btn-brick { font-size: 1.3rem; } .oxbridge-rescue .rescure-plan .buttons a.more-link { color: var(--theme-color1); text-decoration: none; margin-left: 2rem; font-size: 1.3rem; } .oxbridge-rescue .rescure-plan .buttons a.more-link:hover { color: var(--theme-color2); } .oxbridge-rescue .rescure-plan .buttons a.more-link .fa { color: var(--theme-color2); text-decoration: none; } .oxbridge-rescue .rescure-plan .flex-container .right-side h3 { } .oxbridge-rescue .rescure-plan .flex-container .right-side ul { list-style: none; margin: 0; padding: 0; } .oxbridge-rescue .rescure-plan .flex-container .right-side ul li { padding: 1rem 1.4rem; margin: 0 0 1rem 0; background:#fff; font-size: 1.3rem; border-radius: 8px; border: 1px solid #e5e5e5; } @media screen and (max-width: 1540px) { .oxbridge-rescue .rescure-plan .flex-container .right-side ul li { font-size: 1.1rem; } .oxbridge-rescue .rescure-plan .flex-container .left-side ul li { font-size: 1.1rem; } } @media screen and (max-width: 1450px) { .oxbridge-rescue .rescure-plan .flex-container .left-side { width:calc(50% - 1rem); } .oxbridge-rescue .rescure-plan .flex-container .right-side { width:calc(50% - 1rem); } .oxbridge-rescue .rescure-plan .flex-container .left-side ul { columns: 1; } } @media screen and (max-width: 1050px) { .oxbridge-rescue .rescure-plan .flex-container { flex-wrap: wrap; } .oxbridge-rescue .rescure-plan .flex-container .left-side { width:100%; } .oxbridge-rescue .rescure-plan .flex-container .right-side { width:100%; margin-top: 2rem; } } @media screen and (max-width: 1000px) { .oxbridge-rescue .rescure-plan { padding: 3rem 0; } } @media screen and (max-width: 600px) { .oxbridge-rescue .rescure-plan .flex-container .right-side ul li { font-size: 1rem; } } .faqs { padding: 6rem 0; background: #fafafa; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; } .faqs h2 { text-align: center; } .faqs p.intro { text-align: center; max-width:1200px; margin:0 auto 3rem; } .faqs .flex-container { justify-content: space-between; } .faqs .flex-container#accordion { } .faqs .flex-container#accordion .left-side { width:49.7%; } .faqs .flex-container#accordion .right-side { width:49.7%; } .faqs .flex-container#accordion .accord-wrap { background:#fff; padding:0; border: 2px solid var(--theme-color1); margin-bottom: 12px; border-radius: 3rem; } .faqs .flex-container#accordion .accord-wrap h3.accordion-toggle { background:none; color:var(--theme-color1); padding:2rem 4rem 2rem 2.5rem; margin: 0; font-weight: 700; font-size: 1.5rem; } .faqs .flex-container#accordion .accord-wrap h3.accordion-toggle::before { font-size: 1.4rem; right: 2rem; font-family:FontAwesome; content: "\f107"; transform: translateY(-50%); transition:all 0.40s ease-in-out; text-indent: 0; } .faqs .flex-container#accordion .accord-wrap h3.accordion-toggle.active::before { transform: translateY(-50%) rotate(180deg); transition:all 0.40s ease-in-out; color:var(--theme-color1); } .faqs .flex-container#accordion .accord-wrap h3.accordion-toggle::before { color:var(--theme-color1); } .faqs .flex-container#accordion .accord-wrap h3.accordion-toggle .fa { width:0.6rem; } .faqs .flex-container#accordion .accord-wrap .accordion-content { color:var(--theme-color1); padding:0 2rem 2rem; margin: 0; font-size: 1.2rem; } .faqs .flex-container#accordion .accord-wrap .accordion-content p { color:var(--theme-color1); padding:0.5rem 0 0 0; margin: 0; font-size: 1.2rem; } .faqs .flex-container#accordion .accord-wrap .accordion-content ul { color:var(--theme-color1); font-size: 1.2rem; margin: 4px 0 12px 0; list-style: none; padding: 0; } .faqs .flex-container#accordion .accord-wrap .accordion-content ul li { margin: .3em .3em .3em 3em; } .faqs .flex-container#accordion .accord-wrap .accordion-content ul li:before { content: '\f058'; font-family: 'FontAwesome'; float: left; margin-left: -1.5em; } .faqs .flex-container#accordion .accord-wrap .accordion-content p:first-child { padding-top:0; } .faqs .flex-container#accordion .accord-wrap .accordion-content iframe { padding:1rem 0 0 0; } @media screen and (max-width: 980px) { .faqs .flex-container { flex-wrap: wrap; } .faqs .flex-container#accordion .left-side { width:100%; } .faqs .flex-container#accordion .right-side { width:100%; } } @media screen and (max-width:680px) { .faqs { padding: 2rem 0; } } /***** Contact Form Section *******/ .contact-form { display: flex; justify-content: center; padding: 4rem 0; margin: 0; background: #17425f; background-image: url(/pix/computer-hands.webp); background-size: cover; background-position: center; } .contact-form .form-wrap { width:94%; margin: 0 auto; } .contact-form .callback { padding: 5rem 6rem; width: auto; background:var(--theme-color2); background:var(--theme-gradient2); } .contact-form .callback .inner { max-width:900px; margin:0 auto; } .contact-form .callback .inner .g-recaptcha { margin-bottom: 0.6rem; } .contact-form .callback h2 { color: #fff; font-size: 3rem; } .contact-form .callback p { color: #fff; padding: 0 0 1.4rem 0; } .contact-form .callback form { } .contact-form .callback label { margin-bottom: 0.5rem; font-size: 1.3rem; color: #fff; font-weight: 400; } .contact-form .callback input { color: #a5a4a4; font-style: normal; width: 100%; border-radius: 6px; display: block; border: none; padding:0.7rem; margin-bottom: 0.8rem; margin-top: 3px; font-size: 1.3rem; } .contact-form .callback button { font-style: normal; border-radius: 2rem; display: inline-block; border: none; padding:0.9rem 1.3rem; font-size: 1.3rem; background: #3d3f41; color: #fff; } /* make placeholder colour match text colour */ .contact-form .callback input::placeholder { color: #a5a4a4; opacity: 1; /* ensures full visibility */ } /* for older browser support */ .contact-form .callback input::-webkit-input-placeholder { color: #a5a4a4; opacity: 1; } .contact-form .callback input:-moz-placeholder { color: #a5a4a4; opacity: 1; } .contact-form .callback input::-moz-placeholder { color: #a5a4a4; opacity: 1; } .contact-form .callback input:-ms-input-placeholder { color: #a5a4a4; opacity: 1; } @media screen and (max-width: 1540px) { .contact-form .callback label { font-size: 1.1rem; } .contact-form .callback input { font-size: 1.1rem; } } @media screen and (max-width: 900px) { .contact-form .callback { padding: 4rem 3rem; } } @media screen and (max-width: 640px) { .contact-form .callback { padding: 2rem; } }