/*!
Theme Name: First Mobile
Theme URI: http://underscores.me/
Author: tsp27
Author URI: http://tsp2702@gmail.com
Description: Description theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: mobi_by_tsp27
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

First Mobile is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
















@media (min-width: 1366px) and (max-width: 1600px) {
  .blog-detials-area h2 {
    font-size: 28px;
    line-height: 41px;
  }
}
.blog-detials-area h2 {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 15px;
}

.blog-detials-area h3 {
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 15px;
}

.blog-detials-area p {
  color: #777777;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  text-align: left;
  font-family: 'Montserrat', sans-serif;
  margin-bottom: 18px;
}





.blog-details-main ul {
	list-style-type: none;
  margin-bottom: 30px;
}
.blog-details-main ul li {
  font-family: 'Montserrat', sans-serif;
  color: #777777;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
}
.blog-details-main ul li::before {
  content: "\2713";
  display: inline-block;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  border: 1px solid #ddd;
  margin-right: 20px;
  text-align: center;
  font-size: 16px;
}


.blog-detials-area blockquote {
  background: rgba(240,40,48,0.1);
  padding: 40px 38px 26px;
  margin-top: -8px;
  margin-bottom: 25px;
}

.blog-detials-area blockquote p {
  font-size: 18px;
  color: #0E1317;
  font-weight: 500;
  font-family: 'Open Sans';
}


.blog-details-content-list p {
	margin-bottom: 0;
}


/* кнопки следующая предыдущая под записью */
#blog-details-button a {
  display: inline-block;
  border: 2px solid #f90000;
  padding: 3px 20px;
  position: relative;
  z-index: 1;
  background: transparent;
  color: #f90000;
  border-radius: 3px;
  margin-bottom: 10px;
}
#blog-details-button a:first-child {
  margin-right: 10px;
}
#blog-details-button a:hover {
  background: #f90000;
  color: #fff;
  transition: .5s;
}


/* правка основного меню */
.header-menu ul li .sub-menu {
  width: 300px;
}

.services-thumb img {
  width: 300px !important;
  height: 222px !important;
  object-fit: cover;
}



/* для услуг */
.single-services h3 {
  padding-bottom: 15px;
}
.service-detials-area h1 {
  @media (min-width: 1366px) and (max-width: 1600px) {
  .service-detials-area h1 {
    font-size: 32px;
  }
}
}
.service-detials-area h1 {
  padding-bottom: 18px;
    font-size: 30px;
}
.service-detials-area h2 {
  font-size: 30px;
  padding-bottom: 15px;
}
.service-detials-area p {
  padding-bottom: 18px;
}
.service-detials-area .wp-video {
  padding-bottom: 18px;
}
.service-detials-area .single-services ul li {
  list-style: none;
  position: relative;
  padding-left: 30px;
  padding-right: 12px;
  padding-bottom: 12px;
}
.service-detials-area .single-services ul li:before {
  position: absolute;
  content: "";
  left: 0;
  top: 9px;
  height: 12px;
  width: 12px;
  background: #f90000;
  border-radius: 50%;
}
@media (min-width: 1366px) and (max-width: 1600px) {
  .service-detials-area .service-details-content h2 {
    font-size: 16px;
    padding-bottom: 3px;
    padding-top: 0;
  }
}

.service-details-number {
  position: absolute;
  right: 60px;
}
.service-details-number h2 {
  font-size: 48px;
  text-transform: none;
  margin: 0;
  margin: 0;
  color: transparent !important;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #0E1317;
  opacity: .5;
}
.service-details-icon svg {
  width: 61px;
  height: 50px;
  fill: #f90000;
}
/* конец для услуг */



/* хлебные крошки */
.breadcumb-area {
  padding: 20px 0 30px;
}
.breadcumb-content .page-title {
  font-size: 40px;
  color: #fff;

  transition: .5s;
  font-family: 'Montserrat', sans-serif;
  font-style: normal;
  margin-bottom: 0;
  margin-top: 11px;
  line-height: 1.0;
  font-weight: 700;
}

.breadcrumb-list {
  list-style-type: none;
}
.breadcrumb-list li {
  display: inline-block;
  font-size: 12px !important;
  color: #000 !important;
}
.breadcrumb-list li a {
  color: #fff;
  font-size: 12px !important;
}
.breadcrumb-list li a:hover {
  color: #000;
}
.breadcrumb-list li span {
  color: #fff;
}



/* стили для страницы */
.site-main {
  padding: 25px 0 25px;
}
@media (min-width: 1366px) and (max-width: 1600px) {
  .site-main h2 {
    font-size: 28px;
    line-height: 41px;
  }
}
.site-main h2 {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 15px;
}

.site-main h3 {
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 15px;
}

.site-main p {
  color: #777777;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 28px;
  text-align: left;
  font-family: 'Montserrat', sans-serif;
  margin-bottom: 18px;
}

.site-main ul {
	list-style-type: none;
  margin-bottom: 30px;
}
.site-main ul li {
  font-family: 'Montserrat', sans-serif;
  color: #777777;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
}
.site-main ul li::before {
  content: "\2713";
  display: inline-block;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  border: 1px solid #ddd;
  margin-right: 20px;
  text-align: center;
  font-size: 16px;
}

