﻿/*
  Theme Name: Apork - Product Landing HTML5 Template
  Author: theme_group
  Support: robiulislamfree@gmail.com
  Description: Apork is app landing PSD Template.This is a clean Professional and Creative Design using bootstrap 1170px Grid System.You can use Apork as a better way to present and promote your startup mobile apps,
  Tags: business, clean design, clean layout, marketing, minimal design, minimalist, modern, newsletter, app, app landing, App Showcase, digital, digital product, landing page, mobile apps, modern, sales apps, sass, software, startup,
  Version: 1.0
*/
/* CSS Index
-----------------------------------

1.	google fonts
2.	theme default css
3.	pre loader css
4.	header area css
5.	main menu area css
		i. sub menu
6.	search form area css 
7.	hero area css
8.	about area css
9.	counter area css
10.	features area css
11.	videos area css
12.	screen shots area css
13.	call to action area css
14.	pricing table area css
15.	faq area css
16.	testimonial area css
17.	latest blog area css
18.	subscribe area css
19.	client slider area css
20.	footer area css
		i.  wedget 1 css
		ii. wedget 2 css
		iii. wedget 3 css
21.	breadcrumb area css
22.	sidebar wedget area css
		i. widget search area css
		ii. widget latest post area css
		iii. widget post archive area css
		iv. widget tags area css
23.	blog details area css
		i. blog details share & comments
		ii. blog author area css
		iii. related post area css
		iv. recent comments area css
24.	contact area css
		i. contact form area css
25.	error area css


*/
/* google fonts */

@import url('c9e1b5dc2b1b4169961debffbf206f94.css');

/* theme default css */

body {
    font-family: 'Poppins', sans-serif;
    font-weight: normal;
    font-style: normal;
}

img {
    max-width: 100%;
    height: auto;
    transition: all 0.3s ease-out 0s;
}

a,
.button,
.btn {
    -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,
.btn:focus {
    text-decoration: none;
    outline: none;
}

a:focus,
a:hover {
    text-decoration: none;
}

.btn:focus,
button:focus,
input:focus,
input:focus,
textarea,
textarea:focus,
.form-control:focus {
    outline: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    border-color: inherit;
    background: #fff;
    color: #000;
}

button {
    cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Ubuntu', sans-serif;
    font-weight: normal;
    color: #2b2b2b;
    margin: 0px;
    padding: 0px;
    font-style: normal;
    font-weight: 400;
    text-transform: normal;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    color: inherit;
}

ul {
    margin: 0px;
    padding: 0px;
}

li {
    list-style: none
}

p {
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.75;
    color: #1a2b3c;
    margin: 0px;
}

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: #106ad2;
    color: #fff;
    text-shadow: none;
}

*::-moz-placeholder {
    color: #555555;
    font-size: 14px;
    opacity: 1;
}

*::placeholder {
    color: #555555;
    font-size: 14px;
    opacity: 1;
}

/* pre loader css */

.preloader {
    background-image: -moz-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    height: 100%;
    position: fixed;
    width: 100%;
    z-index: 9999;
}

.preloader .spinner {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -20px;
    margin-top: -20px;
    width: 50px;
    height: 40px;
    text-align: center;
    font-size: 10px;
}

