@font-face { 
  font-family: 'Dragon Glyphs Display';
  src: url('https://cdn.omeda.com/hosted/images/dragon/generic/316.eot'); /* IE9 */
  src: url('https://cdn.omeda.com/hosted/images/dragon/generic/316.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
  src: local('na:)none'),
    url('https://cdn.omeda.com/hosted/images/dragon/generic/316.woff') format('woff'),
    url('https://cdn.omeda.com/hosted/images/dragon/generic/316.ttf') format('truetype'),
    url('https://cdn.omeda.com/hosted/images/dragon/generic/316.svg#DragonGlyphsDisplay') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}


/* =========================
   Base / Reset
   ========================= */
* {
  box-sizing: border-box;
}

/* =========================
   Layout Containers
   ========================= */

#logo img {
    max-width: 500px;
    float: none;
    width: 100%;
    min-width: 200px;
}

.container {
  top: 0 !important;
  width: 100%;

}

div#content1,
span#cover {
  margin: 0;
}

div#content1 {
    display: block;
    margin: 0 auto 20px;
    float: none;
    max-width: 800px;
}

div#content4 {
    padding-top: 50px;
    background: #f9f9f9;
    margin: 0;
    display: block;
    float: none;
    /* max-width: 800px; */
    width: 100%;
}


/* =========================
   Header
   ========================= */
span#header_logo {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px;
  width: 100%;
  background: #000;
}

span.head_img {
  display: block;
  max-width: 500px;
  padding: 0px 40px;
  width: 100%;
}

span.head_intro {
  text-align: center;
  margin-bottom: 20px;
  font-size: 35px;
  line-height: normal;
  color: #fff;
  padding: 0 40px;
}

/* =========================
   Typography
   ========================= */
h2 {
  margin: 0 0 20px;
  font-family: inherit;
  font-weight: bold;
  text-align: center;
  color: #000;
}

h3 {
    font-family: inherit;
    color: #000;
    font-size: 22px;
    line-height: initial;
    max-width: 550px;
    text-align: center;
    margin: 0 auto 30px;
}

span.questionlabel {
    color: #000;
}

/* =========================
   Address Section
   ========================= */
.address-sec {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0px;
}

/* Full-row paragraph in address section */
p#p13 {
  padding: 0 10px;
  flex: 100%;
  margin-bottom: 0;
}

/* Half-width paragraphs */
p#p1,
p#p2,
p#p9 {
  padding: 0 10px;
  width: 50%;
  margin: 0;
}

/* Full-width paragraph */
p#p7 {
  width: 100%;
  margin: 0;
}

/* Specific field width */
span.spanc7.drg-element-type-standard-field.drg-element-sub-type-fieldname-COUNTRY {
  width: 50%;
  padding: 0 10px;
}

/* =========================
   Form Fields
   ========================= */
input#id1,
input#id2,
input#id9,
input#id13,
select#id7 {
  height: 40px;
  width: 100%;
  max-width: 100%;
}

/* Check-all Button Group */

.selectall {
  border: 1px solid black;
  background: #fff;
  color: #111;
}

.selectall:hover {
  background: #555;
  color: #fff;
}

#checkall {
  text-align: center;
  margin: 40px 0;
}

.selectall {
  font-family: 'Roboto', sans-serif;
  text-shadow: none;
  margin: 10px 20px;
  padding: 10px 15px;
  font-size: 15px;
  width: 220px;
  max-width: 100%;
  display: inline-block;
  cursor: pointer;
  transition: color .3s;
}

.selectall::before {
  font-family: "Dragon Glyphs Display";
	white-space: pre-wrap;
}

#suball::before {
  content: "\ec02\0020";
}

#unsuball::before {
  content: "\ec01\0020";
}

.selectall:hover {
  background: #555;
  color: #fff;
  transition: color .3s;
}

div#sec3 {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.subscription-status {
  font-size: 14px;
  font-weight: bold;
  color: #2b3a42;
  /* margin-top: 8px; */
}

