WARNING !!

 

YOUR LAYOUT IS INCOMPLETE!

ADD THE FOLLOWING CSS CODE TO YOUR PAGE / SITE TO COMPLETE IT NOW!   ↓

Custom CSS > ADD THIS FIRST!

/* HERO SECTION */

#hero .header-content img {

max-width: 400px;

margin-bottom: 30px;

}

@media screen and (max-width: 980px) {

#hero .et_pb_fullwidth_header_subhead {

max-width: 300px;

margin: -10px auto 10px;

}

body #page-container .et_pb_button {

letter-spacing: 2px !important;

}

#hero .header-content img {

max-width: 300px;

}

}

@media screen and (max-width: 767px) {

#hero h1 {

letter-spacing: 4px;

}

body #page-container .et_pb_button, body #page-container .et_pb_fullwidth_header_0 .et_pb_button_one.et_pb_button {

border-width: 7px !important;

}

#hero .header-content img {

max-width: 240px;

}

}

@media screen and (max-width : 980px) {

#hero .header-content img {

max-width: 180px;

}

}

/*MENU*/

#anchorMenuHolder {

text-align: right;

}

#anchorMenu {

padding-top: 60px;

}

#anchorMenu ul {

padding-left: 0;

list-style-type: none;

}

#anchorMenu li {

display: inline-block;

padding: 0 15px;

}

#anchorMenu li a {

color: #fff;

font-family: Raleway;

font-weight: 700;

letter-spacing: 8px;

text-transform: uppercase;

-webkit-transition: all .3s ease-in-out;

-moz-transition: all .3s ease-in-out;

-o-transition: all .3s ease-in-out;

-ms-transition: all .3s ease-in-out;

transition: all .3s ease-in-out;

}

#anchorMenu li a:hover {

color: rgba(255,255,255,.5);

}

#anchorMenu .widget_nav_menu {

width: 96% !important;

}

@media screen and (max-width : 980px) {

#anchorMenuHolder .et_pb_row {

/*margin: 0 3% 15px 3%;*/

padding: 2% 0 0;

}

#anchorMenuHolder .et_pb_column_1_3 {

width: 25% !important;

}

#anchorMenuHolder .et_pb_column_2_3 {

width: 75% !important;

}

#anchorMenu .widget_nav_menu {

width: 96% !important;

}

}

@media screen and (max-width : 767px) {

#anchorLogo {

text-align: center;

margin: 15px auto 0 !important;

}

#anchorMenu {

text-align: center;

padding-top: 20px;

}

#anchorMenuHolder .et_pb_row {

margin: 0 !important;

padding: 2% 0 !important;

}

#anchorMenuHolder .et_pb_column_1_3 {

width: 100% !important;

float: none;

}

#anchorMenuHolder .et_pb_column_2_3 {

width: 100% !important;

float: none;

}

#anchorMenu .widget_nav_menu {

width: auto !important;

float: none;

text-align: center;

}

}

@media screen and (max-width : 600px) {

#anchorMenu li {

display: block;

}

}

/* SPLIT SECTION */

@media screen and (max-width: 980px) {

.splitSection .splitImage {

height: 500px;

}

}

@media screen and (max-width: 767px) {

.splitSection .splitImage {

height: 300px;

}

}

/* SERVICES SECTION */

#services .et-pb-icon-circle {

padding: 40px;

}

/* WORK */

#anchorWork .et_pb_blurb_content {

max-width: none;

}

/* NEWSLETTER SIGNUP */

.newsletterSignup .et_pb_contact_form {

margin: 0 auto;

max-width: 500px;

position: relative;

left: 5%;

}

.newsletterSignup input[type=”text”] {

border: 1px solid rgba(255, 255, 255, .6);

color: #fff;

border-radius: 3px;

font-weight: 500 !important;

}

.newsletterSignup .et_contact_bottom_container {

float: left;

margin-top: 0;

}

.newsletterSignup button[type=”submit”] {

border-radius: 3px !important;

background-color: #fff !important;

color: #1C2228 !important;

font-family: ‘Raleway’, Helvetica, Arial, sans-serif !important;

font-size: 15px !important;

font-weight: 600 !important;

letter-spacing: 2px !important;

text-transform: uppercase;

font-weight: 500 !important;

border: none !important;

line-height: 30px !important;

padding: 11px 24px 12px 24px !important;

left: -8px !important;

}