.spinner > div {
    background-color: #fff;
    height: 100%;
    width: 6px;
    display: inline-block;
    -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
    animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.spinner .rect3 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

.spinner .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.spinner .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {

    0%,
    40%,
    100% {
        -webkit-transform: scaleY(0.4)
    }

    20% {
        -webkit-transform: scaleY(1.0)
    }
}

@keyframes sk-stretchdelay {

    0%,
    40%,
    100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }

    20% {
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}

/* header area css */

.sticky {
    left: 0;
    margin: auto;
    position: fixed;
    top: 0;
    width: 100%;
    box-shadow: 0 0 60px 0 rgba(0, 0, 0, .07);
    z-index: 9999;
    -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    background: #ffffff;
    transition: .3s;
}

.header-logo {
    margin-top: 20px;
}

.header-logo a {

    display: block;
}

.header-top-area {
    background-color: #222;
    font-size: 15px;
    padding: 10px 0;
}

.header-top-area a,
.header-top-area {
    color: #fff;
}

.header-top-area i {
    color: #f7be49;
}

/* main menu area css */
.main-menu ul {
    display: inline-block;
}

.main-menu nav > ul > li {
    display: inline-block;
    position: relative;
}

.main-menu nav > ul > li:last-child a {
    padding-right: 0
}

.main-menu nav > ul > li:first-child a {
    padding-left: 0
}

.main-menu nav > ul > li > a {
    color: #111111;
    display: block;
    font-size: 16px;
    font-weight: 600;
    padding: 40px 13px;
    transition: all 0.3s ease 0s;
    line-height: 1.25;
    font-family: 'Poppins', sans-serif;
    text-transform: capitalize;
}

.main-menu nav > ul > li:hover > a,
.main-menu nav > ul > li.active > a {
    color: #ff60a3;
}

/* sub menu */
.main-menu nav > ul > li .sub-menu {
    background: #ffffff none repeat scroll 0 0;
    border-top: 3px solid #ff60a3;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 100%;
    transition: all 0.4s ease-out;
    visibility: hidden;
    width: 220px;
    z-index: 9;
    transform-origin: top;
    transform: scaleY(0);
}

.main-menu nav > ul > li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: scaleY(1);
}

.main-menu nav > ul > li .sub-menu li {
    display: block;
    position: relative;
}

.main-menu nav > ul > li .sub-menu li a {
    color: #666666;
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    padding: 13px 20px;
    text-transform: capitalize;
    display: block;
    font-family: 'Poppins', sans-serif;
}

.main-menu nav > ul > li:hover > .sub-menu li > a:hover {
    color: #fff;
    background: #ff60a3;
}

/* sub menu */
.main-menu nav > ul > li > .sub-menu > li > .sub-menu {
    background: #ffffff none repeat scroll 0 0;
    border-top: 3px solid #ff60a3;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    left: 100%;
    opacity: 0;
    position: absolute;
    top: 120%;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    width: 220px;
    z-index: 9;
}

.main-menu nav > ul > li > .sub-menu > li:hover .sub-menu {
    top: 0 !important;
    opacity: 1;
    top: 100%;
    visibility: visible
}

.header-top-btn {
    margin: 24px 0 0 35px;
    display: inline-block;
}

/* search form area css */

ul.header-search {
    margin: 37px 0 0 30px;
    display: inline-block;
}

ul.header-search li a {
    color: #111111;
}

ul.header-search li a:hover {
    color: #ff60a3;
}

#search-overlay {
    display: none;
}

.search-form-area {
    background-image: -moz-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -webkit-linear-gradient(178deg, rgba(47, 50, 212, 0.9) 0%, rgba(113, 66, 247, .9) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
    text-align: center;
    border: #a0a0a0 solid 1px;
    margin: 0;
    z-index: 99999;
}

.search-form-area:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: 0;
}

.search-form-centered {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    padding: 10px 15px;
    color: #FFF;
    border: none;
    background: transparent;
}

#search-box {
    position: relative;
    width: 100%;
    margin: 0;
}

.search-form input.form-control {
    box-shadow: none;
    color: #777777;
    height: 80px;
    background: #f8f8f8;
    border: none;
    border-radius: 30px;
    padding: 20px 30px;
}

.search-form button {
    background-image: -moz-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    position: absolute;
    top: 10px;
    right: 10px;
    text-align: center;
    line-height: 42px;
    border-width: 0;
    border-radius: 30px;
    cursor: pointer;
    padding: 9px 50px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 500;
}

#close-btn {
    position: fixed;
    top: 1em;
    right: 1em;
}

#close-btn:hover {
    color: #ff60a3;
    cursor: pointer;
}

/* hero area css */

.hero-bg {
    background-image: url(/assets/website/img/clash-s/hero-bg-1.jpg);
    background-position: center center;
    background-size: cover;
    color: #fff;
    height: 800px;
}

.hero-content {
    padding-top: 180px;
}

.hero-content h2 {
    color: #fff;
    font-size: 60px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 25px;
}

.hero-content p {
    font-size: 24px;
    color: #fff;
    margin-bottom: 25px;
    line-height: 1.50;
}

.hero-btn a.btn:first-child {
    margin-right: 35px;
}