.subscription-title {
  color: #000;
  font-weight: bold;
  font-size: 28px;
  margin-bottom: 8px;
}

.subscription-frequency {
  display: flex;
  font-size: 16px;
  color: #000000;
  /* text-transform: uppercase; */
  font-weight: bold;
  margin: 20px 0px;
}

.subscription-description {
  font-size: 18px;
  color: #000;
  margin-bottom: 8px;
}

div#nlcont {
    display: flex;
}

.checkbox-container {
    display: flex;
}

.checkbox-container input {
    margin: 0 7px 0 0;
}

div#nlcont div .questionlabel {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 0px;
}

div#nlcont > div {
    background: #fff;
    border-radius: 5px;
    display: flex;
    border: 1px solid #2b3a42;
    padding: 15px 20px;
    align-items: stretch;
    width: 45%;
}

div#nlcont {
    display: flex;
    gap: 25px 20px;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0 auto;
    justify-content: center;
}

/* Style the container div when the checkbox is checked */
.drg-element-type-deployment-type:has(input[type="checkbox"]:checked) {
    border-color: #007BFF !important; /* Change border color when checked */
    background-color: #F0F8FF !important; /* Optional: Add a background color */
}

/* Style the subscription title when the checkbox is checked */
.drg-element-type-deployment-type:has(input[type="checkbox"]:checked) .subscription-title {
    color: #0055cc;
}

/* Style the subscription status text when the checkbox is checked */
.drg-element-type-deployment-type .subscription-status {
    color: #000000; /* Default color */
}

.drg-element-type-deployment-type:has(input[type="checkbox"]:checked) .subscription-status {
    color: #0055cc; /* Change color when checked */
    content: "Subscribed"; /* Change text (requires additional HTML/CSS) */
}

.subscription-preview a {
    color: #2b3a42;
    font-size: 14px;
}


.drg-element-type-deployment-type {
  position: relative; 

}

.subscription-preview {
  position: absolute;
  bottom: 15px;  
  right: 15px;   
  margin: 0;    
}

