/* JustLanded v.1.2.0 Style Index 1. Default and Reset styles 2. Global elements - 2.1 Buttons 3. Fonts and Headings - 3.1 Fonts - 3.2 Headings 4. Content Blocks used for positioning 5. Landing page header and banner - 5.1 Header - 5.2 Banner 6. Content - 6.1 Features - 6.2 Description - 6.3 Screenshots - 6.4 How it works - 6.5 Video - 6.6 Testimonials - 6.7 Newsletter - 6.8 Buy - 6.9 Pricing Table 7. Social elements - 7.1 Contact form 8. Landing page footer 9. Additional styles for jQuery/Foundation Framework plug-ins 10. Responsive Styling /*------------------------------------------------------------------------------------------*/ /* 1. Defaults & Reset of specific styles across browsers */ /*------------------------------------------------------------------------------------------*/ body { background: #ffffff; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 80%; margin: 0; padding: 5px 0 0 0; min-width: 290px; } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } ul, li, li p { margin: 0; padding: 0; list-style: none; } p, li, blockquote { line-height: 1.4em; } a img { border: none; } iframe { border: 0; } /*------------------------------------------------------------------------------------------*/ /* 2. Global elements used throughout the landing page */ /*------------------------------------------------------------------------------------------*/ section { display: block; } article section, #newsletter { background: url(../images/border.gif) repeat-x left bottom; margin: 0 0 40px 0; padding: 0 0 45px 0; overflow: hidden; } .inner { margin: 0 auto; overflow: hidden; } #content .inner { background: url(../images/border.gif) repeat-x left bottom; margin: 0 auto 30px auto; padding: 0 0 35px 0; } .position_left { float: left; margin: 0 10px 0 0; } .last, li.last, .block_460.last, #features li.last, #work li.last, .block_300.last, .pricing_block.last { margin-right: 0; } /* 2.1 Buttons */ .buttons { background-color: rgba(30, 30, 30, 0.15); width: 366px; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; padding: 6px; overflow: hidden; float: left; position: relative; z-index: 99; } #banner .buttons { margin: -60px 0 0 0; } .buttons_big { background-color: rgba(30, 30, 30, 0.15); width: 248px; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; padding: 6px; margin: -65px 0 0 0; overflow: hidden; float: left; position: relative; z-index: 99; } .buttons_big_bottom { float: none; margin-left: auto; margin-right: auto; } #buy .buttons { float: none; margin: 0 auto; } .buttons span { background: #d86600; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2Q4NjYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlODhjMTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #d86600 1%, #e88c13 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #d86600), color-stop(100%, #e88c13)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #d86600 1%, #e88c13 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #d86600 1%, #e88c13 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #d86600 1%, #e88c13 100%); /* IE10+ */ background: linear-gradient(to bottom, #d86600 1%, #e88c13 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#d86600', endColorstr = '#e88c13', GradientType = 0); /* IE6-8 */ border-radius: 100em; -webkit-border-radius: 100em; -moz-border-radius: 100em; height: 32px; width: 32px; font-family: 'Merriweather', serif; font-weight: 700; font-style: italic; color: #833100; text-align: center; margin: 10px 0 0 -16px; padding: 8px 0 0 0; display: block; float: left; position: relative; z-index: 99; text-shadow: 0 1px 0 #f0c08b; box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .3); -moz-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .3); -webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .3); } a.button_buy { background: #fea817; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZlYTgxNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjNTQyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #fea817 1%, #c54200 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fea817), color-stop(100%, #c54200)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fea817 1%, #c54200 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fea817 1%, #c54200 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fea817 1%, #c54200 100%); /* IE10+ */ background: linear-gradient(to bottom, #fea817 1%, #c54200 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fea817', endColorstr = '#c54200', GradientType = 0); /* IE6-8 */ display: block; float: left; width: 177px; height: 51px; padding: 15px 0 0 0; font-size: 135%; font-weight: bold; text-align: center; color: #fff; text-decoration: none; text-shadow: 0 -1px 0 #af5305; border-top-left-radius: 25px; border-bottom-left-radius: 25px; -webkit-border-top-left-radius: 25px; -webkit-border-bottom-left-radius: 25px; -moz-border-radius-topleft: 25px; -moz-border-radius-bottomleft: 25px; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); position: relative; z-index: 20; } a.button_buy_big { background: #fea817; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZlYTgxNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjNTQyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #fea817 1%, #c54200 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fea817), color-stop(100%, #c54200)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fea817 1%, #c54200 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fea817 1%, #c54200 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fea817 1%, #c54200 100%); /* IE10+ */ background: linear-gradient(to bottom, #fea817 1%, #c54200 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fea817', endColorstr = '#c54200', GradientType = 0); /* IE6-8 */ display: block; float: left; width: 237px; height: 51px; padding: 15px 0 0 0; font-size: 135%; font-weight: bold; text-align: center; color: #fff; text-decoration: none; text-shadow: 0 -1px 0 #af5305; border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); position: relative; z-index: 20; } a.button_buy:hover, a.button_buy_pricing:hover, a.button_buy_big:hover { background: #c54200; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M1NDIwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZWE4MTciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #c54200 0%, #fea817 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c54200), color-stop(100%, #fea817)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #c54200 0%, #fea817 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #c54200 0%, #fea817 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #c54200 0%, #fea817 100%); /* IE10+ */ background: linear-gradient(to bottom, #c54200 0%, #fea817 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#c54200', endColorstr = '#fea817', GradientType = 0); /* IE6-8 */ } a.button_try { background: #fec32d; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlYzMyZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkODY2MDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #fec32d 0%, #d86600 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fec32d), color-stop(100%, #d86600)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fec32d 0%, #d86600 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fec32d 0%, #d86600 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fec32d 0%, #d86600 100%); /* IE10+ */ background: linear-gradient(to bottom, #fec32d 0%, #d86600 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fec32d', endColorstr = '#d86600', GradientType = 0); /* IE6-8 */ display: block; float: left; width: 177px; height: 51px; padding: 15px 0 0 0; font-size: 135%; font-weight: bold; text-align: center; color: #fff; text-decoration: none; text-shadow: 0 -1px 0 #af5305; border-top-right-radius: 25px; border-bottom-right-radius: 25px; -webkit-border-top-right-radius: 25px; -webkit-border-bottom-right-radius: 25px; -moz-border-radius-topright: 25px; -moz-border-radius-bottomright: 25px; margin-left: -16px; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); position: relative; z-index: 20; } a.button_try:hover { background: #d86600; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Q4NjYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk5JSIgc3RvcC1jb2xvcj0iI2ZlYzMyZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); background: -moz-linear-gradient(top, #d86600 0%, #fec32d 99%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d86600), color-stop(99%, #fec32d)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #d86600 0%, #fec32d 99%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #d86600 0%, #fec32d 99%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #d86600 0%, #fec32d 99%); /* IE10+ */ background: linear-gradient(to bottom, #d86600 0%, #fec32d 99%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#d86600', endColorstr = '#fec32d', GradientType = 0); /* IE6-8 */ } a.button_buy_pricing { background: #fea817; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZlYTgxNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjNTQyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #fea817 1%, #c54200 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fea817), color-stop(100%, #c54200)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fea817 1%, #c54200 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fea817 1%, #c54200 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fea817 1%, #c54200 100%); /* IE10+ */ background: linear-gradient(to bottom, #fea817 1%, #c54200 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fea817', endColorstr = '#c54200', GradientType = 0); /* IE6-8 */ width: 161px; height: 40px; margin: 0 auto; padding: 10px 0 0 0; display: block; font-size: 135%; font-weight: bold; text-align: center; color: #fff; text-decoration: none; text-shadow: 0 -1px 0 #af5305; border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); -webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, .5); } a.button_buy:active, a.button_try:active, a.button_buy_pricing:active, a.button_buy_big:active { box-shadow: inset 0 -2px 0 rgba(255, 255, 255, .4); -moz-box-shadow: inset 0 -2px 0 rgba(255, 255, 255, .4); -webkit-box-shadow: inset 0 -2px 0 rgba(255, 255, 255, .4); outline: none; } /*------------------------------------------------------------------------------------------*/ /* 3. Styles used for fonts and headings */ /*------------------------------------------------------------------------------------------*/ /* 3.1 Fonts */ h1, h2, h3, h5 { font-weight: normal; } h1 span, h2 span, h3 span { font-weight: 700; } h1 { font-family: 'Merriweather', serif; font-size: 315%; color: #dd4632; margin: 0; } h2 { font-family: 'Merriweather', serif; font-size: 220%; color: #dd4632; margin: 0 0 20px 0; } h3 { font-family: 'Merriweather', serif; font-size: 140%; color: #999; margin: -15px 0 25px 0; } h4 { font-family: 'Merriweather', serif; font-size: 120%; font-weight: 700; margin: 0 0 5px 0; } /* 3.2 Headings */ #logo img { margin: 0 35px 0 0; float: left; } #logo h1 { font-family: 'Lato', sans-serif; font-size: 210%; font-weight: 900; color: #dd4632; float: left; margin: 0 10px 0 0; } #logo h1 span { font-family: 'Merriweather', serif; font-size: 40%; color: #999; font-weight: 400; float: left; margin: 13px 0 0 0; } #logo h2 { font-family: 'Merriweather', serif; font-size: 110%; color: #999; font-weight: 400; float: left; margin: 13px 0 0 0; } #banner h1 { font-size: 290%; color: #fff; font-weight: 700; margin: 10px 0 15px 0; } #banner h2 { font-family: 'Merriweather', serif; font-size: 155%; color: #f7c9c9; } #features h2, #features h3, #screenshots h2, #testimonials h2, #testimonials h3, #buy h2, #buy h3, #pricing h2, #pricing h3 { text-align: center; } #newsletter h2 { background: url(../images/sprite.png) no-repeat -1px -175px; font-size: 170%; color: #fff; padding: 23px 0 20px 70px; margin: 5px 0 0 20px; float: left; } #content #main_content h1 { text-align: center; font-weight: 700; } .pricing_header h4 { font-size: 210%; padding: 15px 0 0 0; } .pricing_header h5 { font-size: 105%; color: #ccc; margin: -10px 0 10px 0; padding: 0; } #favorite h5 { color: #f7c9c9; } /*------------------------------------------------------------------------------------------*/ /* 4. Content blocks used to position content */ /*------------------------------------------------------------------------------------------*/ /* Grid System based on Foundation by ZURB */ .row { width: 940px; max-width: 100%; margin: 0 auto; } .row .row { width: auto; max-width: none; min-width: 0; margin: 0 -10px; } .row.collapse .column, .row.collapse .columns { padding: 0; } .row .row { width: auto; max-width: none; min-width: 0; margin: 0 -10px; } .row .row.collapse { margin: 0; } .column, .columns { float: left; min-height: 1px; padding: 0 10px; position: relative; } .column.centered, .columns.centered { float: none; margin: 0 auto; } [class*="column"] + [class*="column"]:last-child { float: right; } [class*="column"] + [class*="column"].end { float: left; } .one, .row .one { width: 8.33333%; } .two, .row .two { width: 16.66667%; } .three, .row .three { width: 25%; } .four, .row .four { width: 33.33333%; } .five, .row .five { width: 41.66667%; } .six, .row .six { width: 50%; } .seven, .row .seven { width: 58.33333%; } .eight, .row .eight { width: 66.66667%; } .nine, .row .nine { width: 75%; } .ten, .row .ten { width: 83.33333%; } .eleven, .row .eleven { width: 91.66667%; } .twelve, .row .twelve { width: 100%; } .row .offset-by-one { margin-left: 8.33333%; } .row .offset-by-two { margin-left: 16.66667%; } .row .offset-by-three { margin-left: 25%; } .row .offset-by-four { margin-left: 33.33333%; } .row .offset-by-five { margin-left: 41.66667%; } .row .offset-by-six { margin-left: 50%; } .row .offset-by-seven { margin-left: 58.33333%; } .row .offset-by-eight { margin-left: 66.66667%; } .row .offset-by-nine { margin-left: 75%; } .row .offset-by-ten { margin-left: 83.33333%; } .block-grid.four-up { margin: 0 -10px; } .block-grid.four-up > li { width: 25%; padding: 0 10px 10px; } .block-grid.four-up > li:nth-child(4n+1) { clear: both; } img { height: auto; } img, object, embed { max-width: 100%; } img { -ms-interpolation-mode: bicubic; } #map_canvas img, .map_canvas img { max-width: none !important; } /* Nicolas Gallagher's micro clearfix */ .row { *zoom: 1; } .row:before, .row:after { content: " "; display: table; } .row:after { clear: both; } /*------------------------------------------------------------------------------------------*/ /* 5. Landing page header and banner */ /*------------------------------------------------------------------------------------------*/ /* 5.1 Header */ #logo { width: 460px; float: left; margin: 20px 0 0 0; } #logo img { margin: 0 35px 0 0; float: left; } #phone { float: right; font-size: 108%; margin: 33px 0 0 0; color: #999; text-align: right; } #phone a { text-decoration: none; color: #dd4632; cursor: default; font-weight: bold; } /* 5.2 Banner */ #banner { background: #cf5833; background: -moz-linear-gradient(top, #cf5833 0%, #ab2210 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cf5833), color-stop(100%, #ab2210)); background: -webkit-linear-gradient(top, #cf5833 0%, #ab2210 100%); background: -o-linear-gradient(top, #cf5833 0%, #ab2210 100%); background: -ms-linear-gradient(top, #cf5833 0%, #ab2210 100%); background: linear-gradient(to bottom, #cf5833 0%, #ab2210 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#cf5833', endColorstr = '#ab2210', GradientType = 0); color: #fff; clear: both; height: 392px; margin: 20px 0 80px 0; padding: 35px 0 30px 0; } #banner .inner { overflow: visible; } #banner_image img { display: block; margin: 0 auto; } #banner_image img#image_bottom { margin-top: -10px; } #banner ul { margin: 20px 0 20px 0; } #banner li { background: url(../images/sprite.png) no-repeat -1px -79px; font-weight: bold; padding: 7px 0 7px 35px; } #banner a { display: block; color: #fff; } /*------------------------------------------------------------------------------------------*/ /* 6. Content */ /*------------------------------------------------------------------------------------------*/ /* 6.1 Features */ #features { clear: both; } #features li { margin: 15px 0 15px 0; } #features img { float: left; margin: 0 10px 0 0; } /* 6.2 Description */ #description ul { margin: 20px 0 20px 30px; } #description ul li { background: url(../images/icons/icon_check.png) no-repeat 0 7px; padding: 6px 0 6px 28px; } /* 6.3 Screenshots */ #screenshots { clear: both; text-align:center; } #screenshots img { margin:0 3px 0 3px; border:3px solid #e6e6e6; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -webkit-transition : all 0.3s ease-out; -moz-transition : all 0.3s ease-out; -o-transition :all 0.3s ease-out; transition : all 0.3s ease-out; } #screenshots img:hover { border-color:#dd4632; } /* 6.4 How it works */ #work ul li { margin: 15px 0 15px 0; } /* 6.5 Video */ .embed_container { position: relative; padding-bottom: 56.25%; /* 16/9 ratio */ padding-top: 30px; /* IE6 workaround*/ height: 0; overflow: hidden; } .embed_container iframe, .embed_container object, .embed_container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* 6.6 Call */ .phone-holder { background-color: #ff3333 !important; /* Change color of phone btn */ } .text-holder { background-color: #e60000 !important; /* Change color of email btn */ } #bm-cta .phone-holder a { color: white !important; } #bm-cta { font-weight: bold; } .yarpp_pro_msg{border:1px ridge #d0d0d0;padding:.4em 2em .8em;text-align:justify}.yarpp_pro_msg strong{display:inline-block;text-align:center;width:100%;color:orange}.yarpp_help{position:relative;display:inline-block;background:transparent url() no-repeat -520px -20px;vertical-align:text-bottom;width:20px;height:20px}.yarpp_help_msg{position:absolute;left:25px;display:none;border:1px solid #d0d0d0;width:250px;text-align:justify;padding:10px 15px;background-color:#FFF;box-shadow:0 0 .4em -.15em #333;z-index:100}.yarpp_help:hover .yarpp_help_msg{display:block} #liveagent-chat-container{position:fixed;bottom:-410px;right:0;width:300px;height:410px;max-width:100%;z-index:1000;transition:bottom .5s ease}#liveagent-chat-close{cursor:pointer;position:absolute;top:0;right:0;border-radius:50%;width:26px;background:linear-gradient(to bottom,#545454,#7a7a7a);color:white;text-align:center;line-height:26px;font-weight:bold;box-shadow:2px 2px 5px #78787b}#liveagent-chat-embed{width:280px;height:400px;border:0;display:block;margin:10px auto 0 auto;box-shadow:2px 2px 5px #78787b;background:#fff}#liveagent-chat-container.open{bottom:0}.liveagent_btn{cursor:pointer;width:auto;height:30px;line-height:30px;text-align:center;padding:0 .5em}.liveagent_btn:focus,.liveagent_btn:active,.liveagent_btn:hover{color:#f2f2f2}#liveagent_accept{border-radius:5px;background:white;color:#f36716}#liveagent_accept:focus,#liveagent_accept:active,#liveagent_accept:hover{background:#f2f2f2;color:#cc510a}#liveagent-proactive-chat-container{z-index:10000}#liveagent-proactive-chat-container>div{margin:auto;height:190px;background:linear-gradient(#f8f8f8,#d9d9d9);border-radius:5px;box-shadow:2px 2px 5px #78787b}#liveagent_button_holder{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;background:linear-gradient(#f36716,#e45b0c);color:white;position:fixed;padding:1em 2em;width:320px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}#liveagent_invite_holder{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:320px;clear:both;padding:1em;font-size:.9em}.liveagent_chathead{margin:0 .5em 0 0;height:100px;width:100px;min-height:100px;min-width:100px}@media only screen and (min-width:569px){#liveagent-chat-container{right:1em}} /*! Made with Bones: http://themble.com/bones :) */ .page-bodymovin .panel-title-holder{text-align:left}.page-bodymovin h1,.page-bodymovin h2{font-size:2.2em}.page-bodymovin .panel{overflow:hidden}.page-bodymovin .panel h3{text-transform:uppercase}.page-bodymovin .panel-white h1,.page-bodymovin .panel-white h2,.page-bodymovin .panel-white h3{color:#147aa4}.page-bodymovin .panel-dark-blue{background-color:#147aa4}.page-bodymovin .panel-dark-blue h3{color:#4abbeb}.page-bodymovin .panel-mkto_form .panel-title-holder{padding-left:.5em;padding-right:.5em}.page-bodymovin .mkto-panel-holder{background-color:#f8f8f8;margin-top:2em;padding:2em 0}.page-bodymovin .mkto-panel-holder form[id^="mktoForm"] label{display:inline;text-transform:uppercase;color:#147aa4;margin-bottom:.5em}.page-bodymovin .mkto-panel-holder form[id^="mktoForm"] label .mktoAsterix{display:none}.page-bodymovin .mkto-panel-holder form[id^="mktoForm"] .mktoButton{background:#147aa4;border-radius:0}.page-bodymovin .mkto-panel-holder form[id^="mktoForm"] .mktoButton:hover,.page-bodymovin .mkto-panel-holder form[id^="mktoForm"] .mktoButton:active{background:#178bbb}.page-bodymovin .mkto-panel-holder input,.page-bodymovin .mkto-panel-holder textarea{border:0;background-color:#f8f8f8;border-bottom:1px solid #147aa4;border-radius:0;margin-bottom:3em !important}.page-bodymovin .mkto-panel-holder textarea::-webkit-input-placeholder,.page-bodymovin .mkto-panel-holder textarea::placeholder{padding:6em 0 0 0}.page-bodymovin .bottom-pad{margin-bottom:3em}.page-bodymovin .top-pad{margin-top:3em}#hero-page_bodymovin .page-header-holder,#hero-page_bodymovin #page-hero-content{padding:0}#hero-page_bodymovin #page-hero-content{width:100%;padding:0;position:relative;background-color:transparent;height:calc(100vw*900/750);max-height:calc(100vw*900/750);overflow:hidden}#hero-page_bodymovin #page-hero-content .good,#hero-page_bodymovin #page-hero-content .bad{overflow:hidden;height:calc(100vw*900/750) !important;top:0;left:0;bottom:0;display:inline-block}#hero-page_bodymovin #page-hero-content .bad{z-index:1;position:absolute;background-color:#e7e8e9;width:100%}#hero-page_bodymovin #page-hero-content .good{position:absolute;z-index:2;border-right:3px solid white;width:1%;background-color:#fff}#hero-page_bodymovin #page-hero-content .good picture,#hero-page_bodymovin #page-hero-content .good img,#hero-page_bodymovin #page-hero-content .bad svg{height:calc(100vw*900/750) !important;width:100vw !important;max-width:none;max-height:none}#hero-page_bodymovin #page-hero-content .good picture,#hero-page_bodymovin #page-hero-content .good img{float:left}@keyframes bm-buton{0%{transform:scale(1)}20%{transform:scale(1.05)}40%{transform:scale(1)}60%{transform:scale(1.05)}80%{transform:scale(1)}}.bm-circle{-js-display:flex;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;-webkit-animation:bm-buton 2s infinite ease-in-out both;animation:bm-buton 2s infinite ease-in-out both}#bm-slider{width:56px;height:56px;background:white;position:relative;top:calc(50% - 28px);left:calc(1% - 28px);z-index:3;box-shadow:0 0 10px rgba(0,0,0,.25)}#bm-slider>div{background:#ffcba5;width:75%;height:75%;border-radius:50%}#bm-slider>div>div{background:#f36716;color:white}#bm-slider>div>div>img{margin:3px}#bm-slider,#bm-slider *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#bm-cta{background-color:#f8f8f8;position:fixed;right:0;bottom:0;width:100%;max-height:0;-js-display:flex;display:flex;z-index:50;transition:max-height .25s ease-in-out;max-width:600px;overflow:hidden;}#bm-cta.active{max-height:4em}#bm-cta .phone-holder,#bm-cta .text-holder{height:4em}#bm-cta .bm-cta-subwrap{width:100%;height:100%;-js-display:flex;display:flex;justify-content:center;align-items:center;}#bm-cta a{line-height:20px;text-decoration:none;height:20px}#bm-cta .phone-holder{flex:0 0 25%}#bm-cta .phone-holder:active{background-color:#dfdfdf}#bm-cta .phone-holder a{color:black}#bm-cta .phone-holder a:hover,#bm-cta .phone-holder a:active{color:#f36716}#bm-cta .text-holder{background-color:#f36716;flex:0 0 75%}#bm-cta .text-holder a{position:absolute;color:#f8f8f8;z-index:2;width:75%;height:100%;right:0}#bm-cta .text-holder .load-bar{position:absolute;background-color:#f58747;width:0;height:100%;z-index:0;top:0}#bm-cta .text-holder:active .load-bar{width:75%}#bm-cta img{width:20px;height:20px;display:inline;float:left;margin:0}#bm-cta img+span{padding-left:5px}.stopitnow .column-text{overflow:visible}.m-r-offset{width:160%;display:inline-block}.bm-timeline .diamond{display:none}.bm-timeline .column-text>div:first-of-type{font-weight:bold;color:#4abbeb;float:left;width:1em}.bm-timeline .column-text>div:nth-of-type(2){margin-left:2em}.page-bodymovin_static .hero-img{background-size:250%;background-position-x:25%;height:calc(100vh - 72px)}.page-bodymovin_static .hero-img #page-hero-content{background:transparent;text-align:left;padding:1em 1em 1.5em 1.5em;height:calc(100vh - 72px)}.page-bodymovin_static .hero-img #page-hero-content .page-title,.page-bodymovin_static .hero-img #page-hero-content .page-subtitle{margin:0}.page-bodymovin_static .hero-img #page-hero-content .page-title{font-size:36px;line-height:48px}.page-bodymovin_static .hero-img #page-hero-content .page-subtitle{font-size:18px;line-height:28px;padding-top:1em;width:50vw;max-width:280px;display:block}.page-bodymovin_static #page-hero-content-holder{padding-top:1em}.page-bodymovin_static .day-parting_open,.page-bodymovin_static .day-parting_closed{position:absolute;bottom:2em;left:1.5em;right:1.5em}.page-bodymovin_static .bodymovin-btn,.page-bodymovin_static .mkto-panel-holder form[id^="mktoForm"] .mktoButton{background:#f36716;border-radius:6px;color:rgba(255,255,255,.8);font-size:16px;letter-spacing:1.5px;line-height:24px;text-transform:uppercase;padding:1em 2em;text-decoration:none;font-weight:bold;text-align:center;display:block;margin:auto}.page-bodymovin_static .bodymovin-btn:active,.page-bodymovin_static .bodymovin-btn:hover,.page-bodymovin_static .mkto-panel-holder form[id^="mktoForm"] .mktoButton:active,.page-bodymovin_static .mkto-panel-holder form[id^="mktoForm"] .mktoButton:hover{background:#fe8226}.page-bodymovin_static #bm-cta{background-color:#f36716;letter-spacing:1.5px;}.page-bodymovin_static #bm-cta .phone-holder{flex:0 0 75%}.page-bodymovin_static #bm-cta .phone-holder:active{background-color:#cc510a}.page-bodymovin_static #bm-cta .phone-holder a{color:#fff;opacity:.8}.page-bodymovin_static #bm-cta .phone-holder a:hover,.page-bodymovin_static #bm-cta .phone-holder a:active{color:#e45b0c}.page-bodymovin_static #bm-cta .phone-holder .bm-cta-subwrap img{margin-left:1em}.page-bodymovin_static #bm-cta .text-holder{flex:0 0 25%;background-color:#fe8226;}.page-bodymovin_static #bm-cta .text-holder a{position:relative;width:100%;height:100%}.page-bodymovin_static #bm-cta .text-holder:active .load-bar{width:75%}.page-bodymovin_static .panel-mkto_form{padding:3em 0}.page-bodymovin_static .panel-mkto_form .panel-content-inner>div:first-child{padding:0 2em}.page-bodymovin_static .panel-mkto_form .mkto-form-holder{padding:1em}.page-bodymovin_static .panel-mkto_form .mkto-form-holder h3{font-size:1.5em;text-align:left;font-style:normal;margin-bottom:2em;margin-top:1em;color:#147aa4}.page-bodymovin_static .panel-mkto_form .mkto-panel-holder form[id^="mktoForm"] .mktoButton{background-color:#147aa4}.page-bodymovin_static #learnmore{display:none}@media only screen and (min-width:751px){#hero-page_bodymovin .page-header-holder{overflow:hidden}#hero-page_bodymovin .page-header-holder .bad-background{position:absolute;width:50%;right:0;height:calc(100vw*700/1150);max-height:716px;background-color:#e7e8e9;z-index:0}#hero-page_bodymovin #page-hero-content{height:calc(100vw*700/1150);max-height:716px;overflow:visible}#hero-page_bodymovin #page-hero-content .good,#hero-page_bodymovin #page-hero-content .bad{height:calc(100vw*700/1150) !important;max-height:716px;max-width:1180px}#hero-page_bodymovin #page-hero-content .good picture,#hero-page_bodymovin #page-hero-content .good img,#hero-page_bodymovin #page-hero-content .bad svg{height:calc(100vw*700/1150) !important;max-height:716px;max-width:1176px}.page-bodymovin h1{font-size:2.8em}.page-bodymovin h2{font-size:2em}.page-bodymovin .panel-mkto_form{padding:0}.page-bodymovin .panel-mkto_form [class*="col-"]{position:relative}.page-bodymovin .panel-mkto_form .panel-content-inner{padding:0;margin:0}.page-bodymovin .panel-mkto_form .panel-content-inner>div{padding:1em 2em}.page-bodymovin .mkto-content{max-width:none}.page-bodymovin .mkto-panel-holder{padding:0;margin-top:0}.page-bodymovin .mkto-panel-holder form[id^="mktoForm"]{padding:1em}.page-bodymovin .mkto-panel-holder form[id^="mktoForm"] label{width:100% !important}.page-bodymovin .mkto-panel-holder input,.page-bodymovin .mkto-panel-holder textarea{margin-bottom:1em !important}.page-bodymovin .mkto-panel-holder textarea::-webkit-input-placeholder,.page-bodymovin .mkto-panel-holder textarea::placeholder{padding:3em 0 0 0}.preload-hide{display:none}#bm-slider{top:calc(50% - 28px)}#bm-cta{max-width:600px;}#bm-cta .phone-holder{flex:0 0 33%}#bm-cta .phone-holder:hover,#bm-cta .phone-holder:active{background-color:transparent}#bm-cta .text-holder{flex:0 0 67%}#bm-cta .text-holder a{width:67%}#bm-cta .text-holder .load-bar{transition:width .1s linear}#bm-cta .text-holder:active .load-bar,#bm-cta .text-holder:hover .load-bar{transition:width 3s linear;width:67%}#stopitnow{min-height:300px}.m-r-offset{width:100%}.bm-timeline [class*="col-"]{flex-basis:20%;max-width:20%;padding:0}.bm-timeline .column-text{overflow:visible}.bm-timeline .column-text>div:first-of-type{float:none;width:1em;margin-bottom:1em}.bm-timeline .column-text>div:nth-of-type(2){margin-left:0;padding-right:.5em;height:7em}.bm-timeline .bm-bar{width:100%;margin:.5em 0;height:.4em}.bm-timeline .bm-bar.blue{background-color:#4abbeb}.bm-timeline .bm-bar.clear{padding-left:.125em}.bm-timeline .diamond{display:block;width:.4em;height:.4em}.bm-timeline .diamond img{float:left}.page-bodymovin_static .hero-img{height:calc(100vw*0.4680555555555555555555);max-height:674px;background-position-x:10%;background-size:130%}.page-bodymovin_static .hero-img #page-hero-content{height:calc(100vw*0.4680555555555555555555);max-height:674px;width:75%;-js-display:flex;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.page-bodymovin_static .hero-img #page-hero-content .page-title,.page-bodymovin_static .hero-img #page-hero-content .page-subtitle{max-width:400px}.page-bodymovin_static .hero-img #page-hero-content .page-title{font-size:52px;line-height:62px}.page-bodymovin_static .hero-img #page-hero-content .page-subtitle{font-size:16px;line-height:28px;opacity:.8}.page-bodymovin_static .day-parting_open,.page-bodymovin_static .day-parting_closed{position:relative;bottom:auto;left:auto;right:auto;margin:.5em 0}.page-bodymovin_static .bodymovin-btn{max-width:360px;margin:0}.page-bodymovin_static #bm-cta{border-top-right-radius:6px;border-top-left-radius:6px;width:500px;right:60px;}.page-bodymovin_static #bm-cta.active{max-height:3.5em;}.page-bodymovin_static #bm-cta .phone-holder{flex:0 0 50%}.page-bodymovin_static #bm-cta .text-holder{flex:0 0 50%}.page-bodymovin_static #bm-cta .text-holder .bm-cta-subwrap img{margin-left:1em}.page-bodymovin_static #learnmore{display:block;width:180px;position:absolute;right:3em;margin-top:-9em}.page-bodymovin_static #learnmore span{display:block;height:56px}.page-bodymovin_static #learnmore a{-js-display:flex;display:flex;justify-content:space-around;height:56px;text-transform:uppercase;font-size:16px;letter-spacing:1.5px;line-height:56px;color:#fff;text-decoration:none;line-height:56px}}@media only screen and (min-width:1024px){.two-thirds-width{max-width:66%}.bottom-float{position:absolute;bottom:2em}.page-bodymovin_static .hero-img{background-position-x:0;background-size:cover}.page-bodymovin_static #bm-cta .phone-holder:active,.page-bodymovin_static #bm-cta .phone-holder:hover{background-color:#f58747}.page-bodymovin_static #bm-cta .phone-holder a:hover,.page-bodymovin_static #bm-cta .phone-holder a:active{color:#fff}.page-bodymovin_static #bm-cta .text-holder:active,.page-bodymovin_static #bm-cta .text-holder:hover{background-color:#fe9f59}} @media only screen and (min-width: 751px) { #bm-cta { margin-right: 70px !important; font-weight: bold; } } @media only screen and (min-width: 751px){ #bm-cta .text-holder { flex: 0 0 49% !important; } } @media only screen and (min-width: 751px) { #bm-cta .phone-holder { flex: 1 0 33%; } } #bm-cta > div.text-holder > a > span > span { padding-left: 80px; } @media only screen and (max-width: 991px) { #bm-cta > div.text-holder > a > span > span { padding-left: 2vw !important; display: none; } body > div.container-fluid.nav-border > div > div > div > nav > button > i { position: relative; left: -5px; } body > div.container-fluid.nav-border > div > div > div > nav > button { margin-top: 5px !important; } body > div.container-fluid.nav-border > div > div > div > nav > button:hover { background-color: #85CA63; border-color: #85CA63; } #bm-cta .phone-holder { flex: 0 0 76% !important; } #bm-cta .text-holder a { width: 24% !important; } } /* 6.6 Testimonials */ blockquote { background: url(../images/bg_quote.png) no-repeat left top; margin: 0; padding: 0; } blockquote footer { display: block; margin: 15px 0 0 0; line-height: normal; font-weight: normal; color: #999; } blockquote footer img { float: left; border-radius: 100em; -webkit-border-radius: 100em; -moz-border-radius: 100em; margin: 0 10px 0 0; } blockquote footer div { padding: 13px 0 0 0; font-weight: bold; color: #dd4632; } .testimonial_big { margin: 0; padding: 0; text-align: center; } .testimonial_big q { font-family: 'Merriweather', serif; font-size: 140%; line-height: normal; } .testimonial_big footer div { display: inline; } /* 6.7 Newsletter */ #newsletter_inner { background: url(../images/sprite.png) no-repeat 415px -461px #dd4733; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #fff; overflow: hidden; clear: both; } #newsletter form { background: #fff; height: 44px; width: 362px; margin: 18px 20px 0 0; float: right; display: block; border: 1px solid #ab2210; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: inset 0 2px 3px #999; -moz-box-shadow: inset 0 2px 3px #999; -webkit-box-shadow: inset 0 2px 3px #999; } #newsletter input#e-mail { background: none; height: 42px; width: 240px; float: left; margin: 0; padding: 2px 0 0 10px; border-style: none; border-right: 1px solid #ab2210; line-height: 42px; color: #999; } #newsletter input#e-mail:focus { color: #000; } input#submit { background: #fea817; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZlYTgxNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjNTQyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #fea817 1%, #c54200 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fea817), color-stop(100%, #c54200)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fea817 1%, #c54200 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fea817 1%, #c54200 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fea817 1%, #c54200 100%); /* IE10+ */ background: linear-gradient(to bottom, #fea817 1%, #c54200 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fea817', endColorstr = '#c54200', GradientType = 0); /* IE6-8 */ height: 43px; width: 120px; margin: 0; float: right; color: #fff; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 120%; font-weight: bold; color: #fff; text-decoration: none; text-shadow: 0 -1px 0 #af5305; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); border: 1px solid #eb9f29; border-top: none; border-top-right-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-radius-bottom-right: 5px; cursor: pointer; } input#submit:hover { background: #c54200; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M1NDIwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZWE4MTciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #c54200 0%, #fea817 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c54200), color-stop(100%, #fea817)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #c54200 0%, #fea817 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #c54200 0%, #fea817 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #c54200 0%, #fea817 100%); /* IE10+ */ background: linear-gradient(to bottom, #c54200 0%, #fea817 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#c54200', endColorstr = '#fea817', GradientType = 0); /* IE6-8 */ } /* 6.8 Buy */ #payment { width: 260px; margin: 20px auto 0 auto; } #payment img { margin: 0 5px 0 0; } /* 6.9 Pricing Table */ #pricing_table { background: #f0f0f0; padding: 10px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; overflow: hidden; } #pricing table .column, .columns { padding: 0 5px !important; } .pricing_block { background: #fff; border: 1px solid #e5e5e5; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-align: center; position: relative; } .pricing_header { background: url(../images/bg_pricing_block.png) no-repeat center bottom #666666; height: 185px; color: #fff; padding: 0 10px 25px 10px; border-top-right-radius: 5px; border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-top-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-topleft: 5px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .pricing_footer { background: #666666; height: 90px; margin: 10px 0 0 0; padding: 20px 0 5px 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .pricing_footer p { background-color: rgba(30, 30, 30, 0.25); border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; width: 171px; margin: 0 auto; padding: 5px; overflow: hidden; } .pricing_block:hover .pricing_header, .pricing_block:hover .pricing_footer { background-position: center 47px; background-color: #464646; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } #favorite .pricing_header, #favorite .pricing_footer { background-color: #dd4632; } #favorite.pricing_block:hover .pricing_header, #favorite.pricing_block:hover .pricing_footer { background-color: #c03220; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .price { font-size: 380%; font-family: 'Merriweather', serif; font-weight: 700; margin: 0; padding: 0; } .price span { font-size: 45%; position: relative; top: -20px; left: -5px; } .pricing_block li { border-bottom: 1px dashed #e5e5e5; margin: 0 10px 0 10px; padding: 8px 0 8px 0; } .pricing_block li.last { border: none; } #badge { background: url(../images/badges/badge_bestvalue.png) no-repeat left top; float: right; width: 58px; height: 58px; margin: -7px -6px 0 0; overflow: visible; position: absolute; top: 0; right: 0; } #badge span { display: none; } /*------------------------------------------------------------------------------------------*/ /* 7. Social elements */ /*------------------------------------------------------------------------------------------*/ #social_elements { position: fixed; top: 140px; right: 0; } #page_footer #social_elements li { display: block; margin: 0 5px 0 0; } #social_elements a span { display: none; } #social_elements a { display: block; width: 24px; height: 24px; padding: 0; margin: 0 0 4px 0; opacity: 0.3; filter: alpha(opacity = 30); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } #social_elements a:hover { opacity: 0.7; filter: alpha(opacity = 70); } .facebook { background: url(../images/sprite_social_element.png) no-repeat -1px 0; } .googleplus { background: url(../images/sprite_social_element.png) no-repeat -1px -60px; } .twitter { background: url(../images/sprite_social_element.png) no-repeat -1px -30px; } .stumbleupon { background: url(../images/sprite_social_element.png) no-repeat -1px -150px; } .youtube { background: url(../images/sprite_social_element.png) no-repeat -1px -90px; } .vimeo { background: url(../images/sprite_social_element.png) no-repeat -1px -120px; } .linkedin { background: url(../images/sprite_social_element.png) no-repeat -1px -180px; } .pinterest { background: url(../images/sprite_social_element.png) no-repeat -1px -210px; } .rss { background: url(../images/sprite_social_element.png) no-repeat -1px -240px; } .digg { background: url(../images/sprite_social_element.png) no-repeat -1px -270px; } .myspace { background: url(../images/sprite_social_element.png) no-repeat -1px -300px; } .picasa { background: url(../images/sprite_social_element.png) no-repeat -1px -330px; } .flickr { background: url(../images/sprite_social_element.png) no-repeat -1px -360px; } .dribbble { background: url(../images/sprite_social_element.png) no-repeat -1px -390px; } .blogger { background: url(../images/sprite_social_element.png) no-repeat -1px -420px; } .feedback { background: url(../images/sprite_social_element.png) no-repeat -1px -450px; } /* 7.1 Contact form */ #contact { background:#fff; width:390px; left:0; right:0; margin:40px auto; z-index:99999; padding:15px; border:5px solid #f1f1f1; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; box-shadow:0 0 5px #666; -moz-box-shadow:0 0 5px #666; -webkit-box-shadow:0 0 5px #666; display: none; } label { display: block; margin: 10px 0 5px 0; } input#contactname, input#contactemail, #contact textarea, input#humanornot { border: 1px solid #d5d5d5; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: inset 0 2px 3px #999; -moz-box-shadow: inset 0 2px 3px #999; -webkit-box-shadow: inset 0 2px 3px #999; padding: 7px 5px 7px 5px; } input#contactname, input#contactemail { width: 200px; } #contact textarea { font-family: Verdana, Arial, Helvetica, sans-serif; width: 350px; height: 100px; font-size: 100%; } input#submitcontact { background: #fea817; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZlYTgxNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjNTQyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #fea817 1%, #c54200 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #fea817), color-stop(100%, #c54200)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fea817 1%, #c54200 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fea817 1%, #c54200 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fea817 1%, #c54200 100%); /* IE10+ */ background: linear-gradient(to bottom, #fea817 1%, #c54200 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#fea817', endColorstr = '#c54200', GradientType = 0); /* IE6-8 */ height: 34px; width: 120px; display: block; margin: 10px 0 0 0; padding: 0 0 5px 0; color: #fff; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 120%; font-weight: bold; color: #fff; text-decoration: none; text-shadow: 0 -1px 0 #af5305; border: 1px solid #c38787; border-radius: 25px; -moz-border-radius: 25px; -webkit-border-radius: 25px; cursor: pointer; } input#submitcontact:hover { background: #c54200; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M1NDIwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZWE4MTciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #c54200 0%, #fea817 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c54200), color-stop(100%, #fea817)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #c54200 0%, #fea817 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #c54200 0%, #fea817 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #c54200 0%, #fea817 100%); /* IE10+ */ background: linear-gradient(to bottom, #c54200 0%, #fea817 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#c54200', endColorstr = '#fea817', GradientType = 0); /* IE6-8 */ } #contact_close { background: url(../images/controls/close.png) no-repeat; width: 30px; height: 30px; display: block; float: right; margin: -37px -37px 0 0; } #contact_close span { display: none; } .success { background: #a9d26e; padding: 5px; text-align: center; border: 1px solid #79a041; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #fff; } .fail { background: #a93636; padding: 5px; text-align: center; border: 1px solid #742424; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #fff; } a#contact_close_counter { display: block; padding: 5px; text-align: center; color: #666; text-decoration: none; } /*------------------------------------------------------------------------------------------*/ /* 8. Landing page footer */ /*------------------------------------------------------------------------------------------*/ #page_footer { text-align: center; clear: both; font-size: 80%; } #page_footer p { margin: 3px 0 20px 0; } #page_footer, #page_footer a { color: #999; text-decoration: none; } #page_footer a:hover { color: #666; } #page_footer ul { margin: 0 auto; } #page_footer li { display: inline; margin: 0 5px 0 5px; } .scrollup { background: url(../images/sprite.png) no-repeat -91px -349px; width: 40px; height: 40px; opacity: 0.3; filter: alpha(opacity = 30); position: fixed; bottom: 30px; right: 20px; display: none; text-indent: -9999px; } /*------------------------------------------------------------------------------------------*/ /* 9. Additional styles for jQuery/Foundation Framework plug-ins and other plug-in classes */ /*------------------------------------------------------------------------------------------*/ .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; opacity: 0.85; filter: alpha(opacity=85); z-index: 999; display: none; top: 0; left: 0; } .reveal-modal { background: #fff; visibility: hidden; display: none; top: 100px; left: 50%; margin-left: -260px; width: 520px; position: absolute; z-index: 41; padding: 30px; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); } .reveal-modal .close-reveal-modal:not(.button) { font-size: 22px; font-size: 2.2rem; line-height: .5; position: absolute; top: 8px; right: 11px; color: #aaa; text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.6); font-weight: bold; cursor: pointer; } .reveal-modal.small { width: 30%; margin-left: -15%; } .reveal-modal.medium { width: 40%; margin-left: -20%; } .reveal-modal.large { width: 60%; margin-left: -30%; } .reveal-modal.xlarge { width: 70%; margin-left: -35%; } .reveal-modal.expand { width: 90%; margin-left: -45%; } .reveal-modal .row { min-width: 0; margin-bottom: 10px; } .reveal-modal > :first-child { margin-top: 0; } .reveal-modal > :last-child { margin-bottom: 0; } /* The gallery overlay */ #galleryOverlay{ width:100%; height:100%; position:fixed; top:0; left:0; opacity:0; z-index:99; background-color:#222; background-color:rgba(0,0,0,0.8); overflow:hidden; display:none; -moz-transition:opacity 0.4s ease; -webkit-transition:opacity 0.4s ease; transition:opacity 0.4s ease; } /* This class will trigger the animation */ #galleryOverlay.visible{ opacity:1; } #gallerySlider{ height:100%; left:0; top:0; width:100%; white-space: nowrap; position:absolute; -moz-transition:left 0.4s ease; -webkit-transition:left 0.4s ease; transition:left 0.4s ease; } #gallerySlider .placeholder{ background: url(../images/controls/loading.gif) no-repeat center center; height: 100%; line-height: 1px; text-align: center; width:100%; display:inline-block; } /* The before element moves the * image halfway from the top */ #gallerySlider .placeholder:before{ content: ""; display: inline-block; height: 50%; width: 1px; margin-right:-1px; } #gallerySlider .placeholder img{ display: inline-block; max-height: 100%; max-width: 100%; vertical-align: middle; } #gallerySlider.rightSpring{ -moz-animation: rightSpring 0.3s; -webkit-animation: rightSpring 0.3s; } #gallerySlider.leftSpring{ -moz-animation: leftSpring 0.3s; -webkit-animation: leftSpring 0.3s; } /* Firefox Keyframe Animations */ @-moz-keyframes rightSpring{ 0%{ margin-left:0px;} 50%{ margin-left:-30px;} 100%{ margin-left:0px;} } @-moz-keyframes leftSpring{ 0%{ margin-left:0px;} 50%{ margin-left:30px;} 100%{ margin-left:0px;} } /* Safari and Chrome Keyframe Animations */ @-webkit-keyframes rightSpring{ 0%{ margin-left:0px;} 50%{ margin-left:-30px;} 100%{ margin-left:0px;} } @-webkit-keyframes leftSpring{ 0%{ margin-left:0px;} 50%{ margin-left:30px;} 100%{ margin-left:0px;} } /* Arrows */ #prevArrow,#nextArrow{ border:none; text-decoration:none; background:url(../images/controls/arrows.png) no-repeat; opacity:0.5; cursor:pointer; position:absolute; width:43px; height:58px; top:50%; margin-top:-29px; } #prevArrow:hover, #nextArrow:hover{ opacity:1; } #prevArrow{ background-position:left top; left:40px; } #nextArrow{ background-position:right top; right:40px; } #imageTitle { background-color:rgba(0,0,0,0.5); color: #fff; width: 100%; text-align: center; position:absolute; padding:10px 0 10px 0; bottom: 0; left: 0; z-index: 100000; } /*------------------------------------------------------------------------------------------*/ /* 10. Responsive Styling JustLanded */ /*------------------------------------------------------------------------------------------*/ @media screen and (min-width : 761px ) and (max-width: 1005px) { /*Global*/ article section, #newsletter { background: url(../images/border.gif) repeat-x left bottom; margin: 0 0 20px 0; padding: 0 0 25px 0; overflow: hidden; } .row { width: 730px; margin: 0 auto; } .six.columns { width: 99%; } .row .six.mobile-two { width: 50% !important; float: left; padding: 0 10px 0 0 !important; } h2, h3 { text-align: center; } /*Header*/ #phone { text-align: right; } #phone a { display: block; } /* Banner */ #banner { height: auto; padding-top: 10px; padding-bottom: 10px; margin-bottom: 20px; } #banner .six.columns { width: 50%; } #banner_image { margin-top: 20px; } /* Buttons */ #banner .buttons, #banner .buttons_big { margin: 25px 0 -40px 0 !important; } .button_buy_pricing { width: 141px !important; } /*Description*/ #description img.position_left, #description img { display: block; margin: 0 auto !important; float: none; } /*Features*/ #features { padding-top: 45px; } #features li { margin: 15px 0 20px 0; width: 365px; } /*Screenshots*/ #screenshots img { margin:0 3px 3px 0; } /* Work */ #work { background: url(../images/border.gif) repeat-x left bottom; margin: 0 0 20px 0; padding: 0 0 20px 0 !important; } /* Newsletter */ #newsletter_inner { background-image: none; padding: 15px; } #newsletter h2 { background: none; font-size: 170%; color: #fff; padding: 0; margin: 5px 0 0 10px; float: none; text-align: center; } #newsletter form { width: 460px; margin-right: 115px; } #newsletter input#e-mail { width: 338px; } /*Pricing*/ .pricing_footer p { background-color: rgba(30, 30, 30, 0.25); border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; width: 153px; margin: 0 auto; padding: 5px; overflow: hidden; } /*Social Elements */ #social_elements { overflow: hidden; position: relative; margin: 10px 0 5px 0; padding: 0; top: 0; left: 0; text-align: center; } #social_elements ul { display: inline-block; margin: 0 auto; } #social_elements li { float: left; margin: 0 2px 0 2px !important; } } @media screen and (max-width: 760px) { /*Global*/ .column, .columns { width: auto !important; float: none; } .column:last-child, .columns:last-child { float: none; } [class*="column"] + [class*="column"]:last-child { float: none; } .column:before, .columns:before, .column:after, .columns:after { content: ""; display: table; } .column:after, .columns:after { clear: both; } .offset-by-one, .offset-by-two, .offset-by-three, .offset-by-four, .offset-by-five, .offset-by-six, .offset-by-seven, .offset-by-eight, .offset-by-nine, .offset-by-ten { margin-left: 0 !important; } /* Mobile 4-column Grid */ .row .mobile-two { width: 50% !important; float: left; padding: 0 10px; } .row .mobile-two:last-child { float: right; } .row .mobile-two.end { float: left; } .row.collapse .mobile-two { padding: 0; } /* Reveal --- */ /* */ .reveal-modal-bg { position: absolute; } .reveal-modal, .reveal-modal.small, .reveal-modal.medium, .reveal-modal.large, .reveal-modal.xlarge { width: 80%; top: 15px; left: 50%; margin-left: -40%; padding: 20px; height: auto; } article section, #newsletter { background: url(../images/border.gif) repeat-x left bottom; margin: 0 0 20px 0; padding: 0 0 25px 0; overflow: hidden; } .row { width: 430px; margin: 0 auto; } h2, h3 { text-align: center; } /*Header*/ #logo { margin-bottom: 10px; } #phone { float: none; text-align: left; } /* Banner */ #banner { height: auto; padding-top: 10px; margin-bottom: 20px; } #banner_image { margin-top: 10px; } #banner_image img#image_bottom { margin-top: 10px; } /* Buttons */ #banner .buttons { margin: 25px 0 -60px 20px !important; } /*Features*/ #features { padding-top: 45px; } #features li { margin: 15px 0 25px 0; } /*Description*/ #description ul { margin-left: 10px; } /*Screenshots*/ #screenshots img { margin:0 3px 3px 0; } /* Work */ #work { background: url(../images/border.gif) repeat-x left bottom; margin-bottom: 25px; padding-bottom: 25px !important; } /*Newsletter*/ #newsletter h2 { padding: 14px 0 5px 70px; text-align: left; } #newsletter form { background: #fff; height: 44px; width: 395px; margin: 5px 15px 20px 15px; float: right; display: block; border: 1px solid #ab2210; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: inset 0 2px 3px #999; -moz-box-shadow: inset 0 2px 3px #999; -webkit-box-shadow: inset 0 2px 3px #999; } #newsletter input#e-mail { background: none; height: 42px; width: 273px; float: left; margin: 0; padding: 2px 0 0 10px; border-left: none; border-bottom: none; border-top: none; border-right: 1px solid #ab2210; line-height: 42px; color: #999; } /* Table*/ #pricing_table { padding-bottom: 5px; padding-top: 15px; } .pricing_block { margin-bottom: 10px; } /*Quotes*/ blockquote { margin-bottom: 25px; } /*Social Elements */ #social_elements { overflow: hidden; position: relative; margin: 10px 0 5px 0; padding: 0; top: 0; left: 0; text-align: center; } #social_elements ul { display: inline-block; margin: 0 auto; } #social_elements li { float: left; margin: 0 2px 0 2px !important; } .scrollup { display: none !important; } } @media screen and (max-width: 460px) { /*Global*/ article section, #newsletter { background: url(../images/border.gif) repeat-x left bottom; margin: 0 0 20px 0; padding: 0 0 25px 0; overflow: hidden; } .row { width: 285px; margin: 0 auto; } .six.mobile-two.columns { width: 99% !important; padding-left: 0 !important; clear: both; } .row .mobile-two:last-child { float: left; } h2, h3 { text-align: center; } /*Header*/ #logo h2 { margin: 0 0 10px 53px; } #phone { float: none; text-align: left; } /* Banner */ #banner { height: auto; padding-top: 10px; padding-bottom: 15px; margin-bottom: 10px; } #banner_image { margin-top: 10px; } #banner_image img#image_bottom { margin-top: 10px; } /*Features*/ #features { padding-top: 15px; } #features li { margin: 15px 0 25px 0; } /*Description*/ #description ul { margin-left: 10px; } /*Screenshots*/ #screenshots img { margin:0; } /* Work */ #work { background: url(../images/border.gif) repeat-x left bottom; margin-bottom: 25px; padding-bottom: 25px !important; } /*Buttons*/ .buttons { width: 240px; margin: 20px 0 0 20px !important; } #banner .buttons { margin: 20px 0 0 20px !important; } a.button_buy { float: none; width: 227px; height: 51px; text-align: center; color: #fff; border-radius: 25px; -webkit-radius: 25px; -moz-border-radius: 25px; } a.button_try { float: none; width: 227px; height: 51px; border-radius: 25px; -webkit-radius: 25px; -moz-border-radius: 25px; margin: 5px 0 0 0; } .buttons span { display: none; } /* Pricing */ #pricing_table { margin: 0 auto; width: 230px; } .pricing_block { margin-bottom: 10px; width: 200px; } #pricing_table .three.mobile-two.columns { width: 220px; clear: both; float: none; } /* Newsletter */ #newsletter_inner { background-image: none; padding: 15px; } #newsletter h2 { background: none; font-size: 170%; color: #fff; padding: 0; margin: 5px 0 0 0; float: none; text-align: center; } #newsletter form { background: none; height: 100px; width: 235px; float: none; display: block; margin: 10px auto; box-shadow: none; border: none; } #newsletter input#e-mail { background: #fff; height: 42px; width: 235px; float: left; margin: 10px auto; padding: 2px 10px 0 10px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: inset 0 2px 3px #999; -moz-box-shadow: inset 0 2px 3px #999; -webkit-box-shadow: inset 0 2px 3px #999; line-height: 42px; color: #999; } #newsletter input#e-mail:focus { color: #000; } input#submit { height: 44px; width: 120px; margin: 0 auto; float: none; border: 1px solid #eb9f29; border-top: none; border-radius: 5px; -moz-border-right: 5px; -webkit-border-radius: 5px; cursor: pointer; } /*Quotes*/ blockquote { margin-bottom: 25px; } .scrollup { display: none !important; } /*Contact*/ #contact { width:290px; } #contact textarea { width: 250px; } }