mastercut/public/assets/client/scss/_footer.scss

196 lines
5.5 KiB
SCSS

.footer-area{
.footer-top{
border-bottom: 1px solid #233148;
.single-footer-caption{
.footer-logo{
margin-bottom:30px;
}
.footer-pera{
.info1{
line-height: 1.8;
margin-bottom: 35px;
color: #7c7c7c;
@media #{$lg}{
padding-right: 0px;
}
@media #{$md}{
padding-right: 0px;
}
@media #{$sm}{
padding-right: 0px;
}
@media #{$sm}{
padding-right: 0px;
}
}
}
.footer-number{
h4 {
color: $theme-color;
font-size: 30px;
font-weight: 500;
text-transform: capitalize;
span {
color: #fff;
}
}
p {
color: #bdbdbd;
}
}
.footer-tittle{
h4{
color: #fff;
font-family:$font_2;
font-size: 18px;
margin-bottom: 38px;
font-weight: 500;
text-transform: uppercase;
}
ul{
li{
color: #7c7c7c;
margin-bottom: 15px;
text-transform: capitalize;
a{
color: #7c7c7c;
font-weight: 300;
font-size: 15px;
&:hover{
color: #fff;
padding-left: 5px;
}
}
}
}
}
.footer-form{
margin-bottom: 30px;
form{
position: relative;
input{
width: 100%;
height: 43px;
padding: 10px 20px;
border: 0;
background: #101720;
color: #fff;
&::placeholder{
color: #9fa6bd;
font-weight: 300;
font-size: 14px;
}
}
.form-icon{
button{
position: absolute;
top: 0px;
right: 0;
background: none;
border: 0;
cursor: pointer;
padding: 14px 22px;
background:#0a0f17;
line-height: 1;
color: $theme-color;
font-size: 14px;
font-weight: 300;
}
}
}
}
.info.error {
color:#ff0000;
}
.footer-cap{
margin-bottom: 30px;
span{
color: $theme-color;
font-size: 16px;
font-weight: 300;
margin-bottom: 10px;
display: block;
}
p{
color: #7c7c7c;
font-size: 16px;
}
}
}
}
//copy Right
.footer-bottom{
// border-top: 1px solid #1c2e4c;
padding-bottom: 50px;
padding-top: 30px;
.footer-copy-right{
p{
color: #7c7c7c;
font-weight: 300;
font-size: 16px;
line-height: 2;
margin-bottom: 12px;
i{
color:$theme-color
}
a{
color: $theme-color;
&:hover{
color: #fff;
}
}
}
}
}
// Footer SociaL
.footer-social {
span{
color: #fff;
position: relative;
margin-right: 57px;
&::before{
position: absolute;
content: "";
width: 43px;
height: 2px;
background: #3b3647;
top: 50%;
transform: translateY(-50%);
right: -56px;
}
}
@media #{$md}{
float: left;
padding-top: 10px;
}
@media #{$sm}{
float: left;
padding-top: 10px;
}
@media #{$xs}{
float: left;
padding-top: 10px;
}
a{
color:#7c7c7c;
font-size: 14px;
padding-left: 25px;
i {
@include transition(.4s);
transform: rotateY(0deg);
}
&:hover{
color: #fff;
i {
transform: rotateY(180deg);
}
}
}
}
}