.subscription-frequency span:before {width: 24px;height: 23px;display: inline-block;vertical-align: middle;content: '';background: url("data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDUxMS42MzQgNTExLjYzNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNTExLjYzNCA1MTEuNjM0OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPHBhdGggZD0iTTQ4Mi41MTMsODMuOTQyYy03LjIyNS03LjIzMy0xNS43OTctMTAuODUtMjUuNjk0LTEwLjg1aC0zNi41NDF2LTI3LjQxYzAtMTIuNTYtNC40NzctMjMuMzE1LTEzLjQyMi0zMi4yNjEgICBDMzk3LjkwNiw0LjQ3NSwzODcuMTU3LDAsMzc0LjU5MSwwaC0xOC4yNjhjLTEyLjU2NSwwLTIzLjMxOCw0LjQ3NS0zMi4yNjQsMTMuNDIyYy04Ljk0OSw4Ljk0NS0xMy40MjIsMTkuNzAxLTEzLjQyMiwzMi4yNjF2MjcuNDEgICBoLTEwOS42M3YtMjcuNDFjMC0xMi41Ni00LjQ3NS0yMy4zMTUtMTMuNDIyLTMyLjI2MUMxNzguNjQsNC40NzUsMTY3Ljg4NiwwLDE1NS4zMjEsMEgxMzcuMDUgICBjLTEyLjU2MiwwLTIzLjMxNyw0LjQ3NS0zMi4yNjQsMTMuNDIyYy04Ljk0NSw4Ljk0NS0xMy40MjEsMTkuNzAxLTEzLjQyMSwzMi4yNjF2MjcuNDFINTQuODIzYy05LjksMC0xOC40NjQsMy42MTctMjUuNjk3LDEwLjg1ICAgYy03LjIzMyw3LjIzMi0xMC44NSwxNS44LTEwLjg1LDI1LjY5N3YzNjUuNDUzYzAsOS44OSwzLjYxNywxOC40NTYsMTAuODUsMjUuNjkzYzcuMjMyLDcuMjMxLDE1Ljc5NiwxMC44NDksMjUuNjk3LDEwLjg0OWg0MDEuOTg5ICAgYzkuODk3LDAsMTguNDctMy42MTcsMjUuNjk0LTEwLjg0OWM3LjIzNC03LjIzNCwxMC44NTItMTUuODA0LDEwLjg1Mi0yNS42OTNWMTA5LjYzOSAgIEM0OTMuMzU3LDk5LjczOSw0ODkuNzQzLDkxLjE3NSw0ODIuNTEzLDgzLjk0MnogTTM0Ny4xODcsNDUuNjg2YzAtMi42NjcsMC44NDktNC44NTgsMi41Ni02LjU2NyAgIGMxLjcxMS0xLjcxMSwzLjkwMS0yLjU2OCw2LjU3LTIuNTY4aDE4LjI2OGMyLjY3LDAsNC44NTMsMC44NTQsNi41NywyLjU2OGMxLjcxMiwxLjcxMiwyLjU2NywzLjkwMywyLjU2Nyw2LjU2N3Y4Mi4yMjQgICBjMCwyLjY2Ni0wLjg1NSw0Ljg1My0yLjU2Nyw2LjU2N2MtMS43MTgsMS43MDktMy45LDIuNTY4LTYuNTcsMi41NjhoLTE4LjI2OGMtMi42NjksMC00Ljg1OS0wLjg1NS02LjU3LTIuNTY4ICAgYy0xLjcxMS0xLjcxNS0yLjU2LTMuOTAxLTIuNTYtNi41NjdWNDUuNjg2eiBNMTI3LjkxNSw0NS42ODZjMC0yLjY2NywwLjg1NS00Ljg1OCwyLjU2OC02LjU2NyAgIGMxLjcxNC0xLjcxMSwzLjkwMS0yLjU2OCw2LjU2Ny0yLjU2OGgxOC4yNzFjMi42NjcsMCw0Ljg1OCwwLjg1NCw2LjU2NywyLjU2OGMxLjcxMSwxLjcxMiwyLjU3LDMuOTAzLDIuNTcsNi41Njd2ODIuMjI0ICAgYzAsMi42NjYtMC44NTUsNC44NTYtMi41Nyw2LjU2N2MtMS43MTMsMS43MDktMy45LDIuNTY4LTYuNTY3LDIuNTY4SDEzNy4wNWMtMi42NjYsMC00Ljg1Ni0wLjg1NS02LjU2Ny0yLjU2OCAgIGMtMS43MDktMS43MTUtMi41NjgtMy45MDEtMi41NjgtNi41NjdWNDUuNjg2eiBNNDU2LjgxMiw0NzUuMDg4SDU0LjgyM3YtMjkyLjM2aDQwMS45ODlWNDc1LjA4OHoiIGZpbGw9IiMwMDAwMDAiLz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K") no-repeat;}

label.choice {
    padding-right: 10px;
}

div#submitbtn {
    margin: 40px;
}

input[type="submit"] {
    text-shadow: none;
    background: black;
    color: #fff;
    font-size: 20px;
    padding: 15px 40px;
}


@media only screen and (max-width: 810px) {

div#nlcont > div {
    width: 100%;
    display: flex;
    justify-content: space-around;
}

span.questionlabel {
    width: 100%;
}

  div#content4 {
    padding: 0px 15px;
}

}

@media only screen and (max-width: 479px) {
span.head_intro {
  font-size:28px;
}

h2 {
  font-size:24px;
  line-height:normal;
}

  h3 {
    font-size:18px;
  }

  p#p1, p#p2, p#p9, span.spanc7.drg-element-type-standard-field.drg-element-sub-type-fieldname-COUNTRY {
    width: 100%;
  }
  
}