.hero-mobile-img {
    margin-top: 240px;
}

.style-shape {
    position: absolute;
}

.hero-style-shape .shape-1 {
    top: 10%;
    left: 0px;
}

.hero-style-shape .shape-2 {
    top: 0;
    right: 0;
    opacity: .8;
}

.hero-style-shape .shape-3 {
    right: 10%;
    bottom: 19%;
}

/* about area css */

.about-content h3 {
    font-size: 25px;
    font-weight: 500;
    text-transform: capitalize;
    margin: 22px 0;
}

.about-content h3 span {
    color: #ff60a3;
}

/* counter area css */

.single-counter {
    position: relative;
}

.single-counter h2 {
    color: #1a2b3c;
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 7px;
}

.single-counter::before {
    width: 1px;
    height: 40px;
    position: absolute;
    content: "";
    background: #c6c7cb;
    right: -65px;
    top: 19px;
    bottom: 0;
}

.single-counter:nth-child(3)::before {
    display: none;
}

.col-xl-3:last-child .single-counter::before {
    display: none;
}

.col-xl-4:last-child .single-counter::before {
    display: none;
}

.single-counter span {
    font-size: 16px;
    color: #878991;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
}

/* features area css */

.single-features {
    background: #ffffff;
    box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, 0.14);
    padding: 45px 40px;
    position: relative;
}

.features-shape {
    position: absolute;
    left: 0;
    bottom: 0;
}

.apork-features-area .col-xl-4:nth-child(odd) .single-features {
    margin-top: 40px;
}

.single-features h3 {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.25;
    margin: 30px 0 15px 0;
}

.fbs-1 {
    left: 11%;
    top: 26%;
    opacity: .5;
}

.fbs-2 {
    right: 0;
    bottom: -70px;
    opacity: .5;
}

/* videos area css */

.apork-videos {
    box-shadow: 0px 0px 136px 0px rgba(0, 0, 0, 0.06);
}

.videos-icon-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.videos-icon-text i {
    background-image: -moz-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    height: 140px;
    width: 140px;
    color: #fff;
    font-size: 30px;
    line-height: 140px;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    animation: heartbeat 1s infinite alternate;
}

.videos-icon-text h3 {
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 15px;
}

/* screen shots area css */

.swiper-container {
    width: 100%;
    padding-bottom: 70px;
}

.swiper-slide {
    width: 430px;
    height: auto;
    padding: 0 15px;
}

.swiper-slide img {
    box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.14);
}

.swiper-slide.swiper-slide-active img {
    box-shadow: 0px 27px 90px 0px rgba(0, 0, 0, 0.14);
}

.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 0;
}

.swiper-pagination-bullet {
    background: #1a2b3c none repeat scroll 0 0;
    border-radius: 30%;
    display: inline-block;
    height: 15px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    width: 15px;
    transition: all .3s;
}

.swiper-pagination-bullet-active {
    background: #ff60a3;
    border: medium none;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    width: 30px;
    height: 15px;
    border-radius: 7.5px;
}

/* call to action area css */
.cta-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    height: 100%;
    background-image: url(/assets/website/img/clash-s/cta-bg.png);
    background-color: #1a2b3c;
    background-repeat: no-repeat;
}

.cta-area:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-image: -moz-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    opacity: 0.851;
}

.cta-content h3 {
    font-size: 36px;
    color: #fff;
    font-weight: 700;
    line-height: 1.20;
    display: inline-block;
}

.cta-content h3 i {
    color: #ff60a3;
}

.cta-btn {
    margin: 13px 0;
}

/* pricing table area css */

.pricing-area {
    padding-top: 100px;
}

.pricing-area.pricing-area-3 {
    margin-top: 0px;
}

ul.price-nav {
    display: inline-block;
    border: 2px solid #e7e7e7;
    border-radius: 30px;
}

ul.price-nav li {
    display: inline-block;
}

.price-header h4 {
    font-weight: 500;
    text-transform: capitalize;
    font-size: 22px;
    color: #30323d;
    font-family: 'Poppins', sans-serif;
}

ul.price-nav li a {

    padding: 20px 40px;
    line-height: 1;
    color: #878991;
    border-radius: 30px 0px 0px 30px;
}

