/* Определение переменных для цвета в корне документа */
:root {
  --doc_back1_color: #fcf6dc; /* Основной 1 цвет фона */
  --doc_back2_color: #b1aa52; /* Основной 2 цвет фона */
  --doc_back2_color_light: #fbf4cf29; /* Основной прозрачный 1 цвет фона */
  --doc_text_color: #333333; /* Основной цвет текста */
  --doc_back3_color: #fcf2cd; /* Основной 3 цвет фона*/

}

body,
.progress-bar.progress-bar-primary  {
/**** общий фон и цвет текста   ****/
  background-color: var(--doc_back1_color); 
  color: var(--doc_text_color);
} 

h1, h2, h3, h4, h5 {
  color: var(--doc_text_color);
}

h6 {
  color: var(--doc_text_color);
}

/**** общий цвет текста для parallax ****/
.parallax,
.parallax h1,
.parallax h2,
.parallax h3,
.parallax h4,
.parallax h5,
.parallax h6,
.parallax input,
.parallax input:hover,
.parallax textarea,
.parallax textarea:hover {
  color: var(--doc_back1_color);
}


/**** цвет текста и фон кнопок ссылок parallax ****/
.parallax .btn.btn-primary:hover {
  color: var(--doc_back2_color);
  background: var(--doc_back3_color); 
  border-color: var(--doc_back2_color); 	 		
}

/**** цвет текста и фон кнопок ссылок parallax ****/
.parallax .btn.btn-primary {
  color: var(--doc_back1_color);
  background: var(--doc_back2_color); 
  border-color: var(--doc_back1_color); 
}

.preloader {
  background: var(--doc_back1_color);
}

/**** общий цвет текста ссылок ****/
a,
#home-slider .caption h1 span, 
#twitter-carousel .item span, 
#single-portfolio .close-folio-item:hover, 
.contact-info ul li a:hover, 
.dropdown-menu li a   {
  color: var(--doc_text_color);
}

/**** общий цвет фонов  ****/
.service-icon, 
.single-table.featured, 
.twitter-icon .fa-twitter, 
.twitter-left-control:hover, 
.twitter-right-control:hover, 
.post-icon, 
.entry-header .date:after, 
#footer, 
#about-us,
.caption .btn-start:hover, 
.left-control:hover, 
.right-control:hover,
.dropdown-menu,  
.folio-overview a:hover {
  background-color: var(--doc_back2_color);
}


.gradient-animated-text {
  background: linear-gradient(90deg, var(--doc_back2_color), var(--doc_back3_color));
}


 .main-nav { /**** градиенты фонов секций ****/
  background: linear-gradient(to left, var(--doc_back2_color) calc(5% + 10vw),var(--doc_back3_color));
}

.footer-top {
  background: linear-gradient(to bottom, var(--doc_back2_color) 20%, var(--doc_back3_color));
}

.footer-bottom {
  background: linear-gradient(to bottom, var(--doc_back3_color) 10%, var(--doc_back2_color));
}


/**** общий фон и цвет текста прогрессбара ****/
.progress-bar.progress-bar-primary  {
  background-color: var(--doc_back1_color);
  color: var(--doc_text_color);
} 

.progress{
  background-color: var(--doc_back3_color);
}


/**** цвет текста кнопок и меню ****/
.navbar-right li a,
.dropdown-menu li a:hover {
  color: var(--doc_back1_color);
}

/**** цвет текста и фон кнопок ссылок ****/
.btn.btn-primary {
  color: var(--doc_back1_color); 
  background: var(--doc_back2_color);
  border-color: var(--doc_back2_color);	
}

/**** цвет текста и фон кнопок ссылок ****/
.btn.btn-primary:hover,
.single-table.featured .btn.btn-primary:hover  {
  color: var(--doc_back2_color);
  background: var(--doc_back3_color); 
  border-color: var(--doc_back2_color); 		
}

/**** цвета пункта меню под мышкой и того что в фокусе ****/
.navbar-nav li a:hover,
.navbar-nav li a:focus,
.dropdown-menu li a:hover {
  background: var(--doc_back2_color_light); 
}

/**** цвета выпадающего меню и нажатого пункта меню ****/
.navbar-right li.active a,
.navbar-nav > .open > a, 
.navbar-nav > .open > a:focus, 
.navbar-nav > .open > a:hover {
  color: var(--doc_back2_color);
  background: var(--doc_back3_color);
}



/**** цвет текста  и фон кнопок соцсетей ****/
.social-icons ul li a {
  color: var(--doc_back1_color);
  border-color: var(--doc_back1_color);
  background: var(--doc_back2_color);
}

