h1,
h2,
h3 {
   font-family: 'Roboto Condensed', Arial, sans-serif;
}
/* 
h1,
h2,
h3 {
   font-family: 'Roboto Condensed', Arial, sans-serif;
}
/* 
*/
body {
    font-family: Roboto, Arial, sans-serif;
    margin: 0;
    padding: 0;
}

nav ul {
   margin: 0;
   padding: 0;
   list-style: none;
}



/* -----------------------------
   Styles for header
   ----------------------------- */

   header nav {
      background-color: #FFFFFF;
   }
   
   header h2 {
      background-color: #51b0f4;
      color: #ffffff;
      font-variant: small-caps;
      font-weight: normal;
      font-size: 1.25rem;
      margin-top: 0.1rem;
      margin-bottom: 0.1rem;
      margin-right: 0.1rem;
      padding: 0.5rem;
   }
   
   header h2.wordmark {
      background-color: #ffffff;
      background-image: url(../images/dentalogixlogo.png);
      font-family: 'Roboto, Arial, sans-serif';
      background-repeat: no-repeat;
      overflow: hidden;
      display: block;
      width: 258px;
      height: 106px;
      text-indent: -300000px;
      float: left;
      padding: 1rem;
      margin-left: 0.5rem;
      border: 0;
   }
   
   header nav ul {
      display: flex;
      justify-content: center;
      list-style: none;
      margin: 0;
      padding: 0;
      padding-top: 4rem;
      padding-right: 0.5rem;
      font-size: 1.75rem;
   }

/* -----------------------------
   Styles for header primary nav
   ----------------------------- */
/*
header nav.primary ul {
   list-style-type: none;
   text-decoration: none;
   justify-content: flex-end;
   padding-top: 1em;
   padding-bottom: 0;
}
*/
header nav.primary ul li a,
header nav.primary ul li a:link,
header nav.primary ul li a:visited,
header nav.primary ul li a:active
{
   text-decoration: none;
   color:  #000000;
   padding-top: 0.5em;
   padding-right: 0.5em;
   padding-left: 0;
   font-family: 'Roboto condensed', arial, sans-serif;
   font-size: large;
}
header nav.primary ul li a:hover {
   color: #ebebeb;
}

header nav.primary {
   height: 3rem;
}
header nav.primary a:link,
header nav.primary a:visited,
header nav.primary a:active {
   font-weight: bold;
   text-decoration: none;
}

header nav.primary ul li a::before {
   content: " | ";
}


header nav.primary ul li:first-child a::before {
   content: "";
}


header nav.primary ul li:last-child a::before {
   content: "";
}

header nav.primary a:hover {
   text-decoration: underline;
}


header nav.primary ul li.getinfo a {
   background-color: #a51c30;
   color: #ffffff;
   font-weight: bold;
   border: .3rem solid #a51c30;
   padding-bottom: .1rem;
   padding-left: .2rem;

}
header nav.primary ul li a,
header nav.primary ul li a:link,
header nav.primary ul li a:visited,
header nav.primary ul li a:active
{
   text-decoration: none;
   color:  #000000;
   padding-top: 0.5em;
   padding-right: 0.5em;
   padding-left: 0;
   font-family: 'Roboto condensed', arial, sans-serif;
   font-size: large;
}
header nav.primary ul li a:hover {
   color: #ebebeb;
}

header nav.primary {
   height: 3rem;
}
header nav.primary a:link,
header nav.primary a:visited,
header nav.primary a:active {
   font-weight: bold;
   text-decoration: none;
}

header nav.primary ul li a::before {
   content: " | ";
}


header nav.primary ul li:first-child a::before {
   content: "";
}


header nav.primary ul li:last-child a::before {
   content: "";
}

header nav.primary a:hover {
   text-decoration: underline;
}


header nav.primary ul li.getinfo a {
   background-color: #a51c30;
   color: #ffffff;
   font-weight: bold;
   border: .3rem solid #a51c30;
   padding-bottom: .1rem;
   padding-left: .2rem;
}

/* -----------------------------
   Styles for header secondary nav
   ----------------------------- */
header nav.secondary {
   flex-wrap: nowrap;
   height: 60px;

}
nav.secondary a:link,
nav.secondary a:visited,
nav.secondary a:active

{
   margin-left: 2rem;
   font-weight: bold;
   color: #4d84c4;
   text-align: center;
   text-decoration: none;
}
header nav.secondary a:hover {
   text-decoration: underline;
}

header li.login a{
   padding: 0.5rem 1rem;
   border: 2px solid #4d84c4;
}

/* -----------------------------
   Styles for "Dentalhero"
   ----------------------------- */

   div.dentalhero {
      background-image: url(../images/dental_hero_banner_1.jpeg);
      background-repeat: no-repeat;
      background-color: #f5f5f8;
      background-size: cover;
      clear: both;
      padding-bottom: 20rem;
   }
   
   div.dentalhero h1 {
      margin: 0;
      color: #fc4d26;
      font-family: 'Roboto Condensed', Arial, sans-serif;
      text-shadow: 1px 1px 1px #000000;
      text-align: left;
      font-size: 60px;
      padding-left: 9rem;
      padding-top: 4.5rem;
   }

   div.dentalhero p {
      margin: 0;
      color: #000000;
      font-family: 'Roboto Condensed', Arial, sans-serif;
      text-align: left;
      font-size: 30px;
      padding-left: 9rem;
      padding-top: 4.5rem;
      padding-block-start: 3rem;
      padding-block-end: 4rem;
      padding-right: 50rem;
   }
