﻿body {
}

.wrapper { padding-left: 10px; padding-right: 10px; }

section.header { background-image: url("/medical-device-privacy-and-cybersecurity/_assets//hero-image.jpg"); background-size: cover; background-position: center; background-repeat: no-repeat; padding: 30px 0 70px 0; overflow: hidden; }

section.header:before { content: ""; position: absolute; display: block; top: -500px; left: -200px; bottom: 100px; right: 38%; background-color: #5482ab; z-index: 0; transform: rotate(-20deg); transform-origin: bottom right ; }

section.header .wrapper { display: flex; flex-direction: row; gap: 40px; position: relative; z-index: 1; }

section.header .intro { flex-basis: 52%; position: relative; }
section.header .intro > div { position: relative; z-index: 2; }
/*section.header .intro:before { content: ""; position: absolute; display: block; top: -30px; left: 0; bottom: -140px; right: -200px; background-color: #5482ab; z-index: 1; transform: rotate(-13deg); transform-origin: bottom left; }*/
section.header .video { flex-basis: 48%; z-index: 10; }

section.header h1 { color: #ffffff; font-size: 38px; line-height: 1.2em; margin-bottom: 0.3em; width: 100%; max-width: 400px; }
section.header h3 { color: #ffffff; font-size: 23px; line-height: 1.2em; margin-bottom: 1em; width: 100%; max-width: 460px; }

section.header p { color: #ffffff; }

section.header .buttons { display: flex; flex-direction: row; gap: 20px; margin-top: 30px; }

section.header .buttons button,
section.header .buttons a { font-size: 16px; min-width: 150px; display: block; text-align: center; line-height: 1.2em; }

section.header .buttons .btn-talk-to-us { border-color: #bed600; background-color: transparent; color: #ffffff;}
section.header .buttons .btn-talk-to-us:hover { background-color: #bed600; color: #4d5357; }


section.bullet-points { margin-top: -30px; background-color: transparent!important; z-index: 5; }
section.bullet-points .wrapper { z-index: 5; display: flex; flex-direction: row; gap: 20px; }

section.bullet-points .list { flex-basis: 50%; background-color: #EFF3F8; padding: 30px; }
section.bullet-points .list label.title { display: block; font-size: 23px; color: #5482ab; margin-bottom: 1em;  }

section.bullet-points .list ul { list-style: none; }
section.bullet-points .list ul li { color: #3C4748; margin-bottom: 1em; font-size: 16px; line-height: 1.3em; display: flex; flex-direction: row; gap: 16px; align-items: start; }
section.bullet-points .list ul li span.icon { display: block; width: 30px; height: 30px; flex-shrink: 0; background-size: contain; background-position: center; background-repeat: no-repeat; }

section.bullet-points .list ul li span.exclamation { background-image: url("/medical-device-privacy-and-cybersecurity/landing/_assets/exclamation.png"); }
section.bullet-points .list ul li span.tick{ width: 31px; background-image: url("/medical-device-privacy-and-cybersecurity/landing/_assets/tick.png"); }

section.links { margin-top: 40px; }

section.links .wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

section.links .link { position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; }

section.links .link:before { content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.25);}
section.links .link.link-1 { background-image: url("/medical-device-privacy-and-cybersecurity/landing/_assets/link1.jpg"); }
section.links .link.link-2 { background-image: url("/medical-device-privacy-and-cybersecurity/landing/_assets/link2.jpg"); }

section.links .link .content { padding: 30px; position: relative; }

section.links .link .content p.tag { font-size: 19px; color: #bed600; margin-bottom: 0.3em; }
section.links .link .content p.title { font-size: 29px; color: #ffffff; margin-bottom: 0; }

section.links .btn-link { margin-top: 30px; display: inline-block; width: 36px; height: 36px; border: 2px solid #bed600; background-color: transparent; background-image: url("/_assets/icon-plus-white.png"); background-size: 21px; background-position: center; background-repeat: no-repeat; transition: all 0.2s; }
section.links .btn-link:hover { background-color: #bed400; background-image: url("/_assets/icon-plus.png"); }

section.links .link:hover .btn-link { background-color: #bed400; }

.tilt-container { perspective: 300px; height: 100%; }
.tilt { transition: all 0.3s; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; }
.tilt:hover { -webkit-transform: rotateX(4deg); -moz-transform: rotateX(4deg); -o-transform: rotateX(4deg); transform: rotateX(4deg); z-index: 999; }



body.c2019 section.request-a-demo { background-color: #edeeee; }

.rad-inner { width: 1200px; max-width: 100%; margin: auto; padding: 40px 10px; }
.rad-inner .form-container { padding-left: 0; padding-right: 0; }

.rad-inner .form-container .col-2.left { padding-left: 0; }
.rad-inner .form-container .col-2.right { padding-right: 0; }

.left-col-wide { padding: 0 10px; }
.left-col-wide h2 { font-size: 30px; display: inline-block; vertical-align: middle; }

.block-header { background-color: #5c82a8; padding: 13px 20px; margin-bottom: 15px; color: #ffffff; }
.block-header h3 { font-size: 17px; }

.form-cell { font-size: 13px; margin-bottom: 12px; }
.form-cell label { display: block; margin-bottom: 8px; font-size: 16px; color: #000000; }
.form-cell label a { color: inherit; }
.form-container { background-color: #f2f2f2; padding: 30px 25px; }

.form-container input[type="text"],
.form-container input[type="password"],
.dk-select { color: #354546; font-size: 16px; width: 100%; font-family: 'berlingske_sans_roundmedium', sans-serif; border: 1px solid #999999; margin-bottom: 5px; }

.form-container input[type="text"],
.form-container input[type="password"] { padding: 11px; }

.dk-select { padding: 0; }

.form-container textarea { color: #354546; font-size: 13px; padding: 11px; width: 100%; font-family: 'berlingske_sans_roundmedium', sans-serif; height: 122px; resize: none; border: 1px solid #f2f2f2; }
.form-container .col-1,
.form-container .col-2 { padding-left: 15px; padding-right: 15px; }

.error-list { display: none; padding-left: 16px; margin-bottom: 10px; }
.error-list.active { display: block; }
.error-list span { color: #CC0000; font-size: 12px; display: block; margin: 5px 0px; }

@media (max-width: 920px) {
   section.header:before { right: 20px; }
   section.header .intro { max-width: 70%;}
   section.header .wrapper { flex-direction: column; gap: 20px; }
   section.header .video { max-width: 400px; align-self: center; }
}

@media (max-width: 800px) {
   section.bullet-points .wrapper { flex-direction: column; }
   section.links .wrapper { grid-template-columns: 1fr; }
}

@media (max-width: 740px) {
   section.header .intro { max-width: 100%; }
   section.header:before { right: 0; bottom: 0; transform: rotate(0deg); opacity: 0.5; background-color: #000000; }
}