diff --git a/CSS/stylesheet.css b/CSS/stylesheet.css new file mode 100644 index 0000000..6595f58 --- /dev/null +++ b/CSS/stylesheet.css @@ -0,0 +1,250 @@ + +.navbar .navbar-brand { + font-size: 2rem; + padding: auto; +} + +.navbar-brand { + font-family: cursive; +} + + +.card-text { + font: bold; +} + +.card-body { + background-color: rgb(240, 238, 238); + padding-left: 30px; + margin-left: 40px; +} + +.textcards { + height: 230px; + width: 100%; + display: auto; + padding-top: 5%; + padding-bottom: 5%; + padding-right: 5%; + padding-left: 5%; + background-color: rgb(240, 238, 238); +} + + +.numberCircle { + width: 110px; + line-height: 100px; + border-radius: 50%; + text-align: center; + font-size: 20px; + border: 1px solid #dcdcdc; + float: left; + background-color: #dcdcdc; +} + + +.jumbotron { + padding-top: 6rem; + padding-bottom: 6rem; + margin-bottom: 0; + background-color: #fff; +} + +@media (min-width: 768px) { + .jumbotron { + padding-top: 6rem; + padding-bottom: 6rem; +} +} + +.jumbotron p:last-child { + margin-bottom: 0; +} + +.jumbotron h1 { + font-weight: 300; +} + +.jumbotron .container { + max-width: 40rem; +} + +#graybox { + height: 300px; + width: 850px; + padding-top: 20%; + padding-bottom: 20%; +} + + + +.btn-primary .btnbtn-primary { + background-color: rgb(1, 97, 141); +} + +footer { + padding-top: 3rem; + padding-bottom: 3rem; + background-color: rgb(61, 61, 61); +} + +footer p { + margin-bottom: .25rem; +} + +.footer-bottom { + height: 200px; + background-color: rgb(27, 27, 27); +} + + + +#box-8 { + background-color: rgb(37, 37, 37); + } + +#txt { + background-color: rgb(37, 37, 37); +} + +#textbox { + background-color: rgb(37, 37, 37); +} + + +#textbx { + background-color: rgb(37, 37, 37); +} + +#textb { + background-color: rgb(37, 37, 37); +} + +h6 { + color: white; +} + +.fa { + padding: 20px; + font-size: 30px; + width: 50px; + text-align: right; + text-decoration: none; +} + +/* Add a hover effect if you want */ +.fa:hover { + opacity: 0.7; +} + +/* Set a specific color for each brand */ + +/* Facebook */ +.fa-facebook { + background-color: #3B5998; + color: white; +} + +/* Twitter */ +.fa-twitter { + background-color: #55ACEE; + color: white; +} + +.fa-rss { + background-color: #eb700b; + color: white; +} + +.fa-pinterest { + background-color: #eb0b0b; + color: white; +} + +.fa-linkedin { + background-color: #0b6ef0; + color: white; +} + +.fa-dribbble { + background-color: #f70389; + color: white; + } + +#sidebar { + padding-top: 80px; + width: 400px; + float: right; + margin-left: 20px; + margin-right: 150px; +} + +#main-content { + width: 900px; + margin-left: 60px; +} + +p { + margin: 0; +} + +.blog-card { + height: 10rem; + width: 15rem; + display: flex; +} + + +.blog-card__image { + height:60%; + width:60%; + background-color: rgb(156, 156, 156); + margin-right:.5rem; +} + +#thumb { + width: 80px; +} + + + +.vl { + border-left: 3px dotted rgb(156, 156, 156); + height: 1000px; + position: absolute; + left: 50%; + margin-left: 250px; + margin-top: 100px; +} + +#hr { + border-style: dotted; + border-width: 3px; + color: rgb(156, 156, 156); +} + + +.copyright { + margin-left: 350px; + +} + +ul { + list-style: none; +} + +ul li { + display: inline-block; + padding: 0 7px; + position: relative; +} + +ul li:not(:last-child)::after { + content: ""; + border: 1px solid #2f3235; + border-width: 1px 1px 0 0; + position: absolute; + right: -3px; + top: 0; + height: 100%; +} \ No newline at end of file diff --git a/blog-post.html b/blog-post.html new file mode 100644 index 0000000..dbdb7ec --- /dev/null +++ b/blog-post.html @@ -0,0 +1,494 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ + + + +
+ + +
+
+ +
+
+
+
+
+
23 JAN


+

+ + + + + +

Ridiculus Mattis Lorem Dolor Inceptos

+
+
+ +
+

+
+
+ + + +
+ + + + + +
+ + +
+
+
+

+

+

+
+
+ +
+

Donec porta sed dolor vel congue. Sed aliquam iaculis dolor, in ullamcorper lorem pulvinar id. Ut magna ipsum, tristique ut est vitae, mollis tempor nulla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Praesent finibus purus eros, sit amet ornare quam vulputate et. In a lorem dictum, tempor ex a, pulvinar libero. Nulla ultricies ante purus, posuere lacinia enim maximus in. Fusce malesuada augue ante, nec interdum justo porta in. Phasellus non ligula ante.

+
+

Curabitur tempor, quam non congue feugiat, neque sapien commodo tellus, eget fringilla est dui elementum libero. Mauris a massa lectus. Vestibulum pretium nulla vel gravida viverra. Praesent sit amet rhoncus nisl, in blandit nunc. Mauris nec ipsum finibus, consectetur risus at, rutrum dui. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris vitae mi nunc. +
+

Nunc iaculis commodo lectus vitae gravida. Curabitur et tellus fermentum, tincidunt arcu sit amet, pulvinar nisl. Morbi condimentum risus a tempor viverra. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec elementum, lectus et maximus aliquam, neque arcu hendrerit arcu, quis blandit purus metus ac diam. Donec efficitur elit sed leo fermentum facilisis. Donec finibus accumsan ante sit amet rutrum. Donec sed imperdiet dui.

+
+

Ut augue ipsum, accumsan vitae ultricies vitae, iaculis vel lectus. Curabitur et tellus fermentum, tincidunt arcu sit amet, pulvinar nisl.

+
+

Suspendisse imperdiet ante eleifend aliquet pharetra. Morbi cursus a libero sed vestibulum. Integer mattis elementum odio consectetur convallis. Nunc varius eu mauris id euismod. Aliquam gravida, est vel faucibus consectetur, erat nibh elementum dui, in ornare dui lacus quis tellus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque fermentum risus sed sem semper, eget ullamcorper magna hendrerit. Mauris quis odio sit amet tellus ornare euismod non sit amet est. Praesent at velit porta, suscipit arcu eu, fringilla odio. Pellentesque tristique est non imperdiet elementum. Etiam pulvinar, augue fermentum malesuada maximus, ipsum odio viverra lectus, non laoreet magna lorem sit amet erat. Nullam ut risus pellentesque, convallis elit nec, maximus elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Fusce rhoncus, leo quis gravida egestas, lorem ante porttitor ante, id laoreet quam sapien vitae ante.

+ + +
+ +
+
+ +

Related Posts

+
+ +
+
+
+ Placeholder + +
+
+ + +
+
+
+
+ + + +
+
+ Placeholder + +
+
+ +
+
+
+
+ +
+
+ Placeholder + +
+
+ +
+
+
+
+ +
+
+ Placeholder + +
+
+ +
+
+
+
+ +
+
+
+ +
+ + +
+
+
+ +
+ +
2 Responses to "Ridiculus Mattis Lorem Dolor Inceptos"
+
+
+
+ Placeholder + + +
+
+ + +
Barney Stinson
+

Lorem ipsum dolor sit amet.

+
+
+ + + +
+ +
+
+
+ Placeholder + +
+
+ + +
Ted Evelyn Mosby
+

Lorem ipsum dolor sit amet.

+
+
+ + + +
+ + + + +
+
+
+ + + + + + + + + + + + + + + + +
+
+
+ +
+ + +

Submit A Comment

+ + +
+ +
+ +

+ +
+ + +

+ +
+ +

+ + + + + + + + +
+ + + +
+ +
+
+
+ + + +
+ + + + \ No newline at end of file diff --git a/images/Dots-Horizontal.png b/images/Dots-Horizontal.png new file mode 100644 index 0000000..2a7790a Binary files /dev/null and b/images/Dots-Horizontal.png differ diff --git a/images/blog-post.png b/images/blog-post.png new file mode 100644 index 0000000..d9fc637 Binary files /dev/null and b/images/blog-post.png differ diff --git a/images/blog.png b/images/blog.png new file mode 100644 index 0000000..c5e50c3 Binary files /dev/null and b/images/blog.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..262880b --- /dev/null +++ b/index.html @@ -0,0 +1,422 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ + +
+
+ +
+
+
+ Placeholder +
+

Lorem ipsum dolor sit amet

+

Quisque pulvinar elit id ligula porttitor, id auctor turpis dapibus. Ut venenatis fermentum ligula ut maximus.

+ dots +
+
+ + + + + + + 17 January, 2012 +
+ + 15 +
+
+
+
+
+
+ Placeholder +
+

Nulla sit amet lacinia purus Nunc ex nulla

+

Cras ornare et est vel porta. Ut ut leo nec nisi sodales pellentesque a sed ex. Quisque egestas posuere enim in venenatis. Integer convallis sapien vel magna ornare, vitae finibus neque.

+ dots +
+
+ + + + + + + 15 January, 2012 +
+ 21 +
+
+
+
+
+
+ Placeholder +
+

Aenean nec ex at ante auctor

+

Nunc non urna eu quam bibendum varius vitae et dui. Donec vel enim mi. Nunc sed velit arcu.

+ dots +
+
+ + + + + + + 11 January, 2012 +
+ 23 +
+
+
+
+ +
+
+ Placeholder +
+

Aenean massa nisi, vehicula convallis maximus quis

+

dapibus non est. In hac habitasse platea dictumst. Aliquam vel diam vel metus fringilla porta. In gravida non nisl vitae consectetur.

+ dots +
+
+ + + + + + + 09 January, 2012 +
+ 13 +
+
+
+
+
+
+ Placeholder +
+

Proin non libero lobortis, pretium eros

+

Praesent sed metus nec felis maximus lobortis id vel nisl. Cras consectetur vel magna vel euismod. Nullam ultrices ligula neque

+ dots +
+
+ + + + + + + 05 January, 2012 +
+ 11 +
+
+
+
+
+
+ Placeholder +
+

A finibus justo pulvinar eu Aliquam

+

Donec fermentum felis et massa vehicula, sit amet suscipit sem pellentesque. Praesent rhoncus malesuada felis, in rhoncus est fringilla vel. Suspendisse in arcu at orci porta varius ut sed felis.

+ dots +
+
+ + + + + + + 03 January, 2012 +
+ 13 +
+
+
+
+ + +
+
+ Placeholder +
+

Maecenas volutpat dolor tellus

+

Id vestibulum lectus congue nec. Ut molestie augue sit amet orci euismod, vitae feugiat lorem semper. Nullam vitae pharetra lacus.

+ dots +
+
+ + + + + + + 01 January, 2012 +
+ 17 +
+
+
+
+
+
+ Placeholder +
+

Nunc libero felis efficitur

+

On lorem a, porttitor viverra mi. Cras nisi sem, mollis vel ultrices quis, rhoncus id tellus Fusce ultricies libero id lectus imperdiet lacinia.

+ dots +
+
+ + + + + + + 29 December, 2011 +
+ 11 +
+
+
+
+
+
+ Placeholder +
+

Cras quis purus ipsum

+

In hac habitasse platea dictumst. Nullam tincidunt, tortor non semper iaculis, lacus erat consequat enim, vel laoreet erat lectus a lorem.

+ dots +
+
+ + + + + + + 25 december, 2011 +
+ 49 +
+
+
+
+
+
+
+ + + +
+ dots + +
+
+ +
+ +
+ +
+
+
+ + +
+ + + +