/* Medium Layout: 1280px. */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	/*
	* ====================================
	*  About Three
	* ====================================
	*/
	.about-content .title {
		font-size: 30px;
		line-height: 1.2;
	}
	.get-started-content {
		padding-left: 20px;
	}
}

/* Tablet Layout: 768px. */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	h2 {
		font-size: 35px;
	}

	/*
	* ====================================
	*  Header One
	* ====================================
	*/
	.header-one .header-nav .logo {
		margin: 5px 20px 0 0;
	}
	.header-one .header-nav .menu > ul > li > a {
		padding: 8px 15px;
	}

	/*
	* ====================================
	*  About Section One
	* ====================================
	*/
	#about-section-one .right-side p {
		padding-right: 20px;
	}
	#about-section-one .right-side .partners-logo-wrpr ul li {
		width: 80px;
	}
	.about-image {
		margin-bottom: 50px;
	}

	/*
	* ====================================
	*  Our Thinking Section One
	* ====================================
	*/
	#our-thinking-section-one .right-side .our-thinking {
		font-size: 25px;
		margin-bottom: 20px;
	}
	#our-thinking-section-one .right-side {
		padding: 60px 0 60px 25px;
	}
	#our-thinking-section-one:before {
		width: 25%;
	}
	#our-thinking-section-one .left-side {
		left: 25%;
		width: 350px;
	}

	/*
	* ====================================
	*  Our Thinking Section Two
	* ====================================
	*/
	#our-thinking-section-two .left-side-inner {
		margin: 80px 0 60px 0;
		padding: 20px 30px;
	}
	#our-thinking-section-two .left-side .our-thinking {
		font-size: 25px;
		margin-bottom: 20px;
	}
	#our-thinking-section-two .right-side {
		right: 5%;
		width: 35%;
	}

	/*
	* ====================================
	*  Fun Fact Section One
	* ====================================
	*/
	#fun-fact-section-one .number {
		font-size: 40px;
	}

	/*
	* ====================================
	*  Pricing Table Section One
	* ====================================
	*/
	#pricing-table-section-one .pricing-table-item {
		padding: 15px 15px 55px;
	}
	#pricing-table-section-one .pricing-table-item h3 {
		font-size: 20px;
	}
	#pricing-table-section-one .pricing-table-item .price {
		font-size: 25px;
	}

	/*
	* ====================================
	*  Sidebar
	* ====================================
	*/
	.sidebar-widget {
		padding: 25px 15px;
	}
	.sidebar-widget .sidebar-single-post .image-box {
		width: 50px;
	}
	.sidebar-widget .sidebar-single-post .contents {
		width: calc(100% - 50px);
		padding-left: 10px;
	}

	.tj-cta__title-box .cta-title {
		margin-bottom: 20px;
	}

	/*
	* ===============================
	*  Hero Banner -2
	* ===============================
	*/
	.hero-banner-2 .title {
		font-size: 40px;
	}
	.hero_brands {
		margin-top: 30px;
	}

	/*
	* ===============================
	*  Get Started
	* ===============================
	*/
	.get-started-image {
		width: 42%;
	}
	.get-started-content {
		padding-left: 20px;
		padding-top: 60px;
		padding-bottom: 60px;
	}
	.get-started-content .get-started-title .cta-title {
		font-size: 35px;
	}

	.feature_testimonial .testi_title .title {
		font-size: 35px;
	}
	.consultation_form {
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0px;
	}
	.consult_image .image_inner {
		margin: auto;
	}
	#page-header-section .breadcrumb_title,
	#page-header-section h1 {
		font-size: 45px;
	}
}

/* Mobile Layout: 320px. */

