Fonts

You can change the fonts to those that you like. To do this, download the font, paste it into the fonts folder, and connect them using the main.css (or fonts.scss) file. When you do this, change the variable –primary-font to the font you need. You can connect the font using this code:

  1. @font-face {
  2. font-family: "Montserrat";
  3. src: url('../fonts/Montserrat-ExtraLightItalic.ttf') format('truetype');
  4. font-weight: 100;
  5. font-style: italic;
  6. font-stretch: normal;
  7. }
  9. @font-face {
  10. font-family: "Montserrat";
  11. src: url('../fonts/Montserrat-ExtraLight.ttf') format('truetype');
  12. font-weight: 100;
  13. font-style: normal;
  14. font-stretch: normal;
  15. }
  17. @font-face {
  18. font-family: "Montserrat";
  19. src: url('../fonts/Montserrat-LightItalic.ttf') format('truetype');
  20. font-weight: 200;
  21. font-style: italic;
  22. font-stretch: normal;
  23. }
  25. @font-face {
  26. font-family: "Montserrat";
  27. src: url('../fonts/Montserrat-Light.ttf') format('truetype');
  28. font-weight: 200;
  29. font-style: normal;
  30. font-stretch: normal;
  31. }
  33. @font-face {
  34. font-family: "Montserrat";
  35. src: url('../fonts/Montserrat-ThinItalic.ttf') format('truetype');
  36. font-weight: 300;
  37. font-style: italic;
  38. font-stretch: normal;
  39. }
  41. @font-face {
  42. font-family: "Montserrat";
  43. src: url('../fonts/Montserrat-Thin.ttf') format('truetype');
  44. font-weight: 300;
  45. font-style: normal;
  46. font-stretch: normal;
  47. }
  49. @font-face {
  50. font-family: "Montserrat";
  51. src: url('../fonts/Montserrat-Italic.ttf') format('truetype');
  52. font-weight: 400;
  53. font-style: italic;
  54. font-stretch: normal;
  55. }
  57. @font-face {
  58. font-family: "Montserrat";
  59. src: url('../fonts/Montserrat-Regular.ttf') format('truetype');
  60. font-weight: 400;
  61. font-style: normal;
  62. font-stretch: normal;
  63. }
  65. @font-face {
  66. font-family: "Montserrat";
  67. src: url('../fonts/Montserrat-SemiBoldItalic.ttf') format('truetype');
  68. font-weight: 500;
  69. font-style: italic;
  70. font-stretch: normal;
  71. }
  73. @font-face {
  74. font-family: "Montserrat";
  75. src: url('../fonts/Montserrat-SemiBold.ttf') format('truetype');
  76. font-weight: 500;
  77. font-style: normal;
  78. font-stretch: normal;
  79. }
  81. @font-face {
  82. font-family: "Montserrat";
  83. src: url('../fonts/Montserrat-BoldItalic.ttf') format('truetype');
  84. font-weight: 600;
  85. font-style: italic;
  86. font-stretch: normal;
  87. }
  89. @font-face {
  90. font-family: "Montserrat";
  91. src: url('../fonts/Montserrat-Bold.ttf') format('truetype');
  92. font-weight: 600;
  93. font-style: normal;
  94. font-stretch: normal;
  95. }
  97. @font-face {
  98. font-family: "Montserrat";
  99. src: url('../fonts/Montserrat-ExtraBoldItalic.ttf') format('truetype');
  100. font-weight: 700;
  101. font-style: italic;
  102. font-stretch: normal;
  103. }
  105. @font-face {
  106. font-family: "Montserrat";
  107. src: url('../fonts/Montserrat-ExtraBold.ttf') format('truetype');
  108. font-weight: 700;
  109. font-style: normal;
  110. font-stretch: normal;
  111. }
  113. @font-face {
  114. font-family: "Montserrat";
  115. src: url('../fonts/Montserrat-BlackItalic.ttf') format('truetype');
  116. font-weight: 800;
  117. font-style: italic;
  118. font-stretch: normal;
  119. }
  121. @font-face {
  122. font-family: "Montserrat";
  123. src: url('../fonts/Montserrat-Black.ttf') format('truetype');
  124. font-weight: 800;
  125. font-style: normal;
  126. font-stretch: normal;
  127. }
@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-ExtraLightItalic.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-ExtraLight.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-LightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-Light.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-ThinItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-Thin.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-SemiBoldItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-SemiBold.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-BoldItalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-Bold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-ExtraBold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-BlackItalic.ttf') format('truetype');
  font-weight: 800;
  font-style: italic;
  font-stretch: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url('../fonts/Montserrat-Black.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-stretch: normal;
}