@charset "UTF-8";
html {
-webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
width: 100%;
height: 100%;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
input[type="submit"] {
-webkit-appearance: none;
-webkit-border-radius: 0;
border-radius: 0;
}
label{
margin-bottom: 0px;
}
*, *:after, *:before {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
margin: 0;
padding: 0;
font-family: 'Montserrat', sans-serif;
-webkit-font-smoothing: antialiased;
width: 100%;
min-height: 100%;
color: #727384;
background: #ffffff;
}
a {
outline: none;
text-decoration: none;
color: #555;
}
a:hover, a:focus, input:focus{
outline: none !important;
text-decoration: none;
}
button:focus{
outline: 0px !important;
border:0px !important;
}
button::-moz-focus-inner {
border: 0;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-weight: bold;
color: #434343;
}
img {
border: 0;
vertical-align: top;
max-width: 100%;
height: auto;
}
ul, ol {
margin: 0;
padding: 0;
list-style: none;
}
p {
margin: 0 0 15px 0;
padding: 0;
}
.align-row{
align-items: center;
}
.font-12{
font-size: 12px;
}
.radius-6{
border-radius: 6px;
}
.bg-pink{
background-color: #f57206 !important;
}
.color-gray{
background: #7c7c7c;
}
.bg-gray{
background: #eee;
}
.bg-black{
background-color: #063259 !important;
}
.bg-green{
background-color: #0f9946;
}
.slick-slide{
outline: none !important;
}
.slick-slider{
user-select: text;
}
.color-pink{
color: #f57206;
}
.color-black{
color: #063259;
}
header .btn.outline-btn{
background: #fff !important;
}
.btn.outline-btn{
color: #f57206 !important;
border:0px !important;
-webkit-transition-duration: 0.2s;
-webkit-transition-timing-function: linear;
box-shadow:0px 0 0 #f57206 inset;
background: #fff !important;
}
.form-btn{
-webkit-transition-duration: 0.2s;
-webkit-transition-timing-function: linear;
box-shadow:0px 0 0 #f57206 inset;
background: #063259 !important;
border-radius: 40px !important;
}
.form-btn:hover{
box-shadow:0 0 0 50px #f57206 inset;
}
.btn.outline-btn:hover{
background: #fff !important;
color: #fff !important;
border:0px !important;
box-shadow:0 0 0 50px #f57206 inset;
}
.btn{
position: relative;
display: inline-block;
color: #fff;
font-size: 15px;
min-width: 220px;
text-align: center;
line-height: 18px;
font-weight: bold;
padding:10px 15px;
text-transform: uppercase;
-webkit-transition-duration: 0.2s;
-webkit-transition-timing-function: linear;
box-shadow:0px 0 0 #fff inset;
border: 0px !important;
}
.btn i{
margin-right: 5px;
}
/*==============================================================
CTA style end
==============================================================*/
/*==============================================================
banner Style start
==============================================================*/
header .btn{
width: auto !important;
min-width: auto !important;
border-radius: 30px !important;
font-size: 12px !important;
padding: 6px 10px !important;
}
header .btn.outline-btn:hover, header .btn.bg-black:hover{
box-shadow:0 0 0 50px #fff inset;
color: #063259 !important;
}
header .btn.bg-black{
border-color: #212121;
}
.banner-wrap{
height: auto;
position: relative;
overflow: hidden;
}
.banner-slide .container{
padding-top: 80px;
}
.shape{
position: absolute;
bottom: -2px;
right: -2px;
width: 100%;
}
.shape svg{
width: 100%;
}
.banner-slider{
height: 100%;
}
.banner-slider > .banner-slide{
display: none;
}
.banner-slider > .banner-slide:first-child{
display: block;
}
.slick-initialized .banner-slide{
position: relative;
height:600px;
padding-bottom: 300px;
display:-webkit-flex !important;
display:flex !important;
-webkit-align-items:center;
align-items:center;
}
.banner-slider .slick-arrow{
position: absolute;
right: 25px;
bottom: 50px;
font-size: 0;
background: #ffffff;
border: 0;
width: 50px;
height: 50px;
z-index: 12;
cursor: pointer;
border-radius: 100%;
box-shadow: 0 0 15px rgba(0,0,0,0.12);
}
.banner-slider .slick-arrow:before{
font-family: "Fontawesome";
font-size: 30px;
text-align: center;
line-height: 50px;
color: rgba(0,33,71,1);
}
.banner-slider .slick-arrow.slick-prev{
right: 95px;
}
.banner-slider .slick-arrow.slick-prev:before{
content: "\f177";
}
.banner-slider .slick-arrow.slick-next{
right: 25px;
}
.banner-slider .slick-arrow.slick-next:before{
content: "\f178";
}
.hero-image{
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-size: cover;
background-position: center center;
}
.banner-wrap .container{
position: relative;
z-index: 12;
}
.hero-overlay{
background: #081c2d;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: .5;
}
.hero-content{
color: #ffffff;
}
.hero-content p{
font-size: 20px;
line-height: 32px;
max-width: 600px;
color: rgba(255,255,255,0.9);
letter-spacing: 0.010em;
}
.blog-detail-banner .hero-content{
max-width: 900px;
}
.hero-content h3{
font-size: 16px;
color: rgba(255,255,255,.6);
text-transform: uppercase;
letter-spacing: 3px;
position: relative;
margin-top: 0;
margin-bottom: 12px;
margin-left: 6px;
}
.hero-content h1{
line-height: 1.333;
margin-bottom: 18px;
max-width: 760px;
}
.hero-content .cta-btn{
padding-top: 30px;
}
.hero-content .cta-btn .cta-link.cta-outline-white:hover{
background: #ffffff;
color: rgba(0,33,71,1);
}
.logo img{
height: 70px;
}
.navigation-bar .nav-link{
color: #063259 !important;
padding: 10px 15px !important;
font-weight: 500;
transition: all 0.5s;
}
.navigation-bar .nav-link:hover{
color: #f57206 !important;
transition: all 0.5s;
}
.color-div{
height: 80px;
width:80px;
border-radius: 100%;
margin: auto;
transition: all 0.5s;
display: flex;
align-items: center;
justify-content: center;
}
.color-div i{
font-size: 30px;
color: #fff;
}
.outer-icon-div img{
position: absolute;
padding: 25px 35px;
}
.outer-icon-div{
height: 110px;
width: 110px;
margin: auto;
border: 2px dashed #e3e3e3;
background: white;
padding-top: 14px;
border-radius: 100%;
}
.benifit-content h5{
font-weight: 600;
color: #212121;
font-size: 16px;
}
.benifit-content a{
font-weight: 600;
color: #90c143;
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
}
.benifit-content i{
font-size: 22px;
}
.single-benifit:hover .color-div{
background: #adb1b6;
transition: all 0.5s;
}
.single-benifit:hover h4{
color: #adb1b6;
}
.single-benifit{
width: 18% !important;
position: relative;
}
.benifits-row{
display: flex;
justify-content: space-between;
}
.services-container{
padding: 70px 0px;
}
.single-benifit::after{
position: absolute;
content: "";
height: 2px;
width: 50%;
border-top: 2px dashed #e3e3e3;
left: 82%;
top: 56px;
}
.single-benifit:nth-child(5):after{
display: none;
}
.section-heading h3:after{
position: absolute;
content: "";
height: 3px;
width: 70px;
background-color:#f57206;
margin-top: 15px;
margin-left: 5px;
}
.counter h1{
font-size: 60px;
}
.single-counter:after{
position: absolute;
content: "";
height: 60px;
width: 1px;
background-color: #fff;
margin-left: 47%;
top: 30px;
}
.single-counter{
position: relative;
}
.single-counter h6{
font-weight: 500;
}
.single-counter:nth-child(4):after{
display: none;
}
.accounts-section{
padding: 70px 0px;
}
.inner-row .icon{
width: 120px;
background-color: #063259;
display: flex;
align-items: center;
justify-content: center;
}
.inner-row .icon i{
color: #fff;
font-size: 50px;
}
.inner-row .content{
width: calc(100% - 120px);
padding: 20px;
}
.inner-row .content p{
margin-bottom: 0px;
}
.inner-row{
border: 1px solid #063259;
margin: 0px;
border-radius: 6px;
transition: all 0.5s;
}
.inner-row:hover{
transform: translateX(15px);
transition: all 0.5s;
}
.counter-section{
background-image: url("../images/counter-bg.jpg");
background-size: cover;
background-position: center;
position: relative;
}
.counter-section::after{
position: absolute;
content: "";
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0,0.8);
}
.counter{
position: relative;
z-index: 11111;
}
.content p{
font-size: 14px;
}
.content h4{
font-size: 16px;
color: #f57206;
}
.trading-section{
padding: 70px 0px;
}
.single-account li{
list-style: none;
font-size: 14px;
line-height: 25px;
}
.single-account{
border-radius: 7px;
}
.single-account .card-body{
padding: 40px 30px;
border-radius: 7px;
}
.center-card li{
color: #fff !important;
}
.center-card li i{
color: #063259;
}
.center-card h5{
color: #fff;
}
.social-icons li{
list-style: none;
display: inline-block;
}
.social-icons li a{
color: #fff;
transition: all 0.5s;
}
.social-icons{
justify-content: space-around;
display: flex;
}
.social-icons li a:hover{
color: #f57206;
transition: all 0.5s;
}
.footer-links li{
display: block !important;
font-size: 14px;
font-weight: 500;
line-height: 30px;
}
.footer-links{
display: block !important;
}
.footer-logo{
height: 100px;
}
.footer-content p{
font-size: 14px;
}
.footer-content{
box-shadow: inset 0 -10px 10px -10px lightgray;
}
.navbar-light .navbar-toggler-icon {
background-image:none;
background:#f57206;
height: 37px;
width: 35px;
border-radius: 10px;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.navbar-light .navbar-toggler{
border:0px;
color: transparent;
}
/*-----start form styling=---------*/
.field-icon {
float: right;
margin-top: -25px;
position: relative;
z-index: 2;
margin-right: 8px;
}
.menu-section{
box-shadow: 0px 6px 10px #e9e9e9;
}
.form-column{
box-shadow: 0px 0px 10px #e9e9e9;
}
.login-form input:focus{
outline: none;
box-shadow: 0px 0px 0px transparent;
border-color: #063259;
}
.login-form input{
border-radius: 0px;
border-top:0px;
border-left: 0px;
border-right: 0px;
border-bottom: 2px solid #f57206;
}
.login-form label{
font-weight: 500;
color: #063259;
}
.left-col{
border-right: 2px solid #f57206;
}
.content-row{
display: flex;
align-items: center;
}
.content-row .number{
width: 70px;
}
.standradContent .content-row .number{
width: 20px;
}
.miniContent .content-row .number{
width: 20px;
}
.content-row .number h1{
font-size: 44px;
}
.content-row .text{
width: calc(100% - 75px);
}
.tags li{
background: lightgray;
border-radius: 30px;
min-width: auto !important;
padding: 6px 10px 4px 10px;
font-size: 10px;
font-weight: lighter;
color: #000 !important;
display: inline-block;
}
.services-row{
align-items: center;
}
.service-col{
padding: 40px 0px;
border-right: 1px solid lightgray;
border-bottom: 1px solid lightgray;
}
.service-col:nth-child(3), .service-col:nth-child(6){
border-right: 0px;
}
.service-col img{
height: 60px;
margin-bottom: 15px;
}
.service-col:nth-child(4), .service-col:nth-child(5), .service-col:nth-child(6){
border-bottom: 0px;
}
.video-col iframe{
height: 400px;
width: 100%;
}
.insurance-img img{
box-shadow: 20px 20px 0 0 #4184dd;
}
.trade-section{
background-image: url(../images/trade.png);
background-repeat: no-repeat;
background-position: right;
position: relative;
background-size: cover;
}
.trade-section .container{
position: relative;
z-index: 1111;
}
.trade-icons li{
display: inline-block;
list-style: none;
}
.trade-icons li i{
font-size: 50px;
color: #fff;
}
.platform-lists li img{
height: 60px;
width: 60px;
}
.platform-lists li a.active{
background: transparent !important;
border:2px solid #f57206;
transform: scale(1.3);
}
.platform-lists li a{
margin-right: 20px;
}
.laptop{
background-image: url(../images/laptop-bg.png);
height: 283px;
width: auto;
width: 494px;
margin: 50px auto 0px auto;
}
.laptop img{
margin-top: 22px;
margin-left: 10px;
}
.single-testimonial img{
height: 140px;
width: 140px;
border-radius: 50%;
margin: auto;
}
.comment{
font-style: italic;
font-weight:bold;
height: 150px;
}
.post-heading:hover{
color: #f57206 ;
transition: all 0.5s;
}
.post-heading{
transition: all 0.5s;
}
.footer-col p{
display: flex;
font-size: 12px;
color: #fff;
font-weight: 500;
}
.footer-col i{
margin-top: 3px;
margin-right: 10px;
color: #f57206 ;
font-size: 16px;
}
.social-icons i{
height: 35px;
width: 35px;
border: 2px solid;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.5s;
}
.social-icons i:hover{
background: #f57206;
color: #fff;
border-color: #f57206;
transition: all 0.5s;
}
footer, .footer-logo-div{
background-image: url("../images/footer-bg.png");
background-size: cover;
background-position: center;
}
.footer-logo-div{
padding: 30px 15px;
background: #05223c;
margin-top: -110px;
position: absolute;
border-radius: 15px;
}
.footer-logo-div img{
height: 70px;
}
.footer-logo-div p{
font-size: 12px;
color: #fff;
padding-top: 15px;
}
.payment-li{
display: flex;
margin-top: 140px;
}
.payment-li li{
margin-right: 10px;
}
.trade-section::after{
background: rgba(6,50,89,0.8);
position: absolute;
content: "";
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.banner-section{
background-image: url("../images/counter-bg.jpg");
background-size: cover;
background-position: center;
padding: 100px 0px !important;
position: relative;
}
.banner-section::after{
position: absolute;
content: "";
top: 0;
bottom: 0;
right: 0;
left: 0;
background: rgba(0,0,0,0.7);
}
.banner-section .container{
position: relative;
z-index: 1111;
}
.banner-section .breadcrumb li a{
color: #fff;
font-weight: bold;
}
.banner-section .breadcrumb li{
font-weight: bold;
}
.banner-section .breadcrumb-item.active{
color: #f57206;
}
.banner-section .breadcrumb-item+.breadcrumb-item::before{
color: #fff;
}
.contact-section::before{
position: absolute;
content: "";
background: url("../images/contact-bg.png");
top: 0;
bottom: 0;
width: 50%;
}
.contact-section{
position: relative;
}
.form-part{
z-index: 11111;
border: 1px solid lightgray;
border-radius: 8px;
}
.contact-section::after{
position: absolute;
content: "";
background: #063259;
width: 50%;
top: 0;
bottom: 0;
left: 50%;
}
.form-part input, .form-part textarea{
border-top:0px;
border-left: 0px;
border-right: 0px;
border-radius: 0px;
margin-bottom: 20px;
}
.form-part input:focus, .form-part textarea:focus{
box-shadow: 0px 0px 0px transparent;
border-color: #f57206;
}
.price-lists li{
list-style: none;
border-bottom: 1px solid lightgray;
padding: 15px 0px;
}
.price-lists li:nth-child(3){
border-bottom: 1px solid lightgray;
}
.price-btn{
min-width: auto !important;
margin-top: -26px;
}
.calculator-form label{
font-size: 14px;
margin-bottom: 10px;
}
.calculator-form input:focus, .calculator-form select:focus{
border-color: #f57206;
box-shadow: 0px 0px 0px transparent;
}
.account-row{
display: flex;
}
.account-number{
width: 80px;
}
.account-number h2{
height: 50px;
width: 50px;
border-radius: 10px;
background: #f57206;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
.account-info{
width: calc(100% - 80px)
}
@media only screen and (max-width: 1200px){
.container{
width: 95% !important;
max-width: 95% !important;
}
}
@media only screen and (max-width: 992px){
.footer-logo-div{
margin-top: 0px;
position: relative;
}
.payment-li{
margin-top: 20px;
}
.single-counter{
margin-bottom: 30px;
}
.single-counter:nth-child(2)::after{
display: none;
}
.single-account .card-body {
padding: 20px 10px;
}
.navbar-light .navbar-nav .nav-link{
text-align: center;
}
.left-col {
border-right: 0px;
border-bottom: 2px solid #f57206;
padding-bottom: 40px;
}
.right-col{
padding-top: 40px;
}
.left-col{
padding-right: 15px !important;
}
.reverse-col{
flex-direction: column-reverse;
}
}
@media only screen and (max-width: 768px){
.inner-row .content {
width: calc(100% - 70px);
padding: 10px;
}
.inner-row .icon {
width: 70px;
}
.inner-row .icon i {
font-size: 30px;
}
.single-benifit::after{
left: 92%;
}
}
@media only screen and (max-width: 767px){
.single-account .card-body {
padding: 30px;
}
.single-benifit {
width: 26% !important;
}
.benifits-row{
justify-content: space-around;
}
.single-benifit::after{
width: 67%;
left: 82%;
}
.single-benifit:nth-child(3)::after{
display: none;
}
.single-benifit:nth-child(4)::after{
width: 120%;
left: 90%;
}
.service-col:nth-child(2), .service-col:nth-child(4){
border-right: 0px;
}
.service-col:nth-child(3){
border-right: 1px solid lightgray;
}
.service-col:nth-child(4){
border-bottom: 1px solid lightgray
}
}
@media only screen and (max-width: 576px){
h3{
font-size: 18px ;
}
.section-heading h3:after {
margin-top: 27px;
left: 40%;
}
p, li{
font-size: 12px !important;
}
.social-icons li a i{
font-size: 16px !important;
}
.section-heading p{
margin-top: 15px;
}
.single-counter::after{
display: none;
}
.single-counter{
border-bottom:1px solid #fff;
padding-bottom: 30px;
}
.single-counter:nth-child(4){
border-bottom: 0px;
padding-bottom: 0px;
}
.color-div{
height: 50px;
width: 50px;
}
.outer-icon-div{
height: 80px;
width: 80px;
}
.color-div i {
font-size: 20px;
}
.single-benifit::after {
width: 44%;
left: 92%;
top: 41px;
}
.benifit-content h5 {
font-weight: normal;
font-size: 11px;
}
.hero-content h1{
font-size: 22px;
margin-top: 30px;
}
.hero-content p {
font-size: 16px;
line-height: 22px;
}
header{
padding-right: 0px !important;
padding-left: 0px !important;
}
header .btn{
font-size: 10px !important;
}
.header-col, footer{
padding-right: 0px !important;
padding-left: 0px !important;
}
.btn{
min-width: auto !important;
padding: 7px !important;
font-size: 12px !important;
}
.slick-list{
height: 500px !important;
}
.logo img {
height: 50px;
}
.navbar{
padding-right: 0px !important;
padding-left: 0px !important;
}
.form-btn{
min-width: 100% !important;
width: 100% !important;
}
.form-column .section-heading h3::after{
left: 0 !important;
margin-left: 15px;
margin-top: 23px;
}
label{
font-size: 14px;
}
.tags li{
margin-bottom: 10px;
}
.service-col img{
height: 40px;
}
.service-col h6{
font-size: 14px;
}
.laptop{
background-image: none;
height: auto;
width: auto;
margin-top: 20px;
}
.laptop img{
margin-left: 0px;
}
.platform-lists li img{
height: 30px;
}
.platform-lists li a{
padding:10px 0px !important;
margin-right: 5px;
}
.container{
width: 100% !important;
max-width: 100% !important;
}
.banner-section{
padding: 50px 0px !important;
}
}
/*------start style for out see section-----*/
.single-about-col:hover h3{
color: #f57206;
transition: all 0.5s;
}
.single-about-col h3{
transition: all 0.5s;
}