@media only screen and (max-width: 767px) {
	/*
	* ===============================
	*  Defult CSS 
	* ===============================
	*/
	.video-modal-primary .close {
		right: 0;
		top: -40px;
	}

	/*
	* ===============================
	*  Typograpgy
	* ===============================
	*/
	h1 {
		font-size: 35px;
	}
	h2 {
		font-size: 30px;
	}
	.section-header.style-3 p {
		font-size: 16px;
		line-height: 1.5;
	}
	.section-header.style-3 .section_title {
		font-size: 25px;
		line-height: 1.2;
		margin-bottom: 20px;
	}

	/*
	* ====================================
	*  Header One
	* ====================================
	*/
	.header-one .top-bar {
		font-size: 10px;
		padding: 10px 0;
	}
	.header-one .top-bar .help-text > span {
		display: none;
	}
	.header-one .mobile-menu {
		display: block;
	}
	.header-one .header-nav {
		padding: 10px 0;
	}
	.header-one .header-nav .menu {
		display: none;
	}
	.header-one .header-nav .logo {
		margin: 3px 15px 0 0;
		max-width: 120px;
	}
	.header-one .slicknav_menu {
		background: transparent;
		padding: 0;
	}
	.header-one .slicknav_btn {
		background-color: var(--color-primary);
	}
	.header-one .slicknav_nav {
		background: var(--color-black);
	}
	.header-one .slicknav_nav a:hover {
		background: var(--color-primary);
		color: var(--color-white);
	}
	.header-one .header-nav .search-icon {
		margin-left: 5px;
	}

	/*
	* ====================================
	*  Hero Section One
	* ====================================
	*/
	#hero-section-one {
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}

	/*
	* ===============================
	*  Hero Banner -2
	* ===============================
	*/
	.hero-banner-2 .title {
		font-size: 30px;
		margin-bottom: 15px;
	}
	.hero_brands {
		margin-top: 40px;
	}
	.hero_brands .brands_title {
		margin-bottom: 0px;
	}
	.hero_brands_logos .brand_logo {
		margin-top: 15px;
		max-width: 80px;
	}
	.hero_brands_logos .brand_logo:not(:last-child) {
		margin-right: 25px;
	}
	.hero-banner-2 .lead {
		font-size: 18px;
		line-height: 26px;
		margin-bottom: 20px;
	}

	/*
	* ====================================
	*  Hero Section Two
	* ====================================
	*/
	#hero-section-two .hero-slider-item.bg-two {
		background-image: url("../img/hero/1-mob.jpg");
	}
	#hero-section-two .owl-prev {
		left: 15px;
	}
	#hero-section-two .owl-next {
		right: 15px;
	}

	/*
	* ====================================
	*  Our Partner Area
	* ====================================
	*/
	.our-partner-area {
		padding: 10px 0 0 0;
	}
	.our-partner-area .small-secondary {
		margin: 0 0 5px;
	}
	.our-partner-area ul li {
		width: 32%;
		float: left;
		line-height: 30px;
		padding-right: 10px;
		margin-bottom: 10px;
	}
	/*
	* ====================================
	*  About Section One
	* ====================================
	*/
	#about-section-one .left-side {
		max-width: 400px;
		margin: 0 auto 50px;
	}
	#about-section-one .left-side .img-wrpr img {
		width: 80%;
	}
	#about-section-one .right-side p {
		padding-right: 0;
	}

	/*
	* ====================================
	*  About Section Two
	* ====================================
	*/
	#about-section-two .left-side {
		max-width: 400px;
		margin: 0 auto 50px;
	}

	/*
	* ====================================
	*  About Section Three
	* ====================================
	*/
	.about-image {
		margin-bottom: 50px;
	}
	.about-content .title {
		font-size: 25px;
		line-height: 1.2;
		margin-bottom: 20px;
	}
	.about-content .about-feature {
		margin-top: 20px;
	}
	.about-content .about-feature .single-feature {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
	.about-content .about-feature .single-feature.awards {
		margin-bottom: 20px;
	}

	/*
	* ====================================
	*  Services Section One
	* ====================================
	*/
	#services-section-one .service-item {
		background-color: var(--color-primary);
		background-image: url("../img/pattern/2.png");
		background-repeat: no-repeat;
		background-position: top right;
		background-size: contain;
	}
	#services-section-one .service-item a {
		opacity: 1;
		visibility: visible;
		margin-left: 0;
	}

	/*
	* ====================================
	*  Services Section Two
	* ====================================
	*/
	#services-section-two .service-item {
		margin: 0 auto 50px;
		background-color: var(--color-primary);
	}

	/*
	* ====================================
	*  Single Service Section
	* ====================================
	*/
	#single-service-section {
		padding: 60px 0 50px;
	}
	#single-service-section img {
		margin-bottom: 30px;
	}

	/*
	* ====================================
	*  Our Thinking Section One
	* ====================================
	*/
	#our-thinking-section-one .right-side {
		padding: 60px 0;
	}
	#our-thinking-section-one:before,
	#our-thinking-section-one .left-side {
		display: none;
	}

	/*
	* ====================================
	*  Our Thinking Section Two
	* ====================================
	*/
	#our-thinking-section-two .left-side {
		width: 80%;
		margin: 0 10%;
	}
	#our-thinking-section-two .left-side-inner {
		margin: 80px 0 60px 0;
		padding: 15px 25px;
	}
	#our-thinking-section-two .left-side .our-thinking {
		font-size: 22px;
		margin-bottom: 20px;
	}
	#our-thinking-section-two .right-side {
		position: inherit;
		bottom: inherit;
		right: inherit;
		width: 70%;
		margin: 0 auto;
	}

	/*
	* ====================================
	*  Fun Fact Section One
	* ====================================
	*/
	#fun-fact-section-one .col-3 {
		padding-right: 5px;
		padding-left: 5px;
	}

	/*
	* ====================================
	*  Testimonial Section One
	* ====================================
	*/
	#testimonial-section-one p {
		font-size: 20px;
		margin: 0 auto 35px;
	}
	.feature_testimonial .testi_title .title {
		font-size: 25px;
	}
	/*
	* ====================================
	*  Our Approach Section
	* ====================================
	*/
	#our-approach-section .left-side {
		padding-right: 0;
	}

	/*
	* ====================================
	*  Team Section One
	* ====================================
	*/
	#team-section-one .team-item {
		max-width: 250px;
		margin: 0 auto 50px;
	}
	#team-section-one .team-item p {
		margin-bottom: 10px;
	}
	#team-section-one.style-2 .team-item {
		max-width: 350px;
		width: 100%;
		margin-bottom: 50px;
		margin-left: auto;
		margin-right: auto;
	}

	/*
	* ====================================
	*  Success Section One
	* ====================================
	*/
	#success-section-one {
		padding: 60px 0 20px;
	}
	#success-section-one .success-steps-item {
		margin-bottom: 20px;
	}
	#success-section-one .bg-image {
		display: none;
	}

	/*
	* ====================================
	*  Blog Section One
	* ====================================
	*/
	#blog-section-one .blog-item {
		max-width: 350px;
		margin: 0 auto 50px;
	}
	.blog-section-inner .contents {
		padding: 25px 15px;
	}
	/*
	* ====================================
	*  Single Post Section
	* ====================================
	*/
	#single-post-section {
		padding: 60px 0 10px;
	}
	#single-post-section .single-post .author-image {
		width: 60px;
		margin: 0 0 10px 0;
	}
	#single-post-section .single-post .contents,
	#single-post-section .single-post .post-text.contents,
	.tj__post .tj__content .tj-post__tags {
		width: 100%;
	}
	#single-post-section .single-post .post-text.contents,
	.tj__post .tj__content .tj-post__tags {
		margin-left: 0px;
	}
	#single-post-section .single-post .contents .author-info h4 {
		margin-bottom: 5px;
	}
	#single-post-section .single-post .comments-box .media img {
		max-width: 60px;
	}
	#single-post-section .single-post .comments-box .comment {
		margin-bottom: 25px;
	}
	#single-post-section .single-post .comments-box {
		margin-left: 0;
	}
	.tj__comment .tj-comment__wrap .comment__avatar {
		max-width: 60px;
		-webkit-box-flex: 0;
		-ms-flex: 0 0 60px;
		flex: 0 0 60px;
	}
	.tj-latest__comments .children {
		margin-left: 76px;
	}
	/*
	* ====================================
	*  Get Started Section One
	* ====================================
	*/
	#get-started-section-one {
		padding: 60px 0 0;
	}

	/*
	* ====================================
	*  Get Started Section Two
	* ====================================
	*/
	#get-started-section-two {
		padding: 60px 0;
	}

	/*
	* ====================================
	*  Success Section Two
	* ====================================
	*/
	#success-section-two {
		padding: 60px 0 10px;
	}
	#success-section-two .success-steps-item {
		max-width: 300px;
		margin: 0 auto 50px;
	}
	#success-section-two .success-steps-item .icon {
		margin-bottom: 15px;
	}
	.get-started-image {
		width: 100%;
		height: 300px;
		position: relative;
	}
	.get-started-content {
		padding-left: 0px;
		padding-top: 60px;
		padding-bottom: 60px;
	}
	.get-started-content .get-started-title .cta-title {
		font-size: 25px;
	}

	.get-started-content .get-started-title {
		margin-bottom: 25px;
	}
	/*
	* ====================================
	*  Pricing Table Section One
	* ====================================
	*/
	#pricing-table-section-one .pricing-table-item {
		height: inherit;
	}

	/*
	* ====================================
	*  Contact Section
	* ====================================
	*/
	#contact-section .contact-item {
		padding: 35px 5px 25px;
		height: inherit;
	}
	#contact-section .contact-map-form {
		margin-top: 25px;
	}
	#contact-section #googleMap {
		margin-top: 50px;
	}

	/*
	* ====================================
	*  Page Header Section
	* ====================================
	*/
	#page-header-section {
		padding: 110px 0 40px;
	}

	/*
	* ====================================
	*  Footer Area
	* ====================================
	*/
	.footer-one .footer-top {
		padding: 60px 0 0;
	}
	.footer-one .footer-top .footer-logo,
	.footer-one .footer-top h3 {
		margin-bottom: 15px;
	}
	.footer-one .footer-item {
		margin-bottom: 25px;
	}
	.footer-one .footer-top .links li {
		margin-bottom: 5px;
	}
	.footer-one .footer-bottom .left-side,
	.footer-one .footer-bottom .right-side {
		text-align: center;
	}
	.footer-one .footer-bottom .right-side {
		margin-top: 10px;
	}
	.footer-one .footer-bottom .right-side ul li {
		margin: 0 8px;
	}
	.footer-one .footer-bottom {
		padding: 15px 0 20px;
	}

	/*
	* ====================================
	*  Scroll To Top
	* ====================================
	*/
	#scroll-to-top {
		bottom: 5px;
		font-size: 30px;
	}
	#scroll-to-top.active {
		-webkit-transform: translateY(-20px);
		-ms-transform: translateY(-20px);
		transform: translateY(-20px);
	}

	.tj-cta__title-box .cta-title {
		margin-bottom: 20px;
	}
	.tj-cta_input_box input[type="text"],
	.tj-cta_input_box input[type="email"] {
		height: 45px;
		padding: 0 20px;
	}

	.tj-cta_input_box .btn {
		position: relative;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
		right: auto;
		left: auto;
		margin-top: 20px;
	}
	#team-section-one.style-3 .team-item {
		max-width: 350px;
		margin-left: auto;
		margin-right: auto;
	}

	.consultation_form {
		padding: 30px 15px;
		margin-top: 60px;
		margin-bottom: 0;
	}

	.consultation_form .title {
		font-size: 25px;
		line-height: 30px;
	}

	.consultation_form .form_fields input[type="text"],
	.consultation_form .form_fields input[type="email"],
	.consultation_form .form_fields input[type="tel"],
	.consultation_form .form_fields textarea {
		border-radius: 15px;
	}
	#page-header-section.style-2 .breadcrumb_title {
		font-size: 30px;
		line-height: 35px;
		font-weight: 600;
	}
	#page-header-section.style-2 {
		padding: 150px 0 60px 0;
	}
	.get-started-three .get-started-image {
		width: 100%;
		height: 300px;
	}
	.get-started-three .get-started-content {
		padding-left: 0;
		padding-top: 330px;
		padding-bottom: 60px;
	}
	.get-started-three .get-started-content .get-started-title .cta-title {
		font-size: 25px;
		line-height: 1.2;
	}
	.get-started-three.style-4 .get-started-content {
		padding-top: 330px;
		padding-bottom: 60px;
	}
	.progress-wrap {
		right: 15px;
		bottom: 15px;
	}
	#page-header-section .breadcrumb_title,
	#page-header-section h1 {
		font-size: 35px;
	}
}

/* Wide Mobile Layout: 480px. */

@media only screen and (min-width: 576px) and (max-width: 767px) {
	/*
	* ===============================
	*  Defult CSS 
	* ===============================
	*/
	.video-modal-primary .close {
		right: -30px;
		top: -34px;
	}

	/*
	* ===============================
	*  Typograpgy
	* ===============================
	*/
	h1 {
		font-size: 35px;
	}

	/*
	* ====================================
	*  Header One
	* ====================================
	*/
	.header-one .top-bar {
		font-size: 12px;
	}

	/*
	* ====================================
	*  Fun Fact Section One
	* ====================================
	*/
	#fun-fact-section-one .number {
		font-size: 30px;
	}

	/*
	* ====================================
	*  Testimonial Section One
	* ====================================
	*/
	#testimonial-section-one p {
		font-size: 25px;
	}
	.tj-posts__area {
		padding-top: 60px;
		padding-bottom: 10px;
	}
	.tj-cta_input_box input[type="text"],
	.tj-cta_input_box input[type="email"] {
		height: 60px;
		padding: 0 135px 0px 30px;
	}

	.tj-cta_input_box .btn {
		position: absolute;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		right: 8px;
		left: auto;
		margin-top: 0px;
	}
}
