@import url('main-showcase.css');

/*@font-face {
  font-family: 'Graphik-Bold-Web';
  src: url('../fonts/Graphik-Bold-Web.eot');
  src: url('../fonts/Graphik-Bold-Web.eot?#iefix') format('embedded-opentype');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'GraphikLCWeb-Bold';
  src: url('../fonts/GraphikLCWeb-Bold.svg#GraphikLCWeb-Bold') format('svg'),
       url('../fonts/GraphikLCWeb-Bold.ttf') format('truetype'),
       url('../fonts/GraphikLCWeb-Bold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
    font-family: 'Source Sans Pro';
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url('sourcesansprolight.woff2') format('woff2'), url('sourcesansprolight.woff') format('woff'), url('sourcesansprolight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}*/
@font-face {
  font-family: 'Xolonium';
  src: url('../fonts/xolonium/Xolonium.eot');
  src: url('../fonts/xolonium/Xolonium.eot?#iefix') format('embedded-opentype'),
       url('../fonts/xolonium/Xolonium.svg#Xolonium') format('svg'),
       url('../fonts/xolonium/Xolonium.ttf') format('truetype'),
       url('../fonts/xolonium/Xolonium.woff') format('woff'),
       url('../fonts/xolonium/Xolonium.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

h1,h2,h3,h4,h5,h6{

	font-family: 'Xolonium', "Helvetica Neue", Helvetica, Arial, "sans-serif" !Important;
}
h1{font-size:24px}h2{font-size:21px}h3{font-size:18px}h4{font-size:16px}h5{font-size:14px}h6{font-size:12px}
body{overflow-y: scroll !important;}
/*--------------------------------------------------------------
# Top Bar
--------------------------------------------------------------*/
.contact-info{
  padding-left: 15px;
  padding-right: 15px;
  display:flex;
	
}

 .contact-info .social-networks{
	display:flex;
}
@media screen and (max-width: 768px){
	.contact-info .social-networks {display: none;}
}
.border-left{
	border-left: 1px solid #fff;
	padding-right: 12px;
}
@media screen and (min-width: 991px){
	#topbar .contact-info .phones {
	margin-right:auto;
    /*flex-grow: 6;*/
}
	
}


@media screen and (min-width: 1200px) {
    .contact-info {
		margin-left: 0px;
        margin-right: 0px;
      } 
}
/*--------------------------------------------------------------
# Ends Top Bar
--------------------------------------------------------------*/

/* ------------------- Heading Underlined ------------------- */
.heading-line {
    position: relative;
}
.heading-line:after {
    content: '';
    width: 10%;
    min-width: 100px;
    height: 2px;
    position: absolute;
    bottom: -5px;
    left: 0;
	background-color: #439065;
}
/* ------------------ /Heading Underlined ------------------- */
/* ------------------ Heading with strip ------------------- */
.strip-section-title-holder.strip-st-vertical-lines {
    text-align: center;
}

.strip-section-title-holder {
    position: relative;
    display: inline-block;
    width: 100%;
     vertical-align: middle; 
     box-sizing: border-box;
	margin: 12px auto;
}

.strip-st-vertical-top, .strip-st-vertical-bottom {
    background-color: #ddd;
    content: '';
    display: inline-block;
    width: 1px;
    height: 50px;
}
/* ------------------ /Heading with strip ------------------- */
body
{   /*font-family: Roboto,sans-serif;
    font-size: 17px; 	
    line-height: 43px;*/
    font-weight: 400;	
    color: #717780;
}
.site-title a {
    font-size: 24px;
    line-height: 36px;
    font-weight: 300;
    margin: 0 auto;
}


@media only screen and (min-width: 840px){
    .site-title {
        max-width: 100%;
    }
}
.url a, .url-link a{color:#439065;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    /*background-image: linear-gradient(to right, #439065 1px, transparent 1px);
    background-size: 3px 1px;
    background-repeat: repeat-x;
    background-position: left bottom;*/
     background: -webkit-gradient(linear, left top, right top, from(#284116), to(#439065));
    background: linear-gradient(to right, #284116 0%, #439065 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

}
.url a:hover, .url-link a:hover{
    background: -webkit-gradient(linear, left top, right top, from(#439065), to(#284116));
    background: linear-gradient(to right, #439065 0%, #284116 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-transition: 0.3s;
}
.url a:visited{color:##338C2A;}

.url-in-text{display: inline-block !important;}
.url-in-text a, .url-in-text-link a{color:#338c2a;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	border-bottom: 1px dashed;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: initial;
    

    /*background-image: linear-gradient(to right, #fff 1px, transparent 1px);
	background-size: 3px 1px;
	background-repeat: repeat-x;
	background-position: left bottom;*/
}
.url-in-text a:hover, .url-in-text-link a:hover{
	color:#439065;
}
.url-in-text a:visited, .url-in-text-link a:visited{
	color:##439065;
}

/*---btn-gradient--*/

.btn-gradient{
  border-radius: 30px; 
  box-shadow: 8px 8px 25px 0px rgba(85, 138, 48, 0.85); 
  background: -webkit-gradient(linear, left top, right top, from(#439065), to(#284116));
  background: linear-gradient(to right, #338C2A 0%, #284116 100%);
  padding:10px 28px;
  display: block;
  color:#fff;
}
.btn-gradient:hover{
  color:#439065;
  background: -webkit-gradient(linear, left top, right top, from(#284116), to(#439065));
  background: linear-gradient(to right, #284116 0%, #439065 100%);
}
}
}
/*---btn-gradient--*/

h3.title--thumbnail{
	font-size: .9em;
	text-align:left !important;
}
ul li {
	list-style: disc;
}

/* ------------------- Li with Stars ------------------- */
ul li.star{font-size: .7em;}
 ul li.star::before {content: ""; color: #ca188e;
  display: inline-block; width: 1em;
  margin-left: 0em}
/* ------------------- /Li with Stars ------------------- */

/* ------------------- Breadcrumbs ------------------- */
.breadcrumb a{ 
    color: #6c757d;
    border-bottom: 1px dashed;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: initial;
}.breadcrumb a:hover { 
    color: #F0F;
}
.breadcrumb-item.active {
    color: #ccc;
}
.breadcrumb {
 /*    display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 padding: .75rem 1rem;
 margin-bottom: 1rem; */
    list-style: none;
    background: none !Important;
    border: none !Important;
    font-size: .8em;
}
/* ------------------- /Breadcrumbs ------------------- */

/* ------------------- Site Header ------------------- */
.site-header{
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 15px 0;
	/*color: #89949a;
	align-items: center;*/
	color:#fff;
	font-weight: 500;
	font-family: Montserrat,sans-serif;
}
.site-header>div{
	padding: 0 25px; 
	/*width: 80%;*/
	margin: 8px auto;
}
.site-header>div.headers{
	display: flex; align-items: center; justify-content: center;
}
/*.site-header>div.headers h1{ !Created for more space for typed text
	margin-bottom: 2em;
}*/
	.site-header>div:nth-child(3){
	font-size: 1.0em;
	color:#558a30;
	}
.site-header h1{
	font-size: 1.3em;
}
.site-header h2{
	
	font-weight: 500;
	/*font-size: 1.0em;*/
	
}
.site-header h3{
	 color: #8b99b5;
	font-size: 1.0em;
}

.site-header h3, .site-header h4{
    font-family: Roboto,sans-serif !Important;
}
@media only screen and (min-width: 840px){
.site-title {
    float: none;
    text-align: center; 
}
}
@media only screen and (min-width:960px){
	.site-header{flex-direction: row;}
	.site-header div{
		
		/*width: 50%;*/
	}

	.site-header>div:nth-child(1){
		border-right: 1px solid #558a30;
	}
	.site-header>div:nth-child(3){ 
	font-size: .8em;
	}
	
}
@media only screen and (max-width:960px){

	.site-header>div:nth-child(3){display: none;}
	.site-header h1{
    text-align: center;
}
	
	}
@media only screen and (min-width:960px){
	.site-header>div:nth-child(1){width: 25%;}
		.site-header>div:nth-child(2){width: 48%; border-right: 1px solid #ddd;}
		.site-header>div:nth-child(3){width: 27%;}

	
	}	
@media only screen and (min-width:1800px){
	.site-header>div:nth-child(1){width: 25%;}
		.site-header>div:nth-child(2){width: 50%;}
		.site-header>div:nth-child(3){width: 25%;}
	}
/*@media only screen and (min-width:2400px){
	.site-header div:nth-child(1){width: 20%;}
		.site-header div:nth-child(2){width: 60%;}
		.site-header div:nth-child(3){width: 20%;}
	}

@media only screen and (min-width:3000px){
	.site-header div:nth-child(1){width: 16.66%;}
		.site-header div:nth-child(2){width: 41.666%;}
		.site-header div:nth-child(3){width: 41.666%;}
	}*/


/*.site-header a{
color: #8b99b5;

}
.site-header .contact-info div{
	width: 100%;
}
.site-header .contact-info div.phone{
	font-size: 1.4em;
	font-weight: 600;

}
@media only screen and (min-width: 1000px){
	.site-header .contact-info div.phone{
	font-size: 2.2em;
}
}

.site-header .contact-info div.adress{
	font-size: .9em;
	font-weight: 600;
}
.site-header .contact-info div.time{
	font-size: 1.2em;
	font-weight: 600;
}
.site-header span.small-letters{
	font-size: .6em;
}*/
  #topbar, .site--footer, #mobile-nav {
  background: linear-gradient(-45deg, #284116, #558a30, #558a30, #284116);
  background-size: 400% 400%;
  animation: gradientBG 6s ease infinite;
  }
/* .fa {
    color: #8b99b5;
}*/
/* ------------------- /Site Header ------------------- */


/* ------------------- Info Block ------------------- */
.infoblock{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	background: url( ../../../../../lib/img/angle_lines.png);
	width: 100%;
	padding: 12px;
	}
.infoblock>div{
	width: 100%;	
}
.infoblock div.inner{
	/*display: flex;
	justify-content: center;
	align-items: center;*/
	background-color: #fff;
	}
.infoblock-inner-content{
	margin: 25px 40px;
}
@media screen and (max-width: 576px){
	.infoblock-inner-content{
	margin:0px;
}
}

span.price{
	font-weight: 700;
	color:#338C2A;
	font-size: 1.3em;
	white-space: nowrap;
}
/*.footer-item-bottom{
		display: none;
	}
.footer-item-ever{
		display: block;
	}*/
.footer-item{
	line-height: 1.3em;
	font-size: .9em;
	text-align: center;
}
.footer-item h4{
	margin: .4em 0 1.0em 0;
}
.project__meta {
border-bottom: 3px solid #ddd;
	border-top: 3px solid #ddd;
    display: flex;
    justify-content: space-between;
	padding-top: 25px;
	padding-bottom: 25px;
	margin: 8px 0;
	width: 100%;
	/*flex-direction: row;*/
}
.project__meta .footer-item {
	width: 100%;
	/*flex-direction: column;*/}

/*@media only screen and (min-width: 600px){

	.project__meta .footer-item {
	width: 50%;
   flex-direction: row;
}*/
}
/*@media only screen and (max-width:600px){
	.project__meta{
		margin:60px 0;
		padding:25px 0;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		float: left;
		width: 100%;
	}
	.footer-item-top{
		display: none;
	}
	.footer-item-bottom{
		display: block;
	}
	}*/
/* ------------------ /Info Block ------------------- */



/* ------------------ Portfolio Block ------------------- */
.portfolio-project{
	margin-top: 60px;
}
.gallery .portfolio-blocks{
	/*display: flex;
	flex-direction: colomn;
	flex-wrap: wrap;
	justify-content: center;*/
}
.gallery .portfolio-blocks div{
	border: 2px solid #fff;
}
@media only screen and (min-width: 300px){
.gallery .portfolio-blocks{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

/* ----------------- /Portfolio Block ------------------- */
.firstletter::first-letter {
  font-size: 2.2em;
	color: #338C2A;
	/*font-family: 'GraphikLCWeb-Bold';
	font-family: Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif';*/
	font-weight: 600;
}
.strongblack{
	font-weight: 600;
	color: #242424;
}
	.light-gray-italic{
	color: #8b939e;
	font-style: italic;
}
	.small-text{
    font-size: .75em;
}
.divider{
	padding-top: 20px; margin-top: 20px; border-top: 1px solid #ddd;
}
.nowrap{
	white-space: nowrap;
}
.button--close {
    position: fixed !important;
	/*background-color: #f2e9fe;*//*The bgcolor of close Button*/
	border-radius: 50%;
	width: 40px;
	height: 40px;
	outline: none !Important;
}
	.button--close :active {
	outline: none  !Important;
}
.alexportfolio{
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* ----------------------Gradients----------------------------*/
.site__title {
    color: #439065;
    background-image: linear-gradient(92deg, #439065 0%,#aae444 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: hue 3s infinite linear;

  }
	@keyframes hue {
  from {
    filter: hue-rotate(0deg);
  }
  
  to {
    filter: hue-rotate(-360deg);
  }
}
.gradient--pink{
	background: -webkit-gradient(linear, left top, right top, from(#439065), to(#DC2527));
    background: linear-gradient(to right, #439065 0%, #DC2527 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* ---------------------/Gradients----------------------------*/ 
/* ----------------------Typed cursor-------------------------*/ 

.typed-cursor{
		  /*color: #aae444;*/ /* blue-gray color */
	 		color: #439065; /* pink color */
            opacity: 1;
            font-weight: 100 !important;
            -webkit-animation: blink 1.3s infinite;
            -moz-animation: blink 1.3s infinite;
            -ms-animation: blink 1.3s infinite;
            -o-animation: blink 1.3s infinite;
            animation: blink 1.3s infinite;
        }
        @-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-webkit-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-moz-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-ms-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }
        @-o-keyframes blink{
            0% { opacity:1; }
            50% { opacity:0; }
            100% { opacity:1; }
        }

/* ----------------------/Typed cursor-------------------------*/ 

/* ---------------Puls------------------*/ 
.puls
{
    /*color: #aae444;*/display: inline-block;
	-webkit-animation: pulse 1.8s linear infinite;
    -moz-animation: pulse 1.8s linear infinite;
    -ms-animation: pulse 1.8s linear infinite;
    animation: pulse 1.8s infinite;
    padding: 0 1px;
}




@keyframes "pulse" {
    0% { transform: scale(1.1); }
    70% { transform: scale(0.8,0.8); }
    80% { transform: scale(0.9,0.9); }
    100% { transform: scale(1.1);  }
}

@-moz-keyframes pulse {
    0% { transform: scale(1.1); }
    70% { transform: scale(0.8,0.8); }
    80% { transform: scale(0.9,0.9); }
    100% { transform: scale(1.1);  }
}

@-webkit-keyframes "pulse" {
    0% { transform: scale(1.1); }
    70% { transform: scale(0.8,0.8); }
    80% { transform: scale(0.9,0.9); }
    100% { transform: scale(1.1);  }
}

@-ms-keyframes "pulse" {
    0% { transform: scale(1.1); }
    70% { transform: scale(0.8,0.8); }
    80% { transform: scale(0.9,0.9); }
    100% { transform: scale(1.1);  }
}
/* ---------------/Puls------------------*/ 

/*----------------TypeWriter-------------*/
.typewriter {
  /*color: #8b99b5;*/
  color: #439065;
  position: relative;
  top: 2.1em;
  left: 0%;
  transform: translate(0%, -50%);
  font-weight: 800;
  font-size: 1.2em;
  margin: 2em auto;
}
@media only screen and (min-width: 960px){
	.typewriter {
  top: 1.3em;
 font-weight: 600;
  font-size: 1em;
 margin: auto;
}
}
.typedText {
  margin: 0 auto;
  display: inline;
  /*white-space: no-wrap;*/
  overflow: auto;
}

.blink {
  font-weight: bold;
  animation: 
  blink-caret .75s step-end infinite;
}

@keyframes blink-caret {
  from, to { color: transparent }
  25% { color: #439065; }
}
/*---------------/TypeWriter-------------*/

/*---------------# Topbar-------------*/
@keyframes gradientBG {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
/*--------------/# Topbar-------------*/
	
/* ------------------- Site-Brief ------------------- */
	.site-brief-table-content{}
	.site-brief{display: flex; border-collapse: collapse; flex-direction: column;}	
	.site-brief>div{
		border-bottom: 1px solid #ccc;
		/*display: flex;*/
		width: 100%;
		padding: 15px;
		
	}
@media only screen and (min-width:576px){
	.site-brief{display: table; border-collapse: collapse;}
	.site-brief div{
		border: 1px solid #d5d8e0;
		display: table-cell;
		width: 50%;
	}
	.site-brief .infoblock{padding: 50px auto;}
	}
/* ------------------- Site-Brief ------------------- */

/* ------------------- CarouselClients ----------------- */
#carouselClientsFade{
	border-top:1px solid #dee5ed;
	border-bottom:1px solid #dee5ed;
}
.carousel-control-next, .carousel-control-prev {
	width: 12%;
}
.carousel-control-next-icon, .carousel-control-prev-icon {
    background: url(../../../../../lib/img/arrow-logos.png) no-repeat center #fff;
    webkit-box-shadow: 0 5px 29px rgba(0,0,0,.17);
    box-shadow: 0 5px 29px rgba(0,0,0,.17);
    width: 54px !Important;
    height: 44px;
    -webkit-box-shadow: 0 5px 29px rgba(0,0,0,.17);
    box-shadow: 0 5px 29px rgba(0,0,0,.17);
    -webkit-transition: background-color .3s;
    transition: background-color .3s;
    cursor: pointer;
    outline: 0;
}
.carousel-control-next-icon {
    background: url(../../../../../lib/img/arrow-logos.png) no-repeat center #fff;
    background-position: 3px 10px;
    margin-right: -30%;
}.carousel-control-prev-icon {
    background: url(../../../../../lib/img/arrow-logos.png) no-repeat center #fff;
    background-position: 3px -24px;
    margin-left: -30%;
}
.carousel-control-next-icon:hover, .carousel-control-prev-icon:hover{
	background-color: #f2f4f6;
}
@media screen and (max-width: 992px) {
    .carousel-control-next-icon {margin-right: -200%;}
    .carousel-control-prev-icon {margin-left: -200%;}
}
/* ------------------ /CarouselClients ----------------- */
/*  .arrow-next .arrow-next:after{
	  content: "\f107";
	  position: absolute;
	  right: 8px;
	  font-family: FontAwesome;
	  font-style: normal;
	  font-weight: normal;
	  transition: 0.1s; 
	 } */	 
.arrow-next{
	background: url(../../../../../lib/img/arrow-logos.png) no-repeat center #fff;
    background-position: 100% -3px;
    padding-right: 5%;
}
.arrow-prev{
    background: url(../../../../../lib/img/arrow-logos.png) no-repeat center #fff;
    background-position: -3% -36px;
    padding-left: 13%;
}	

/*--------------- Banners in portfolio-------------*/



/*--------------- Responsive Flexbox Grid with Banners in portfolio-------------*/
.break {
  flex-basis: 100%;
  height: 0;
}
.banners-section{z-index: 1000;}
.grid-container {
  max-width: 1280px;
 margin: 0 auto;

}
.grid-row {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
}
.grid-item {
  /*height: 259px;*/
  /*flex-basis: 16.666%*/;
  -ms-flex: auto;
  position: relative;
  padding: 0 15px;
  box-sizing: border-box;
  /*border: 1px solid #000;*/
}
.grid-item-horisontal {
 /* flex-basis: 50%;
  -ms-flex: auto;
  width: 598px; */
  position: relative;
  padding: 0 15px;
  box-sizing: border-box;
}

@media(max-width: 992px) {
   .grid-item {
    flex-basis: 33.33%;
  }
}
@media(max-width: 768px) {
  .grid-item {
    flex-basis: 50%;
  }
  .grid-item-horisontal {
  flex-basis: 100%;
}
}
@media(max-width: 576px) {
  .grid-item {
    flex-basis: 50%;
  }
}
/*--------------- /Responsive Flexbox Grid with Banners in portfolio-------------*/



/*--------------- /Banners in portfolio-------------*/
.loading--show{
  z-index: -1 !important;
}
/*--------------- Site Footer-------------*/
.site--footer{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	padding: 25px 15px;
	font-size: .8em;
}

@media only screen and (min-width: 768px){
.site--footer{
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding: 15px 15px;
	font-size: .7em;
}
}
.site--footer, .site--footer a{
		color: #fff !important;
}
.site--footer, .site--footer a:hover{
		color: #cdffab !important;
}
.site--footer a{
	-webkit-transition: 0.3s;
    transition: 0.3s;
}
.site--footer a:hover{
	color: #fff!important;
	-webkit-transition: 0.3s;
    transition: 0.3s;
}

   a {
    color: #4a544f;
    transition: all 0.5s;
    text-decoration: none;
    background-color: transparent;
    }
      a:hover {
    color: #429065;
    }

/*---------------/Site Footer-------------*/