.buttons {
   text-align: left;
}

.intro p {
   display: inline-block;
   font-weight: 900 !important;
   font-size: var(--mainHeadingFontSize);
}

/* specific to setting password pg */
.intro, #introHeading {
   text-align: left;
   padding: 0 25px;
}

#emailIntroMsg {
   margin: 0 25px;
}

#emailSuccessMsg {
   margin: 0 25px;
}

.attrEntry label {
   display: inline-block;
   text-align: left;
   font-weight: 900 !important;
   margin-top: 1.5em;
}

#attributeList ul li .helpLink {
   display: none;
}

.container {
   font-family: "fidelityfont";
   padding: 4px;
   width: 80%;
   font-weight: 3px;
   font-size: 16px;
}

#logo {
   height: 80px;
   padding-bottom: 10px;
}

.container-logo {
   text-align: center;
   width: 100%;
   margin-bottom: 10px;
}

.panel {
   width: 32.5em;
   border-radius: .1875em;
   box-shadow: 0 1px 4px 0 rgba(0,0,0,.3);
   text-align: left;
}

.panel-body {
   padding: 6px;
   text-align: left;
}

.passContainer {
   height: 50em;
}

.row {
   margin: 0;
   text-align: center;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   display: flex;
   flex-direction: column;
}

.row .panel-default {
   padding: 40px 0px;
   margin-top: auto;
   margin-bottom: auto;
   margin-right: auto;
   margin-left: auto;
   background-color: white;
}

.VerificationControl ul {
    padding: 0 0px 0 0;
}

div#attributeList> ul {
   margin-bottom: 1em;
   padding: 0 25px;
}

#attributeList ul li {
   list-style: none;
   margin: 1rem 0
}

.attrEntry .verificationInfoText {
   margin-bottom: 5px;
}

.col-lg-6 {
   width: 100%;
}

#relative_align {
   position: relative;
   right: 100px;
   padding-bottom: 25px;
}

#attributeList ul.a li {
    list-style: circle;
    list-style-type: disc;
}

input{
   -webkit-appearance: none !important;
}


/* This section solves some MAJOR container issues mostly seen in Safari browsers Mobile and Desktop */
#continue, #cancel{
   margin: 3em 50% 0 50% !important;
   -webkit-appearance: none !important;
   -ms-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);
}

ul li div{
    height: 100% !important;
}

.passContainer {
    height: 100%;
}
/* ########################################################################################### */

/* Below code is with the container */
/* Adding media query for iPhone Xs, iPhone12, iPhone 6,7,8 Plus, Galaxy S5, Moto G4,*/
@media (max-width: 600px){
   body{
      -webkit-appearance: none !important;
      margin: 0 .5em;
   }
   
   .unified_container .row .panel-default{
      width: 100%;
      padding: 1em 0 0 0;
   }

   .container {
      padding: 1em;
      width: 100%;
   }

   div#attributeList> ul, .intro, #introHeading {
      padding: 0 1em;
   }

   .row {
      position: relative;
      top: 0;
      left: 0%;
      transform: translate(0, 0);
      margin: 0 auto;
   }

   button{
      margin: 3em 50% 0 50% !important;
      width: 120px !important;
      padding: 11px 0 !important;
      -webkit-appearance: none !important;
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
   }

   .buttons #email_ver_but_send, #ReadOnlyEmail_ver_but_send {
      margin: 30px 50% 9px 50% !important;
   }
     
   #logo {
      margin-top: 0;
      height: 70px;
   }
}