.social-icons ul li a:hover {
  color: #f5f5f5
}

.social-icons ul li a.envelope:hover {
  background-color: #CECB26;
}

.social-icons ul li a.facebook:hover {
  background-color: #3b5998;
}

.social-icons ul li a.telegram:hover {
  background-color: #0088cc;
}
.social-icons ul li a.viber:hover {
  background-color: #7360f2;
}
.social-icons ul li a.whatsapp:hover {
  background-color: #25D366;
}
.social-icons ul li a.instagram:hover {
  background-color: #DD2A7B;
}
.social-icons ul li a.twitter:hover {
  background-color: #2ac6f7;
}
.social-icons ul li a.dribbble:hover {
  background-color: #ff5b92;
}
.social-icons ul li a.linkedin:hover {
  background-color: #036dc0;
}
.social-icons ul li a.tumblr:hover {
  background-color: #ff6b00;
}


.twitter-left-control:hover, 
.twitter-right-control:hover, 
.btn-loadmore:hover  {
	border: 1px solid #028fcc;
}

.caption .btn-start:hover, 
.left-control:hover, 
.right-control:hover {
	border-color:  var(--doc_back2_color);
}

.caption .btn-start {
  border-color: var(--doc_back2_color);
}

.caption .btn-start:hover {
  color: var(--doc_back1_color);
}

.carousel-fade .carousel-inner .item:after {
  background: rgba(0,0,139,.05);
}

.left-control:hover, 
.right-control:hover {
  color: var(--doc_back1_color);
}


#home-slider .fa-angle-down {
  color: var(--doc_back1_color);
}

.service-icon {
  color: var(--doc_back1_color);
}

#services .overlay {
  background-color: var(--doc_back2_color);
  color: var(--doc_back1_color); 
}

#single-services {
  background: var(--doc_back1_color);
}

.services-overview a {
  color: var(--doc_text_color);
  background-color: var(--doc_back1_color);;
}

.services-overview a:hover {
  color: var(--doc_back1_color);
}

#about-us h2 {
  color: var(--doc_back1_color);
}


#portfolio .overlay {
  background-color: var(--doc_back2_color);
  color: var(--doc_back1_color); 
}

.folio-overview a {
  color: var(--doc_text_color);
  background-color: var(--doc_back1_color);
}

.folio-overview a:hover {
  color: var(--doc_back1_color);
}

#portfolio .text-overlay {
    color: var(--doc_back1_color);
}

#single-portfolio {
  background: var(--doc_back1_color);
}

#single-portfolio .close-folio-item {
  color: var(--doc_back3_color);
}

.fixed-height-list li::before {
  color: var(--doc_text_color); /* Цвет номера в списке о прайсе продукта*/
}

.featured .fixed-height-list li::before {
  color: var(--doc_back1_color); /* Цвет номера в списке о прайсе продукта*/
}


.team-member {
  color: var(--doc_text_color);
}


#features h3 {
  color: var(--doc_back1_color);
}


.single-table.featured {  
  color: var(--doc_back1_color);
}

.single-table.featured .btn.btn-primary  {
  color: var(--doc_back2_color);
}


.single-table.featured h3 { 
  color: var(--doc_back1_color);
}

.single-table.featured .btn.btn-primary {
  background-color: var(--doc_back1_color);
}

.single-table {
  background-color: var(--doc_back3_color);
  border-color: var(--doc_back2_color);
}

.single-table .btn.btn-primary:hover {
  background-color: var(--doc_back1_color);
}


.post-icon {
  color: var(--doc_back1_color);
}

.post-meta {
  color: var(--doc_back1_color);
}

.blog-left-control, .blog-right-control {
  color: rgba(255,255,255,.7);
}

.blog-left-control:hover, .blog-right-control:hover {
  color: var(--doc_back1_color);  
}

.btn-loadmore {
  border-color: #f2f2f2;
  color: #666666;
}

.btn-loadmore:hover {
  color:#f5f5f5;
}

.form-control {
  border-color: var(--doc_back1_color);
}

.form-control:focus {
  border-color: var(--doc_back1_color);
  background-color: var(--doc_back2_color_light);
}



.contact-info ul li a {
  color: var(--doc_back1_color);
}


#footer a,
#footer p{
  color:var(--doc_back3_color); 
}

#footer .footer-bottom p {
  color:var(--doc_back2_color); 
}

#footer a:hover, 
#footer a:focus {
	color: var(--doc_back1_color); 
}