/* ######################################## ########### davidwindham.com ############## ########################################### . . . . . . . . ...-..-| |-. .-. .-.-..-| .-.. ...-| ` ` '' '`-'-' '-`-`-' ' '`-'-`-`-` '`-'- 1 - Body 2 - Typography 3 - Header 4 - Navigation 5 - Layout 6 - Parts 7 - Footer 9 - Queries 10 - Fonts */ /*######################################## ################# BODY ################### #########################################*/ body { position: relative; margin: 0; padding: 0; min-height: 100%; -webkit-font-smoothing: antialiased; font-kerning: auto; color: #000; background: :#363e48; transition: background-color 0.4s ease; font-family: sans-serif; } /*######################################## ################# TYPE ################### #########################################*/ h1 { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 37px; letter-spacing: .01em; } .header h1 { color: #fff; } h2 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 27px; } h3 { font-family: 'Playfair Display', serif; font-weight: 500; font-size: 23px; } p { font-family: 'Montserrat', sans-serif; font-size: 17px; line-height: 1.2; } a { color: #376399; } .right { text-align:right; } /*######################################## ################# HEAD ################### #########################################*/ /*######################################## ################# NAVI ################### #########################################*/ /*######################################## ################# LAYO ################### #########################################*/ .container { padding:30px; } .main { background:#fbfbfb; padding: 40px; } /*######################################## ################# PART ################### #########################################*/ /*######################################## ################# FOOT ################### #########################################*/ /*######################################## ################# QUER ################### #########################################*/ @media (max-width: 639px) { h1 { font-size: 27px; } .container { padding:10px 5px; } .main { padding: 5px 15px; } } @media (max-width: 767px) {} @media (max-width: 1023px) {} @media (max-width: 1279px) {} /*######################################## ################# FONT ################### #########################################*/ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; src: url("./_font/Inter/Inter-Regular.woff2") format("woff2"), url("./_font/Inter/Inter-Regular.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 400; src: url("./_font/Inter/Inter-Italic.woff2") format("woff2"), url("./_font/Inter/Inter-Italic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; src: url("./_font/Inter/Inter-Medium.woff2") format("woff2"), url("./_font/Inter/Inter-Medium.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 500; src: url("./_font/Inter/Inter-MediumItalic.woff2") format("woff2"), url("./_font/Inter/Inter-MediumItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; src: url("./_font/Inter/Inter-SemiBold.woff2") format("woff2"), url("./_font/Inter/Inter-SemiBold.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 600; src: url("./_font/Inter/Inter-SemiBoldItalic.woff2") format("woff2"), url("./_font/Inter/Inter-SemiBoldItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; src: url("./_font/Inter/Inter-Bold.woff2") format("woff2"), url("./_font/Inter/Inter-Bold.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 700; src: url("./_font/Inter/Inter-BoldItalic.woff2") format("woff2"), url("./_font/Inter/Inter-BoldItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; src: url("./_font/Inter/Inter-ExtraBold.woff2") format("woff2"), url("./_font/Inter/Inter-ExtraBold.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 800; src: url("./_font/Inter/Inter-ExtraBoldItalic.woff2") format("woff2"), url("./_font/Inter/Inter-ExtraBoldItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 900; src: url("./_font/Inter/Inter-Black.woff2") format("woff2"), url("./_font/Inter/Inter-Black.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 900; src: url("./_font/Inter/Inter-BlackItalic.woff2") format("woff2"), url("./_font/Inter/Inter-BlackItalic.woff") format("woff"); } @font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 400; src: url('_font/montserrat-v14-latin-italic.eot'); /* IE9 Compat Modes */ src: local('Montserrat Italic'), local('Montserrat-Italic'), url('_font/montserrat-v14-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/montserrat-v14-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/montserrat-v14-latin-italic.woff') format('woff'), /* Modern Browsers */ url('_font/montserrat-v14-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/montserrat-v14-latin-italic.svg#Montserrat') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; src: url('_font/montserrat-v14-latin-regular.eot'); /* IE9 Compat Modes */ src: local('Montserrat Regular'), local('Montserrat-Regular'), url('_font/montserrat-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/montserrat-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/montserrat-v14-latin-regular.woff') format('woff'), /* Modern Browsers */ url('_font/montserrat-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/montserrat-v14-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; src: url('_font/montserrat-v14-latin-500.eot'); /* IE9 Compat Modes */ src: local('Montserrat Medium'), local('Montserrat-Medium'), url('_font/montserrat-v14-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/montserrat-v14-latin-500.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/montserrat-v14-latin-500.woff') format('woff'), /* Modern Browsers */ url('_font/montserrat-v14-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/montserrat-v14-latin-500.svg#Montserrat') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 500; src: url('_font/montserrat-v14-latin-500italic.eot'); /* IE9 Compat Modes */ src: local('Montserrat Medium Italic'), local('Montserrat-MediumItalic'), url('_font/montserrat-v14-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/montserrat-v14-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/montserrat-v14-latin-500italic.woff') format('woff'), /* Modern Browsers */ url('_font/montserrat-v14-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/montserrat-v14-latin-500italic.svg#Montserrat') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 900; src: url('_font/montserrat-v14-latin-900.eot'); /* IE9 Compat Modes */ src: local('Montserrat Black'), local('Montserrat-Black'), url('_font/montserrat-v14-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/montserrat-v14-latin-900.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/montserrat-v14-latin-900.woff') format('woff'), /* Modern Browsers */ url('_font/montserrat-v14-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/montserrat-v14-latin-900.svg#Montserrat') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400; src: url('_font/playfair-display-v20-latin-regular.eot'); /* IE9 Compat Modes */ src: local(''), url('_font/playfair-display-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/playfair-display-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/playfair-display-v20-latin-regular.woff') format('woff'), /* Modern Browsers */ url('_font/playfair-display-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/playfair-display-v20-latin-regular.svg#PlayfairDisplay') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 700; src: url('_font/playfair-display-v20-latin-700.eot'); /* IE9 Compat Modes */ src: local(''), url('_font/playfair-display-v20-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/playfair-display-v20-latin-700.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/playfair-display-v20-latin-700.woff') format('woff'), /* Modern Browsers */ url('_font/playfair-display-v20-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/playfair-display-v20-latin-700.svg#PlayfairDisplay') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 900; src: url('_font/playfair-display-v20-latin-900.eot'); /* IE9 Compat Modes */ src: local(''), url('_font/playfair-display-v20-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/playfair-display-v20-latin-900.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/playfair-display-v20-latin-900.woff') format('woff'), /* Modern Browsers */ url('_font/playfair-display-v20-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/playfair-display-v20-latin-900.svg#PlayfairDisplay') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 400; src: url('_font/playfair-display-v20-latin-italic.eot'); /* IE9 Compat Modes */ src: local(''), url('_font/playfair-display-v20-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/playfair-display-v20-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/playfair-display-v20-latin-italic.woff') format('woff'), /* Modern Browsers */ url('_font/playfair-display-v20-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/playfair-display-v20-latin-italic.svg#PlayfairDisplay') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 700; src: url('_font/playfair-display-v20-latin-700italic.eot'); /* IE9 Compat Modes */ src: local(''), url('_font/playfair-display-v20-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('_font/playfair-display-v20-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */ url('_font/playfair-display-v20-latin-700italic.woff') format('woff'), /* Modern Browsers */ url('_font/playfair-display-v20-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('_font/playfair-display-v20-latin-700italic.svg#PlayfairDisplay') format('svg'); /* Legacy iOS */ } @font-face { font-family: 'fontello'; src: url('_font/fontello.eot?84652176'); src: url('_font/fontello.eot?84652176#iefix') format('embedded-opentype'), url('_font/fontello.woff?84652176') format('woff'), url('_font/fontello.ttf?84652176') format('truetype'), url('_font/fontello.svg?84652176#fontello') format('svg'); font-weight: normal; font-style: normal; } .demo-icon { font-family: "fontello"; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; width: 1em; margin-right: .2em; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; margin-left: .2em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* opacity: .8; */ /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ }