/* codivus.css */


body
{
   margin: 0;
   padding: 0;

   display: flex;
   flex-direction: column;
   min-height: 100vh;
}

header
{
   border-bottom: 1px solid #85c1e9 ;

   padding-top: 0.5rem;
   padding-left: 0.75rem;
   padding-right: 0.75rem;
   padding-bottom: 0.5rem;

   display: flex;
   column-gap: 5rem;
   justify-content: flex-start;
   align-items: center;


   background-color: #d4e6f1;
   color: black;
}

header img.codivus-logo
{
   width: 90px;
   height: 45px;
}

header div.corporate-identity
{
   display: flex;
   align-items: center;
   justify-content: flex-start;
}

header div.corporate-name
{
   font-family: "Publico Text";
   font-size: 2rem;
   font-weight: bold;
   font-style: italic;
   margin-left: -2.5rem;
}

header div.what-we-do
{
   margin-left: 1rem;
   margin-right: 1rem;
   font-style: italic;
   font-size: 1.5rem;
   display: flex;
   flex-direction: column;
   align-items: center;
}


main
{
   flex-grow: 1;
   flex-shrink: 0;
   flex-basis: auto;
}


nav
{
   font-family: 'Verdana', sans-serif;

   padding-left: 1rem;
   padding-right: 1rem;

   padding-top: 0.5rem;
   padding-bottom: 0.5rem;

   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   column-gap: 1rem;
   row-gap: 0.5rem;

   background-color: #184B81;
   color: white; 
}

nav a
{
   padding-left: 1rem;
   padding-right: 1rem;
   text-decoration: none;
   color: white;
   background-color: #184B81;
}

nav a:hover
{
   background-color: #d4e6f1;
   color: #184B81;
}


nav a.selected
{
   font-style: italic;
}


/* because "about" has teams-styles.css that defines div.main-content */
body#index-id div.main-content,
body#contact-id div.main-content,
body#successes-id div.main-content,
body#technologies-id div.main-content,
body#testimonials-id div.main-content
{
   margin-top: 0.5rem;
   margin-left: 1rem;
   margin-right: 1rem;
   margin-bottom: 0.5rem;

   display: flex;
   flex-wrap: wrap;
   justify-content: flex-start;
   align-items: flex-start;
}


div.main-content section.card
{
   margin: 0.5rem;
   border: 1px solid #33669d; /* 184B81 */
   background-color: #eaf5fc;
   border-radius: 0.5rem;
   max-width: 20rem;

   box-shadow: 0.3rem 0.3rem 0.3rem #c5def9; 
}

div.main-content section.card h1
{
   font-family: Helvetica;
   font-weight: 400;
   font-size: 1rem;

   margin-top: 0.5rem;
   margin-bottom: 0.25rem;
   padding-top: 0;
   padding-left: 0.5rem;
   padding-right: 0.5rem;
}

div.main-content section.card div.card-body
{
   font-family: Helvetica;
   font-weight: 300;
   font-size: 1rem;

   padding: 0.5rem;
}

div.main-content section.card ul
{
   margin-block-start: 0rem;
   padding-inline-start: 1rem;
}

div.main-content section.card ul li
{
  margin-bottom: 0.5rem;
}


footer
{
   font-size: 0.8rem;
   font-style: italic;

   border-top: 1px solid #85c1e9 ;

   background-color: #d4e6f1;
   color: black;

   padding-left: 0.75rem;
   padding-right: 0.75rem;
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;

   flex-shrink: 0;
   display: flex;
   justify-content: space-between;
}

footer div.policies-wrapper
{
    display: flex;
}

footer div.policies-wrapper div
{
   margin-left: 1rem;
   margin-right: 1rem;
}


/* Successes page */

body#successes-id div.success-item
{
   padding-top: 0.75rem;
   display: flex;
   column-gap: 1rem;
}

body#successes-id div.success-item:nth-child(n+2)
{
   border-top: 1px dotted gray;
}

body#successes-id div.caption h2
{
   margin-top: 0;
   padding-top: 0;
}



body#successes-id div.success-item div.caption
{
   max-width: 30rem;
}



body#successes-id div.main-content
{
   flex-direction: column; /* each success-item stacked on top of the other */
   row-gap: 1rem;
}


body#technologies-id div.main-content > h1,
body#about-id div.main-content > h1
{
   font-size: 1.25rem;
   background-color: #3a6ea5; /* the testimonials primary color */
   color: white;
   margin-top: 0;
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
   padding-left: 1rem;
   padding-right: 1rem;
   text-align: center;
}

body#technologies-id div.main-content
{
   flex-direction: column;
   row-gap: 1rem;
}

body#technologies-id div.main-content div.cards-section-wrapper
{
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
   column-gap: 1rem;
   align-items: flex-start;
   justify-content: flex-start;
}

body#technologies-id div.postfix
{
   width: 80%;
}

body#technologies-id div.postfix p
{
   font-style: italic;
}