/*************************************/
/*  G E N E R E R I C   S T Y L E S  */
/*************************************/

*
  {
  margin: 0;
  padding: 0;
  border: 0;
  }

*, *:before, *:after
  {
  box-sizing: border-box;     /* box size = content + padding + border */
  }



/***************************/
/*  F O N T   S T Y L E S  */
/***************************/

@font-face
  {
  font-family: 'merriweatherheavy_italic';
  src: url('../fonts/merriweather-heavyitalic-webfont.eot');
  src: url('../fonts/merriweather-heavyitalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/merriweather-heavyitalic-webfont.woff2') format('woff2'),
       url('../fonts/merriweather-heavyitalic-webfont.woff') format('woff'),
       url('../fonts/merriweather-heavyitalic-webfont.ttf') format('truetype'),
       url('../fonts/merriweather-heavyitalic-webfont.svg#merriweatherheavy_italic') format('svg');
  font-weight: 900;
  font-style: italic;
  }

@font-face
  {
  font-family: 'sansationbold';
  src: url('../fonts/sansation_bold-webfont.eot');
  src: url('../fonts/sansation_bold-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/sansation_bold-webfont.woff2') format('woff2'),
       url('../fonts/sansation_bold-webfont.woff') format('woff'),
       url('../fonts/sansation_bold-webfont.ttf') format('truetype'),
       url('../fonts/sansation_bold-webfont.svg#sansationbold') format('svg');
  font-weight: 700;
  font-style: normal;
  }



/*********************************/
/*  B A S I C   E L E M E N T S  */
/*********************************/

html
  {
  font-size: 75%;     /* corresponds to 16px × 0.75 = 12px in all major browsers, unless overridden by user settings in browser */
  }


body
  {
  width: 100%;
  background: rgb(255,255,255) url(../images/bg_main_texture_grey.gif);     /* white */
  font-family: Verdana, Corbel, Geneva, 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Liberation Sans', sans-serif;
  font-size: 1rem;     /* = 12px for all body copy */
  font-weight: 400;
  font-style: normal;
  color: rgb(0,0,128);     /* navy blue */
  }



/*******************************************/
/*  G E N E R A L   T E X T   S T Y L E S  */
/*******************************************/

h2
  {
  margin: 0rem 0rem 1.5rem 0rem;
  text-align: left;
  font-size: 1.5rem;
  font-family: 'sansationbold', Verdana, Corbel, Geneva, 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Liberation Sans', sans-serif;
  font-weight: 700;
  font-style: normal;
  text-transform: uppercase;
  color: rgb(0,0,128);     /* navy blue */
  }

h2.second_instance
  {
  margin-top: 3rem;
  }

h3
  {
  margin:2rem 1rem 1rem 0rem;
  text-align: left;
  font-size: 1.125rem;
  font-weight: 700;
  color: rgb(0,0,128);     /* navy blue */
  }

p
  {
  margin: 0.75rem 0rem 0.5rem 0rem;
  line-height: 1.75rem;
  color: rgb(0,0,128);     /* navy blue */
  }

em
  {
  font-style: italic;
  }

.company_name
  {
  font-weight: 700;
  font-style: italic;
  }



/*****************************************/
/*  L A N G U A G E   S E L E C T I O N  */
/*****************************************/

#language_selection
  {
  width: 85rem;
  margin: 0 auto;
  padding: 1.5rem 7rem 1.5rem 0;
  background-color: transparent;
  text-align: right;
  }

#language li
  {
  margin-right: 2.5rem;
  display: inline;
  }

#language a:link, #language a:visited
  {
  display: inline-block;     /* makes link fill entire li area and entire li area (not just text) clickable */
  font-size: 0.75rem;
  font-weight: 700;
  color: rgb(125,139,183);     /* medium smokey blue */
  text-decoration: none;     /* removes default underline and blue or violet color from links */
  }

#language a:hover
  {
  color: rgb(0,0,128);     /* navy blue */
  }

#language a.active_lang, #language a.active_lang:visited, a.active_lang:hover
  {
  color: rgb(0,0,128);     /* navy blue */
  }

#language a:hover, #language a:focus, #language a:active
  {
  outline: none;     /* removes dotted outline from focussed or active links */
  }

.language_flag
  {
  margin-right: 0.75rem;
  border: 0;
  vertical-align: middle;
  box-shadow: 3px 3px 4px rgb(204,204,204);
  width: 32px;
  }



