html,body{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow-x: hidden;
}
html{
/* according to my browser */
font-size: 62.5%;
/* font-size: 10px;
font-size: 1rem; */
}
.heading_underline_main{
display: inline-block;
position: relative;
}
.heading_underline_main::before{
content: '';
height: .5rem;
width:13rem;
background-color: #d47d0b;
position: absolute;
left:12rem;
top:4.5rem;
bottom:-0.5rem ;
}
/* navbar css start */
.navbar{
background-color: #031446!important;
}
.navbar-brand{
margin-left:2rem;
}
.navbar-nav{
margin: 0rem 1rem 0rem 50rem;
}
.navbar-nav .nav-item {
padding: 1rem;
font-size:1.6rem;
}
.navbar-nav .nav-item .nav-link {
color:#FFFFFF;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.navbar-nav .nav-item .current{
color: #fa983a;
background-color: #031446;
}
.navbar-nav .nav-item .nav-link:hover{
color:#b3b8b7;
}
/* navbar css end */
/* media query for navbar start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
html{
font-size:40%;
}
.navbar-toggler-icon{
color: rgb(10, 10, 10);
}
.navbar-toggler{
background-color: rgb(172, 99, 4);
}
.navbar-brand{
margin-left: 1rem;
}
.navbar-nav{
margin: 0rem 27rem 0rem 22rem;
}
.navbar-nav .nav-item {
padding: .5rem;
font-size:1.8rem;
}
.navbar-nav .nav-item .nav-link {
color: #f7f3f0;
font-weight: 600;
}
.navbar-nav .nav-item .current{
color: #fa983a;
background-color: #031446;
}
.navbar-nav .nav-item .nav-link:hover{
color:#b3b8b7;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px){
html{
font-size:60%;
}
.navbar-toggler-icon{
color: rgb(10, 10, 10);
}
.navbar-toggler{
background-color: rgb(172, 99, 4);
}
.navbar-nav{
margin: 0rem 61rem 0rem 15rem;
}
.navbar-nav .nav-item .current{
color: #fa983a;
background-color: #031446;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size:60%;
}
.navbar-toggler-icon{
color: rgb(10, 10, 10);
}
.navbar-toggler{
background-color: rgb(172, 99, 4);
}
.navbar-nav{
margin: 0rem 62rem 0rem 15rem;
}
.navbar-nav .nav-item .current{
color: #fa983a;
background-color: #031446;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px){
html{
font-size:62%;
}
.navbar-toggler-icon{
color: rgb(10, 10, 10);
}
.navbar-toggler{
background-color: rgb(172, 99, 4);
}
.navbar-nav{
margin: 0rem 3rem 0rem 33rem;
}
.navbar-nav .nav-item .current{
color: #fa983a;
background-color: #031446;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px){
html{
font-size:62%;
}
.navbar-toggler-icon{
color: rgb(10, 10, 10);
}
.navbar-toggler{
background-color: rgb(172, 99, 4);
}
.navbar-brand{
margin-left:6rem;
}
.navbar-nav{
margin: 0rem 2rem 0rem 47rem;
}
.navbar-nav .nav-item .current{
color: #fa983a;
background-color: #031446;
}
}
/* media query for navbar End */
/* ........................................................................... */
/* main content start here */
/* hero-banner css start */
.hero-banner{
width:128rem;
/* width: 100vw; */
height:80rem;
background-image: url(../image/hero-banner.jpg);
background-repeat: no-repeat;
background-size:cover;
}
.hero-banner h1{
margin-top: 10rem;
line-height:10rem;
letter-spacing: .3rem;
word-spacing:.5rem;
font-size:10rem;
color:#FFFFFF;
line-height:12rem;
font-family: 'Oswald', sans-serif;
font-weight: 700;
}
.hero-banner p{
margin-top: 2rem;
line-height:12rem;
letter-spacing: .2rem;
word-spacing:.5rem;
font-size:10rem;
color:#FFFFFF;
font-family: 'Oswald', sans-serif;
font-weight: 700;
}
/* hero-banner css end */
/* media query for hero-banner start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.hero-banner{
width:138rem;
height:80rem;
background-image: url(../image/mobile-hero-banner.jpg);
background-repeat: no-repeat;
background-size:cover;
background-position: center;
background-attachment:fixed;
}
.hero-banner h1{
margin: 10rem 3rem 0rem -82rem;
font-size:8rem;
}
.hero-banner p{
margin:1rem 1rem 3rem -2rem;
font-size:8rem;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
html{
font-size: 50%;
}
.hero-banner{
height: 80rem;
}
.hero-banner h1{
margin: 10rem 3rem 0rem -45rem;
}
.hero-banner p{
margin: 1rem 3rem 0rem -2rem;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size:60%;
}
.hero-banner h1{
margin: 10rem 3rem 0rem -30rem;
}
.hero-banner p{
margin:1rem 1rem 1rem 2rem;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
html{
font-size: 62.5%;
}
.hero-banner h1{
margin: 10rem 3rem 0rem -10rem;
}
.hero-banner p{
margin:1rem 1rem 1rem 2rem;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
html{
font-size: 62.5%;
}
}
/* media query for hero-banner end */
/* .................................................................................. */
/*Gallery section css start */
.gallery-sec{
width: 100vw;
height:125rem;
background-image: linear-gradient(to right,#000000 , #031446);
}
.gallery-sec h2{
font-size:3.5rem;
letter-spacing: .5rem;
line-height:5rem;
color:#FFFFFF;
font-family:'Oswald', sans-serif;
font-weight: 700;
}
.gallery-sec p{
font-size:1.5rem;
color:#FFFFFF;
letter-spacing: .1rem;
font-family: 'Poppins', sans-serif;
font-weight: 300;
}
.call-btn{
text-decoration: none;
margin: 2rem 1rem 1rem 28rem;
background-color: #fa983a;
color: #030303;
font-size: 1.5rem;
padding: .5rem 1rem .5rem 1rem;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.call-btn:hover{
background-color: #000099;
color: #FFFFFF;
}
.romar{
margin: 6rem 0rem 2rem 0rem;
}
.romar span{
position: relative;
top: 1rem;
left: 10rem;
font-size: 1.8rem;
text-align: center;
padding: .2rem .5rem .2rem .5rem;
color:#df8b0e;
letter-spacing: .1rem;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.romar img{
margin: 0rem 0rem 0rem 1rem;
}
img:hover{
opacity: .5;
}
/* media query for Gallery Section start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (min-width: 300px) and (max-width: 480px) {
html{
font-size:50%;
}
.gallery-sec{
height: 240rem;
}
.romar img{
margin: 3rem .5rem 1rem 2rem;
}
.romar span{
margin: 2rem .5rem 2rem 8rem;
font-size: 2rem;
}
.call-btn{
margin: 2rem 1rem .5rem 22rem;
}
}
@media only screen and (min-width:481px) and (max-width:600px) {
html{
font-size:50%;
}
.gallery-sec{
height:252rem;
}
.romar img{
margin: 3rem .5rem 1rem 9rem;
}
.romar span{
margin: 2rem .5rem 2rem 18rem;
font-size: 2rem;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
html{
font-size:60%;
}
.gallery-sec{
height:230rem;
}
.call-btn{
margin: 2rem 1rem 1rem 20rem;
}
.romar img{
margin: 2rem .5rem 3rem 7rem;
}
.romar span{
margin: -1rem -20rem .2rem 12rem;
font-size: 2rem;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size:60%;
}
.gallery-sec{
height:142rem;
}
.call-btn{
margin: 2rem 1rem 1rem 15rem;
}
.romar img{
margin: 1rem .5rem 1rem 1rem;
}
.romar span{
margin: -1rem -20rem .2rem 6rem;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
html{
font-size: 62.5%;
}
.gallery-sec{
height:128rem;
}
.call-btn{
margin: 2rem 1rem 1rem 27rem;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
html{
font-size: 62.5%;
}
}
/* media query for Gallery Section End */
/* Gallery section end */
/* ............................................................................... */
/* css for customer choice start */
.customer-choice{
width: 100vw;
height:130rem;
background-image: linear-gradient(to right,#000000 , #031446);
}
.customer-choice h2{
margin: 0rem 0rem 0rem 10rem;
font-size:2.8rem;
letter-spacing: .4rem;
font-family:'Oswald', sans-serif;
font-weight: 700;
}
.customer-choice p{
position: relative;
left: 5rem;
top: 4rem;
bottom: 1rem;
font-size: 1.5rem;
font-family: 'Poppins', sans-serif;
font-weight: 300;
color: #FFFFFF;
letter-spacing: .1rem;
}
.call-btn1{
text-decoration: none;
position: relative;
top: 5rem;
left: 18rem;
right: 3rem;
bottom: 1rem;
color: #030303;
background-color: #fa983a;
padding: 1rem 1rem 1rem 1rem;
font-size: 1.3rem;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.call-btn1:hover{
background-color: #000099;
color: #f7f3f0;
}
.img-fluid{
border-radius:1%;
}
/* media query start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (min-width: 300px) and (max-width: 480px) {
html{
font-size:40%;
}
.customer-choice{
height:85rem;
}
.customer-choice p{
margin: 0rem 1rem 1rem -4rem;
}
.img-fluid{
margin:7rem 0rem 0rem 0rem ;
}
}
@media only screen and (min-width: 481px) and (max-width: 600px) {
html{
font-size:40%;
}
.customer-choice{
height:100rem;
}
.customer-choice h2{
margin: 0rem 1rem 1rem 11rem;
}
.customer-choice p{
margin: 0rem 1rem 1rem -4rem;
}
.call-btn1{
margin: 1rem 1rem 1rem 3rem;
}
.img-fluid{
margin:7rem 0rem 0rem 0rem ;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
html{
font-size:50%;
}
.customer-choice{
height: 87rem;
}
.call-btn1{
margin: -1rem 1rem .5rem 3rem;
}
.img-fluid{
margin:6rem 0rem 0rem 9rem;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size:40%;
}
.customer-choice{
height:47rem;
}
.customer-choice h2{
margin: 0rem 1rem 1rem 1rem;
}
.customer-choice p{
margin: 0rem 0rem 1rem -6rem;
}
.call-btn1{
margin: -1rem 1rem 1rem 1rem;
padding:.2rem .2rem .2rem .2rem ;
}
.img-fluid{
margin:7rem 0rem 0rem 0rem ;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
html{
font-size: 62.5%;
}
.call-btn1{
padding:.5rem .5rem .5rem .5rem;
}
.img-fluid{
margin:3rem 0rem 0rem 0rem ;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
html{
font-size: 62.5%;
}
.call-btn1{
padding:.5rem .5rem .5rem .5rem;
}
}
/* media query end */
/* css for customer's choice end */
/* ............................................................................. */
/* css for Why choose-us section start */
.choose-us{
width: 100vw;
height:37rem;
background-image: linear-gradient(to right,#000000 , #031446);
}
.header-choose{
position: relative;
top: 5rem;
left: 40rem;
right: 2rem;
color: #FFFFFF;
font-size: 2.5rem;
letter-spacing: .4rem;
font-family:'Oswald', sans-serif;
font-weight: 700;
}
.choose-para h3{
margin: 10rem 1rem 1rem -1rem;
font-size: 2rem;
color:#FFFFFF;
letter-spacing: .1rem;
font-family: 'Poppins', sans-serif;
font-weight: 400;
}
.choose-para p{
margin:2rem 1rem 2rem -1rem;
font-size: 1.4rem;
color:#FFFFFF;
font-family: 'Poppins', sans-serif;
font-weight: 300;
}
/* media query start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
html{
font-size:45%;
}
.choose-us{
height:90rem;
}
.header-choose{
position: relative;
top: 3rem;
left: 12rem;
right: 3rem;
}
.choose-para h3{
position: relative;
top:-2rem;
left: 10rem;
right: 3rem;
}
.choose-para p{
position: relative;
top:-2rem;
left: 14rem;
right: 3rem;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
html{
font-size: 50%;
}
.choose-us{
height:99rem;
}
.header-choose{
position: relative;
top:6rem;
left: 14rem;
right: 3rem;
}
.choose-para h3{
position: relative;
top: 4rem;
left: 14rem;
right: 3rem;
}
.choose-para p{
position: relative;
top:-4rem;
left: 16rem;
padding: 8rem 2.5rem .2rem 2.5rem;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size:50%;
}
.choose-us{
height:50rem;
}
.header-choose{
position: relative;
top: 3rem;
left: 27rem;
}
.choose-para h3{
position: relative;
top: 2rem;
left: 4rem;
right: 3rem;
}
.choose-para p{
position: relative;
top:-4rem;
left:4rem;
padding: 7rem 2.5rem .2rem 2.5rem;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
html{
font-size: 62.5%;
}
.header-choose{
position: relative;
top: 3rem;
left:37rem;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
html{
font-size: 62.5%;
}
.header-choose{
position: relative;
top: 3rem;
left:40rem;
}
}
/* media query End */
/* css for Why choose-us section End */
/* .............................................................................. */
/* css for full-spare parts start*/
.full-spare-sec{
width: 100vw;
height: 80rem;
background-image: linear-gradient(to right,#000000 , #031446);
}
.full-spare h2{
letter-spacing: .4rem;
line-height:4rem;
word-spacing: .3rem;
color: #FFFFFF;
font-size: 3.5rem;
font-family:'Oswald', sans-serif;
font-weight: 700;
}
.full-spare h2 span{
letter-spacing: .4rem;
word-spacing: .3rem;
color: #FFFFFF;
font-size: 3.5rem;
font-family:'Oswald', sans-serif;
font-weight: 700;
}
.full-spare p{
font-size: 1.5rem;
color:#FFFFFF;
font-family: 'Poppins', sans-serif;
font-weight: 300;
letter-spacing: .1rem;
}
.full-spare h3{
font-size: 1.5rem;
color: #FFFFFF;
letter-spacing: .2rem;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.full-spare img{
position: relative;
left: -4.5rem;
border-radius: 1%;
}
.full-sparelast h3{
font-size: 1.5rem;
color: #FFFFFF;
letter-spacing: .2rem;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.full-sparelast img{
position: relative;
left: -4.5rem;
border-radius: 1%;
}
/* media query for spare part start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
html{
font-size: 45%;
}
.full-spare-sec{
height:200rem;
}
.full-spare h3{
font-size:2rem;
}
.full-spare img{
position: relative;
left:3rem;
right: 2rem;
}
.full-sparelast h3{
font-size:2rem;
}
.full-sparelast img{
position: relative;
left:3rem;
right: 2rem;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
html{
font-size:55%;
}
.full-spare-sec{
height:174rem;
}
.full-sparelast h3{
margin: 0rem 0rem 0rem 8rem;
}
.full-spare h3{
margin: 0rem 0rem 0rem 8rem;
}
.full-spare img{
position: relative;
left:2rem;
right: 3rem;
}
.full-sparelast img{
position: relative;
left:2rem;
right: 3rem;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size:55%;
}
.full-spare-sec{
height:75rem;
}
.full-sparelast h3{
margin: 0rem 0rem 0rem 6rem;
}
.full-spare h3{
margin: 0rem 0rem 0rem 6rem;
}
.full-spare img{
position: relative;
left:2rem;
right: 2rem;
}
.full-sparelast img{
position: relative;
left:2rem;
right: 2rem;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
html{
font-size:60%;
}
.full-spare-sec{
height:75rem;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
html{
font-size:62.5%;
}
.full-spare-sec{
height:80rem;
}
}
/* media query for spare part end */
/* css for full-spare parts End */
/* .......................................................................... */
/* css for main call section start */
.main-call-sec{
width: 100vw;
height:34rem;
background-image: linear-gradient(to right,#000000 , #031446);
}
.main-call-sec h1{
margin: 2rem 0rem 2rem 10rem;
font-size: 3rem;
color: #FFFFFF;
word-spacing: .5rem;
letter-spacing: .3rem;
font-family: 'Oswald', sans-serif;
font-weight: 700;
}
.main-call-sec p{
margin: 1.5rem 0rem 2rem 9rem;
font-size: 1.4rem;
color: #FFFFFF;
letter-spacing: .1rem;
font-family: 'Poppins', sans-serif;
font-weight: 300;
}
.main-call-sec a{
text-decoration: none;
position: relative;
top: 1.5rem;
left: 19rem;
bottom: 1rem;
color: #000000;
background-color: #fa983a;
padding: 1rem 1rem 1rem 1rem;
font-size: 1.3rem;
border-radius: 3%;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.main-call-sec a:hover{
background-color: #000099;
color: #FFFFFF;
}
/* media query for call - section start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
html{
font-size: 45%;
}
.main-call-sec{
height:70rem;
}
.main-call-sec h1{
margin: 3rem 0rem 0rem 12rem;
}
.main-call-sec p{
margin: 2.5rem 0rem 2rem 12rem;
}
.main-call-sec a{
margin: 2rem 0rem 0rem 3rem;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
html{
font-size:50%;
}
.main-call-sec{
height:80rem;
}
.main-call-sec h1{
margin: 5rem 0rem 0rem 20rem;
}
.main-call-sec p{
margin: 2.5rem 0rem 2rem 20rem;
}
.main-call-sec a{
margin: 2rem 0rem 0rem 9rem;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size:50%;
}
.main-call-sec{
height:38rem;
}
.main-call-sec h1{
margin: 5rem 0rem 0rem 10rem;
}
.main-call-sec p{
margin: 2.5rem 0rem 2rem 10rem;
}
.main-call-sec a{
margin: 2rem 0rem 0rem 1rem;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
html{
font-size:60%;
}
.main-call-sec{
/* height:80rem; */
height: 40rem;
}
.main-call-sec h1{
margin: 5rem 0rem 0rem 10rem;
}
.main-call-sec p{
margin: 2.5rem 0rem 2rem 10rem;
}
.main-call-sec a{
margin: 2rem 0rem 0rem 1rem;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
html{
font-size:62.5%;
}
.main-call-sec{
/* height:80rem; */
height: 40rem;
}
.main-call-sec h1{
margin: 5rem 0rem 0rem 10rem;
}
.main-call-sec p{
margin: 2.5rem 0rem 2rem 10rem;
}
.main-call-sec a{
margin: 2rem 0rem 0rem 1rem;
}
}
/* media query for call - section end */
/* css for call section end */
/* .................................................................................. */
.footer-sec{
width: 100vw;
height:41rem;
background-image: linear-gradient(to right,#000000 , #031446);
}
.footer-sec img{
margin: 5rem 0rem 4rem -6rem;
}
.footer-sec ul{
margin: -3rem 0rem 0rem 3rem;
list-style-type: none;
}
.footer-sec ul li{
display: inline;
padding: 1rem;
}
.footer-sec ul li a{
text-decoration: none;
}
.footer-sec ul li a i{
font-size: 2rem;
color: #FFFFFF;
}
.footer-sec ul li a i:hover{
color: #3d3c3c;
}
.foot_underline{
display: inline-block;
position: relative;
}
.foot_underline::before{
content: '';
height: 2px;
width:6rem;
background-color: #df8b0e;
position: absolute;
left:0rem;
bottom:-0.5rem ;
}
.footer-link h2{
margin: 2rem 2rem 1rem 12rem;
font-size: 1.5rem;
color: #FFFFFF;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.footer-link a{
position: relative;
top: 1rem;
left: 12rem;
padding:0rem 0rem 8rem 0rem;
text-decoration: none;
color:#FFFFFF ;
font-size: 1.5rem;
font-family: 'Poppins', sans-serif;
font-weight: 400;
}
.footer-link a:hover{
text-decoration: underline;
color: #df8b0e;
}
.footer-addres h2{
margin: 2rem 2rem 1rem 12rem;
font-size: 1.5rem;
color: #FFFFFF;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.footer-addres h4{
margin: 1rem 1rem 1rem 11rem;
padding: 1rem;
font-size: 1.5rem;
color: #FFFFFF;
font-family: 'Poppins', sans-serif;
font-weight: 400;
}
.footer-addres h4 span{
position: relative;
top: 1rem;
font-size: 1.5rem;
font-family: 'Poppins', sans-serif;
font-weight: 400;
}
.footer-addres p{
font-size: 1.3rem;
margin:1rem 1rem 1rem 12rem;
color: #FFFFFF;
font-family: 'Poppins', sans-serif;
font-weight: 400;
}
.footer-addres a{
text-decoration: none;
font-size: 1.3rem;
color:#FFFFFF;
margin:-10rem 0rem 0rem 13rem;
letter-spacing: .1rem;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
.footer-addres a:hover{
color: #df8b0e;
}
hr{
display: block;
margin: 5rem 0rem 0rem 0rem;
border-style:solid;
border-width:.1rem;
color: #FFFFFF;
}
.copyright{
width: 100vw;
height: 5rem;
background-image: linear-gradient(to right,#000000 , #031446);
}
.copyright p{
position: relative;
top: 2rem;
left:25rem;
font-size: 1.3rem;
color: #FFFFFF;
letter-spacing: .2rem;
font-family: 'Poppins', sans-serif;
font-weight: 500;
}
/* media query start */
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
html{
font-size: 45%;
}
.footer-sec{
height:75rem ;
}
.footer-sec img{
margin: 8rem 1rem 4rem -1rem;
}
.footer-sec ul{
margin: -3rem 0rem 0rem 13rem;
}
.copyright p{
position: relative;
top: 1rem;
left:2rem;
}
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
html{
font-size: 50%;
}
.footer-sec{
height:60rem ;
}
.footer-sec img{
margin: -10rem 1rem 4rem -1rem;
}
.footer-sec ul{
margin: -3rem 0rem 0rem 13rem;
}
.copyright p{
position: relative;
top: 2rem;
left:10rem;
}
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
html{
font-size: 55%;
}
.footer-sec{
height:50rem ;
}
.footer-sec img{
margin:-1rem 1rem 4rem -2rem;
}
.footer-sec ul{
margin: -3rem 0rem 0rem 0rem;
}
.footer-addres h4 span{
margin: 0rem 0rem 0rem -10rem;
}
.copyright p{
margin: .5rem 1rem 1rem 10rem;
}
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
html{
font-size: 62.5%;
}
.footer-sec{
height:44rem;
}
.footer-addres h4 span{
margin: 0rem 0rem 0rem -10rem;
}
.copyright p{
margin: .5rem 1rem 1rem 20rem;
}
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
html{
font-size: 62.5%;
}
.footer-sec{
height:43rem;
}
.footer-sec img{
margin: 4rem 1rem 4rem -1rem;
}
.footer-link h2{
margin: 5rem 2rem 1rem 12rem;
}
.footer-addres h2{
margin: 5rem 2rem 1rem 12rem;
}
.footer-addres h4 span{
margin: 0rem 0rem 0rem -1rem;
}
.copyright p{
margin: .5rem 1rem 1rem 20rem;
}
}
/* media query end */
/* footer section End here */