/************************************************************************
                            IMPORT DES POLICES
************************************************************************/

/*
 * @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;400;900&family=Roboto+Condensed:wght@300;400;700&display=swap');
 * mettre dans font.css le contenu de l'url une fois que c'est terminé.
 * Accelere le chargement de la page
 */

 @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;400;900&display=swap');

:root {
  --color-primary:        #145A70; 
  --color-primary-text:   #FFF; 
  --color-secondary:      #07212E; 
  --color-secondary-text: #FFF; 
  --color-action:         #EB5B49;
  --color-action-text:    #FFF;

  --color-black:          #000;
  --color-white:          #FFF;
  --color-greylight:      #EFEFEF;
  --color-grey:           #CCC;

  --color-text:           #000;

  --color-overlay:        #000000AA;
  --color-primary-overlay:#145A70AA;

  --color-exp-infra:      #90c48b;
  --ocolor-exp-infra:     #90c48b80;
  --tcolor-exp-infra:     #FFF;

  --color-exp-cyber:      #f3dbbc;
  --ocolor-exp-cyber:     #f3dbbc80;
  --tcolor-exp-cyber:     #000;

  --color-exp-pdt:        #f5cb75;
  --ocolor-exp-pdt:       #f5cb7580;
  --tcolor-exp-pdt:       #FFF;

  --color-exp-com:        #bfd56d;
  --ocolor-exp-com:       #bfd56d80;
  --tcolor-exp-com:       #FFF;
  
  --color-exp-tra:        #404e55;
  --color-exp-tra:        #404e5580;
  --tcolor-exp-tra:       #FFF;

  --color-exp-cloud:      #a22778;
  --ocolor-exp-cloud:     #a2277880;
  --tcolor-exp-cloud:     #FFF;


  --color-srv-heb:        #a22778;
  --ocolor-srv-heb:       #a2277880;
  --tcolor-srv-heb:       #FFF;

  --color-srv-ara:        #c33b43;
  --ocolor-srv-ara:       #c33b4380;
  --tcolor-srv-ara:       #FFF;

  --color-srv-ope:        #4aa4c1;
  --ocolor-srv-ope:       #4aa4c180;
  --tcolor-srv-ope:       #FFF;

  --color-srv-cyb:        #e29f48;
  --ocolor-srv-cyb:       #e29f4880;
  --tcolor-srv-cyb:       #FFF;

  --color-mira-backup:    #076380;
  --ocolor-mira-backup:   #07638080;
  --tcolor-mira-backup:   #FFF;

  --color-mira-soc:       #6f82be;
  --ocolor-mira-soc:      #6f82be80;
  --tcolor-mira-soc:      #FFF;
  
  --color-mira-connect:   #acc9e2;
  --ocolor-mira-connect:  #acc9e280;
  --tcolor-mira-connect:  #FFF;

  --color-mira-link:      #681141;
  --ocolor-mira-link:     #68114180;
  --tcolor-mira-link:     #FFF;

  --color-mira-hosting:   #afcc99;
  --ocolor-mira-hosting:  #afcc9980;
  --tcolor-mira-hosting:  #FFF;

  --color-mira-manage:    #c86b62;
  --ocolor-mira-manage:   #c86b6280;
  --tcolor-mira-manage:   #FFF;


  --color-message-red-color: #a94442;
  --color-message-red-back: #f2dede;
  --color-message-red-border: #ebccd1;

  --color-message-green-color: #3c763d;
  --color-message-green-back: #dff0d8;
  --color-message-green-border: #d6e9c6;

  --color-message-warning-color: #ffc107;
  --color-message-warning-back: #fff2cf;
  --color-message-warning-border: #d39e00;

  --gap-xs:  8px;
  --gap:    15px;
  --gap-2 : 30px;
  --gap-3 : 45px;
  --gap-4 : 60px;
  --gap-5 : 75px;
  --gap-6 : 90px;
  --gap-7 : 105px;
  --gap-8 : 120px;
  --gap-12 : 180px;

  --gap-button-v: 5px;
  --gap-button-h: 10px;

  --font-title: 'Montserrat', sans-serif;
  --font-text:  'Montserrat', sans-serif;
  
  --font-title-thin:     100;
  --font-title-regular:  400;
  --font-title-bold:     900;

  --font-text-thin:     100;
  --font-text-regular:  400;
  --font-text-bold:     900;

  --height-header:  80px;

  --size-h1:        3.7rem;
  --size-h1-height: 3.6rem;
  --size-h2:        3rem;
  --size-h2-height: 2.7rem;
  --size-h3:        1.8rem;
  --size-h3-height: 2.2rem;  
  --size-h4:        1.7rem;
  --size-h4-height: 1.4rem;
  --size-p:         1.6rem;
  --size-p-height:  2.2rem;    

  font-size: 62.5%;
}