@font-face {
  font-family: "TheSans";
  src: url("https://www.tangram-tis.nl/custom/common/fonts/thesans/TheSans_B2_400_.eot?#iefix") format("embedded-opentype"), url("https://www.tangram-tis.nl/custom/common/fonts/thesans/TheSans_B2_400_.woff") format("woff"), url("https://www.tangram-tis.nl/custom/common/fonts/thesans/TheSans_B2_400_.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}


@font-face {
  font-family: "TheSans";
  src: url("https://www.tangram-tis.nl/custom/common/fonts/thesans/TheSans_B2_700_.eot?#iefix") format("embedded-opentype"), url("https://www.tangram-tis.nl/custom/common/fonts/thesans/TheSans_B2_700_.woff") format("woff"), url("https://www.tangram-tis.nl/custom/common/fonts/thesans/TheSans_B2_400_.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}

/* Standaardfontdefinitie */
* {font-family: "TheSans", "Open Sans", Arial, Helvetica, sans-serif; font-size: 16px;}
.submitbutton, a.actionlink, .button, input.flatbutton, .button a, button, select, option {font-family: FontAwesome, "TheSans", "Open Sans", Arial, sans-serif;}
h1 span.category:before {font-family: FontAwesome, "TheSans", "Open Sans";}
div.error, p.error {font-family: 'Roboto Mono', Courier, Arial;}


/* Basis steunkleur instellen, standaard is donkerblauwe achtergrond met witte letters */
a, .accountmenu a, .history a, button, a.maillink {color: #1073BD;}
.submitbutton, a.actionlink, .button, input.flatbutton, .button a, #fotolink-image, .photocontainer {background-color: #1073BD;}
.submitbutton, a.actionlink, input.flatbutton, .button a {color: #FFF;}
a:hover, .history a:hover * {color: #1073BD;}
.submitbutton:hover, .button:hover, .button a:hover, a.actionlink:hover, input.flatbutton:hover, .photocontainer:hover, button:hover, button:hover span {background-color: #004489;}
.submitbutton:hover, .button a:hover, a.actionlink:hover, input.flatbutton:hover, button:hover, button:hover span {color: #FFF;}
.csbs h2, .vdtl h2, .vsbs h2, .covv h2 {border-bottom: 1px solid #ff6b00;}
div.header {border-bottom: none;}
input.text:focus, input[type=text]:focus, input.date:focus, input[type="date"]:focus, select:focus, input.account:focus, textarea:focus {border: 1px solid #1073BD;}
button, div#upload-cv-div {background-color: #FFFFFF; border: 1px solid #CCC;}
button:hover  {background-color: #F7F6F4; color: #1073BD;}

/* Afronding van knoppen en inputs, standaard rechte hoeken */
.submitbutton, a.actionlink, .button, .button a, input.flatbutton, button, input.text, input[type="text"], input.date, input[type="date"], select, input.account, textarea, div#upload-cv-div {
  border-radius: 3px;
}


h2 {
  color: #ff6b00;
}

h3 {
    margin: 2em 0 0 0;
    font-weight: 700;
    font-size: 14px;
}

.lowertext {padding-top: 2.5em;}
.stressedtext {text-decoration: underline; font-weight: bold; font-style: normal;}

/*  GRID OPTIMIZATION FOR CURRENT LIGHTBOX */
@media only screen and (max-width: 705px) and (min-width: 695px) {
  .col.name_gender { width: 32.3%; }
  .col.name_title { width: 32.3%; }
  .col.name_initials { width: 32.3%; }
  .col.name_firstname { width: 32.3%; }
  .col.name_prefix { width: 17%; }
  .col.name_lastname { width: 47.65%; }
  .col.address { width: 32.3%; }
  .col.postalcode { width: 17%; }
  .col.city { width: 47.65%; }
  .span_1_of_3 { width: 32.3% }
}
