/* -----------------------------------------
CSS RESET
-----------------------------------------*/

/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* -----------------------------------------
TABLE OF CONTENTS
-----------------------------------------
1. Color Library
2. General Styles
3. Grid Styles
4. Navigation and Buttons
5. Header and Hero Styles
6. Divider Styles
7. About Styles
8. Work Section Styles
9. Contact Section
10. Footer Styles
----------------------------------------*/

/* -----------------------------------------
1. COLOR LIBRARY
-----------------------------------------*/

:root{
--color1: #F8F4E3;
--color2: #EAD1A5;
--color3: #7E5A17;
--color4: #DDBEA9;
--color5: #925831;
--color6: #70492E;
--color7: #C1C9B3;
--color8: #A3B18A;
--color9: #6D7A56;
--color10: #9CA3AF;
--color11: #54628B;
--color12: #1E1F26;
}

/* -----------------------------------------
2. GENERAL STYLES
-----------------------------------------*/

body{
    background-color: var(--color1);
    font: normal 400 16px/20px 'Montserrat', sans-serif;
}

*:before, *:after{
    box-sizing: border-box;
    transition: .7s;
}

h1{
    font-size: 38px;
    line-height: 48px
}

h3{
    font-size: 30px;
    line-height: 64px;
    margin-bottom: 16px;
}

p{
    margin-bottom: 16px;
}

.uppercase{
    text-transform: uppercase;
}

/* -----------------------------------------
3. GRID STYLES
-----------------------------------------*/

.container{
    width: 1170px;
    max-width: 90%
}