:root {
	--color1: #5551FF;
	--color2: #F9FAFE;
	--color3: #CECDF8;
}

@font-face {
	font-family: Gordita;
	src: url(../font/Gordita/Gordita Black.woff);
	font-display: swap;
}
a{text-decoration: none;}
html,body{
	font-family: 'Inter', sans-serif;
	font-size: 18px;
}
.bgcolor1{
	background: var(--color1)!important;
	background-color: var(--color1)!important;
}

.bgcolor2{
	background: var(--color2)!important;
	background-color: var(--color2)!important;
}
.alert-theme{
	color: #000;
	background-color: var(--color3);
	border-color: var(--color3);
}
header{
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.bannerbg{
	background-image: url(../../website/banner-bg.png);
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.rounded-2rem{border-radius: 2rem;}

.primary-shadow-lg{
	/* box-shadow: 0 1rem 3rem rgba(127, 17, 224, 0.175)!important; */
}

.normal-shadow-lg{
	box-shadow: 0 1rem 3rem rgba(127, 17, 224, 0.175)!important;
}

.btn:hover{
	/* box-shadow: 0 1rem 3rem rgba(127, 17, 224, 0.175)!important; */
}

.bannerbg:before {
    content: '';
    position: absolute;
    z-index: -1; /* push it to the background */
    top: 300px; /* position it off the top background */
    right: 0;
    bottom: 12px; /* position it off the bottom background */
    left: 28%;
	height: 85px;
	width: 85px;
}
.textcolor2{
	color: var(--color2)!important;
}
nav a{
	font-weight: 400;
}

.btn-primary,.btn-primary:hover{
	border: 2px solid var(--color1)!important;
    background-color:  var(--color1)!important;
	color: white;
	box-shadow: none;
}

.btn-outline-primary,.btn-outline-primary:hover,.btn-outline-primary:focus,.btn-outline-primary:active {
    border: 2px solid var(--color1)!important;
    background-color: transparent!important;
	color: var(--color1)!important;
	box-shadow: none;
}
.border-primary{
	border-color: var(--color1)!important;
}

.text-primary{
	color: var(--color1)!important;
}

header{
	background-color: rgba(255,255,255,0.98);
}

.fixedElement {
    /* background: rgba(251, 251, 251, 1); */
	background: white;
    width: inherit;
    max-width: inherit;
    z-index: 100;
    transition: 2sec;
    transition-duration: 0.5s;
	transition: padding 0.5s linear;
	left: 0px;
	right: 0px;
	margin:auto;
}
.nav-tabs{border:none;}
.fixedElement .nav-link {
    display: block;
    color: var(--color1);
    text-decoration: none;
    border:1px solid var(--color1)!important;
    border-radius:30px!important;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}
 .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    background-color: var(--color1)!important;
    border:1px solid var(--color1);
    color: #fff;
}

.pricing_box_first h3 {
	width: 100%;
	float: left;
	font-size: 42px;
	margin: 0;
	padding: 30px 0 0
}

.pricing_box_inner li span {
	text-align: left;
	float: left;
	width: 85%
}

.table-responsive.table_price {
	padding: 35px
}

.pricing .table_price table td {
	color: #767586;
	font-size: 18px;
	text-align: left;
	padding: 30px 0 30px 20px
}

.pricing .table_price table td.broker_fee span {
	font-size: 56px;
	color: #000;
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
	border-color: transparent
}

.price_inner_tabs li a {
	font-size: 18px;
	font-weight: 400;
	border-radius: 8px;
	color: #0a1733;
	margin: 0 10px 0 0;
	background: inherit
}

.price_inner_tabs ul {
	width: auto;
	float: none;
	background: #e8e8f1;
	display: inline-block;
	border-radius: 8px
}

.price_inner_tabs li {
	width: auto;
	float: left;
	margin: 0 12px 0 0
}

.table_price .tab-content {
	border-radius: 5px;
	box-shadow: 0 2px 10px 0 rgba(46, 46, 46, .14);
	-webkit-box-shadow: 0 2px 10px 0 rgba(46, 46, 46, .14);
	width: 100%;
	float: left
}

div.metrics {
	padding: 0;
	padding-left: 20px;
	border-right: 1px solid #ddd
}

.metrics h2 {
	width: 100%;
	font-weight: bold;
	float: left;
	font-size: 20px !important;
	padding: 8px;
	border-bottom: 1px solid #ddd;
	text-align: center;
}

.metrics p strong {
	font-weight: bold;
}

.table_price .metrics p {
	color: #fff;
	font-size: 18px;
	text-align: left !important;
	padding: 30px 20px !important;
	display: inherit !important;
	width: 100% !important;
	float: left !important;
	border-bottom: 1px solid #ddd;
	text-align: center;
}

.broker_fee h2 {
	width: 100%;
	float: left;
	font-weight: bold;
	font-size: 20px !important;
	padding: 8px;
	border-bottom: 1px solid #ddd;
	text-align: center;
}

.publishing_fee h2 {
	width: 100%;
	float: left;
	font-weight: bold;
	font-size: 20px !important;
	padding: 8px;
	border-bottom: 1px solid #ddd;
	text-align: center;
}

.total_cost h2 {
	width: 100%;
	float: left;
	font-weight: bold;
	font-size: 20px !important;
	padding: 8px;
	border-bottom: 1px solid #ddd;
	text-align: center;
}

.broker_fee h2:nth-child(2) {
	font-size: 56px !important;
	color: #fff;
	padding: 30px 0 30px 20px;
	border: none;
	margin: 46px 0 0 !important
}

.table_price .broker_fee li {
	font-size: 16px;
	color: #fff;
	list-style-type: disc;
	margin: 0 0 20px
}

.broker_fee li {
	text-align: left
}

.publishing_fee span {
	width: 100%;
	float: none;
	font-weight: bold;
	display: inline-block;
	font-size: 18px;
	padding: 45px 35px;
	border-bottom: 1px solid #ddd;
	min-height: 138px
}

.publishing_fee span p {
	font-size: 16px;
	font-weight: normal;
}

.table_price .metrics p:last-child {
	border: none
}

.total_cost span {
	width: 100%;
	float: none;
	text-align: center;
	display: inline-block;
	font-size: 20px;
	color: #fff;
	padding: 33px 0px;
	border-bottom: 1px solid #ddd;
	min-height: 138px;
	font-weight: 700;
}

.total_cost span small {
	text-decoration: line-through;
	font-size: 14px;
	color: red;
}

.total_cost span p {
	margin-bottom: 0px;
	font-size: 14px;
	color: green;
	display: inline-block;
}

.total_cost span:last-child {
	border: none
}

.publishing_fee span:last-child {
	border: none
}

.broker_fee.broker_change ul {
	padding: 10px 15px 30px 40px
}

div.broker_fee.broker_change {
	padding: 0;
}

div.publishing_fee {
	padding: 0;
	border-right: 1px solid #ddd;
	border-left: 1px solid #ddd;
}

.accordion-button:not(.collapsed),.accordion-button:focus{
	border: none;
	color: var(--color1);
	font-weight:bold;
	background:transparent;
	border-bottom:none;
	box-shadow: none;
}

.footer-social {
	display:block;
	padding: 5px 10px;
	text-decoration: none;
	color: #10356C;
}

.footer-social:hover {
	display:block;
	color: var(--color1);
	padding: 5px 10px;
}
.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('https://rankz.co/img/loading3.gif') 50% 50% no-repeat rgb(249, 249, 249, 0.5);
}

.ozstroke{
	border-radius: 6px;
    border: 1px solid rgb(204, 204, 204);
    z-index: 3;
    filter: drop-shadow(rgba(0, 0, 0, 0.067) 0px 1px 6px);
    grid-area: 2 / 1 / 3 / 2;
}


.nav-pills .nav-link{
	border: 2px solid var(--color1);
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
	background: var(--color1);
	border: 2px solid var(--color1);
}
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link.active,.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{
	color: var(--color1);
	border-bottom: 1px solid var(--color1);
}