/*
  Theme Name: Squad - Marketing Agency Multipurpose Html5 template
  Version: 1.0
*/

/* CSS Index
-----------------------------------
1. Theme default css
2. header
3. slider
4. service
5. about
6. video
7. feature
8. choose us
9. portfolio
10. team
11. counter
12. contact us
13. blog and news 
14. footer
15. testimonial 
16. pricing
17. fqa
18. 404 page
19. map
*/



/* 1. Theme default css */
@import url('css2.css');
body {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-style: normal;
}
.img {
	max-width: 100%;
	transition: all 0.3s ease-out 0s;
}
.fix {
	overflow: hidden
}
a,
.button {
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
}
a:focus,
.button:focus {
	text-decoration: none;
	outline: none;
}
a:focus,
a:hover,
.portfolio-cat a:hover,
.footer -menu li a:hover {
	color: #2B96CC;
	text-decoration: none;
}
a,
button {
	color: #1696e7;
	outline: medium none;
	text-decoration: none;
}
button:focus,input:focus,input:focus,textarea,textarea:focus{outline: 0}
.uppercase {
	text-transform: uppercase;
}
.capitalize {
	text-transform: capitalize;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Roboto', sans-serif;
	font-weight: normal;
	color: #313131;
	margin-top: 0px;
	font-style: normal;
	font-weight: 400;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: inherit;
}
h1 {
	font-size: 40px;
	font-weight: 500;
}
h2 {
	font-size: 35px;
}
h3 {
	font-size: 28px;
}
h4 {
	font-size: 22px;
}
h5 {
	font-size: 18px;
}
h6 {
	font-size: 16px;
}
ul {
	margin: 0px;
	padding: 0px;
}
li {
	list-style: none
}
p {
	font-size: 14px;
	font-weight: normal;
	line-height: 24px;
	color: #7e7e7e;
	margin-bottom: 15px;
}
hr {
	border-bottom: 1px solid #eceff8;
	border-top: 0 none;
	margin: 30px 0;
	padding: 0;
}
label {
	color: #7e7e7e;
	cursor: pointer;
	font-size: 14px;
	font-weight: 400;
}
*::-moz-selection {
	background: #d6b161;
	color: #fff;
	text-shadow: none;
}
::-moz-selection {
	background: #444;
	color: #fff;
	text-shadow: none;
}
::selection {
	background: #444;
	color: #000;
	text-shadow: none;
}
*::-moz-placeholder {
	color: #555555;
	font-size: 14px;
	opacity: 1;
}
*::placeholder {
	color: #555555;
	font-size: 14px;
	opacity: 1;
}
.theme-btn a {
    position: relative;
    font-size: 17px;
    color: #000;
    border: 1px solid #FF3C00;
    padding: 12px 24px;
    margin-top: 22px;
    display: inline-block;
    text-decoration: none;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    z-index: 1;
}
.theme-btn a:hover{
	color: #fff;
}
.theme-btn a::before {
	position: absolute;
	width: 0;
	height: 100%;
	left: 0;
	top: 0;
	background: #FF3C00;
	content: "";
	border: 1px solid #FF3C00;
	border-radius: 8px;
	opacity: 0;
	visibility: hidden;
	transition: .5s;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	-o-transition: .5s;
	z-index: -1;
}
.theme-btn a:hover::before{
	width: 100%;
	opacity: 1;
	visibility: visible;
}
.theme-btn a i{
	font-size: 13px;
}

/* page breadcrumb */
.page-breadcrumb-bg {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.page-breadcrumb-bg::before {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0 ,0, 0, 0.7);
    content: "";
}
.page-breadcrumb-title h2 {
    font-size: 60px;
    font-weight: 600;
    color: #fff;
    padding-bottom: 15px;
}
.page-breadcrumb{
    position: relative;
    z-index: 1;
}
.page-breadcrumb nav ol li a{
    font-size: 22px;
    color: #fff;
}
.page-breadcrumb nav ol li {
    font-size: 22px;
    color: #FF3C00 !important;
}
.page-breadcrumb i {
    position: absolute;
    bottom: -95px;
    left: 40%;
    color: #fff;
    font-size: 24px;
    animation: 3s linear infinite rotated;
    -webkit-animation: 3s linear infinite rotated;
}
@keyframes rotated {
    100%{
        transform: rotate(-180deg);
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        -o-transform: rotate(-180deg);
}
}