ul.price-nav li a.active {
    border-radius: 30px 0px 0px 30px;
    background-image: -moz-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    color: #fff;
    -webkit-border-radius: 30px 0px 0px 30px;
    -moz-border-radius: 30px 0px 0px 30px;
    -ms-border-radius: 30px 0px 0px 30px;
    -o-border-radius: 30px 0px 0px 30px;
}

ul.price-nav li:nth-child(2) a {
    border-radius: 0px 30px 30px 0px;
    -webkit-border-radius: 0px 30px 30px 0px;
    -moz-border-radius: 0px 30px 30px 0px;
    -ms-border-radius: 0px 30px 30px 0px;
    -o-border-radius: 0px 30px 30px 0px;
}

.pricing-area {
    margin-bottom: -240px;
}

.single-price-area {
    background: transparent;
    border: 1px solid #f2f2f2;
    border-radius: 10px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    padding: 40px 50px;
    position: relative;
    overflow: hidden;
}

.single-price-bg {	
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: absolute;
    height: 100%;
    background-image: url(/assets/website/img/clash-s/prictable-bg.png);
    background-repeat: no-repeat;
    left: 0;
    right: 0;
    bottom: -30px;
    opacity: 0;
    visibility: hidden;
    transition: all .3s;
	z-index: -1;	
}

.single-price-area:hover .price-header:before,
.single-price-area:hover .price-header:after {
    background: #ff60a3;
}

.single-price-area:hover {
    box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.15);
}

.single-price-area:hover .single-price-bg {
    opacity: 0.7;
    visibility: visible;
    bottom: -10px;
}

.single-price-area:hover .price-header h2 {
    color: #7142f7;
}

.single-price-area.active .price-header h2 {
    color: #7142f7;
}

.single-price-area.active {
    box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.15);
}

.single-price-area.active .single-price-bg{
    opacity: 0.7;
    visibility: visible;
    bottom: -10px;
}

.single-price-area.active .price-header:before,
.single-price-area.active .price-header:after {
    background: #ff60a3;
}

.single-price-area.active .btn-type-5 {
    background-image: -moz-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    color: #fff;
}

.single-price-area.active .btn-type-5 i {
    color: #fff;
    margin-right: 0;
    opacity: 1;
    visibility: visible;
}


.price-header {
    position: relative;
    margin-bottom: 25px;
    border-bottom: 1px solid #f6f2fe;
    padding-bottom: 25px;
    margin-bottom: 35px;
}

.price-header:before {
    content: '';
    width: 5px;
    height: 5px;
    position: absolute;
    background: #1a2b3c;
    right: 0;
    bottom: -3px;
    border-radius: 100%;
}

.price-header:after {
    content: '';
    width: 5px;
    height: 5px;
    position: absolute;
    background: #1a2b3c;
    left: 0;
    bottom: -3px;
    border-radius: 100%;
}

.price-header > span {
    font-size: 18px;
    color: #30323d;
    margin-bottom: 15px;
    font-weight: 600;
}

.price-header h2 {
    font-size: 60px;
    color: #ff60a3;
    font-weight: 500;
    font-family: 'Poppins', sans-serif;
    transition: all .3s;
}

.price-header h2 > span.sep {
    font-size: 18px;
    color: #30323d;
}

.price-header h2 > span {
    font-size: 18px;
    color: #30323d;
}

.price-item-list ul li {
    font-size: 17px;
    margin-bottom: 17px;

}

.price-item-list ul li:last-child {
    margin-bottom: 0px;
}

/* faq area css */

.faq-shape {
    position: absolute;
    right: -35px;
    top: 3px;
    z-index: -1;
}

.aprok-accordion-wrapper p {
    margin: 0;
    font-size: 15px;
}

.aprok-accordion-wrapper .card {
    margin-bottom: 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 73px 0px rgba(0, 0, 0, 0.09);
    border: 0;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px
}

.aprok-accordion-wrapper .btn {
    background-image: -moz-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    border-radius: 15px 15px 0 0;
    display: block;
    text-align: left;
    padding: 30px 35px;
    font-size: 18px;
    border: none;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
}

.aprok-accordion-wrapper .btn.collapsed {
    background: #fff;
    border-radius: 15px;
}

