Sign in / Register
If more than one type of fraction needs to be used within one section, wrap each 'section' in .section-content-wrapper, if not leave that div out.
:first-of-type and :last-of-type are used to reset the outer margins to keep the content inline.
Ut venenatis quis erat quis eleifend. Suspendisse varius eros nec aliquam varius. Nam at ante vestibulum ante imperdiet aliquam posuere eu dui. Etiam pellentesque lacus mauris, vel tincidunt erat vestibulum et. Duis vel mauris luctus, dapibus tortor non, euismod arcu. Proin congue elementum velit egestas ornare. Phasellus id iaculis elit, id scelerisque arcu. Nullam vehicula ultrices ipsum, in elementum justo pellentesque a.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent massa libero, rhoncus at sodales et, fringilla vitae justo. Suspendisse adipiscing nunc tortor, eget accumsan tellus tincidunt at. Ut suscipit elit id tellus tincidunt, ac luctus nisi consectetur. Proin velit libero, faucibus sed ultricies eget, pulvinar sit amet erat. Suspendisse vel leo sit amet magna sodales tincidunt.
Integer sit amet nibh sit amet lectus luctus placerat. Suspendisse eget arcu tortor. Fusce pretium sodales nisl et tempus. Curabitur pretium pellentesque libero. Curabitur pretium malesuada purus, id posuere neque. Donec ante metus, rutrum id lacus ut, ultricies aliquam magna.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent massa libero, rhoncus at sodales et, fringilla vitae justo. Suspendisse adipiscing nunc tortor, eget accumsan tellus tincidunt at. Ut suscipit elit id tellus tincidunt, ac luctus nisi consectetur. Proin velit libero, faucibus sed ultricies eget, pulvinar sit amet erat. Suspendisse vel leo sit amet magna sodales tincidunt.
Integer sit amet nibh sit amet lectus luctus placerat. Suspendisse eget arcu tortor. Fusce pretium sodales nisl et tempus. Curabitur pretium pellentesque libero. Curabitur pretium malesuada purus, id posuere neque. Donec ante metus, rutrum id lacus ut, ultricies aliquam magna.
Donec consequat est sed eros condimentum, nec porttitor mi convallis. Sed porttitor, justo a blandit interdum, lorem nulla ullamcorper eros, sit amet convallis ipsum ligula eu lorem. Praesent elementum diam at mauris sodales, et pellentesque nibh dignissim.
Each .cta will be accompanied by its own modifier (e.g .cta--example) where individual height and background-image styles can be set. background-position: center and background-size: cover have already been set on .cta
Transparent grey overlay is applied on top of the image using :after to promote reusability of the original image.
This portion of the caption is hidden until the image is hovered.
This portion of the caption is hidden until the image is hovered.
This portion of the caption is hidden until the image is hovered.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent massa libero, rhoncus at sodales et, fringilla vitae justo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent massa libero, rhoncus at sodales et, fringilla vitae justo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent massa libero, rhoncus at sodales et, fringilla vitae justo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent massa libero, rhoncus at sodales et, fringilla vitae justo.
Success!
Warning!