This project was made for an introductory web development course. The code repository can be found here The live site is deployed here.
The color scheme was selected from the Canva theme "Middle Eastern Empire" The font is called Lekton from Google Fonts
I used media queries to apply different styles and structures to mobile, tablet and desktop views. Some of the main differences are the use of grids for the desktop view, the presence or absence of the stylized initials in the contact form div and the size of images.
I made heavy use of class and id names, but also choose to use tag names occasionally when I really did want all related tag elements to have a certain style.
The navigation bar also changes depending on the mobile or desktop view. This was the a navbar tempalte provided by the instructor of a previous web dev class I took. I reused it here because it is highly responsive. My intrsuctor was Greg Kerr. His web and teaching portfolio can be found here. (You'll notice a similar navbar is used on his site, particularly in the mobile view.) I took his CAS 206 Principles of HTML5 and CSS3 and CAS 215 Advanced CSS3 and Pre-Processors classas. More about the navbar. It uses Bootstrap CSS and jQuery. It uses classes such as navbar-brand and navbar-collapse. To learn more about Bootstrap Navbars here is their Navbar Documentation It's important to note that I am using version 3.3.5 of Bootstrap which is still supported but there are newer versions out there. The navbar in mobile also relies on jQuery, here I'm using version 1.11.3. Again, this is an older but supported version. You can find jQuery hosted here