.aprok-accordion-wrapper .card-header:first-child {
    border-radius: 15px;
}

.aprok-accordion-wrapper .card-header {
    padding: 0;
    border-bottom: 1px solid transparent;
}

.aprok-accordion-wrapper .card-body {
    padding: 30px 50px 30px 35px;
}

.aprok-accordion-wrapper .accordion > .card:first-of-type {
    border-bottom-right-radius: inherit;
    border-bottom-left-radius: inherit;
}

.aprok-accordion-wrapper .accordion > .card {
    border-radius: 10px !important;
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    -ms-border-radius: 10px !important;
    -o-border-radius: 10px !important;
}

.aprok-accordion-wrapper h2 a.btn {
    color: #fff;
    position: relative;
}

.aprok-accordion-wrapper h2 a.btn:hover {
    color: #fff;
}

.aprok-accordion-wrapper h2 a.btn.collapsed {
    color: #30323d;
}

.aprok-accordion-wrapper h2 a.btn::after {
    content: "-";
    position: absolute;
    right: 25px;
    top: 30px;
    height: 25px;
    width: 25px;
    background: #fff;
    color: #000;
    text-align: center;
    line-height: 25px;
    border-radius: 30px;
}

.aprok-accordion-wrapper h2 a.btn.collapsed::after {
    content: "+";
    background-image: -moz-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(255, 153, 165) 0%, rgb(255, 96, 163) 100%);
    color: #fff;
}

.faq-thumb img {
    margin-left: -45px;
}

.faq-bottom-area h2 {
    font-weight: 600;
    font-size: 30px;
    color: #30323d;
    line-height: 40px;
}

/* testimonial area css */

.apork-testimonial-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    background-image: url(/assets/website/img/clash-s/testimonial-bg.png);
    background-color: #1a2b3c;
}

.apork-testimonial-area:before {
    background-image: -moz-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.851;
}

.single-testimonial p {
    font-size: 26px;
    color: #fff;
    font-style: italic;
    line-height: 1.50;
}

.single-testimonial .title-desig {
    margin: 40px 0;
}

.single-testimonial .title-desig h4 {
    color: #ff60a3;
    font-size: 18px;
    font-weight: 700;
    text-transform: capitalize;
    font-family: 'Poppins', sans-serif;
}

.single-testimonial .title-desig h4 span {
    text-transform: lowercase;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    margin-left: 20px;
    padding-left: 20px;
    position: relative;
}

.single-testimonial .title-desig h4 span:after {
    position: absolute;
    left: -3px;
    content: '-';
    font-size: 18px;
    top: 1px;
}

.single-testimonial img {
    width: 110px !important;
    height: 110px;
    margin: 0 auto;
    border-radius: 50%;
}

.testimonial-wraper .owl-nav div {
    left: 35%;
    position: absolute;
    bottom: 8%;
    transform: translateY(-50%);
    transition: all 0.3s ease 0s;
    text-align: center;
    line-height: 30px;
    font-size: 30px !important;
    color: #fff !important;
    background: transparent !important;
    border-radius: 0px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.testimonial-wraper .owl-nav div.owl-next {
    left: auto;
    right: 35%;
}

/* latest blog area css */

.blog-img-wraper {
    position: relative;
}

.blog-img-wraper img {
    width: 100%;
}

.blog-datetime {
    position: absolute;
    left: 0;
    bottom: 25px;
    background: #ff60a3;
    color: #fff;
    padding: 12px 18px;
    border-radius: 0 15px 15px 0;
    font-size: 14px;
    font-weight: 700;
    transform-origin: left;
    transform: scaleX(0);
    transition: all 0.4s ease-out;
    visibility: hidden;
    opacity: 0;
}

.single-blog-wraper:hover .blog-datetime {
    opacity: 1;
    visibility: visible;
    transform: scaleX(1);
}

.single-blog-wraper:hover .blog-content-wrap a {
    color: #ff60a3;
}

.blog-content-wrap {
    padding: 15px 3px 15px 15px;
}

.blog-content-wrap a {
    color: #1a2b3c;
    font-size: 22px;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;
    margin-bottom: 15px;
    display: block;
}

.blog-content-wrap p {
    font-size: 15px;
}

/* subscribe area css */

.apork-subscribe-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    position: relative;
    background-image: url(/assets/website/img/clash-s/subscribe-bg.jpg);
    background-color: #1a2b3c;
}