/* -----------------------------
   Styles for "Dentalsmile"
   ----------------------------- */

   div.dentalsmile {
      background-repeat: no-repeat;
      background-color: #ffffff;
      background-size: cover;
      clear: both;
      padding-bottom: 2rem;
   }
   
   div.dentalsmile h1 {
      margin: 0;
      color: #4d84c4;;
      font-family: 'Roboto Condensed', Arial, sans-serif;
      text-align: center;
      font-size: 60px;
      padding-top: 1.5rem;
      padding-bottom: 3rem;
   }
   
   div.dentalsmile #smilenote {
      margin: 0;
      color: #4d84c4;
      font-family: 'Roboto Condensed', Arial, sans-serif;
      text-align: center;
      font-size: 20px;
      padding-top: 1.5rem;
      padding-bottom: 3rem;
   }

   div.dentalsmile div.dentalservices {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 2rem;
      padding: 0;
      margin: 0;
      color: #000000;
   
   }
   
   div.dentalsmile div.dentalservices section {
      flex-basis: 30%;
      background-color: #ffffff;
   }
   
   div.dentalsmile div.dentalservices section h2 {
      text-transform: uppercase;
      margin: 0;
      padding: 0;
      padding-left: 1rem;
      padding-top:  1rem;
      background-color: #ffffff;
      
      padding-bottom: 0.5rem;
      font-size: 1.25rem;
   }
   
   div.dentalsmile div.dentalservices li {
      list-style: none;
      padding: 0;
   }
   
   div.dentalsmile div.dentalservices a:link,
   div.dentalsmile div.dentalservices a:visited,
   div.dentalsmile div.dentalservices a:active {
      text-decoration: none;
      font-weight: bold;
      font-size: 1.2rem;
   }
   
   div.exploredentalsmile div.dentalservices li::after {
      content: url(../images/arrow-right.svg);
      padding-left: .5rem;
   }
   
   div.dentalsmile div.dentalservices section ul {
      padding: 1rem;
      margin: 0;
   }

   /* -----------------------------
   Styles for "latestnews"
   ----------------------------- */
   div.latestnews {
      background-color: #ffffff;
      padding: 1rem;
   }

   div.latestnews h2 {
   margin-top: 0;
   margin-bottom: 0;
   font-weight: bold;
   font-family: 'Roboto Condensed', Arial, sans-serif;
   text-align: center;
   font-size: 2.5rem;
   padding-top: 1rem;
   padding-bottom: .5rem;
   }

   div.latestnews>p {
      width: 65%;
      margin: auto;
   }


div.latestnews div.news {
   display: flex;
   justify-content: space-between;
   align-items: stretch;
   font-family: 'Roboto condensed', Arial, sans-serif;
}

div.latestnews div.news {
   flex: 1 1 30%;
   padding: 1rem;
   margin: 1rem;
   background-color: #ffffff;
}

div.latestnews div.news img {
   width: 95%;
   object-fit: cover;
}

div.latestnews div.news article ul { 
   list-style-type: none;
}

div.latestnews div.articles h3 {
   padding-left: .5rem;
}

/* -----------------------------
   Styles for footer
   ----------------------------- */
footer {
   background-color: #51b0f4;;
   padding: 1rem;
   color: #ffffff;
   font-size: 90%;
   text-decoration: none;
}

footer a:link,
footer a:hover,
footer a:active,
footer a:visited {
   color: #ffffff;
   text-decoration: none;

}

footer nav.contactplus {
   font-weight: bold;
}

footer nav.contactplus ul li {
   display: inline;
   padding-left: 2rem;
}

footer nav.contactplus ul li:first-child {
   padding-left: 0rem;
}

footer nav.contactplus ul {
   margin-bottom: 2rem;
}

footer nav.privacyplus ul li {
   display: inline;
}

footer nav.privacyplus ul li a::before {
   content: " | ";
   padding-left: 0.3rem;
   padding-right: 0.3rem;
}

footer nav.privacyplus ul li:first-child a::before {
   content: "";
   padding: 0;
}

footer nav.privacyplus ul {
   margin-bottom: 1rem;
}

#map_container { 
   height: 600px;
   width: 100%;
}

body {
   margin: 1rem 5%;
}

.form-container {
   margin: 80px auto;
   width: 500px;
}

.form-group {
   margin-bottom: 10px;
}

.btn {
   background: #1c94ff;
   padding: 4px 8px;
   border: none;
   box-shadow: 2px 1px 1px #d3d3d3;
   color: #fff;
   outline: none;
   font-size: 17px;
   cursor: pointer;
   width: 100%;
}

label {
   display: block;
   margin-bottom: 2px;
}

.form-group .form-control {
   width: 100%;
   outline: thin;
   padding: 5px;
   border: .5rem;
   background: #ffffff;
   border-bottom: 2px solid #000000;
   border-top: 2px solid #000000;
   border-left: 2px solid #000000;
   border-right: 2px solid #000000;
   font-size: 16px;
}

.has-success .form-control {
   border-bottom: 2px solid #168b3f;
}

.has-danger .form-control {
   border-bottom: 2px solid #dc1d34;
}

.form-group .text-help {
   color: #dc1d34;
}

.inline-label label{
   display: inline;
}

.pristine-error {
   display: table;
}