<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>CodePen - Bootstrap Footer AV Test</title>
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootswatch/3.2.0/sandstone/bootstrap.min.css'><link rel="stylesheet" href="./style.css">
</head>
<body>
<!-- partial:index.partial.html -->
<div class="container">
<div class="footer_trust_top">
<p>AS FEATURED IN</p>
<div class="trustlogos"></div>
</div><div class="col-lg-12 col-md-12 col-xs-12 footer_main">
<div class="col-xs-5 col-md-3 footer-left">
<h4>Find Out More</h4>
<ul class="footer_list">
<li><a href="">About Us</a></li>
<li><a href="">Reviews</a></li>
<li><a href="">FAQ's</a></li>
<li><a href="">Policies</a></li>
<li><a href="">Contact Us</a></li>
</ul>
</div>
<div class="col-xs-7 col-md-3 col-md-push-6 footer-right">
<div class="footerbox">
<h4>Contact Us</h4>
<p>We're ready to help!</p>
<ul class="footer_list">
<li>USA | CANADA</li>
<li class="phone">+1 555 555 5555</li>
<li>UK | IRELAND</li>
<li class="phone">+555 5 555 5555</li>
</ul>
</div>
</div>
<div class="col-xs-12 col-md-6 col-md-pull-3 footer_middle">
<h4>Be the first to know about Authentic Travel Deals</h4>
<p>Subscribe to get exclusive offers on the world’s greatest vacations.</p>
<form class="hero-cta__form">
<div class="elcontainer">
<div class="inner-wrap submit-container">
<div class="hero-cta__input-wrap"> <input type="email" name="data[email]" required="" id="hero-cta-email" placeholder="Enter Your Email Address"></div> <button type="submit" class="emailsignup">Sign Up</button></div>
</div>
</form>
</div></div>
<div class="footer_bottom"><div class="col-lg-3 col-md-12 footer_copyright">
<p>©2018 All rights reserved.</p>
</div>
<div class="col-md-9 col-xs-12 footer__partners"><img src="https://www.authenticireland.com/wp-content/uploads/2018/04/Bottom_Trust2.png"></div>
<!-- partial -->
</body>
</html>
@media only screen and (max-width: 768px) {
/* For mobile phones: */
.footer_main {
padding: 0px 0px 50px 0px;
}
}
.footer-right p,
.footer_middle p {
font-family: montserrat;
font-size: 16px;
color: rgba(0, 0, 0, 0.5);
}
ul.footer_list {
list-style: none;
padding-left: 0px;
}
ul.footer_list li {
color: rgba(0, 0, 0, 0.5);
line-height: 1.6;
font-weight: 500;
}
ul.footer_list li.phone {
font-size: 22px;
color: rgba(0, 0, 0, 1);
}
ul.footer_list li a {
color: rgba(0, 0, 0, 0.5);
font-weight: 500;
text-transform: none;
}
ul.footer_list a:hover {
color: rgba(54, 204, 142, 1);
text-decoration: none;
list-style: none;
}
.footer_middle h4, .footer-right h4 {
font-family: montserrat;
font-size: 24px;
}
.footer_middle {
text-align: center;
padding: 0;
}
.footer-right h4, .footer-left h4 {
font-family: montserrat;
font-size: 18px;
margin-bottom: 10px;
}
#hero-cta-email {
height: 50px;
width: 60%;
}
.hero-cta__form input {
width: 100%;
float: left;
border: none;
background: rgba(0, 0, 0, 0.1);
border-radius: 8px;
padding-left: 15px;
font-size: 16px;
line-height: 18px;
height: 18px;
font-family: raleway;
font-weight: 400;
opacity: 1;
display: block;
margin-top: 10px;
}
.hero-cta__form input:focus {
outline: none;
}
.emailsignup {
font-family: montserrat;
font-size: 16px;
margin-left: 15px;
height: 50px;
width: 30%;
border: none;
background-color: #36cc8e;
color: #fff;
text-transform: uppercase;
border-radius: 50px;
margin-top: 10px;
}
.trustlogos {
content: url(https://www.authenticireland.com/wp-content/uploads/2018/04/TopTrust1.png);
margin: 10px auto;
max-width: 100%;
}
.footer_trust_top {
width: 100%;
margin: 20px auto;
text-align: center;
}
.footer_trust_top p {
font-family: montserrat;
font-size: 18px;
font-weight: 400;
color: rgb(0, 0, 0, 0.5);
}
.footer-left {
padding-left: 0px;
justify-content: flex-start;
}
.footer-right {
margin: 0 auto;
display: flex;
justify-content: flex-end;
}
.footer_main {
margin: 20px 0px 20px 0px;
}
.footer_copyright p {
font-size: 12px;
color: rgb(0,0,0,0.5);
padding-top: 20px;
}
.footer__partners img {
float: right;
margin: 10px auto;
max-width: 100%;
}