.subscribe-title h3 {
    color: #fff;
    font-size: 36px;
    font-weight: 500;
    text-transform: capitalize;
}

.subscribe-form input {
    width: 100%;
    height: 76px;
    border: none;
    background: #fff;
    padding: 0 33px;
    border-radius: 40px;
    font-size: 18px;
    color: #30323d;
}

.subscribe-form form {
    position: relative;
}

.subscribe-form form button {
    position: absolute;
    right: 8px;
    top: 8px;
    bottom: 8px;
}

/* client slider area css */

.single-client {
    padding: 0px 30px;
}

/* footer area css */

.apork-footer-area {
    background-position: center center;
    background-size: cover;
    background-attachment: inherit;
    background-image: url(/assets/website/img/clash-s/foot-bg.png);
    background-color: #1a2b3c;
}

/* wedget 1 css */

.widget-1 {}

.widget-1 p {
    color: #fff;
    font-size: 15px;
}

ul.footer-social {
    padding-top: 30px;
    margin-top: 25px;
    border-top: 1px solid #ff60a3;
}

ul.footer-social li {
    display: inline-block;
    margin-right: 25px;
}

ul.footer-social li a {
    color: #fff;
    font-size: 16px;
}

ul.footer-social li a i {}

.footer-logo {
    margin-bottom: 28px;
}

/* wedget 2 css */

.footer-widget > h3 {
    font-weight: 500;
    color: #fff;
    margin-bottom: 35px;
    text-transform: capitalize;
    font-size: 28px;
}

.widget-2 .media-body a {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    font-family: 'Poppins', sans-serif;
    display: block;
    margin-top: -5px;
    margin-bottom: 3px;
}

.widget-2 .media-body {
    margin-left: 20px;
}

.widget-2 .media-body .post-date {
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    text-transform: capitalize;
    font-family: 'Poppins', sans-serif;
}

.widget-2 .media-box .media {
    margin-bottom: 18px;
}

.widget-2 .media-box .media:last-child {
    margin-bottom: 0;
}

/* wedget 3 css */

ul.gallery-all-img {}

ul.gallery-all-img li {
    display: inline-block;
    margin: 0 15px 15px 0;
    width: 100px;
    height: 100px;
}

ul.gallery-all-img li:nth-child(3),
ul.gallery-all-img li:nth-child(6) {
    margin-right: 0;
}

ul.gallery-all-img li:nth-child(4),
ul.gallery-all-img li:nth-child(5) {
    margin-bottom: 0;
}

.footer-copyright p {
    color: #fff;
    font-size: 16px;
}

.footer-copyright {
    border-top: 1px solid #ff60a3;
    margin-top: 100px;
}

.footer-copyright p a {
    color: #fff;
    font-weight: 700;
}

/* breadcrumb area css */

.apork-breadcrumb-area {
    background-position: center center;
    background-size: cover;
    position: relative;
    background-image: url(/assets/website/img/clash-s/breadcrumb.png);
    padding: 140px 0;
    background-color: #1a2b3c;
}

.apork-breadcrumb-area:before {
    background-image: -moz-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -webkit-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    background-image: -ms-linear-gradient(178deg, rgb(47, 50, 212) 0%, rgb(113, 66, 247) 100%);
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: .7;
}

.apork-breadcrumb-area h1, .apork-breadcrumb-area h2 {
    color: #fff;
    font-size: 80px;
    font-weight: 500;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.apork-breadcrumb-area .breadcrumb {
    background: inherit;
    padding: 0;
    margin: 0;
}

.breadcrumb .breadcrumb-item {
    font-family: 'Poppins', sans-serif;
    font-size: 24px;
}

.apork-breadcrumb-area .breadcrumb .breadcrumb-item,
.apork-breadcrumb-area .breadcrumb-item.active a,
.apork-breadcrumb-area .breadcrumb .breadcrumb-item.active {
    color: #fff;
    text-transform: capitalize;
}

.apork-breadcrumb-area .breadcrumb .breadcrumb-item a {
    color: #ff60a3;
    text-transform: capitalize;
}

.apork-breadcrumb-area .breadcrumb-item + .breadcrumb-item::before {
    color: #fff;
}

/* sidebar wedget area css */

.single-sid-wdg {
    margin-bottom: 50px;
}

.sid-wdg-title {
    font-size: 18px;
    font-weight: 700;
    text-transform: capitalize;
    margin-bottom: 30px;
    color: #1a2b3c;
    padding: 15px;
    background: #f7faff;
    position: relative;
    line-height: 1;
}

.sid-wdg-title:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #ff60a3;
}