/* 2. header */
.header-top-area {
    position: relative;
    height: 50px;
    width: 100%;
    background: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
}
.header-top-area::before {
    position: absolute;
    width: 60%;
    height: 100%;
    top: 0;
    left: -25px;
    background: #FF3C00;
    content: "";
    z-index: -1;
    transform: skew(-25deg);
    -webkit-transform: skew(-25deg);
    -moz-transform: skew(-25deg);
    -ms-transform: skew(-25deg);
    -o-transform: skew(-25deg);
}
.header-top-icon-left {
    display: inline-block;
}
.header-top-icon-left a {
    font-size: 15px;
    color: #fff;
    display: inline-block;
    margin-right: 15px;
	text-decoration: none;
}
.header-top-icon-left a i {
    margin-right: 6px;
}
.header-top-social-right{
	text-align: right;
}
.header-top-social-right a {
	font-size: 15px;
	color: #fff;
	margin-left: 8px;
	transition: .5s;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	-o-transition: .5s;
}
.header-top-social-right a:hover{
	color: #FF3C00;
}
.header-bottom-area {
    width: 100%;
    height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.sticky {
    position: fixed;
    height: 84px;
    left: 0;
    margin: 0;
    padding: 28px 0;
    top: 0;
    width: 100%;
    box-shadow: 0 0 60px 0 rgba(0, 0, 0, .07);
    z-index: 9999;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    background: rgb(44 42 41);
    animation: slide-down 0.9s;
    -webkit-animation: slide-down 0.9s;
}
@keyframes slide-down {
    0% {
        opacity: 0;
        transform: translateY(-100%);
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
	} 
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
	} 
}
.header-bottom-area .logo img:nth-child(2){
	display: none;
}
.header-bottom-area.sticky .logo img:nth-child(1){
	display: none;
}
.header-bottom-area.sticky .logo img:nth-child(2){
	display: block;
}
.main-menu nav ul {
    text-align: right;
    list-style-type: none;
    margin-top: 10px;
}
.main-menu nav ul li {
	position: relative;
    display: inline-block;
    margin-left: 40px;
    padding: 0;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.main-menu nav ul li a {
    color: #000;
    font-size: 15px;
    font-weight: 400;
    text-decoration: none;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.header-bottom-area.sticky .main-menu nav ul li > a {
	color: #fff;
}
.header-bottom-area.sticky .main-menu nav ul li > a::before {
    position: absolute;
    width: 0;
    left: 100%;
    height: 2px;
    background: #fff;
    bottom: -3px;
    left: 0;
    content: "";
    opacity: 0;
    visibility: hidden;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.header-bottom-area.sticky .main-menu nav ul li > a:hover::before{
    width: 100%;
    opacity: 1;
    visibility: visible;
}
.main-menu nav ul li a i {
    font-size: 11px;
}
.main-menu nav ul li a:hover{
	color: #FF3C00;
}
/* 2nd menu */
.main-menu nav ul li ul {
    position: absolute;
    width: 238px;
    top: 68%;
    background: #ffffff;
    -webkit-box-shadow: rgba(17,17,26,.1) 0 0 16px;
    box-shadow: rgba(17,17,26,.1) 0 0 16px;
    padding: 12px 0;
    text-align: left;
    visibility: hidden;
    opacity: 0;
    transition: .8s;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    -ms-transition: .8s;
    -o-transition: .8s;
    z-index: 9;
}
.main-menu nav ul li:hover ul{
	top: 105%;
	visibility: visible;
	opacity: 1;
}
.main-menu nav ul li ul li {
	display: block;
    padding-top: 5px;
    padding-bottom: 5px;
}
.main-menu nav ul li ul li a {
    line-height: 24px;
}
.header-bottom-area.sticky .main-menu nav ul li ul li a{
	color: #000;
}
.header-bottom-area.sticky .main-menu nav ul li ul li a:hover{
	color: #FF3C00;
	padding-left: 5px;
}
/* 3. slider */
.slider-content h2 {
    font-size: 20px;
    color: #000;
    padding: 8px 0;
    border-top: 2px solid #FF3C00;
    display: inline-block;
    text-transform: uppercase;
}
.slider-content h1 {
    font-size: 60px;
    padding-top: 30px;
    font-weight: 700;
    line-height: 70px;
    padding-bottom: 15px;
}
.slider-content p {
    font-size: 18px;
    line-height: 36px;
    max-width: 590px;
}
.slider-image {
    width: 430px;
    height: 430px;
    float: right;
}
.slider-image img{
	width: 100%;
	height: 100%;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
}
.slider-shape-one {
    position: absolute;
    left: 11%;
    top: 34%;
}
.rotate{
	animation: rotate 10s linear infinite;
	-webkit-animation: rotate 10s linear infinite;
}
@keyframes rotate{
	0%{ 
	  transform:rotate(0deg);
	 }
	25%{ 
	  transform:rotate(90deg);
	 }
	50%{ 
	  transform:rotate(180deg);
	 }
	100%{
	   transform:rotate(360deg);
	}
  }

/* 4. service */
  .service-area {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.sevice-sub-title h3 {
    font-size: 18px;
    color: #FF3C00;
    text-transform: uppercase;
}
.sevice-sub-title h1 {
    font-size: 36px;
    font-weight: 600;
    padding: 10px 0;
    color: #fff;
}
.service-text p {
    font-size: 14px;
    color: #fff;
    line-height: 36px;
    padding-top: 10px;
}
.service-content {
    position: relative;
    padding: 30px;
    box-shadow: 0px 0px 24px 0px rgba(92, 60, 56, 1);
	z-index: 1;
	overflow: hidden;
}
.service-content::before{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 100%;
	left: 0;
	/* background: #FF3C00; */
	background: linear-gradient(135deg, rgba(23, 23, 23, 0) 0%, rgba(200, 23, 23, 0.65) 0%, #FF3C00 130%);
	content: "";
	z-index: -1;
	opacity: 0;
	visibility: hidden;
	transition: all 300ms linear;
	-webkit-transition: all 300ms linear;
	-moz-transition: all 300ms linear;
	-ms-transition: all 300ms linear;
	-o-transition: all 300ms linear;
}
.service-content:hover::before{
	top: 0;
	transform-origin: bottom;
	opacity: 1;
	visibility: visible;
}
.service-content::after {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: linear-gradient(135deg, rgba(23, 23, 23, 0) 0%, rgba(23, 23, 23, 0.65) 63%, #FF3C00 130%);
    content: "";
    z-index: -1;
}
.service-content:hover::after{
	visibility: hidden;
	opacity: 0;
}
.service-content span {
    position: absolute;
    color: #fff;
    font-size: 14px;
    background: #9f9898;
    padding: 4px;
    right: 30px;
    top: 77px;
}
.service-content h5 {
    position: relative;
    font-size: 18px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    text-transform: uppercase;
    line-height: 24px;
}
.service-content h5::before {
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    bottom: 0;
    background: #9f9898;
    content: "";
}
.service-content h5 a{
	color: #fff;
}
.service-icon {
    color: #fff;
    font-size: 50px;
    padding-bottom: 18px;
}
.service-content p {
    text-align: justify;
    color: #fff;
}
.service-details-img {
    height: 570px;
}
.service-details-img img {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    padding-bottom: 40px;
}
.service-details-content h1 {
    font-size: 38px;
    font-weight: 700;
    padding: 10px 0;
}
.service-details-content p {
    font-size: 17px;
    line-height: 34px;
}
.service-details-process h2 {
    font-size: 34px;
    color: #000;
    font-weight: 500;
    padding: 24px 0;
}
.single-process {
    background: #F4F4FD;
    margin: 0 7px;
    padding: 15px 5px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}
.single-process .process-icon {
    position: absolute;
    width: 60px;
    height: 60px;
    line-height: 60px;
    background: #fff;
    text-align: center;
    font-size: 28px;
    margin: 0 10px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.single-process ul.details-process-content {
    margin-left: 86px;
}
.single-process ul li {
    font-size: 22px;
    font-weight: 500;
    padding-bottom: 12px;
}
.single-process ul p {
    font-size: 16px;
}
.service-details-sidebar {
    background: #fff;
    box-shadow: 0 0 45px rgba(0,0,0,.08);
    padding: 30px 40px;
}
.service-details-sidebar h3 {
    font-size: 25px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 4px;
    margin-bottom: 24px;
}
.service-details-sidebar ul li a {
    position: relative;
    font-size: 16px;
    text-transform: capitalize;
    background: #F4F4FD;
    padding: 14px 31px;
    display: block;
    color: #000;
    border-radius: 30px;
    margin-top: 20px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.service-details-sidebar ul li a:hover{
    color: #FF3C00;
}
.service-details-sidebar ul li a i {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 15px;
    color: #000;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    border-radius: 7px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.service-details-sidebar ul li a:hover i{
    background: #FF3C00;
    color: #fff;
}
.service-details-contact {
    background: #fff;
    box-shadow: 0 0 45px rgba(0,0,0,.08);
    padding: 48px 40px;
}
.service-details-contact h2 {
	font-size: 44px;
	font-weight: 600;
	padding: 15px 0;
	text-transform: capitalize;
}
.service-details-contact i {
    width: 60px;
    height: 60px;
    line-height: 60px;
    background: #F4F4FD;
    font-size: 25px;
    color: #000;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
}
.service-details-contact i:hover{
    color: #fff;
    background: #FF3C00;
    cursor: pointer;
}
.service-details-contact span {
    font-size: 21px;
    display: block;
    padding-top: 22px;
}
.service-details-contact h6 {
    font-size: 18px;
    padding-top: 25px;
}

/* 5. about */
.about-content h6 {
    font-size: 18px;
    color: #FF3C00;
}
.about-content h1 {
    font-size: 46px;
    font-weight: 700;
    color: #000;
    padding: 17px 0;
}
.about-content p {
    font-size: 16px;
    line-height: 32px;
    text-align: justify;
    padding-bottom: 27px;
}
.about-content ul li {
    position: relative;
    width: 50%;
    padding-left: 30px;
    margin: 8px 0;
}
.about-content ul li::before {
    position: absolute;
    left: 0;
    top: 0;
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    content: "\f00c";
    background: #FF3C00;
    padding: 1px 4px;
    font-size: 11px;
    color: #fff;
    border-radius: 50%;
    margin: 4px 0;
}
.about-image {
    position: relative;
    margin-left: 85px;
    text-align: right;
}
.about-image img{
	width: 100%;
	height: 100%;
}
.about-image .image-one {
    width: 70%;
    margin-top: 112px;
    height: 270px;
}
.about-image .image-two {
    position: absolute;
    left: 0;
    top: 75%;
    width: 75%;
    height: 64%;
    border: 8px solid #fff;
}
.about-pattern-icon img {
	position: relative;
	left: 126px;
	top: -196px;
	z-index: -1;
	animation: bounce-x 10s infinite linear;
	-webkit-animation: bounce-x 10s infinite linear;
}
@keyframes bounce-x {
	0% {
	  -webkit-transform: translateX(0);
			  transform: translateX(0);
	}
	50% {
	  -webkit-transform: translateX(30px);
			  transform: translateX(30px);
	}
	100% {
	  -webkit-transform: translateX(0);
			  transform: translateX(0);
	}
}


/* 6. video */
.video-content {
    position: relative;
    padding: 190px 0 200px;
}
.video-box {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border: 1px solid #FF3C00;
    padding: 18px;
}
.video-content::before {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #000;
    content: "";
    opacity: .6;
}
.video-content a {
    font-size: 26px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    color: #fff;
    background: #FF3C00;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    z-index: 1;
}
.ripple {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 70px;
    width: 70px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
    -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
    -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
    -webkit-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
}
@keyframes ripple {
	70% {
	  -webkit-box-shadow: 0 0 0 70px rgba(255, 255, 255, 0);
	  box-shadow: 0 0 0 70px rgba(255, 255, 255, 0);
	}
	100% {
	  -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
	  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
	}
}

.ripple:before {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 70px;
    width: 70px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    -webkit-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
    content: "";
    position: absolute;
}
.ripple:after {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 70px;
    width: 70px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
    -webkit-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
    content: "";
    position: absolute;
}
.video-content h2 {
    font-size: 60px;
    position: relative;
    top: 120px;
    padding: 168px 0;
    color: #fff;
}
/* 7. feature */
.feature-area {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: -224px;
}
.feature-content {
    position: relative;
    z-index: 1;
    background: #000;
    padding: 35px 30px 8px 30px;
}
.feature-content h5.feature-title{
    font-size: 20px;
    line-height: 28px;
    color: #fff;
    font-weight: 600;
    padding-bottom: 34px;
    border-bottom: 1px solid #fff;
    margin-bottom: -72px;
    text-align: left;
	display: block;
	text-transform: uppercase;
}
.feature-content h5.feature-title:hover a{ 
	color: #FF3C00;
}
.feature-content i {
    font-size: 62px;
    color: #fff;
    position: relative;
    left: 83%;
    top: -22px;
}
.feature-content .feature-btn a {
    display: inline-block;
    color: #fff;
    padding: 25px 0 15px 0;
}

/* 8. choose us */
.choose-us-image-left img {
    width: 92%;
    min-height: 545px;
    border-radius: 30px;
}
.choose-us-exp {
    position: relative; 
}
.choose-us-exp p {
    font-size: 30px;
    position: absolute;
    text-align: center;
    bottom: 30px;
    padding: 26px 35px;
    background: #fff;
    left: 18%;
    border-radius: 30px;
    font-weight: 500;
    color: #000;
}
.choose-us-exp p span{
    font-size: 46px;
    color: #FF3C00;
}
.choose-us-content {
    position: relative;
}
.choose-us-content img{
    width: 20px;
    height: 20px;
}
.choose-us-content h6 {
    position: absolute;
    top: 4px;
    left: 33px;
    font-size: 18px;
    color: #FF3C00;
    text-transform: capitalize;
}
.choose-us-content h2 {
    font-size: 40px;
    font-weight: 500;
    padding: 25px 0;
}
.choose-us-content p {
    font-size: 16px;
    line-height: 30px;
    text-align: justify;
}
.skill-progress {
    margin: 40px auto;
}
.skill-progress li{
	margin: 20px 0;
	padding: 10px;
}
.skill-progress li span.bar-width {
    font-size: 13px;
    color: #000;
    text-align: right;
    margin-bottom: -21px;
    display: block;
}
.skill-progress li h3 {
    font-size: 18px;
}
li span.bar {
    background: #353b48;
    display: block;
    height: 10px;
    border: 1px solid rgba(0 ,0, 0, 0.3);
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0 ,0, 0, 0.12), 0 1px 2px rgba(0 ,0, 0, 0.24);
    transition: all .3s cubic-bezier(.25, .8, .25, 1);
    -webkit-transition: all .3s cubic-bezier(.25, .8, .25, 1);
    -moz-transition: all .3s cubic-bezier(.25, .8, .25, 1);
    -ms-transition: all .3s cubic-bezier(.25, .8, .25, 1);
    -o-transition: all .3s cubic-bezier(.25, .8, .25, 1);
}
li span.bar:hover {
    box-shadow: 0 7px 15px rgba(0 ,0, 0, 0.25), 0 6px 7px rgba(0 ,0, 0, 0.22);
}
li span.bar span {
    position: relative;
    height: 8px;
    float: left;
    background: linear-gradient(135deg, rgba(236, 0, 140, 1), rgba(252, 103, 103, 1)100%);
    border-radius: 30px 0 0 30px;
}
.skill-progress li span::before {
    position: absolute;
    top: -8px;
    right: -7px;
    border: 7px solid transparent;
    content: "";
    border-right-width: 7px;
    border-bottom-width: 0;
    border-top-color: rgba(252, 103, 103, 1);
}
span.web-developer{
	width: 90%;
	position: relative;
	content: "====>";
	animation: webdeveloper 3s;
	-webkit-animation: webdeveloper 3s;
}
span.ui-designer{
	width: 45%;
	animation: uidesigner 3s;
	-webkit-animation: uidesigner 3s;
}
span.software-developer{
	width: 80%;
	animation: softwaredeveloper 3s;
	-webkit-animation: softwaredeveloper 3s;
}
span.marketing{
	width: 85%;
	animation: marketing 3s;
	-webkit-animation: marketing 3s;
}

@keyframes webdeveloper {
	0%{
		width: 0;
	}
	100%{
		width: 90%;
	}
}
@keyframes uidesigner {
	0%{
		width: 0;
	}
	100%{
		width: 45%;
	}
}
@keyframes softwaredeveloper {
	0%{
		width: 0;
	}
	100%{
		width: 80%;
	}
}
@keyframes marketing {
	0%{
		width: 0;
	}
	100%{
		width: 85%;
	}
}

/* 9. portfolio */
.portfolio-slider {
    position: relative;
}
.portfolio-title h5 {
    font-size: 16px;
    color: #FF3C00;
    letter-spacing: 2px;
}
.portfolio-title h2 {
    font-size: 36px;
    color: #000;
    font-weight: 500;
    text-transform: uppercase;
    padding-top: 10px;
    padding-bottom: 15px;
    margin-bottom: 30px;
}
.single-portfolio{
    cursor: pointer;
}
.portfolio-image::after {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(23, 23, 23, 0) 0%, rgba(23, 23, 23, 0.65) 66%, #FF3C00 148%);
    content: "";
}
.portfolio-image{
    overflow: hidden;
}
.portfolio-image img{
    transition: .6s;
    -webkit-transition: .6s;
    -moz-transition: .6s;
    -ms-transition: .6s;
    -o-transition: .6s;
}
.portfolio-image:hover img{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
}
.portfolio-content a h2 {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 26px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
}
/* owl carousel customization */
.owl-nav {
    position: absolute;
    top: -90px;
    right: 300px;
}
.owl-nav button i.fa-arrow-left {
    background: #dcdcf9;
    margin: 0px 7px;
    padding: 13px;
    display: inline-block;
    color: #000;
    border-radius: 50%;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.owl-nav button i.fa-arrow-right {
    background: #dcdcf9;
    padding: 13px;
    display: inline-block;
    color: #000;
    border-radius: 50%;
    transition: .5s;
}
.owl-nav button i.fa-arrow-left:hover{
    background: #000;
    color: #FF3C00;
} 
.owl-nav button i.fa-arrow-right:hover{
    background: #000;
    color: #FF3C00;
}
.single-page-portfolio {
	position: relative;
	margin-bottom: 135px;
	margin-right: 20px;
}
.portfolio-page-image {
    height: 350px;
}
.portfolio-page-image img {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    z-index: 1;
}
.single-page-portfolio:hover .portfolio-page-image img{
    border-radius: 8px 8px 0 0;
    -webkit-border-radius: 8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    -ms-border-radius: 8px 8px 0 0;
    -o-border-radius: 8px 8px 0 0;
}
.portfolio-page-image a.right-arrow i {
    position: absolute;
    top: 28px;
    right: 30px;
    color: #000;
    font-size: 17px;
    background: #fff;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 50%;
    opacity: 0;
    visibility: hidden;
    transition: .4s;
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
    z-index: 1;
}
.portfolio-page-image a.right-arrow i:hover{
    background: #FF3C00;
    color: #fff;
}
.single-page-portfolio:hover .portfolio-page-image a.right-arrow i {
    opacity: 1;
    visibility: visible;
}
.portfolio-page-content {
    position: absolute;
    width: 100%;
    bottom: 0;
    background: #F4F4FD;
    padding: 25px 22px;
    border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    -moz-border-radius: 0 0 8px 8px;
    -ms-border-radius: 0 0 8px 8px;
    -o-border-radius: 0 0 8px 8px;
    opacity: 0;
    visibility: hidden;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.single-page-portfolio:hover .portfolio-page-content {
    bottom: -113px;
    opacity: 1;
    visibility: visible;
}
.portfolio-page-content a h2 {
    position: relative;
    font-size: 26px;
    padding-top: 6px;
    color: #000;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.portfolio-page-content a h2 i {
    position: absolute;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background: red;
    font-size: 18px;
    color: #fff;
    border-radius: 50%;
    right: 6px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.portfolio-page-content a p {
    font-size: 15px;
    padding-bottom: 0px;
    margin-bottom: 0;
}
.portfolio-page-content a:hover h2{
    color: #FF3C00;
}
.portfolio-details-image img{
    width: 100%;
    height: 100%;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.portfolio-details-left {
    padding: 1px 30px 30px 30px;
    background: #F4F4FD;
    border-radius: 30px;
}
.portfolio-details-left ul li {
    margin-top: 30px;
}
.portfolio-details-left ul li p {
    font-size: 14px;
}
.portfolio-details-left ul li  h5 {
    font-size: 16px;
    color: #000;
    font-weight: 500;
    text-transform: uppercase;
}
.portfolio-details-right h1 {
    font-size: 46px;
    text-transform: capitalize;
    font-weight: 600;
    padding-bottom: 10px;
}
.portfolio-details-right p {
    font-size: 16px;
    text-align: justify;
    line-height: 28px;
}
.portfolio-section-title h2 {
    font-size: 36px;
    color: #000;
    font-weight: 500;
}
/* slick slider customization */
.portfolio-page-active.slick-slider button {
    width: 45px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    border: 1px solid;
    border-radius: 50%;
    position: absolute;
    top: -75px;
    right: 40px;
    font-size: 14px;
    color: #000;
    background: #F4F4FD;
    border: none;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.portfolio-page-active.slick-slider button:hover{
    color: #fff;
    background: #FF3C00;
}
.portfolio-page-active.slick-slider button.prev-arrow {
    right: 94px;
}

/* 10. team */
.team-title h5 {
    font-size: 20px;
    text-transform: uppercase;
    color: #FF3C00;
}
.team-title h2 {
    font-size: 38px;
    text-transform: capitalize;
    font-weight: 500;
    padding: 10px 0;
    margin-bottom: 50px;
}
.single-team {
    position: relative;
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    overflow: hidden;
    margin: 12px;
}
.team-image {
    padding: 25px;
}
.team-image img {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    margin-bottom: 26px;
    z-index: 9;
}
.team-content {
    position: relative;
    bottom: 22px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.single-team:hover .team-content{
    bottom: -110px;
}
.team-content h3 {
    font-size: 28px;
    color: #000;
    font-weight: 500;
    text-transform: uppercase;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.team-content h3:hover{
    color: #FF3C00;
}
.team-content span {
    font-size: 15px;
}
.team-social {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 168px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}
.single-team:hover .team-social {
    bottom: 52px;
}
.team-social a {
    font-size: 18px;
    color: #FF3C00;
    width: 35px;
    height: 35px;
    line-height: 35px;
    display: inline-block;
    background: #ddd;
    border-radius: 50%;
    margin: 0 4px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.team-social a:hover{
    color: #fff;
    background: #FF3C00;
}
.team-details-bg {
    border-radius: 30px;
}
.single-team-details .team-details-img {
    padding: 30px;
    margin-right: 30px;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.single-team-details .team-details-img img {
    width: 100%;
    height: auto;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.team-details-content {
    margin-top: 26px;
}
.team-details-content h2 {
    font-size: 36px;
    font-weight: 500;
}
.team-details-content span {
    font-size: 15px;
    margin-bottom: 30px;
    display: block;
}
.single-team-details .team-details .details-name {
    position: relative;
    margin-right: 20px;
    width: 155px;
}
.single-team-details .team-details ul li {
    display: flex;
    margin-top: 30px;
    align-items: self-start;
    font-size: 18px;
}
.single-team-details .team-details .details {
    width: 350px;
    margin-left: 42px;
}
.single-team-details .team-details .details-name strong {
    margin-left: 14px;
}
.single-team-details .team-details .details p {
    font-size: 15px;
    color: #000000;
}
.single-team-details .team-details .team-details-social a {
    font-size: 15px;
    color: #FF3C00;
    width: 40px;
    height: 40px;
    line-height: 40px;
    display: inline-block;
    background: #fff;
    text-align: center;
    border-radius: 50%;
    margin: 0 2px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.single-team-details .team-details .team-details-social a:hover{
    color: #fff;
    background: #FF3C00;
}
.single-team-skill h2 {
    font-size: 30px;
    font-weight: 600;
    margin-top: 22px;
    padding-bottom: 10px;
    text-transform: uppercase;
}
.single-team-skill p {
    font-size: 16px;
    color: #7c7c7c;
    line-height: 30px;
    text-align: justify;
}
.team-skill-progress {
    margin: 0;
}
.team-contact-content {
    margin: 0px 300px;
}
.team-contact-bg {
    border-radius: 30px;
}
.team-contact-content h3 {
    font-size: 30px;
    text-transform: uppercase;
    font-weight: 600;
    padding-bottom: 10px;
}
.team-contact-content p {
    font-size: 20px;
    text-transform: uppercase;
    color: #000;
    margin-bottom: 45px;
}
.team-contact-content form input {
    width: 100%;
    margin-bottom: 30px;
    padding: 17px 30px;
    border-radius: 30px;
    border: 1px solid transparent;
    outline: none;
}
.team-contact-content form input:focus{
    border: 1px solid #FF3C00;
}
.team-contact-content form input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #808080;
    font-size: 12px;
}
.team-contact-content form input::-moz-placeholder { /* Firefox 19+ */
	color: #808080;
    font-size: 12px;
}
.team-contact-content form input:-ms-input-placeholder { /* IE 10+ */
	color: #808080;
    font-size: 12px;
}
.team-contact-content form input:-moz-placeholder { /* Firefox 18- */
	color: #808080;
    font-size: 12px;
}
.team-contact-content form textarea {
    width: 100%;
    padding: 20px 30px;
    border: navajowhite;
    border-radius: 30px;
    margin-bottom: 30px;
    border: 1px solid transparent;
}
.team-contact-content form textarea:focus{
    border: 1px solid #FF3C00;
}
.team-contact-content form button {
    position: relative;
    font-size: 15px;
    padding: 13px 25px;
    margin: 0 2px;
    border: none;
    background: #FF3C00;
    color: #fff;
    border-radius: 4px;
    z-index: 1;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.team-contact-content form button:hover{
    color: #000;
}
.team-contact-content form button::before{
    position: absolute;
    width: 0;
    height: 100%;
    left: 0;
    top: 0;
    background: #fff;
    content: "";
    opacity: 0;
    visibility: hidden;
    z-index: -1;
    transition: .7s;
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -ms-transition: .7s;
    -o-transition: .7s;
}
.team-contact-content form button:hover::before{
    width: 100%;
    opacity: 1;
    visibility: visible;
    color: #000;
}
/* 11. counter */
.counter-wrapper {
    position: relative;
    width: 85%;
    margin: 0 auto;
    border: 15px solid #fff;
    border-radius: 250px;
    -webkit-border-radius: 250px;
    -moz-border-radius: 250px;
    -ms-border-radius: 250px;
    -o-border-radius: 250px;
    z-index: 1;
}
.single-counter {
    position: relative;
    padding: 45px 0 45px 0;
    margin-left: -80px;
}
.single-counter i {
    font-size: 35px;
    color: #FF3C00;
    background: #fff;
    border-radius: 50%;
    width: 75px;
    height: 75px;
    line-height: 75px;
    margin-right: 19px;
}
.counter-content {
    display: inline-block;
    position: absolute;
}
.counter-content h5 {
    font-size: 36px;
    font-weight: 500;
    color: #000;
}
.counter-content p {
    font-size: 16px;
    color: #000;
}

/* 12. contact us */
.contact-bg {
    border-radius: 40px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    -ms-border-radius: 40px;
    -o-border-radius: 40px;
    position: relative;
    top: -106px;
    padding-top: 155px;
    padding-bottom: 45px;
}
.contact-image {
    padding: 20px 80px;
}
.contact-image img {
    width: 100%;
    height: auto;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.contact-wrapper {
    box-shadow: 0 0 60px 0 rgb(255 255 255);
    padding: 25px 45px 0;
    background: #fff;
    margin: 20px 82px 0 0;
}
.contact-text h3 {
    font-size: 30px;
    font-weight: 500;
    text-transform: uppercase;
    color: #000;
}
.contact-form form {
    padding: 20px 30px 30px 30px;
}
.contact-form form input {
    width: 100%;
    padding: 10px 20px;
    margin: 9px 0;
    border-radius: 8px;
    border: 1px solid #000;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}
.contact-form form input:focus{
    border: 1px solid #FF3C00;
}
.contact-form form textarea {
    padding: 10px 20px;
    width: 100%;
    border-radius: 8px;
    border: 1px solid #000;
    margin-bottom: 20px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    margin-top: 10px;
}
.contact-form form textarea:focus{
    border: 1px solid #FF3C00;
}
.contact-form form button {
    font-size: 16px;
    padding: 12px 25px;
    border: 1px solid transparent;
    background: #FF3C00;
    color: #fff;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
}
.contact-form form button:hover{
    background: #cb3304;
}
.contact-help-box {
    background: #3661FC;
    padding: 25px 45px;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
}
.need-help-content h3 {
    font-size: 36px;
    color: #fff;
    font-weight: 600;
}
.need-help-content p {
    font-size: 16px;
    color: #fff;
    margin-bottom: 18px;
}
.need-content {
    position: relative;
    padding-left: 75px;
}
.need-content .icon {
    position: absolute;
    width: 55px;
    height: 55px;
    line-height: 55px;
    left: 0;
    top: 0;
    font-size: 20px;
    background: #FF3C00;
    color: #fff;
    text-align: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.need-content h4 {
    font-size: 26px;
    color: #fff;
    margin-bottom: 15px;
}
.need-content p {
    padding: 0;
    margin-bottom: 0;
}
.contact-wrapper.contact-page-wrapper {
    border-radius: 15px;
    margin: 0;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
}
.contact-form.contact-page-form input {
    padding: 20px 25px;
    border: none;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.contact-form.contact-page-form textarea{
    padding: 20px 25px;
    border: none;
    border-radius: 30px;
}
.need-help-image {
    height: 188px;
}
.need-help-image img {
    width: 100%;
    height: 100%;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}

/* 13. blog and news */
.blog-title h5{
    font-size: 20px;
    text-transform: uppercase;
    color: #FF3C00;
}
.blog-title h2{
    font-size: 38px;
    text-transform: capitalize;
    font-weight: 500;
    padding: 10px 0;
    margin-bottom: 50px;
}
.blog-img{
    position: relative;
    z-index: 1;
    overflow: hidden;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.blog-img img{
    width: 100%;
    height: auto;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    transition: .7s;
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -ms-transition: .7s;
    -o-transition: .7s;
    cursor: pointer;
}
.blog-img:hover img{
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
}
.blog-img span.date {
    position: absolute;
    width: 110px;
    height: 75px;
    bottom: 0;
    left: 0px;
    padding: 15px;
    background: #FF3C00;
    text-align: center;
    border-radius: 30px;
    font-size: 16px;
    color: #fff;
    z-index: 1;
}
.blog-img span.cat {
    position: absolute;
    width: 235px;
    height: 36px;
    left: 12px;
    bottom: 0;
    background: rgb(255 59 0 / 50%);
    color: #fff;
    padding: 6px 0 0 105px;
    border-radius: 30px;
    font-size: 14px;
}
.blog-content {
    position: relative;
    padding: 60px 30px 30px;
    background: #fff;
    top: -25px;
    border-radius: 0 0 30px 30px;
}
.blog-content ul.meta{
    list-style-type: none;
}
.blog-content ul.meta li {
    display: inline-block;
    font-size: 13px;
    color: #766767;
    margin-right: 45px;
}
.blog-content ul.meta li i {
    padding-right: 5px;
}
.blog-content h2 {
    font-size: 20px;
    color: #000;
    text-transform: uppercase;
    padding-top: 28px;
    transition: .3s ease-in;
    -webkit-transition: .3s ease-in;
    -moz-transition: .3s ease-in;
    -ms-transition: .3s ease-in;
    -o-transition: .3s ease-in;
}
.blog-content h2:hover a{
    color: #FF3C00;
}
.signle-product-filter {
    border: 1px solid #FF3C00;
    padding: 20px 26px;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.signle-product-filter h3 {
    position: relative;
    font-size: 30px;
    color: #000;
    padding: 5px 0;
    margin-bottom: 20px;
}
.signle-product-filter h3::before{
    position: absolute;
    width: 100%;
    height: 1px;
    bottom: 0;
    left: 0;
    background: #ddd;
    content: "";
}
.signle-product-filter h3::after{
    position: absolute;
    max-width: 85px;
    width: 100%;
    height: 1px;
    bottom: 0;
    left: 0;
    background: #FF3C00;
    content: "";
}
.sidebar-search form{
    position: relative;
}
.sidebar-search form input {
    width: 100%;
    padding: 18px 14px;
    border-radius: 8px;
    color: #fff;
    border: 1px solid #FF3C00;
    background: linear-gradient(90deg, rgba(255,3,0,0.8211659663865546) 0%, rgba(255,0,0,0.5690651260504201) 80%) !important;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}
.sidebar-search form input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #fff;
    font-size: 12px;
}
.sidebar-search form input::-moz-placeholder { /* Firefox 19+ */
	color: #fff;
    font-size: 12px;
}
.team-contact-content form input:-ms-input-placeholder { /* IE 10+ */
	color: #fff;
    font-size: 12px;
}
.sidebar-search form input:-moz-placeholder { /* Firefox 18- */
	color: #fff;
    font-size: 12px;
}
.sidebar-search form button {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #fff;
    font-size: 20px;
}
.recent-blog.recent-post-title a h5{
    color: #000 !important;
}
.recent-blog.recent-post-title span{
    color: #000 !important;
}
.recent-blog.recent-post-title a h5:hover{
    color: #FF3C00 !important;
}
.sidebar-categories ul li {
    padding: 10px 0;
}
.sidebar-categories ul li a {
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    color: #101010;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.sidebar-categories ul li:hover a{
    color: #FF3C00;
}
.sidebar-tags ul li {
    display: inline-block;
    padding: 10px 9px;
}
.sidebar-tags ul li a {
    font-size: 16px;
    color: #000;
    background: #F4F4FD;
    padding: 7px 14px;
    display: inline-block;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}



.blog-details-wrap {
    max-width: 800px;
    width: 100%;
}
.blog-details-img {
    height: 430px;
}
.blog-details-img img:hover{
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
}
.blog-details-content {
    padding-top: 60px;
    padding-bottom: 0;
    padding-left: 0;
}
.blog-details-content h2 {
    font-size: 24px;
    font-weight: 500;
    padding-bottom: 10px;
}
.blog-details-content p {
    font-size: 15px;
    line-height: 32px;
    text-align: justify;
}
.blog-details-comment {
    position: relative;
    padding: 30px 30px 15px 30px;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
}
.blog-details-comment blockquote span {
    font-size: 44px;
    color: #FF3C00;
    font-weight: 700;
    position: absolute;
    top: 30px;
    left: 30px;
}
.blog-details-comment blockquote {
    font-size: 16px;
    margin-left: 25px;
    line-height: 34px;
    text-align: justify;
}
.blog-details-bottom{
    border-top: 1px solid #ddd;
}
.blog-details-bottom {
    border-top: 1px solid #ddd;
    display: flex;
    justify-content: space-between;
}
.blog-details-bottom p.blog-details-tag span {
    font-size: 20px;
    color: #000;
    font-weight: 600;
    padding-right: 20px;
}
.blog-details-bottom p.blog-details-tag a {
    font-size: 16px;
    padding: 8px 15px;
    background: #FF3C00;
    margin: 0 3px;
    color: #fff;
    border-radius: 8px;
    transition: .4s;
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}
.blog-details-bottom p.blog-details-tag a:hover{
    background: #000;
}
.blog-details-social span {
    font-size: 20px;
    color: #000;
    font-weight: 600;
    padding-right: 10px;
}
.blog-details-social a {
    font-size: 15px;
    color: #fff;
    background: #000;
    display: inline-block;
    text-align: center;
    width: 34px;
    height: 34px;
    line-height: 34px;
    border-radius: 50%;
    margin: 0 1px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.blog-details-social a:hover{
    background: #FF3C00;
    transform-origin: top;
}
.blog-details-arrow .nav-link{
    display: flex;
    justify-content: space-between;
}
.blog-details-arrow .nav-link .prev {
    width: calc(50% - 15px);
    margin-right: 30px;
}
.blog-details-arrow .nav-link .next {
    width: calc(50% - 15px);
}
.blog-details-arrow .nav-link .prev a {
    font-size: 16px;
    color: #000;
    padding: 50px 68px;
    background: #F4F4FD;
    display: inline-block;
    text-align: left;
    line-height: 32px;
    border-radius: 15px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.blog-details-arrow .nav-link .next a {
    font-size: 16px;
    color: #000;
    padding: 50px 68px;
    background: #F4F4FD;
    display: inline-block;
    text-align: left;
    line-height: 32px;
    border-radius: 15px;
    transition: .5s;
}
.blog-details-arrow .nav-link .prev a:hover{
    background: #000;
    color: #fff;
} 
.blog-details-arrow .nav-link .next a:hover {
    background: #000;
    color: #fff;
}
.blog-details-comment.single-comment {
    padding: 0;
}
.blog-details-comment h2 {
    font-size: 30px;
    color: #000;
    font-weight: 500;
    padding: 20px 0;
    margin-top: 20px;
}
.blog-details-comment .details-comment {
    background: #F4F4FD;
    padding: 30px;
    border-radius: 30px;
    margin-bottom: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.blog-details-comment .details-comment.middle {
    margin-left: 40px;
}
.blog-details-comment .details-comment .details-info .detalis-client-image {
    width: 80px;
    height: 80px;
    margin-right: 30px;
}
.blog-details-comment .details-comment .details-info .detalis-client-image img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.blog-details-comment .details-comment .details-info h4 {
    font-size: 25px;
    font-weight: 500;
}
.blog-details-comment .details-comment p {
    font-size: 15px;
    text-align: justify;
    padding: 15px 0px;
    line-height: 28px;
    color: #000;
}
.blog-details-comment .details-comment .reply input {
    width: 100%;
    padding: 8px 15px;
    border-radius: 15px;
    border: none;
    font-size: 14px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    margin-right: 30px;
}
.blog-details-comment .details-comment .reply button.btn {
    font-size: 14px;
    padding: 8px 15px;
    background: #FF3C00;
    color: #fff;
}
.leave-comment h3 {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 20px;
}
.leave-comment form input {
    width: 100%;
    padding: 10px 25px;
    border-radius: 30px;
    border: none;
    background: #F4F4FD;
    margin-bottom: 30px;
}
.leave-comment form textarea{
    width: 100%;
    padding: 10px 25px;
    border-radius: 30px;
    border: none;
    background: #F4F4FD;
    margin-bottom: 30px;
}
.leave-comment form button {
    position: relative;
    font-size: 15px;
    padding: 13px 25px;
    margin: 0 2px;
    border: none;
    background: #FF3C00;
    color: #fff;
    border-radius: 4px;
    z-index: 1;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.leave-comment form button:hover{
    color: #fff;
}
.leave-comment form button::before{
    position: absolute;
    width: 0;
    height: 100%;
    left: 0;
    top: 0;
    background: #000;
    content: "";
    opacity: 0;
    visibility: hidden;
    z-index: -1;
    transition: .7s;
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -ms-transition: .7s;
    -o-transition: .7s;
}
.leave-comment form button:hover::before{
    width: 100%;
    opacity: 1;
    visibility: visible;
}







/* 14. footer */
footer {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.newsletter-form {
    border-bottom: 1px solid #383838;
}
.newsletter-form .left-content p {
    font-size: 15px;
    color: #fff;
}
.newsletter-form .left-content h3 {
    font-size: 30px;
    color: #fff;
    font-weight: 500;
}
.newsletter-form .right-content{
    max-width: 500px;
    width: 100%;
}
.newsletter-form .right-content form { 
    position: relative;
}
.newsletter-form .right-content form input {
    width: 100%;
    padding: 22px 30px;
    border-radius: 30px;
}
.newsletter-form .right-content form button {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    padding: 13px 17px;
    border-radius: 30px;
    outline: none;
    border: none;
    background: #FF3C00;
    font-size: 15px;
    color: #fff;
}
.about-company p {
    font-size: 15px;
    color: #fff;
    padding: 20px 0;
    line-height: 34px;
    text-align: justify;
}
.footer-social a {
    font-size: 16px;
    color: #fff;
    border: 1px solid #fff;
    width: 35px;
    height: 35px;
    line-height: 35px;
    display: inline-block;
    text-align: center;
    margin: 0 5px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.footer-social a:hover{
    background: #FF3C00;
    border: 1px solid transparent;
}
.footer-widget .footer-title h4 {
    font-size: 34px;
    color: #fff;
    font-weight: 500;
    padding-bottom: 27px;
}
.footer-contact p {
    font-size: 15px;
    color: #fff;
    line-height: 28px;
}
.footer-links ul li {
    position: relative;
    padding: 5px 0;
    padding-left: 18px;
}
.footer-links ul li::before {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    color: #fff;
    font-family: "Font Awesome\ 5 Free";
    font-weight: 900;
    content: "\f054";
    padding: 7px 0;
    font-size: 14px;
}
.footer-links ul li a{
    position: relative;
    font-size: 15px;
    color: #fff;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    z-index: 1;
}
.footer-links ul li a:hover{
    color: #FF3C00;
    padding-left: 5px;
}
.recent-post{
    position: relative;
}
.recent-post .footer-post-img img {
    width: 70px;
    height: 70px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}
.recent-post .recent-post-title {
    position: absolute;
    top: 0;
    left: 90px;
}
.recent-post .recent-post-title a h5 {
    font-size: 17px;
    color: #fff;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.recent-post .recent-post-title a h5:hover{
    color: #FF3C00;
}
.recent-post .recent-post-title span{
    font-size: 13px;
    color: #fff;
}
.footer-copywrite-text p {
    font-size: 15px;
    color: #fff;
}
.footer-copywrite-link ul li {
    display: inline-block;
}
.footer-copywrite-link ul li:nth-child(1) {
    padding-right: 20px;
    margin-right: 15px;
    border-right: 1px solid #fff;
}
.footer-copywrite-link ul li a {
    font-size: 15px;
    color: #fff;
}
/* back to top */
.back-to-top {
    position: fixed;
    right: 30px;
    bottom: 30px;
    width: 44px;
    height: 44px;
    color: #fff;
    background: #FF3C00;
    text-align: center;
    line-height: 44px;
    z-index: 99;
    font-size: 20px;
    cursor: pointer;
    display: none;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.back-to-top i{
    animation: backto-top-bounce  1s infinite ease-in-out;
    -webkit-animation: backto-top-bounce  1s infinite ease-in-out;
}
@keyframes backto-top-bounce{
    0%{
        transform: translateY(2px);
        -webkit-transform: translateY(2px);
        -moz-transform: translateY(2px);
        -ms-transform: translateY(2px);
        -o-transform: translateY(2px);
}
    50%{
        transform: translateY(-2px);
        -webkit-transform: translateY(-2px);
        -moz-transform: translateY(-2px);
        -ms-transform: translateY(-2px);
        -o-transform: translateY(-2px);
}
    100%{
        transform: translateY(2px);
        -webkit-transform: translateY(2px);
        -moz-transform: translateY(2px);
        -ms-transform: translateY(2px);
        -o-transform: translateY(2px);
}
}
/* 15. testimonial  */
.testimonial-title h6 {
    font-size: 20px;
    color: #000;
    font-weight: 500;
}
.testimonial-title h1 {
    font-size: 50px;
    color: #000;
    font-weight: 500;
}
.inner-box {
    position: relative;
    margin: 45px 10px;
    margin-bottom: 100px;
}
.single-testimonial {
    background: #fff;
    padding: 30px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.single-testimonial::before {
    position: absolute;
    right: 0;
    top: 100%;
    border-top: 40px solid #ffffff;
    border-right: 65px solid transparent;
    content: "";
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.single-testimonial:hover{
    background: #000;
    cursor: pointer;
}
.single-testimonial:hover::before{
    border-top: 32px solid #000;
}
.testimonial-thum {
    position: absolute;
    width: 70px;
    height: 70px;
    margin-top: -63px;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 30px;
    z-index: 9999;
    background: #fff;
    border-radius: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.testimonial-thum img {
    width: 100%;
    height: 100%;
    border: 1px solid red;
    padding: 5px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.testimonial-content .rating {
    margin-top: 30px;
    text-align: center;
    margin-bottom: 15px;
}
.testimonial-content .rating i{
    font-size: 15px;
    color: #FF3C00;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.testimonial-content p {
    font-size: 15px;
    text-align: justify;
    line-height: 32px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
}
.single-testimonial:hover .testimonial-content p{
    color: #fff;
}
.testimonial-info {
    position: absolute;
    right: 72px;
    bottom: -95px;
}
.testimonial-info h3 {
    font-size: 26px;
    color: #000;
    font-weight: 600;
    margin-bottom: 0;
}
.testimonial-info p {
    font-size: 15px;
    color: #2a2a2a;
}
.testi-section-two {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 950px;
}
.testimonial-title-v2 h6 {
    font-size: 20px;
    color: #fff;
    font-weight: 500;
}
.testimonial-title-v2 h1 {
    font-size: 50px;
    color: #fff;
    font-weight: 500;
}
.single-testimonial-v2 {
    position: absolute;
}
.single-testimonial-v2 .images {
    width: 60px;
    height: 60px;
    border: 2px solid red;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    display: inline-block;
}
.single-testimonial-v2 .images img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.single-testimonial-v2:hover .images{
    cursor: pointer;
}
.hidden-content {
    position: absolute;
    width: 450px;
    padding: 25px;
    background: #F4F4FD;
    border: 1px solid #FF3C00;
    border-radius: 30px;
    margin-top: 10px;
    opacity: 0;
    visibility: hidden;
    z-index: 1;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
}
.single-testimonial-v2:hover .hidden-content{
    opacity: 1;
    visibility: visible;
    z-index: 12;
}
.hidden-content .hidden-imgs {
    width: 110px;
}
.hidden-content .hidden-imgs img {
    width: 100%;
    border-radius: 20px 8px 8px;
}
.hidden-content .hidden-title {
    position: relative;
    top: -66px;
    margin-left: 130px;
    border-bottom: 1px solid red;
    margin-bottom: -35px;
}
.hidden-title h4 {
    font-size: 24px;
    font-weight: 500;
    color: #000;
    margin-bottom: 2px;
}
.hidden-content .hidden-title p {
    font-size: 14px;
    color: #2c2c2c;
}
.hidden-content p {
    font-size: 16px;
    text-align: justify;
    line-height: 30px;
}
.single-testimonial-v2.one {
    position: relative;
    left: 0;
    display: inline-block;
}
.single-testimonial-v2.two {
    position: absolute;
    left: 45%;
}
.single-testimonial-v2.two .hidden-content {
    left: -180px;
}
.single-testimonial-v2.three {
    position: relative;
    left: 86%;
    top: -60px;
    display: inline-block;
}
.single-testimonial-v2.three .hidden-content {
    left: -375px;
}
.single-testimonial-v2.four {
    position: relative;
    left: 210px;
    top: 45px;
    display: inline-block;
}
.single-testimonial-v2.four .hidden-content {
    left: -7px;
}
.single-testimonial-v2.five {
    position: relative;
    left: 60%;
    top: 40px;
    display: inline-block;
}
.single-testimonial-v2.five .hidden-content {
    left: -375px;
}
.single-testimonial-v2.six {
    position: relative;
    left: 28%;
    top: 270px;
    display: inline-block;
}
.single-testimonial-v2.six .hidden-content {
    left: -375px;
    bottom: 78px;
}
.single-testimonial-v2.seven {
    position: relative;
    left: 78%;
    top: 36px;
    display: inline-block;
}
.single-testimonial-v2.seven .hidden-content {
    left: -375px;
}
/* 16. pricing */
.pricing-title h2{
	font-size: 48px;
	font-weight: 700;
	color: #393542;
	padding-bottom: 15px;
}
.pricing-title p {
    font-size: 18px;
    font-weight: 400;
    color: #878991;
    line-height: 30px;
    padding: 0px 350px;
    padding-bottom: 40px;
}
.single-price {
    background: #F4F4FD;
    border: 1px solid #ddd;
    padding: 40px 46px;
    border-radius: 20px;
    margin: 0 20px;
}
.mid-single-price{
    background: #000;
}
.mid-single-price .pricing-header h3{
    color: #fff;
}
.mid-single-price .pricing-header h2{
    color: #fff;
}
.mid-single-price .pricing-header span.shape{
    color: #fff;
}
.mid-single-price .pricing-header span{
    color: #fff;
}
.mid-single-price .pricing-body ul li{
    color: #fff;
}
.pricing-header h3 {
    font-size: 22px;
    font-weight: 600;
    color: #30323d;
    text-transform: uppercase;
}
.mid-single-price .pricing-header {
    border-bottom: 1px solid #fff;
}
.pricing-header {
	border-bottom: 1px solid #c3c3c3;
	margin-bottom: 36px;
	padding-bottom: 25px;
}
.pricing-header h2 {
    font-size: 60px;
    font-weight: 500;
    color: #3661FC;
    padding-top: 20px;
}
.pricing-header span.shape{
	font-size: 36px;
	color: #30323d;
}
.pricing-header span{
	font-size: 18px;
	color: #30323d;
}
.pricing-body ul li {
    font-size: 16px;
    color: #000;
    margin-bottom: 20px;
}
.pricing-body ul li.dis{
    opacity: 0.5;
}
.mid-single-price .pricing-btn a{
    color: #fff;
    background: #FF3C00;
}
.pricing-btn a {
	font-size: 14px;
	font-weight: 700;
	color: #38363d;
	text-transform: uppercase;
	padding: 20px 35px;
	border: 1px solid #FF3C00;
	border-radius: 30px;
	margin: 8px 0;
	transition: .5s;
	display: inline-block;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	-o-transition: .5s;
}
.mid-single-price .pricing-btn a:hover{
    background: transparent;
    border: 1px solid #FF3C00;
}
.pricing-btn:hover a{
	background: #FF3C00;
	color: #fff;
	border: 1px solid transparent;
}
/* 17. fqa */
.single-fqa h2{
    font-size: 40px;
    font-weight: 600;
    color: #000;
    padding-bottom: 25px;
}
.single-fqa ul.nav.nav-pills{
    display: block;
}
.single-fqa .nav.nav-pills li {
    margin: 20px 0;
}
.single-fqa .nav.nav-pills li.nav-item button {
    width: 270px;
    height: 55px;
    border-radius: 30px;
    background: #F4F4FD;
    text-align: left;
    font-size: 18px;
    color: #000;
}
.single-fqa .nav.nav-pills li.nav-item button i {
    padding-right: 10px;
    padding-left: 5px;
}
.single-fqa .nav.nav-pills li.nav-item button.nav-link.active{
    background: #3661FC;
    color: #fff;
} 
.accordion-item {
    margin-bottom: 30px;
    background: #fff;
    box-shadow: 10px 10px 30px rgba(0,0,0,.08);
    border: 0;
    padding: 13px 40px;
    border-radius: 30px !important;
    -webkit-border-radius: 30px !important;
    -moz-border-radius: 30px !important;
    -ms-border-radius: 30px !important;
    -o-border-radius: 30px !important;
}
.accordion-item h2 {
    padding-bottom: 0;
}
.accordion-button {
    padding: 22px 0;
    font-size: 24px;
    font-weight: 700;
}
button.accordion-button:not(.collapsed) {
    border-bottom: 1px solid #ddd !important;
    background: none;
}
.accordion-button:focus {
    border: none !important;
    box-shadow: none !important;
}
.accordion-button::after {
    display: none;
}
.accordion-button::before {
    content: "\f067";
    font-weight: 700;
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translate(0,-50%);
    color: #3661FC;
    font-family: "Font Awesome\ 5 Free";
    -webkit-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    font-size: 16px;
}
.accordion-button:not(.collapsed)::before{
    content: "\f068";
    font-weight: 700;
    font-family: "Font Awesome\ 5 Free";
}
.accordion-body {
    padding: 20px 0;
}
.accordion-body p {
    font-size: 16px;
    line-height: 32px;
    text-align: justify;
}

/* 18. 404 page */
.error-image img {
    width: 100%;
    height: 100%;
    border-radius: 30px;
    margin-bottom: 40px;
}
.error-content h4 {
    font-size: 28px;
    font-weight: 700;
    padding-bottom: 10px;
}
.error-content p {
    font-size: 16px;
    padding: 0 450px;
    line-height: 32px;
}
/* 19. map */
.map-area {
    width: 100%;
    height: 500px;
}
.map-area iframe {
    width: 100%;
    height: 500px;
}



/*Loader*/

.loader-wrapper {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    transition: 0.8s 1s ease;
    z-index: 666;
}
.loader {
  position: relative;
  display: block;
  z-index: 201;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  margin: -50px 0 0 -50px;
  border-radius: 50%;
  transition: all 1s 1s ease;
  border: 3px solid transparent;
  border-top-color: #FF3C00;
  -webkit-animation: spin 1.5s linear infinite;
  -moz-animation: spin 1.5s linear infinite;
  -o-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}
.loader:before {
  position: absolute;
  content: '';
  top: 6px;
  left: 6px;
  right: 6px;
  bottom: 6px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-left-color: #825AE8;
  -webkit-animation: spin 2s linear infinite;
  -moz-animation: spin 2s linear infinite;
  -o-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
.loader:after {
  position: absolute;
  content: '';
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-right-color: #fff;
  -webkit-animation: spin 2.5s linear infinite;
  -moz-animation: spin 2.5s linear infinite;
  -o-animation: spin 2.5s linear infinite;
  animation: spin 2.5s linear infinite;
}
/** Here comes the Magic **/

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-moz-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.loader-wrapper .loder-section {
    position: fixed;
    top: 0;
    width: 50%;
    height: 100%;
    background: #111;
    z-index: 2;
}
.loader-wrapper .loder-section.left-section {
  left: 0;
  transition: 1s 1.4s ease;
}
.loader-wrapper .loder-section.right-section {
  right: 0;
  transition: 1s 1.4s ease;
}

/** When page loaded **/
.loaded .loder-section.left-section {
  left: -100%;
}
.loaded .loder-section.right-section {
  right: -100%;
}
.loaded .loader-wrapper {
  visibility: hidden;
}
.loaded .loader {
  top: -100%;
  opacity: 0;
}