.site-main blockquote {
  background: rgba(240,40,48,0.1);
  padding: 40px 38px 26px;
  margin-top: -8px;
  margin-bottom: 25px;
}
.site-main blockquote p {
  font-size: 18px;
  color: #0E1317;
  font-weight: 500;
  font-family: 'Open Sans';
}



/* виджеты */
.sidebar .widget-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 24px;
  border-bottom: 2px solid #f90000;
  padding: 0px 0 15px;
    padding-left: 0px;
  margin: 0 0 30px;
  position: relative;
  padding-left: 10px;
}
.sidebar .widget-title::before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 24px;
  width: 3px;
  background: #f90000;
}

.widget_categories, .widget_archive, .widget_tag_cloud {
  background: #fff;
  padding: 42px 40px 25px;
  border-radius: 5px;
  margin-bottom: 30px;
  box-shadow: 0px 0px 70px rgb(0 0 0 / 5%);
}

.widget_archive ul li {
  list-style: none;
  margin-bottom: 6px;
}
.widget_archive ul li a {
  font-weight: 600;
  transition: .5s;
}
.widget_archive ul li a::before {
  content: url('./assets/img/angle-right.svg');
  display: inline-block;
  font-size: 17px;
  width: 22px;
  height: 17px;
  margin-right: 3px;
}

.widget_tag_cloud a {
  display: inline-block;
  border: 2px solid #f90000;
  padding: 3px 20px;
  margin: 4px 3px;
  border-radius: 2px;
  color: #f90000;
  font-weight: 500;
  position: relative;
  transition: .5s;
  z-index: 1;

  font-size: 16px !important;
}


.widget_tag_cloud a::before {
  position: absolute;
  content: "";
  left: -2px;
  top: 0px;
  height: 102%;
  width: 0%;
  background: #f90000;

  z-index: -1;
  border-radius: 3px;

  transition: .5s;
}

.widget_tag_cloud a:hover{
    color: #fff;
    border-color: #f90000;
}


.widget_categories ul li {
  display: block;
  list-style: none;
  margin-bottom: 15px;
  background: transparent;
  padding: 16px 20px 16px;
  border-radius: 4px;
  transition: .5s;
  border: 2px solid #f90000;
  position: relative;
  z-index: 1;
}
.widget_categories ul li::before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 0;
  background: #f90000;
  transition: .5s;
  z-index: -1;
}
.widget_categories ul li a {
  display: block;
  color: #f90000;
  transition: .5s;
}
.widget_categories ul li::after {
  content: url('./assets/img/angle-right.svg');
  display: inline-block;
  float: right;
  background: #f90000;
  height: 22px;
  width: 22px;
  font-size: 12px;
  text-align: center;
  margin-top: 6px;
  color: #fff;
  line-height: 22px;
  transition: .5s;
}
.widget_categories ul li:hover a span {
    /*background: #fff;
    color: #f90000;*/
}

.widget_categories ul li:hover a {
    color: #fff;
}


/* виджеты в подвале */
.footer-widget-title {
  color: #fff;
  font-size: 22px;
  margin-bottom: 37px;
  position: relative;
}
.footer-widget-title::before {
  position: absolute;
  content: "";
  width: 58px;
  height: 1px;
  left: 4px;
  bottom: -17px;
  background: #fff;
  display: inline-block;
}
.widget-footer ul li {
  list-style: none;
  position: relative;
  margin-left: 14px;
}
.widget-footer ul li:before {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    top: 11px;
    left: -14px;
    background: #fff;
    border-radius: 50px;
}
.widget-footer ul li a {
  color: #fff;
  display: inline-block;
  margin-bottom: 6px;
}
.widget-footer ul li a:hover{
    color: #f90000;
}

.footer-widget-desc h4 {
  color: #FFF;
  font-size: 16px;
  padding-top: 32px;
  margin-top: 7px;
}
.footer-social-icon ul li::before {
  content: none;
}
.footer-social-icon ul li {
  margin: 0;
}


/*.hero-area {
  filter: hue-rotate(120deg) saturate(110%);
}
.breadcumb-area {
  filter: hue-rotate(120deg) saturate(110%);
}
.footer-area {
  filter: hue-rotate(120deg) saturate(110%);
}*/


.top-bar-info a:hover {
  color: #000;
}



/* FAQ */
.faqs-accordion-item ul h3 {
  line-height: 1.5;
  text-indent: 0;
  margin-left: 20px;
  padding-right: 20px !important;
}
.faqs-accordion-item ul p {
  margin-top: 15px;
}

.working-process-area {
  filter: hue-rotate(110deg) saturate(130%);
}









/* кнопки */
.test1 a {
    /*display: inline-block !important;
    height: 28px !important;
    line-height: 28px !important;*/
    background-image: -webkit-linear-gradient(30deg, #fff 50%, transparent 50%) !important;
    background-image: linear-gradient(30deg, #fff 50%, transparent 50%) !important;
    background-size: 500px !important;
    background-repeat: no-repeat !important;
    background-position: 0% !important;
    -webkit-transition: background 300ms ease-in-out !important;
    transition: background 300ms ease-in-out !important;
}

.test1 a:hover{
  background-position: 100% !important;
  color: #fff !important;
}