/***********************************************************************************/
/*  W R A P P E R   A R O U N D   H E A D E R   +   T W O - C O L U M N   A R E A  */
/***********************************************************************************/

#wrapper_container_main
  {
  width: 84rem;
  margin: 0 auto;
  border: 1px solid rgb(125,139,183);     /* medium smokey blue */
  padding: 0;
  background-color: rgb(255,255,255);     /* white */
  border-radius: 10px;
  box-shadow: 6px 6px 6px rgb(204,204,204);
  overflow: auto;     /* value must be other than visible (default) (i.e., auto, hidden, scroll …) to clip content at rounded corners */
  }



/*****************/
/*  H E A D E R  */
/*****************/

header
  {
  margin-bottom: 4rem;
  padding: 2rem 8rem 2rem 4rem;
  background: rgb(247,247,247) url(../images/bg_header_letters_lightgrey.png);     /* light grey */
  border-bottom: 1px solid rgb(247,247,247);     /* light grey */
  display: flex;
  justify-content: space-between;     /* flex items are evenly distributed within container along main axis */
  align-items: center;     /* flex items are centered within one line on cross-axis */
  box-shadow: 3px 6px 6px rgb(204,204,204);
  }

#logo
  {
  }

#company_focus
  {
  text-align: right;
  }

h1
  {
  padding-left: 2em;
  font-family: 'merriweatherheavy_italic', Georgia, 'Times New Roman', Times, serif;
  font-size: 1.5rem;
  font-weight: 700;
  font-style: italic;
  letter-spacing: 0.075rem;
  color: rgb(77,112,255);     /* logo blue lighter */
  }

h1 span.bullet:after
  {
  content: url(../images/bullet_diamond_blue.gif);
  }

h1.focus_top
  {
  padding-bottom: 0.5rem;
  border-bottom: 2px solid rgb(77,112,255);     /* logo blue lighter */
  }

h1.focus_bottom
  {
  margin-top: 0.5rem;
  }



/***********************************/
/*  T W O - C O L U M N   A R E A  */
/***********************************/

#wrapper_twocolumns
  {
  padding: 4rem 8rem 4rem 7rem;
  background: url(../images/mapleleaf_lightgrey.png) 20px 240px no-repeat;
  height: 100%;     /* full height of the box */
  min-height: 550px;
  display: flex;
  justify-content: space-between;     /* flex items are evenly distributed within container along main axis */
  align-items: flex-start;     /* flex items are positioned at the beginning of the container */
  gap: 0 5rem;
  }



/***********************************/
/*  M A I N   N A V I G A T I O N  */
/***********************************/

nav
  {
  border-top: 1px dotted rgb(0,0,128);     /* navy blue */
  flex: 0 0 14rem;          /* flex item is sized according to its width and height properties = it is fully inflexible */
  }

nav ul
  {
  margin: 0;
  padding: 0;
  list-style: none;     /* removes bullets */
  }

nav ul li
  {
  margin: 0;
  padding: 0;
  text-align: center;
  font-family: 'sansationbold', Corbel, Geneva, 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Liberation Sans', sans-serif;;
  font-size: 1.375rem;
  font-weight: 700;
  font-style: normal;
  text-transform: lowercase;
  font-variant: small-caps;
  }

nav a, nav a:visited
  {
  display: block;     /* allows padding on all (not only left and right) sides */
  border-bottom: 1px dotted rgb(0,0,128);     /* navy blue */
  padding: 0.75rem;
  text-decoration: none;     /* removes default underline and blue or violet color from links */
  background-color: transparent;
  color: rgb(125,139,183);     /* medium smokey blue */
  }

nav a:hover
  {
  border-bottom: 1px solid rgb(0,0,128);     /* navy blue */
  background: url(../images/arrow_nav_up.gif) no-repeat 50% 100%;
  color: rgb(0,0,128);     /* navy blue */
  }

nav a.active, nav a.active:visited, nav a.active:hover
  {
  border-bottom: 1px solid rgb(0,0,128);     /* navy blue */
  background: url(../images/arrow_nav_up.gif) no-repeat 50% 100%;
  color: rgb(0,0,128);     /* navy blue */
  }

nav a:hover, nav a:focus, nav a:active
  {
  outline: none;     /* removes dotted outline from focussed or active links */
  }



/***************************************/
/*  M A I N   C O N T E N T   A R E A  */
/***************************************/

main
  {
  flex: 1 1 auto;          /*  */
  }