.newsletterSignup button[type=”submit”]:hover {

background-color: rgba(255,255,255,.7) !important;

padding: 11px 24px 12px 24px !important;

}

@media screen and (max-width: 1140px) {

.newsletterSignup .et_pb_contact_form {

left: 6%;

}

}

@media screen and (max-width: 1040px) {

.newsletterSignup .et_pb_contact_form {

left: 7%;

}

}

@media screen and (max-width: 870px) {

.newsletterSignup .et_pb_contact_form {

left: 8%;

}

}

@media screen and (max-width: 767px) {

.newsletterSignup .et_pb_contact_form {

left: 0;

}

.newsletterSignup .et_pb_contact_field_0 {

max-width: 100%;

padding-left: 0 !important;

}

.newsletterSignup .et_contact_bottom_container, .newsletterSignup button[type=”submit”] {

width: 100%;

}

.newsletterSignup button[type=”submit”] {

left: 0 !important;

margin-left: 0 !important;

}

}

/*GREY OVERLAY*/

.greyOverlay .et_parallax_bg:before, .greyOverlay:before {

content:””;

display: block;

height: 100%;

position: absolute;

top: 0;

left: 0;

width: 100%;

background-color: rgba(58, 60, 69, .25);

}

/*IMAGE ZOOM FEATURE*/

.imageWrap {

overflow: hidden;

-webkit-backface-visibility: hidden;

-webkit-transform: translateZ(0) scale(1.0, 1.0);

}

.imageWrap img {

vertical-align: bottom;

-webkit-transition: -webkit-transform 0.5s ease;

-moz-transition: -moz-transform 0.5s ease;

-o-transition: -o-transform 0.5s ease;

transition: transform 0.5s ease;

}

.imageWrap img:hover {

-webkit-transform: scale(1.1);

-moz-transform: scale(1.1);

-ms-transform: scale(1.1);

-o-transform: scale(1.1);

transform: scale(1.1);

}

/*ANIMATION – WAYPOINTS*/

/*——–FROM LEFT———-*/

.left-animated.et-animated {

opacity: 1;

-webkit-animation: fadeLeft 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-moz-animation: fadeLeft 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-o-animation: fadeLeft 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

animation: fadeLeft 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

}

/*——–FROM RIGHT———*/

.right-animated.et-animated {

opacity: 1;

-webkit-animation: fadeRight 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-moz-animation: fadeRight 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-o-animation: fadeRight 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

animation: fadeRight 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

}

/*———FROM TOP———-*/

.top-animated.et-animated {

opacity: 1;

-webkit-animation: fadeTop 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-moz-animation: fadeTop 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-o-animation: fadeTop 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

animation: fadeTop 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

}

/*——–FROM BOTTOM——–*/

.bottom-animated.et-animated {

opacity: 1;

-webkit-animation: fadeBottom 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-moz-animation: fadeBottom 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-o-animation: fadeBottom 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

animation: fadeBottom 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

}

/*———FADE IN———–*/

.fadein-animated.et-animated {

opacity: 1;

-webkit-animation: fadeIn 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-moz-animation: fadeIn 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

-o-animation: fadeIn 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

animation: fadeIn 1.0s 1 cubic-bezier(0.44, 0, .52, .94);

}

HOW TO ADD IT

DELETE THIS SECTION AFTER YOU DO THAT 🙂

Anchor

A Landing Page from Superfly
Learn More
Say Hello to Anchor
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur tincidunt mollis ante non volutpat. Nam consequat diam nec leo rutrum tempus. Nulla accumsan eros nec sem tempus scelerisque. Morbi tincidunt risus magna, posuere lobortis felis. Donec at vehicula risus. Cras vel sollicitudin ipsum. Etiam tincidunt placerat enim, a rhoncus eros sodales ut.

“The sea, once it casts its spell, holds one in its net of wonder forever.”

“The sea, once it casts its spell, holds one in its net of wonder forever.”