/* widget search area css */

.wdg-search-form {
    position: relative;
}

button.submit-btn {
    background: #f7faff none repeat scroll 0 0;
    border: 1px solid #f1f1f1;
    color: #1a2b3c;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 25px;
    padding: 15px 30px;
    display: inline-block;
    border-radius: 0;
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    border-left-color: #f7faff;
}

.wdg-search-form input {
    height: 57px;
    border-radius: 0;
    box-shadow: none;
    color: #1a2b3c;
    background: transparent;
    border: 1px solid #f1f1f1;
    width: 100%;
    padding: 20px;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    text-transform: capitalize;
}

.wdg-search-form input :focus {
    background: transparent !important;
    border: 1px solid #98cb2b;
}

/* widget latest post area css */

.single-wdg-post {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 20px;
}

.single-wdg-post:last-child {
    margin-bottom: 0;
}

.wdg-post-img {
    min-width: 100px;
    height: auto;
}

.wdg-post-content {
    padding-left: 12px;
}

.wdg-post-content h5 {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #1a2b3c;
}

.single-wdg-post:hover .wdg-post-content h5 a {
    color: #ff60a3;
}

.wdg-post-content span {
    margin-top: 10px;
    display: block;
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
    color: #777777;
}

/* widget post archive area css */

.wdg-post-archive li {
    margin-bottom: 25px;
}

.wdg-post-archive li:last-child {
    margin-bottom: 0;
}

.wdg-post-archive li a {
    font-size: 15px;
    color: #757575;
    font-weight: 400;
    display: block;
    text-transform: capitalize;
}

.wdg-post-archive li:hover a {
    color: #ff60a3;
}

.wdg-post-archive li a span {
    float: right;
}

/* widget tags area css */

.tag-list li {
    display: inline-block;
    margin: 0px 5px 10px 0px;
}

.tag-list li a {
    font-size: 13px;
    line-height: 24px;
    color: #1a2b3c;
    padding: 10px 15px;
    border: 1px solid #f1f1f1;
    display: block;
    transition: all .2s;
    text-transform: capitalize;
    border-radius: 20px;
}

.tag-list li a:hover {
    background: #ff60a3;
    color: #fff;
}

/* blog details area css */

.blog-details-content p {
    font-size: 15px;
}

.block-quote {
    background: #f7faff;
    border-left: 6px solid #ff60a3;
    padding: 35px 20px 35px 30px;
    box-shadow: 0px 0px 30px 0px rgba(26, 43, 60, 0.15);
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    margin: 40px 0;
}

.block-quote:before {
    content: url(assets/img/blog/quote.png);
    position: absolute;
    bottom: -22px;
    right: 15%;
}

.block-quote p {
    color: #1a2b3c;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
}

/* blog details share & comments */

.blog-share-comments-area {
    background: #f7faff;
    padding: 15px 30px;
    border: 1px solid #f1f1f1;
    margin-top: 30px;
}

.blog-share-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.blog-share-icon span {
    font-weight: 500;
    font-size: 15px;
    text-transform: capitalize;
    color: #1a2b3c;
}

ul.share-icon-list {
    margin-left: 15px;
}

ul.share-icon-list li {
    display: inline-block;
    margin-right: 10px;
}

ul.share-icon-list li:hover a {
    color: #fff;
    background: #ff60a3;
}

ul.share-icon-list li a {
    display: block;
    text-align: center;
    font-size: 18px;
    color: #1a2b3c;
    background: #fff;
    border-radius: 50%;
    line-height: 40px;
    width: 40px;
    height: 40px;
    transition: .3s all;
    border: 1px solid #f1f1f1;
}

ul.share-icon-list li a i {}

