/* 1. Imports */
@font-face {
   font-family: "CenturyGothicRegular";
   src: url('../fonts/CenturyGothicRegular.ttf') format("truetype");
}
/* 2. Variables */
:root{
  /* 2.1 variables master or global */
  --borderRadius-master: 20px;
  --marginHeight-master: 50px;
  --marginWidth-master: 50px;
  --paddingHeight-master: 2%;
  --paddingWidth-master: 2%;
  /* 2.2 background color */
  --backgroundColor-default: #FFFFFF;
  --backgroundColor-one: #0C101B;
  --backgroundColor-two: #00769C;
  --backgroundColor-three: #213366;
  --backgroundColor-four: #051F3E;
  --backgroundColor-five: #E8E8E8;
  --backgroundColor-six: #F0F0F0;
  /* 2.3 border color */
  --borderColor: #FFFFFF;
  /* 2.4 section */
  --marginHeight-section: calc(var(--marginHeight-master) * 1);
  --marginWidth-section: 0;
  --paddingHeight-section: 0;
  --paddingWidth-section: 0;
  --width-section: 80%;
  /* 2.5 row */
  --marginWidth-row: 0;
  --paddingHeight-row: 0;
  --paddingWidth-row: 0;
  --width-row: 0;
  /* 2.6 row and column */
  --marginHeight-rowAndColumn: calc(var(--marginHeight-master) * 0.5);
  /* 2.7 item */
  --marginHeight-item: calc(var(--marginHeight-master) * 0.5);
  --marginWidth-item: calc(var(--marginWidth-master) * 0.5);
  --minWidth-item: 216px;
  --paddingHeight-item: calc(var(--paddingHeight-master) * 2);
  --paddingWidth-item: calc(var(--paddingWidth-master) * 2);
  --width-item: 0;
  /* 2.8 header section */
  --marginHeight-headerSection: calc(var(--marginHeight-master) * 0.25);
  --marginWidth-headerSection: 0;
  --paddingHeight-headerSection: calc(var(--paddingHeight-master) * 1);
  --paddingWidth-headerSection: calc(var(--paddingWidth-master) * 1);
  --width-headerSection: 0;
  /* 2.9 font */
  --fontColor-default: #58595B;
  --fontColor-gradient: #FFFFFF;
  --fontColor-white: #FFFFFF;
  --fontColor-blueDark: #213366;
  --fontColor-strongTalentManagement: #091432;
  --fontFamily-centuryGothicRegular: CenturyGothicRegular;
  --fontSize-h1: 1.5em;
  --fontSize-h2: calc(var(--fontSize-h1) * 0.85);
  --fontSize-p: calc(var(--fontSize-h1) * 0.7);
  --fontMarginHeight-h1: var(--fontSize-h1);
  --fontMarginHeight-h2: var(--fontSize-h2);
  --fontMarginHeight-p: var(--fontSize-p);
  /* 2.10 br */
  --height-spaceOne: calc(var(--marginHeight-master) * 0.25);
  --height-spaceTwo: calc(var(--marginHeight-master) * 0.5);
  --height-spaceThree: calc(var(--marginHeight-master) * 0.75);
  --height-spaceFour: calc(var(--marginHeight-master) * 1);
  /* 2.11 separator gradient */
  --marginWidth-separatorGradient: 0;
  --paddingHeight-separatorGradient: 0;
  --paddingWidth-separatorGradient: 0;
  --marginHeight-separatorGradientOne: calc(var(--marginHeight-master) * 0.75);
  --marginHeight-separatorGradientTwo: calc(var(--marginHeight-master) * 0.05);
  /* 2.12 separator solid */
  --marginWidth-separatorSolid: 0;
  --paddingHeight-separatorSolid: 0;
  --paddingWidth-separatorSolid: 0;
  --marginHeight-separatorSolid: calc(var(--marginHeight-master) * 0.25);
  /* 2.13 separator gradient and solid */
  --width-separatorLong: 100%;
  --width-separatorShort: 37.5%;
  /* 2.14 semiFull-Edges */
  --width-semiFullEdges: calc(2% * 2);
  /* 2.15 input */
  --paddingHeight-input: var(--paddingHeight-master);
  --paddingWidth-input: var(--paddingWidth-master);
  --width-input: calc(100% - 2px);
}