img.membership
  {
  float: right;
  margin: 0px 8px;
  padding: 5px;
  border: 1px solid rgb(183,204,221);     /* very light smokey blue */
  box-shadow: 3px 3px 4px rgb(204,204,204);
  }


/* LISTS */

ul.standard
  {
  padding-left: 1.5rem;
  list-style: url(../images/bullet_doublearrow.gif);
  }

ul.standard li
  {
  margin-bottom: 0.75rem;
  line-height: 1.5rem;
  }

ul.standard li p     /*  GERMAN SERVICES PAGE ONLY  */
  {
  margin-top: 0.75rem;
  line-height: 1.5rem;
  }


ul.standard li ul li     /*  GERMAN SERVICES PAGE ONLY  */
  {
  margin-top: 1rem;
  margin-left: 1.5rem;
  list-style-image: none;     /* removes double arrow bullets */
  list-style-type: circle;
  }


ul.table_like     /*  SERVICES PAGE ONLY  */
   {
   margin-top: 0.75rem;
   }

ul.table_like li
  {
  display: inline-block;     /* automatically removes bullets from list items */
  width: 14rem;
  }

ul.table_like li:before
  {
  content: url(../images/bullet_doublearrow.gif) ' ';
  letter-spacing: 0.25em;
  }



/* CSS TABLE -- CONTACT PAGE ONLY */

table
  {
  margin-top: 2.5em;
  width: 60%;
  table-layout: fixed;     /* horizontal layout is determined by table and column widths, not cell contents */
  }

tr
  {
  }

td
  {
  vertical-align: top;
  padding-bottom: 1rem;
  line-height: 1.75rem;
  }

td:first-child
  {
  width: 12rem;
  font-weight: 700;
  }


/* INTERNAL LINKS */

a.link_inline, a.link_inline:visited, a.link_inline:focus, a.link_inline:hover, a.link_inline:active
  {
  padding-left: 12px;
  padding-bottom: 0.125rem;
  text-decoration: none;     /* removes default underline and blue or violet color from links */
  color: rgb(63,76,127);     /* dark blue */
  background: url(../images/arrow_link.gif) no-repeat 2% center;
  }

a.link_inline:hover
  {
  border-top: 1px dotted rgb(143,153,191);     /* light smokey blue */
  border-bottom: 1px dotted rgb(143,153,191);     /* light smokey blue */
  }

a.link_inline:hover, a.link_inline:focus, a.link_inline:active
  {
  outline: none;     /* removes dotted outline from focussed or active links */
  }



/*****************/
/*  F O O T E R  */
/*****************/

footer
  {
  width: 85rem;
  margin: 0 auto;
  padding: 0.75rem 3rem;
  background-color: transparent;
  display: flex;                           /*  */
  justify-content: space-between;          /*  */
  align-items: center;                     /*  */
  font-size: 0.75rem;
  font-style: italic;
  color: rgb(63,76,127);     /* dark blue */
  }

#copyright
  {
  flex: 1 1 auto;          /*  */
  text-align: left;
  }

#privacy
  {
  flex: 1 1 auto;          /*  */
  text-align: center;
  }

#designer
  {
  flex: 1 1 auto;          /*  */
  text-align: right;
  }


footer a.link_inline, footer a.link_inline:visited, footer a.link_inline:focus, footer a.link_inline:hover, footer a.link_inline:active
  {
  padding-left: 12px;
  padding-bottom: 0.125rem;
  padding-right: 4px;
  text-decoration: none;     /* removes default underline and blue or violet color from links */
  color: rgb(125,139,183);     /* medium smokey blue */
  background: url(../images/arrow_link.gif) no-repeat 2% center;
  }

footer a.link_inline:hover
  {
  color: rgb(63,76,127);     /* dark blue */
  border-top: 1px dotted rgb(143,153,191);     /* light smokey blue */
  border-bottom: 1px dotted rgb(143,153,191);     /* light smokey blue */
  }


/*************/
/*  N E W S  */
/*************/

#news
  {
  width: 100%;
  margin: 0 auto 2.5em auto;
  padding: 1em 0;
  border: 1px solid #ddeeff;
  border-radius: 7px;
  background: #ddeeff;
  font-family: 'merriweatherheavy_italic', Georgia, 'Times New Roman', Times, serif;
  font-size: 1.25rem;     /* = 15px */
  font-weight: 700;
  font-style: italic;
  letter-spacing: 0.04em;
  text-align: center;
  }