ul.blog-comments-count {
    margin: 8px 0;
}

ul.blog-comments-count li {
    font-size: 15px;
    color: #1a2b3c;
    font-weight: 500;
}

ul.blog-comments-count li i {
    margin-right: 5px;
}

/* blog author area css */

.blog-author-area {
    border: 4px solid #f1f1f1;
    display: flex;
    align-items: start;
    justify-content: center;
    padding: 35px 25px;
    background: #f7faff;
    margin: 60px 0;
}

.blog-author-img {
    width: 360px;
    height: auto;
    margin-right: 20px;
}

.blog-author-img img {
    border-radius: 50%;
}

.author-desig {
    margin-bottom: 18px;
}

.author-desig h3 {
    font-weight: 600;
    font-size: 20px;
    text-transform: capitalize;
    color: #010101;
    font-family: 'Poppins', sans-serif;
}

.blog-author-area p {
    font-size: 15px;
    color: #878991;
}

/* related post area css */

.post-heading {
    margin-bottom: 30px;
}

.post-heading h3 {
    font-size: 20px;
    font-weight: 600;
    text-transform: capitalize;
    font-family: 'Poppins', sans-serif;
}

/* recent comments area css */

.comments-box {
    margin-bottom: 40px;
}

.comments-avatar {
    float: left;
    width: 150px;
}

.comments-avatar img {
    border-radius: 50%;}

.comments-text {
    overflow: hidden;
    padding-left: 30px;
}

.avatar-name-date {
    overflow: hidden;
}

.avatar-name-date > h5 {
    font-size: 18px;
    font-weight: 500;
    text-transform: capitalize;
    color: #1a2b3c;
    font-family: 'Poppins', sans-serif;
}

.avatar-name-date span {
    text-transform: capitalize;
    font-weight: 400;
    font-size: 14px;
    margin: 10px 0 12px;
    display: block;
    color: #333333;
    font-family: 'Poppins', sans-serif;
}

.comments-text > p {
    margin-bottom: 20px;
    color: #878991;
    font-size: 15px;
}

.comments-text > a {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    color: #1a2b3c;
    font-family: 'Poppins', sans-serif;
}

.comments-reply {
    padding-left: 130px;
}

.post-comments-form input.form-control {
    border-radius: 0;
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #f7faff;
    border: none;
}

.post-comments-form textarea.form-control {
    border-radius: 0;
    box-shadow: none;
    color: #777777;
    height: 133px;
    margin-bottom: 30px;
    background: #f7faff;
    border: none;
    padding: 15px;
}

/* contact area css */

.contact-info-icon {
    display: inline-block;
    background: #f7faff;
    border-radius: 50%;
    border: 4px solid #f1f1f1;
    width: 100px;
    height: 100px;
}

.contact-info-icon img {
    padding: 25px 0;
}

ul.contact-info {
    margin-top: 35px;
}

ul.contact-info li,
ul.contact-info li a {
    font-size: 18px;
    color: #1a2b3c;
    font-weight: 500;
    margin-bottom: 0px;
    font-family: 'Poppins', sans-serif;
}

#apork-map {
    width: 100%;
    height: 400px;
}

/* contact form area css */

.apork-contact-form input.form-control {
    border-radius: 0;
    box-shadow: none;
    color: #777777;
    height: 50px;
    margin-bottom: 30px;
    background: #f7faff;
    border: none;
}

.apork-contact-form textarea.form-control {
    border-radius: 0;
    box-shadow: none;
    color: #777777;
    height: 133px;
    margin-bottom: 30px;
    background: #f7faff;
    border: none;
    padding: 15px;
}

/* error area css */

.error-content {
    margin-top: 100px;
}

.error-content h2 {
    color: #1a2b3c;
    font-family: 'Poppins', sans-serif;
    font-size: 66px;
    font-weight: 700;
    text-transform: capitalize;
}

.error-content h2 span {
    color: #ff60a3;
}

.error-content p {
    margin: 45px 0;
}

.header-logo h1, .header-logo span {font-size: 2.5rem;font-weight: bold;color: #333;}
.xcblog-blog-list .item {margin-bottom: 1.5rem;}
.xcblog-blog-list .item h3 {font-size: 1.5rem;margin-bottom: 0.5rem;}