diff --git a/css/footer.css b/css/footer.css new file mode 100644 index 0000000..02a4aa8 --- /dev/null +++ b/css/footer.css @@ -0,0 +1,107 @@ +html,body { + margin: 0; + padding: 0; + font-family: Arial, Helvetica, Sans-serif; + background-color: #070617; + } + + /* STYLES SPECIFIC TO FOOTER */ + .footer { + width: 100%; + position: relative; + height: auto; + background-color: #070617; + } + .footer .col { + width: 190px; + height: auto; + float: left; + box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + padding: 0px 20px 20px 20px; + } + .footer .col h1 { + margin: 0; + padding: 0; + font-family: inherit; + font-size: 12px; + line-height: 17px; + padding: 20px 0px 5px 0px; + color: rgba(255,255,255,0.2); + font-weight: normal; + text-transform: uppercase; + letter-spacing: 0.250em; + } + .footer .col ul { + list-style-type: none; + margin: 0; + padding: 0; + } + .footer .col ul li { + color: #999999; + font-size: 14px; + font-family: inherit; + font-weight: bold; + padding: 5px 0px 5px 0px; + cursor: pointer; + transition: .2s; + -webkit-transition: .2s; + -moz-transition: .2s; + } + .social ul li { + display: inline-block; + padding-right: 5px !important; + } + + .footer .col ul li:hover { + color: #ffffff; + transition: .1s; + -webkit-transition: .1s; + -moz-transition: .1s; + } + .clearfix { + clear: both; + } + @media only screen and (min-width: 1280px) { + .contain { + width: 1200px; + margin: 0 auto; + } + } + @media only screen and (max-width: 1139px) { + .contain .social { + width: 1000px; + display: block; + } + .social h1 { + margin: 0px; + } + } + @media only screen and (max-width: 950px) { + .footer .col { + width: 33%; + } + .footer .col h1 { + font-size: 14px; + } + .footer .col ul li { + font-size: 13px; + } + } + @media only screen and (max-width: 500px) { + .footer .col { + width: 50%; + } + .footer .col h1 { + font-size: 14px; + } + .footer .col ul li { + font-size: 13px; + } + } + @media only screen and (max-width: 340px) { + .footer .col { + width: 100%; + } + } \ No newline at end of file diff --git a/index.html b/index.html index eb56a5b..b72a998 100644 --- a/index.html +++ b/index.html @@ -3,316 +3,383 @@
+ - - - - - - - - - - - - - -
+ Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it oer 2000 years old. Richard McClintock, a Latin professor at Hampden-Syndey College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cities of the word in classical literature, discovered the undoubtable source.
+ Switch between your computer, tablet or mobile
+
+ Learn from industry experts who are passionate about teaching.
+
+ Choose what you'd like to learn from our extensive subscription library
+
+ Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it oer 2000 years old. Richard McClintock, a Latin professor at Hampden-Syndey College in Virginia.
+ +
- Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it oer 2000 years old. Richard McClintock, a Latin professor at Hampden-Syndey College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cities of the word in classical literature, discovered the undoubtable source.