/* --------------------------------- */
/* Css Styles                        */
/*---------------------------------- */

/**
	Berlin - Portfolio Template
	Author : Tavonline
	Copyright 2018

/* Table of Content
==================================================

	1. Body and Core Css
	2. Home Section
	3. About Section
	4. Portfolio Section
	5. Contact Section
	6. Responsive
	7. Slider & Video Home


/*------------------------ 1 Body and Core Css ------------------------*/


#cd-lateral-nav{
z-index: 222;

}

/*responsive*/

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  .diag .home{
		background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: top !important;
		height: 100vh;

	}

	.image-wrap2{
		background-size: contain !important;
    background-repeat: no-repeat !important;

	}

	.image-wrap3{
		background-size: contain !important;
    background-repeat: no-repeat !important;

	}

	.image-wrap4{
		background-size: contain !important;
    background-repeat: no-repeat !important;

	}

	.diag .home-content .home-down.bounce{
		padding:100px 170px 0 !important;

	}

	.proof{
		width:300px!important;
		height: 200px!important;

	}

	.tableauPlaceholder{
		width:100%;
		height: 250px;

	}
	.bim{
		width: 300px;
	}

	.bim2{
		width:266px !important;

	}

	.bim3{
	width:266px !important;

	}

 .bim4{
	 width:266px !important;

 }
 .round{
	 width:250px !important;
	 height: 250px !important;

 }

 .holderCircle {
    width: 390px !important;
    height: 300px;
		    left: 30% !important;
			}

			.dotCircle{
				left:-10% !important;
			}

			.bim6{
		 	 width: 260px !important;

		  }
			.bim5{
		 	 width: 290px !important;

		  }
			.bim7{

				    margin-left: -15%;
			}

			.bim8{
		 	 width: 300px!important;
			     margin-bottom: 12%;
		  }

			.tweet{
		 	 width: 320px !important;

		  }

			.tweet1{
				 width: 320px !important;

			}

			.tweet2{
		 	 width: 320px !important;
		  }

			.tweet3{
				margin-bottom: 40%;

			}

			.go1{
				width:300px;

			}

			.go2{
				width:300px;

			}

			.go3{
		 	 width:350px;

		  }

			.me5a{
				margin-bottom: 65%;
			}

      .bar-main-container{
     width:225px !important;

      }
}



@media only screen and (max-width: 600px) {
  /* For mobile phones: */
  .diag .home{
		background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: top !important;
		height: 100vh;

	}
	.image-wrap2{
		background-size: contain !important;
		background-repeat: no-repeat !important;

	}

	.image-wrap3{
		background-size: contain !important;
    background-repeat: no-repeat !important;

	}

	.image-wrap4{
		background-size: contain !important;
    background-repeat: no-repeat !important;

	}

	.diag .home-content .home-down.bounce{
		padding:100px 170px 0 !important;

	}

	.tableauPlaceholder{
		width:100%;


	}

	.bim{
		width: 300px;
	}
	.bim2{
		width:266px !important;

	}
	.bim3{
	width:266px !important;

	}

	.bim4{
		width:266px !important;

	}

	.round{
		width:250px !important;
		height: 250px !important;
	}

	.holderCircle {
     width: 390px !important;
     height: 300px;
		     left: 30% !important;
 }

 .dotCircle{
	 left:-10% !important;
 }

 .contentCircle .CirItem{
	 width: 75% !important;
	 bottom: 54px !important;
	     right: 50px !important;

 }
 .bim5{
	 width: 290px !important;

 }

 .bim6{
	 width: 260px !important;

 }
 .bim7{

			 margin-left: -15%;
 }

 .bim8{
	 width: 300px!important;
	     margin-bottom: 12%;
 }

 .tweet{
	 width: 320px !important;

 }

 .tweet1{
		width: 320px !important;

 }

 .tweet2{
	 width: 265px !important;
 }

 .bar-main-container{
width:225px !important;

 }

 .tweet3{
	 margin-bottom: 40%;

 }

 .go1{
	 width:300px;

 }

 .go2{
	 width:300px;

 }

 .go3{
	 width:350px;

 }

 .me5a{
	 margin-bottom: 65%;
 }

}





/**/

.progress {
	overflow: hidden;
	height: 20px;
	background-color: #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
	box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
		margin-bottom: 20px;
}
.progress-bar {
	width: 0;
	height: 100%;
	color: #fff;
	text-align: center;
	background-color: #ee303c;



}
.progress-striped .progress-bar {
			background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
			background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
			background-size: 40px 40px;
}
.progress.active .progress-bar {
	-webkit-animation: progress-bar-stripes 2s linear infinite;
	animation: progress-bar-stripes 2s linear infinite;
	-moz-animation: progress-bar-stripes 2s linear infinite;
}


/*value*/
.textanim-container {
  position: relative;
  max-width: 250px;
  min-height: 150px;
  margin: 12px;
  border: 2px solid #ffa5a5;
  overflow: hidden;
  text-align: center;
  border-radius: 5px;
}

.textanim-title {
  margin: 0;
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  transition: 0.5s;
  color:white;
}

.textanim-container:hover .textanim-title {
  top: 15px;
  transform: translateY(0);
  color:white;
}

.textanim-hidden {
  position: absolute;
  top: 400px;
  transition: 0.8s;
  text-align: center;
      right: 40%;
          font-size: 26px;
              font-family: arial;
                  font-weight: bold;
                  color:white;
}

.textanim-container:hover .textanim-hidden {
  top: 50%;
  transform: translateY(-50%);
}

/*end-value*/

/*slider*/

/*----------------------------*\
      Coverflow Album Slider
\*-----------------------------*/
.coverflow {
  position: relative;
  height: 600px;
  padding: 30px;
  overflow: hidden;
  -webkit-perspective: 1000px;
  perspective: 1000px;

}

.coverflow__image {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width:500px;
  height: 500px;
  -webkit-transition: all 350ms cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 350ms cubic-bezier(0.215, 0.61, 0.355, 1);
}

.coverflow__image[data-coverflow-index] {
  position: absolute;
  left: 50%;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.coverflow__image[data-coverflow-index]:before {
  content: " ";
  z-index: 1;
  position: absolute;
  top: 300px;
  width: 100%;
  height: 10%;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.7);
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 7;
  -webkit-transform: translateX(190px) scale(0.35) rotateY(-45deg);
  transform: translateX(190px) scale(0.35) rotateY(-45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 6;
  -webkit-transform: translateX(280px) scale(0.2) rotateY(-45deg);
  transform: translateX(280px) scale(0.2) rotateY(-45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 5;
  -webkit-transform: translateX(370px) scale(0.05) rotateY(-45deg);
  transform: translateX(370px) scale(0.05) rotateY(-45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 4;
  -webkit-transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 3;
  -webkit-transform: translateX(550px) scale(-0.25) rotateY(-45deg);
  transform: translateX(550px) scale(-0.25) rotateY(-45deg);
  opacity: -0.5;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 2;
  -webkit-transform: translateX(640px) scale(-0.4) rotateY(-45deg);
  transform: translateX(640px) scale(-0.4) rotateY(-45deg);
  opacity: -0.66667;
}

.coverflow[data-coverflow-position="1"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 1;
  -webkit-transform: translateX(730px) scale(-0.55) rotateY(-45deg);
  transform: translateX(730px) scale(-0.55) rotateY(-45deg);
  opacity: -0.83333;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 7;
  -webkit-transform: translateX(190px) scale(0.35) rotateY(-45deg);
  transform: translateX(190px) scale(0.35) rotateY(-45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 6;
  -webkit-transform: translateX(280px) scale(0.2) rotateY(-45deg);
  transform: translateX(280px) scale(0.2) rotateY(-45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 5;
  -webkit-transform: translateX(370px) scale(0.05) rotateY(-45deg);
  transform: translateX(370px) scale(0.05) rotateY(-45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 4;
  -webkit-transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 3;
  -webkit-transform: translateX(550px) scale(-0.25) rotateY(-45deg);
  transform: translateX(550px) scale(-0.25) rotateY(-45deg);
  opacity: -0.5;
}

.coverflow[data-coverflow-position="2"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 2;
  -webkit-transform: translateX(640px) scale(-0.4) rotateY(-45deg);
  transform: translateX(640px) scale(-0.4) rotateY(-45deg);
  opacity: -0.66667;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 7;
  -webkit-transform: translateX(190px) scale(0.35) rotateY(-45deg);
  transform: translateX(190px) scale(0.35) rotateY(-45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 6;
  -webkit-transform: translateX(280px) scale(0.2) rotateY(-45deg);
  transform: translateX(280px) scale(0.2) rotateY(-45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 5;
  -webkit-transform: translateX(370px) scale(0.05) rotateY(-45deg);
  transform: translateX(370px) scale(0.05) rotateY(-45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 4;
  -webkit-transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="3"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 3;
  -webkit-transform: translateX(550px) scale(-0.25) rotateY(-45deg);
  transform: translateX(550px) scale(-0.25) rotateY(-45deg);
  opacity: -0.5;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 7;
  -webkit-transform: translateX(-590px) scale(0.35) rotateY(45deg);
  transform: translateX(-590px) scale(0.35) rotateY(45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 7;
  -webkit-transform: translateX(190px) scale(0.35) rotateY(-45deg);
  transform: translateX(190px) scale(0.35) rotateY(-45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 6;
  -webkit-transform: translateX(280px) scale(0.2) rotateY(-45deg);
  transform: translateX(280px) scale(0.2) rotateY(-45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 5;
  -webkit-transform: translateX(370px) scale(0.05) rotateY(-45deg);
  transform: translateX(370px) scale(0.05) rotateY(-45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="4"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 4;
  -webkit-transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  transform: translateX(460px) scale(-0.1) rotateY(-45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 6;
  -webkit-transform: translateX(-680px) scale(0.2) rotateY(45deg);
  transform: translateX(-680px) scale(0.2) rotateY(45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 7;
  -webkit-transform: translateX(-590px) scale(0.35) rotateY(45deg);
  transform: translateX(-590px) scale(0.35) rotateY(45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 7;
  -webkit-transform: translateX(190px) scale(0.35) rotateY(-45deg);
  transform: translateX(190px) scale(0.35) rotateY(-45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 6;
  -webkit-transform: translateX(280px) scale(0.2) rotateY(-45deg);
  transform: translateX(280px) scale(0.2) rotateY(-45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="5"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 5;
  -webkit-transform: translateX(370px) scale(0.05) rotateY(-45deg);
  transform: translateX(370px) scale(0.05) rotateY(-45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 5;
  -webkit-transform: translateX(-770px) scale(0.05) rotateY(45deg);
  transform: translateX(-770px) scale(0.05) rotateY(45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 6;
  -webkit-transform: translateX(-680px) scale(0.2) rotateY(45deg);
  transform: translateX(-680px) scale(0.2) rotateY(45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 7;
  -webkit-transform: translateX(-590px) scale(0.35) rotateY(45deg);
  transform: translateX(-590px) scale(0.35) rotateY(45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 7;
  -webkit-transform: translateX(190px) scale(0.35) rotateY(-45deg);
  transform: translateX(190px) scale(0.35) rotateY(-45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="6"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 6;
  -webkit-transform: translateX(280px) scale(0.2) rotateY(-45deg);
  transform: translateX(280px) scale(0.2) rotateY(-45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 4;
  -webkit-transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 5;
  -webkit-transform: translateX(-770px) scale(0.05) rotateY(45deg);
  transform: translateX(-770px) scale(0.05) rotateY(45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 6;
  -webkit-transform: translateX(-680px) scale(0.2) rotateY(45deg);
  transform: translateX(-680px) scale(0.2) rotateY(45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 7;
  -webkit-transform: translateX(-590px) scale(0.35) rotateY(45deg);
  transform: translateX(-590px) scale(0.35) rotateY(45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="7"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 7;
  -webkit-transform: translateX(190px) scale(0.35) rotateY(-45deg);
  transform: translateX(190px) scale(0.35) rotateY(-45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 3;
  -webkit-transform: translateX(-950px) scale(-0.25) rotateY(45deg);
  transform: translateX(-950px) scale(-0.25) rotateY(45deg);
  opacity: -0.5;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 4;
  -webkit-transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 5;
  -webkit-transform: translateX(-770px) scale(0.05) rotateY(45deg);
  transform: translateX(-770px) scale(0.05) rotateY(45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 6;
  -webkit-transform: translateX(-680px) scale(0.2) rotateY(45deg);
  transform: translateX(-680px) scale(0.2) rotateY(45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 7;
  -webkit-transform: translateX(-590px) scale(0.35) rotateY(45deg);
  transform: translateX(-590px) scale(0.35) rotateY(45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="8"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 8;
  -webkit-transform: translateX(100px) scale(0.5) rotateY(-45deg);
  transform: translateX(100px) scale(0.5) rotateY(-45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 2;
  -webkit-transform: translateX(-1040px) scale(-0.4) rotateY(45deg);
  transform: translateX(-1040px) scale(-0.4) rotateY(45deg);
  opacity: -0.66667;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 3;
  -webkit-transform: translateX(-950px) scale(-0.25) rotateY(45deg);
  transform: translateX(-950px) scale(-0.25) rotateY(45deg);
  opacity: -0.5;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 4;
  -webkit-transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 5;
  -webkit-transform: translateX(-770px) scale(0.05) rotateY(45deg);
  transform: translateX(-770px) scale(0.05) rotateY(45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 6;
  -webkit-transform: translateX(-680px) scale(0.2) rotateY(45deg);
  transform: translateX(-680px) scale(0.2) rotateY(45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 7;
  -webkit-transform: translateX(-590px) scale(0.35) rotateY(45deg);
  transform: translateX(-590px) scale(0.35) rotateY(45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.coverflow[data-coverflow-position="9"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 9;
  -webkit-transform: translateX(10px) scale(0.65) rotateY(-45deg);
  transform: translateX(10px) scale(0.65) rotateY(-45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="1"] {
  z-index: 1;
  -webkit-transform: translateX(-1130px) scale(-0.55) rotateY(45deg);
  transform: translateX(-1130px) scale(-0.55) rotateY(45deg);
  opacity: -0.83333;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="2"] {
  z-index: 2;
  -webkit-transform: translateX(-1040px) scale(-0.4) rotateY(45deg);
  transform: translateX(-1040px) scale(-0.4) rotateY(45deg);
  opacity: -0.66667;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="3"] {
  z-index: 3;
  -webkit-transform: translateX(-950px) scale(-0.25) rotateY(45deg);
  transform: translateX(-950px) scale(-0.25) rotateY(45deg);
  opacity: -0.5;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="4"] {
  z-index: 4;
  -webkit-transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  transform: translateX(-860px) scale(-0.1) rotateY(45deg);
  opacity: -0.33333;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="5"] {
  z-index: 5;
  -webkit-transform: translateX(-770px) scale(0.05) rotateY(45deg);
  transform: translateX(-770px) scale(0.05) rotateY(45deg);
  opacity: -0.16667;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="6"] {
  z-index: 6;
  -webkit-transform: translateX(-680px) scale(0.2) rotateY(45deg);
  transform: translateX(-680px) scale(0.2) rotateY(45deg);
  opacity: 0;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="7"] {
  z-index: 7;
  -webkit-transform: translateX(-590px) scale(0.35) rotateY(45deg);
  transform: translateX(-590px) scale(0.35) rotateY(45deg);
  opacity: 0.16667;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="8"] {
  z-index: 8;
  -webkit-transform: translateX(-500px) scale(0.5) rotateY(45deg);
  transform: translateX(-500px) scale(0.5) rotateY(45deg);
  opacity: 0.33333;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="9"] {
  z-index: 9;
  -webkit-transform: translateX(-410px) scale(0.65) rotateY(45deg);
  transform: translateX(-410px) scale(0.65) rotateY(45deg);
  opacity: 0.5;
}

.coverflow[data-coverflow-position="10"] .coverflow__image[data-coverflow-index="10"] {
  z-index: 10;
  -webkit-transform: translateX(-200px);
  transform: translateX(-200px);
  box-shadow: 0 1px 25px 10px rgba(0, 0, 0, 0.6);
}

.prev-arrow,
.next-arrow {
  cursor: pointer;
  z-index: 10;
  position: absolute;
  top: 50%;
  padding: 1rem 1rem;
  color: rgba(255, 255, 255, 0.5);
  font-size: 3rem;
  line-height: 3rem;
  background: #00000029;
  border-radius: 1rem;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: color 200ms, background 200ms;
  transition: color 200ms, background 200ms;
}

.prev-arrow:hover,
.next-arrow:hover,
.prev-arrow:focus,
.next-arrow:focus {
  color: rgba(255, 255, 255, 0.9);
  background: rgba(0, 0, 0, 0.5);
}

.prev-arrow {
  left: 0%;
}

.prev-arrow:before {
  content: "❮";
}

.next-arrow {
  right: 0%;
}

.next-arrow:after {
  content: "❯";
}

/*end slider*/



/*ggg*/

.timeline2 {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
  padding-top: 20px;
  background-color: inherit;
}

.timeline2:after {
  content: '';
  position : absolute;
  width: 5px;
  background-color: $dot-colour;
  left: 50%;
  top: 0;
  bottom: 0;
  margin-left: -2px;
}

.timeline2--first:after {
  top: 20px;
}

.era {
  text-align: center;
  position: relative;
  z-index: 1;
  padding-bottom: 20px;
}

.era__title {
  background-color: #0a5cc1;
  color: #fff;
  display: inline-block;
  padding: 10px 20px;
}

.entry {
  padding: 10px 30px 40px 30px;
  width: 50%;
  position: relative;
  background-color: inherit;
}

.entry--right {
  margin-left: 50%;
}

.entry__content {
  padding: 20px 30px;
  background-color: white;
  position: relative;
  text-align: right;
  direction:rtl;
}

.entry:before {
    content: " ";
    height: 0;
    position: absolute;
    top: 20px;
    width: 0;
    z-index: 1;
}

.entry--left:before {
  right: $dot - 8px;
  border: medium solid transparent;
  border-width: 8px 0 8px 8px;
  border-color: transparent transparent transparent white;
}

.entry--right:before {
   left: $dot - 8px;
   margin-left: 0;
   border: medium solid transparent;
   border-width: 8px 8px 8px 0;
   border-color: transparent white transparent transparent;
}

.entry:after {
  content: '';
  position: absolute;
  width: $dot;
  height: $dot;
  right: (-$dot / 2) - $dot-border - 1;
  //background-color: inherit;
  background-color: white;
  border: 4px solid $dot-colour;
  top: 10px;
  border-radius: 50%;
  z-index: 1;
}

.entry--right:after {
  right: auto;
  left: (-$dot / 2) - $dot-border;
}



@media all and (max-width: $small-breakpoint) {
  .timeline2:after {
    left: $dot + $dot-border;
  }

  .era {
    text-align: left;
    padding-left: $dot + ($dot-border / 2);
  }

  .entry {
    width: 100%;
    margin-left: 0;
    padding-left: $dot + $dot + 4px;
    padding-right: 20px;
  }

  .entry:before {
    right: auto;
    left: ($dot * 2) - 4px;
    margin-left: 0;
    border: medium solid transparent;
    border-width: 8px 8px 8px 0;
    border-color: transparent white transparent transparent;
  }

  .entry:after {
    left: $dot / 2;
  }
}
/*ggg*/


#flip {
height:50px;
overflow:hidden;
}

#flip > div > div {
color:#fff;
padding:4px 12px;
height:45px;
margin-bottom:45px;
display:inline-block;
}

#flip div:first-child {
animation: show 5s linear infinite;
}

#flip div div {
background:#42c58a;
}
#flip div:first-child div {
background:#4ec7f3;
}
#flip div:last-child div {
background:#DC143C;
}

@keyframes show {
0% {margin-top:-270px;}
5% {margin-top:-180px;}
33% {margin-top:-180px;}
38% {margin-top:-90px;}
66% {margin-top:-90px;}
71% {margin-top:0px;}
99.99% {margin-top:0px;}
100% {margin-top:-270px;}
}





/*video*/


div.desktop-wrapper {
    position: relative;
    padding-top: 25px;
    padding-bottom: 67.5%;
    height: 0;
}
div.desktop-wrapper iframe {
    box-sizing: border-box;
    background: url(../images/ipad.png) center center no-repeat;
    background-size: contain;
    padding: 3.4% 10.8% 18.6%;/* 11.9% 15.5% 14.8% */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



/*end video*/




/*area*/
.text{
text-align: center;
}

.text h6{
text-align: center;

}

.text p{
text-align: center !important;

}

/*end-area*/


.tableauPlaceholder{
height: 500px !important;
width: 1190px ;

}



#container { text-align: center; margin: 20px; }
h2 { color: #CCC; }
a { text-decoration: none; color: #EC5C93; }

.bar-main-container {
  margin: 10px auto;
  width: 300px;
  height: 50px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-family: sans-serif;
  font-weight: normal;
  font-size: 0.8em;
  color: #FFF;
}

.wrap { padding: 8px; }

.bar-percentage {
  float: left;
  background: rgba(0,0,0,0.13);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 9px 0px;
  width: 18%;
  height: 42px;
}

.bar-container {
  float: right;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  height: 10px;
  background: rgba(0,0,0,0.13);
  width: 78%;
  margin: 12px 0px;
  overflow: hidden;
}

.bar {
  float: left;
  background: #FFF;
  height: 100%;
  -webkit-border-radius: 10px 0px 0px 10px;
  -moz-border-radius: 10px 0px 0px 10px;
  border-radius: 10px 0px 0px 10px;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

/* COLORS */
.azure   { background: #38B1CC; }
.emerald { background: #2CB299; }
.violet  { background: #8E5D9F; }
.yellow  { background: #EFC32F; }
.red     { background: #E44C41; }
.green     { background: #0e62b9; }
.black     { background: #676060; }
.orange     { background: #ff6347; }



/*table*/

.aa_htmlTable{
  background: tomato;
  padding: 3rem;
  display: table;
  width: 100%;
  height: 100vh;
  vertical-align: middle;
}

table{
   background: #fff;
}
table,thead,tbody,tfoot,tr, td,th{
  text-align: center;
  margin: auto;
  border:1px solid #ffffff;
  padding: 1rem;
  /*width: 100%;*/
	font-size:15px;
	background: #ffffff00;
	color:#ffffff;

}
.table    { display: table; width: 50%; }
.tr       { display: table-row;  }
.thead    { display: table-header-group }
.tbody    { display: table-row-group }
.tfoot    { display: table-footer-group }
.col      { display: table-column }
.colgroup { display: table-column-group }
.td, .th   { display: table-cell; width: 50%; }
.caption  { display: table-caption }

.table,
.thead,
.tbody,
.tfoot,
.tr,
.td,
.th{
  text-align: center;
  margin: auto;
  padding: 1rem;
}
.table{
  background: #fff;
  margin: auto;
  border:none;
  padding: 0;
  margin-bottom: 5rem;
}

.th{
  font-weight: 700;
  border:1px solid #dedede;
  &:nth-child(odd){
    border-right:none;
  }
}
.td{
  font-weight: 300;
  border:1px solid #dedede;
  border-top:none;
  &:nth-child(odd){
    border-right:none;
  }
}


/*end-table*/



.media-object{
border-radius: 80%;

}

.media-heading{
margin-top: 10px;

}


.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus{
color:white;

}
/*twitter*/
.nav-pills-custom>li>a {
	color: lightgrey;
}

.nav-pills-custom>li>a:focus,
.nav-pills-custom>li>a:hover {
	background: none;
	color: grey;
}

.panel-custom>.panel-heading {
	background: none;
	border-bottom: none;
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{
	background-color: #337AB7;
}
.form-control-nav{
	background-color:#F0FFFF;
  border: lightgrey solid 1px;
	border-radius:15px;
}

.navbar-default .navbar-collapse, .navbar-default{
background-color: white;
}
.panel-footer{
	background-color: lightcyan;
}
.well{
	background-color: lightcyan;
}
a{
	color:#60A6C1;
}
div.panel-heading{
	padding-top:15px;
	padding-bottom: 0px;
}
.form-control-feedback{
	line-height:27px;
}
.panel-info{
	border:1px lightgrey solid;
}



/*end-twitter*/

.fb-profile img.fb-image-lg{
    z-index: 0;
    width: 100%;
    margin-bottom: 10px;
}

.fb-image-profile
{
    margin: -200px 10px 0px 50px;
    z-index: 9;
    width: 20%;
}

@media (max-width:768px)
{

.fb-profile-text>h1{
    font-weight: 700;
    font-size:16px;
}

.fb-image-profile
{
    margin: -45px 10px 0px 25px;
    z-index: 9;
    width: 20%;
}
}

/*circle*/

.holderCircle { width: 500px; height: 500px; border-radius: 100%; margin: 60px auto; position: relative; left:33%; }


.dotCircle { width: 100%; height: 100%; position: absolute; margin: auto; top: 0; left: 0; right: 0; bottom: 0; border-radius: 100%; z-index: 20; }
.dotCircle  .itemDot { display: block; width: 80px; height: 80px; position: absolute; background: #ffffff; color: #3b5999; border-radius: 20px; text-align: center; line-height: 23px; font-size: 30px; z-index: 3; cursor: pointer; border: 2px solid #e6e6e6; }
.dotCircle  .itemDot .forActive { width: 56px; height: 56px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: none; }
.dotCircle  .itemDot .forActive::after { content: ''; width: 5px; height: 5px; border: 3px solid #7d4ac7; bottom: -31px; left: -14px; filter: blur(1px); position: absolute; border-radius: 100%; }
.dotCircle  .itemDot .forActive::before { content: ''; width: 6px; height: 6px; filter: blur(5px); top: -15px; position: absolute; transform: rotate(-45deg); border: 6px solid #a733bb; right: -39px; }
.dotCircle  .itemDot.active .forActive { display: block; }
.round { position: absolute; left: 40px; top: 45px; width: 410px; height: 410px; border: 2px dotted #3b5999; border-radius: 100%; -webkit-animation: rotation 100s infinite linear; }
.dotCircle .itemDot:hover, .dotCircle .itemDot.active { color: #ffffff; transition: 0.5s;    background: #3b5999; /* Old browsers */ background: -moz-linear-gradient(left, #3b5999 0%, #3b5999 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, #3b5999 0%, #3b5999 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #7d4ac7 0%, #a733bb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d4ac7', endColorstr='#a733bb', GradientType=1); /* IE6-9 */ border: 2px solid #ffffff; -webkit-box-shadow: 0 30px 30px 0 rgba(0, 0, 0, .13); -moz-box-shadow: 0 30px 30px 0 rgba(0, 0, 0, .13); box-shadow: 0 30px 30px 0 rgba(0, 0, 0, .13); }
.dotCircle .itemDot { font-size: 40px; }
.contentCircle { width: 250px; border-radius: 100%; color: #222222; position: relative; top: 150px; left: 50%; transform: translate(-50%, -50%); }
.contentCircle .CirItem { border-radius: 100%; color: #222222; position: absolute; text-align: center; bottom: 0; left: 0; opacity: 0; transform: scale(0); transition: 0.5s; font-size: 15px; width: 100%; height: 100%; top: 0; right: 0; margin: auto; line-height: 250px; }
.CirItem.active { z-index: 1; opacity: 1; transform: scale(1); transition: 0.5s; }
.contentCircle .CirItem i { font-size: 180px; position: absolute; top: 0; left: 50%; margin-left: -90px; color: #000000; opacity: 0.1; }
@media only screen and (min-width:300px) and (max-width:599px) {
	.holderCircle { width: 300px; height: 300px; margin: 110px auto; }
	.holderCircle::after { width: 100%; height: 100%; }
	.dotCircle { width: 100%; height: 100%; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }
}
@media only screen and (min-width:600px) and (max-width:767px) { }
@media only screen and (min-width:768px) and (max-width:991px) { }
@media only screen and (min-width:992px) and (max-width:1199px) { }
@media only screen and (min-width:1200px) and (max-width:1499px) { }
  .title-box .title { font-weight: 600; letter-spacing: 2px; position: relative; z-index: -1; }
        .title-box span { text-shadow: 0 10px 10px rgba(0, 0, 0, .15); font-weight: 800; color: #640178; }
        .title-box p {font-size: 17px; line-height: 2em; }


/*end-cirlce*/


.well{

  padding: 0px;
      background-color: #eaebef;
      border:0px solid #e3e3e3;
      webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, .05);
    box-shadow: inset 0 0px 0px rgba(0, 0, 0, .05);
}
/*fb*/
.wrapper, .row {
   height: 100%;
   margin-left:0;
   margin-right:0;
}

.wrapper:before, .wrapper:after,
.column:before, .column:after {
    content: "";
    display: table;
}

.wrapper:after,
.column:after {
    clear: both;
}

.column {
    height: 100%;
    overflow: auto;
    *zoom:1;
}

.column .padding {
    padding: 20px;
}

.full{
	padding-top:70px;
}

.box {
  	bottom: 0; /* increase for footer use */
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    background-color:#444444;
  /*
    background-image:url('/assets/example/bg_suburb.jpg');
    background-size:cover;
    background-attachment:fixed;
  */
}

.divider {
	margin-top:32px;
}

.navbar-blue {
    border-width:0;
	background-color:#3B5999;
    color:#ffffff;
    font-family:light;
    top:0;
    position:fixed;
    width:inherit;
}

.navbar-blue li > a,.navbar-toggle  {
   color:#efefef;
   font-family: light;
}

.navbar-blue .dropdown-menu li a {color:#2A4888;}
.navbar-blue .dropdown-menu li > a {padding-left:30px;}

.navbar-blue li>a:hover, .navbar-blue li>a:focus, .navbar-blue .open, .navbar-blue .open>a, .navbar-blue .open>a:hover, .navbar-blue .open>a:focus {
   background-color:#2A4888;
   color:#fff;
}

#main {
   background-color:#e9eaed;
   padding-left:0;
   padding-right:0;
}
/*#main .img-circle {
   margin-top:18px;
   height:70px;
   width:70px;
}*/

#sidebar {
    padding:0px;
	padding-top:15px;
}

#sidebar, #sidebar a, #sidebar-footer a {
    color:#ffffff;
    background-color:transparent;
	text-shadow:0 0 2px #000000;
    padding-left:5px;
}
#sidebar .nav li>a:hover {
    background-color:#393939;
}

.logo {
  display:block;
  padding:3px;
  background-color:#fff;
  color:#3B5999;
  height:28px;
  width:28px;
  margin:1px;
  margin-right:2px;
  margin-left:5px;
  font-size:20px;
  font-weight:700;
  text-align:center;
  text-decoration:none;
  text-shadow:0 0 1px;
  border-radius:2px;
}
#sidebar-footer {
  background-color:#444;
  position:absolute;
  bottom:5px;
  padding:5px;
}
#footer {
  margin-bottom:20px;
}

/* bootstrap overrides */

h1,h2,h3 {
   font-weight:800;
}

.navbar-toggle, .close {
	outline:0;
}

.navbar-toggle .icon-bar {
	background-color: #fff;
}

.btn-primary,.label-primary,.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus  {
	background-color:#3B5999;
    color:#fffffe;
}
.btn-default {
    color:#666666;
    text-shadow:0 0 1px rgba(0,0,0,.3);
}
.form-control {

}

.panel textarea, .well textarea, textarea.form-control
{
   resize: none;
}

.badge{
   color:#3B5999;
   background-color:#fff;
}
.badge:hover, .badge-inverse{
   background-color:#3B5999;
   color:#fff;
}

.jumbotron {
  background-color:transparent;
}
.label-default {
  background-color:#dddddd;
}
.page-header {
  margin-top: 55px;
  padding-top: 9px;
  border-top:1px solid #eeeeee;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:2px;
}

.panel-default .panel-heading {
  background-color:#f9fafb;
  color:#555555;
}

.col-sm-9.full {
    width: 100%;
}

.modal-header, .modal-footer {
	background-color:#f2f2f2;
    font-weight:800;
    font-size:12px;
}

.modal-footer i, .well i {
    font-size:20px;
    color:#c0c0c0;
}

.modal-body {
	padding:0px;
}

.modal-body textarea.form-control
{
   resize: none;
   border:0;
   box-shadow:0 0 0;
}

small.text-muted {
  font-family:courier,courier-new,monospace;
}

/* adjust the contents on smaller devices */
@media (max-width: 768px) {

  .column .padding {
    padding: 7px;
  }

  .full{
	padding-top:20px;
  }

  .navbar-blue {
	background-color:#3B5999;
    top:0;
    width:100%;
    position:relative;
  }

}


/*
 * off canvas sidebar
 * --------------------------------------------------
 */
@media screen and (max-width: 768px) {
  .row-offcanvas {
    position: relative;
    -webkit-transition: all 0.25s ease-out;
    -moz-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
  }

  .row-offcanvas-left.active {
    left: 33%;
  }

  .row-offcanvas-left.active .sidebar-offcanvas {
    left: -33%;
    position: absolute;
    top: 0;
    width: 33%;
    margin-left: 5px;
  }

  #sidebar, #sidebar a, #sidebar-footer a {
    padding-left:3px;
  }
}

/*end fb*/



/*top*/

#button {
  display: inline-block;
  background-color: #075682;
  width: 40px;
  height: 40px;
  text-align: center;
  border-radius: 4px;
  position: fixed;
  bottom: 30px;
  right: 30px;
  transition: background-color .3s,
    opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
}
#button::after {
  content: "\f0a6";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  /*line-height: 50px;*/
  color: #fff;
}
#button:hover {
  cursor: pointer;
  background-color: #333;
}
#button:active {
  background-color: #555;
}
#button.show {
  opacity: 1;
  visibility: visible;
}


/*end-top*/







/*timeline*/

.timeline {
  position: relative;
  width: 660px;
  margin: 0 auto;
  margin-top: 20px;
  padding: 1em 0;
  list-style-type: none;
}

.timeline:before {
  position: absolute;
  left: 50%;
  top: 0;
  content: ' ';
  display: block;
  width: 6px;
  height: 100%;
  margin-left: -3px;
  background: rgb(80,80,80);
  background: -moz-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(100%,rgba(125,185,232,1)));
  background: -webkit-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
  background: -o-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
  background: -ms-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
  background: linear-gradient(to bottom, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);

  z-index: 1;
}

.timeline li {
  padding: 1em 0;
}

.timeline li:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.direction-l {
  position: relative;
  width: 300px;
  float: left;
  text-align: right;
}

.direction-r {
  position: relative;
  width: 300px;
  float: right;
}

.flag-wrapper {
  position: relative;
  display: inline-block;

  text-align: center;
}

.flag {
  position: relative;
  display: inline;
  background: rgb(248,248,248);
  padding: 4px 25px;
  border-radius: 5px;

  font-weight: 600;
  text-align: left;
}

.direction-l .flag {
  -webkit-box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  -moz-box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
}

.direction-r .flag {
  -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
  box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
}

.direction-l .flag:before,
.direction-r .flag:before {
  position: absolute;
  top: 50%;
  right: -36px;
  content: ' ';
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -10px;
  background: #fff;
  border-radius: 10px;
  border: 4px solid #38a9e3;
  z-index: 10;
}

.direction-r .flag:before {
  left: -36px;
}

.direction-l .flag:after {
  content: "";
  position: absolute;
  left: 100%;
  top: 50%;
  height: 0;
  width: 0;
  margin-top: -8px;
  border: solid transparent;
  border-left-color: rgb(248,248,248);
  border-width: 8px;
  pointer-events: none;
}

.direction-r .flag:after {
  content: "";
  position: absolute;
  right: 100%;
  top: 50%;
  height: 0;
  width: 0;
  margin-top: -8px;
  border: solid transparent;
  border-right-color: rgb(248,248,248);
  border-width: 8px;
  pointer-events: none;
}

.time-wrapper {
  display: inline;

  line-height: 1em;
  font-size: 0.66666em;
  color: rgb(250,80,80);
  vertical-align: middle;
}

.direction-l .time-wrapper {
  float: left;
}

.direction-r .time-wrapper {
  float: right;
}

.time {
  display: inline-block;
  padding: 6px 14px;
  background: rgb(248,248,248);
	font-size: 14px;
	font-family: cursive;
  color:#38a9e3;
}




.desc {
  margin: 1em 0.75em 0 0;

  font-size: 14px;
  font-style: italic;
  line-height: 1.5em;
	    direction: rtl;
}

.direction-r .desc {
  margin: 1em 0 0 0.75em;
	direction: rtl;
	font-size: 14px;
    text-align: center;
}

/* ================ Timeline Media Queries ================ */

@media screen and (max-width: 660px) {

.timeline {
 	width: 100%;
	padding: 4em 0 1em 0;
}

.timeline li {
	padding: 2em 0;
}

.direction-l,
.direction-r {
	float: none;
	width: 100%;

	text-align: center;
}

.flag-wrapper {
	text-align: center;
}

.flag {
	background: rgb(255,255,255);
	z-index: 15;
}

.direction-l .flag:before,
.direction-r .flag:before {
  position: absolute;
  top: -30px;
	left: 52%;
	content: ' ';
	display: block;
	width: 12px;
	height: 12px;
	margin-left: -9px;
	background: #fff;
	border-radius: 10px;
	border: 4px solid #38a9e3;
	z-index: 10;

}

.direction-l .flag:after,
.direction-r .flag:after {
	content: "";
	position: absolute;
	left: 50%;
	top: -8px;
	height: 0;
	width: 0;
	margin-left: -8px;
	border: solid transparent;
	border-bottom-color: #38a9e3;
	border-width: 8px;
	pointer-events: none;
}

.time-wrapper {
	display: block;
	position: relative;
	margin: 4px 0 0 0;
	z-index: 14;
}

.direction-l .time-wrapper {
	float: none;
}

.direction-r .time-wrapper {
	float: none;
}

.desc {
	position: relative;
	margin: 1em 0 0 0;
	padding: 1em;
	background: rgb(245,245,245);
	-webkit-box-shadow: 0 0 1px rgba(0,0,0,0.20);
	-moz-box-shadow: 0 0 1px rgba(0,0,0,0.20);
	box-shadow: 0 0 1px rgba(0,0,0,0.20);

  z-index: 15;
}

.direction-l .desc,
.direction-r .desc {
	position: relative;
	margin: 1em 1em 0 1em;
	padding: 1em;

  z-index: 15;
}

}

@media screen and (min-width: 400px ?? max-width: 660px) {

.direction-l .desc,
.direction-r .desc {
	margin: 1em 4em 0 4em;
}

}









/*end time*/


@font-face {
	font-family: 'droid';
	src: url('../fonts/droidkufi-bold.eot');
	src: url('../fonts/droidkufi-bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/droidkufi-bold.ttf') format('truetype'),
        url('../fonts/droidkufi-regular.svg#webfontRl4nowrT') format('svg');
	font-weight: normal;
	font-style:normal;
}


@font-face {
	font-family: 'light';
	src: url('../fonts/droidkufi-regular.eot');
	src: url('../fonts/droidkufi-regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/droidkufi-regular.ttf') format('truetype'),
        url('../fonts/droidkufi-regular.svg#webfontRl4nowrT') format('svg');
	font-weight: normal;
	font-style:normal;
}

body{
	font-family: light;

}

html{
	height: 100%;
}

nav{
    /*position: fixed;*/
    /*background: #fff;*/
    z-index: 1000;
    width: 100%;
  /*  padding: 30px;*/
    /*display: none;*/
    -webkit-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.18);
    -moz-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.18);
    box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.18);
}

.nav-menu{
    float: right;
    line-height: 32px;
}

nav ul li{
    /*float: left;*/
    margin-right: 0px;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
}

nav ul li a{
    color: #000;
}

nav ul li a:hover{
    color: #afafaf!important;
}

.logo{
    float: left;
}

 .responsive{
    display: none;
    font-size: 23px;
}

.active{
    color:#afafaf;
}


/*footer{
    background: #000;
    padding: 90px 0;
    margin-top:90px;
    text-align: center;
}

footer p{
    line-height: 20px;
    margin-top: 20px;
}

footer .social a{
    color: #b1b1b1;
    font-size: 15px;
    margin: 0 10px;
    transition: all ease 0.3s;
    font-size: 13px;
}*/

/*.diag footer p{
    font-size: 14px;
    color: #757575;
    line-height: 27px;
}*/

ul, li {


    padding-bottom: 10px;

}

.site-button:focus{
    outline: 0;
}

.nav-menu li a:focus{
    color: #000;
}

.ok{
    background: green !important;
    border: solid 2px green !important;
    color: white;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset;
}

.form-inp.reqError, .contact-form textarea.reqError {
    border-color: #f00;
}

.content{
    margin-top: 60px;
}

.subpage-nav{
    display:block !important;
    position: relative;
}

.page-title{
   display: table-cell;
   vertical-align: middle;
   text-align: center;
   z-index: 2;
   position: relative;
}

.page-title h1{
   font-size: 75px;
   color: #fff;
   font-weight: bold;
   letter-spacing: -3px;
   margin-bottom: 20px;
}


/* Margins */

.top_15{
    margin-top: 15px;
}

.top_30{
    margin-top: 30px;
}

.top_45{
    margin-top: 45px;
}

.top_60{
    margin-top: 60px;
}

.top_90{
    margin-top: 90px;
}

.top_120{
    margin-top: 120px;
}

.padding_30{
   padding: 30px 0;
}

.padding_45{
   padding: 45px 0;
}

.padding_60{
   padding: 60px 0;
}

.padding_90{
   padding: 90px 0;
}

.bottom_15{
    margin-bottom: 15px;
}

.bottom_30{
    margin-bottom: 12px;
}

.bottom_45{
    margin-bottom: 45px;
}

.bottom_60{
    margin-bottom: 60px;
}

.bottom_90{
    margin-bottom: 90px;
}

.bottom_120{
    margin-bottom: 120px;
}

.padbot_15{
    padding-bottom: 15px;
}

.padbot_30{
    padding-bottom: 30px;
}

.padbot_45{
    padding-bottom: 45px;
}

.padbot_60{
    padding-bottom: 60px;
}

.padbot_90{
    padding-bottom: 90px;
}

.padbot_120{
    padding-bottom: 120px;
}

.padbot_200{
    padding-bottom: 200px;
}
/*preloader */
.loader-wrapper {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 9999;
}

.loader {
    height: 1px;
    background-color: #fff;
    position: absolute;
    z-index: 9999;
}


/*------------------------ 2 Home ------------------------*/

.home{
    background:url(../images/home.jpg) bottom center;
    width: 100%;
    display: table;
}

.diag .home{
    background: url(../images/home-2.jpg) 50% 60% fixed;
    background-size: cover;
}

.home-content{
   display: table-cell;
   vertical-align: middle;
   text-align: center;
   z-index: 2;
   position: relative;
}

.home-content h1{
   font-size: 75px;
   color: #fff;
   font-weight: bold;
   letter-spacing: -3px;
   margin-bottom: 20px;
}

.home:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.14);
    z-index: 1;
}

.social{
    height: 30px;
}



.social a{
    color: #fff;
    font-size: 15px;
    margin:0 15px;
    transition: all ease 0.3s;
}


.social a:hover{
    transition: all ease 0.3s;
    opacity: 0.5;
}


.home-down {
    color: #fff;
    font-size: 40px;
    padding-top: 40px;
    padding-left: 20px;
    display: inline-block;
    transition: all 0.3s ease;
}


.home-down:hover{
    color: #fff;
	transition:all 0.3s ease;
}

.home-down:focus{
    color: #fff;
}

/* arrow css3 animation */

@-webkit-keyframes bounce {
	 0%, 100% {-webkit-transform: translateY(0);}
	 50% {-webkit-transform: translateY(-20px);}
}

@-moz-keyframes bounce {
	 0%, 100% {-moz-transform: translateY(0);}
	 50% {-moz-transform: translateY(-20px);}
}

@-o-keyframes bounce {
	 0%, 100% {-o-transform: translateY(0);}
	 50% {-o-transform: translateY(-20px);}
}

@keyframes bounce {
	 0%, 100% {transform: translateY(0);}
	 50% {transform: translateY(-20px);}
}

 .bounce {
	 -webkit-border-radius:50%;
	 -moz-border-radius:50%;
	 -ms-border-radius:50%;
	 border-radius:50%;
	 animation: bounce 2s infinite;
	 -webkit-animation: bounce 2s infinite;
	 -moz-animation: bounce 2s infinite;
	 -o-animation: bounce 2s infinite;
}

.diagonal{
    position: absolute;
    left: 0;
    bottom: 0;
    pointer-events: none;
    background: #fff;
    float: left;
    z-index: 1000;
}

.diagonal-gray{
    position: absolute;
    left: 0;
    bottom: 0;
    pointer-events: none;
    background: #f8dbb6 url(../images/overlay.png);
    float: left;
    z-index: 0;
    margin-top: 90px;
}

.diagonal-gray path {
       fill: #dadada;
			 background:  #dedede url("../images/overlay.png");
}

.diagonal-white{
    background:  #dedede url("../images/overlay.png");
    margin-bottom: -6px;
    margin-top: 60px;
}

.diagonal-white path {
    fill: #f3d5b0;
    stroke: #f3d5b0;
    stroke-width: 0;
}

#portfolio{
background: #f7dab5 url(../images/overlay.png) !important;

}

.diagonal.home-left{
    position: absolute;
    bottom: 0;
    left: 0;
    background: none;
    z-index: 99;
}

.diagonal.home-right{
    position: absolute;
    bottom: 0;
    right: 0 !important;
    background: none;
    z-index: 99;
    left: auto;
}

.diagonal.home-left, .diagonal.home-right path {
    fill: #dadada;
    stroke: #dadada;
    stroke-width: 4;
}

.diag p{
    font-size: 14px;
    color: #474848;
    line-height: 28px;
		margin-top:3%;
		direction: rtl;
		    text-align: justify;
        font-weight: 600;
}

.diag .section-title.dleft{
    text-align: right;
    padding: initial;
}

.diag .section-title.dleft .portfolio_filter ul{
    float: left;
}

.diag .section-title.dright{
    text-align: right;
    padding: initial;
}

.diag section{
    position: relative;
}

.diag .contact .contact-info li{
    line-height: 36px;
    font-size: 14.5px;
    color: #414141;
    text-align: left;
    list-style: none;
}

.diag .page-title.sub{
    font-size: 23px;
    text-align: right;
    width: 100%;
    float: right;
}

.diag .page-title.sub h5{
        font-weight: bold;
    line-height: 30px;
    padding-bottom: 15px;
}

.diag .social-icons a {
    color: #000;
    font-size: 13px;
    width: 26px;
    height: 18px;
    display: inline-block;
}

.diag .home-content h1{
    text-align: left;
}

.diag .home-content .social{
    text-align: left;
}

.diag .home-content .home-down.bounce{
    float: left;
    padding: 550px 170px 0;
}

.social-icons a:hover {
    font-size: 15px;
}

.fb:hover{
    color: #3b5998!important;
    transition: all ease 0.1s;
}

.tw:hover{
    color: #55acee!important;
    transition: all ease 0.1s;
}

.ins:hover{
    color: #cd486b!important;
    transition: all ease 0.1s;
}

.bh:hover{
    color: #1769ff!important;
    transition: all ease 0.1s;
}

.dr:hover{
    color: #ea4c89!important;
    transition: all ease 0.1s;
}


.sitebtn{
    border: solid 2px #dfdfdf;
    background: none;
    font-size: 13px;
    padding:9px 11px;
    text-align: left;
    min-width: 140px;
    line-height: 17px;
    transition: all ease 0.3s;
    color:#000;
}

.sitebtn:after{
    font-family: FontAwesome;
    content: "\f178";
    color: #000;
    float: right;
}

.sitebtn:focus{
    border: solid 2px #000;
}

.sitebtn:hover{
    background: #000;
    color: #fff;
    border-color: #000;
    transition: all ease 0.3s;
}

.sitebtn:hover:after{
    color: #fff;
}

.sitebtn:focus{
    border: solid 2px #dfdfdf;
}


/*------------------------ 3 About ------------------------*/

/*.about.type-1 .about-image{
    padding-bottom: 70px;
    background: #e8e8e8;
}*/

.about.type-1 .about-image img:before{
    background: #e4e4e4;
}

.about.type-1 .about-image img{
    width: 100%;
    box-shadow: 0px 0px 85px 0px rgba(0, 0, 0, 0.14);
    margin-top: -15%;
    margin-left: calc(15% - 15px);
}

.about.type-1.vertiqal .about-image img{
    width: 100%;
    box-shadow: 0px 0px 85px 0px rgba(0, 0, 0, 0.14);
    margin-top: -15%;
    margin-left: -15%;
}

.diagonal-title h5{
    padding-bottom: 20px;
    font-size: 25px;
    line-height: 31px;
}

.diagonal span{
    font-size: 15px;
    color: #b3b3b3;
    letter-spacing: 3px;
    margin-bottom: 5px;
    display: block;
}

.about{
    padding-top:25px;
 }

.diag .about{
    position: relative;
 }

.about-image img{
    width: 100%;
 }


.work-areas{
    width: 100%;
    display: inline-block!important;
}

.work-areas .area .icon i:before{
    font-size: 40px;
    margin-left: 5px;
}

.work-areas .area .icon i{
    display: inline-block;
		color:#40a7e1;
}

.work-areas .area .icon {
    width: 5%;
    float: right;
}

.work-areas .area .text {
    width: 80%;
    float: right;
		direction: rtl;
		text-align: center;
}

.work-areas .area .text h6{
    font-size: 15px;
    margin-bottom: 8px;
		color: #075682;
		font-weight: bold;
		line-height: 22px;
}

.work-areas .area .text p{
    font-size: 16px;
    line-height: 24px;
		text-align: center;
}


.about h2{
    font-size: 23px;
    line-height: 30px;
 }

.about-text{
    display: table;
   /*height: 600px;*/
 }

.out{
    display: table-cell;
   vertical-align: middle;
 }

.typed-cursor{
    opacity: 1;
    -webkit-animation: blink 0.7s infinite;
    -moz-animation: blink 0.7s infinite;
    animation: blink 0.7s 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; }
}


.gray-bg{
    margin-top: 90px;
    background: #f5f5f5;
}

.dgray-bg{
    background: #dedede url(../images/overlay.png);
}

.what-can{
    padding: 90px 0;
}

.what-can .feature{
    text-align: center;
    margin-bottom: 30px;
}

.what-can .feature i{
    font-size: 40px;
}

.what-can .feature h3{
    font-size: 13px;
    letter-spacing: 1px;
    margin-bottom: 11px;
}

.what-can .feature p{
    line-height: 20px;
}



/*------------------------ 4 Portfolio ------------------------*/


.section-title{
    text-align: center;
    padding: 90px 0 60px 0;
}

.section-title h2{
    font-size: 20px;
    font-weight: bold;
		color:#38a9e3;
		direction: rtl;
}

.section-title p{
    line-height: 20px;
}

.portfolio_filter{
    text-align: center;
    padding-top: 15px;
}

.portfolio_filter ul{
    margin: auto;
    display: inline-block;
}

.portfolio_filter ul li{
    font-size: 14px;
    color: #777777;
    font-family: 'Poppins', sans-serif;
    float: left;
    margin-right: 15px;
    list-style: none;
    cursor: pointer;
}

.single_item {
    margin-bottom: 30px;
}

.single_item img{
    width: 100%;
    transition: all ease 0.3s;
}

.single_item img:hover {
  background: #ffffff;
  transition: all ease 0.3s;
  box-shadow: 0px 16px 22px 0px rgba(90, 91, 95, 0.3);
  top: -5px;
}

.select-cat{
    color:#000 !important;
}

.popup-youtube {
    position: relative;
}

.popup-youtube i{
    position: absolute;
    text-align: center;
    top: 50%;
    left: 50%;
    background: rgba(0, 0, 0, 0.66);
    padding: 28px 29px;
    color: #fff;
    margin: -31px;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
}



/*------------------------ 5 Blog ------------------------*/

.blog-image img{
    width: 100%;
    min-height: 207px;
}

.blog-content{
    margin-bottom:60px;
}

.blog-title{
    font-size: 18px;
    letter-spacing: 0;
    line-height: 27px;
    padding: 30px 0 15px;
    color: #000;
}

.blog-info{
    font-size: 12px;
    font-weight: 400;
    color: #b9b9b9;
    margin-top: 20px;
    display: inline-block;
}

.blog-info span{
    color: #000;
    font-weight: 600;
}

.blog .site-button{
    margin:0 auto 60px;
    display: table;
}

.blog-single h1 {
    font-size: 30px;
    line-height: 41px;
    margin: 25px 0 22px 0;
    color: #000;
    font-weight: 600;
    letter-spacing: -1px;
}

.blog-single .blog-detail{
    font-size: 13px;
    color: #b9b9b9;
    margin-bottom: 30px;
}

.blog-single .blog-detail span{
    color: #000;
}

.blog-single blockquote {
    font-size: 14px;
    line-height: 24px;
    color: #000;
    border-left: 4px solid #000;
    padding-left: 20px;
    margin: 40px 0;
}

.blog-single ul.list-style {
    padding: 30px;
    line-height: 24px;
}

.blog-single ul.list-style li {
    font-size: 14px;
    list-style: circle;
}

.lightbox-image img{
    width: 100%;
    padding-bottom: 30px;
}

.blog-single .post-lightbox{
    padding: 30px 0 0;
 }

.subtitle {
     font-size: 22px;
    line-height: 24px;
    margin: 25px 0 30px 0;
    color: #000;
    font-weight: bold;
}

.post-comment {
    float: left;
}

ul.post-comment li {
    width: 100%;
    float: left;
    border-bottom: 1px solid #efefef;
    padding: 15px 0;
    list-style: none;
}

ul.post-comment li img {
    width: 15%;
    float: left;
}

ul.post-comment li .comment-info {
    float: left;
    width: 85%;
    padding-left: 15px;
        margin-top: 15px;
}


ul.post-comment li h3 {
    float: left;
    font-size: 14px;
}

ul.post-comment li a {
    float: right;
    font-size: 11px;
    font-weight: bold;
    color: #000;
}

ul.post-comment li span {
    float: left;
    width: 100%;
    font-size: 12px;
    color: #c5c5c5;
    margin-top: 3px;
}

ul.post-comment li p {
    font-size: 12px;
    line-height: 20px;
    float: left;
    margin-top: 6px;
}

.send-message{
    margin-top:60px !important;
}

.send-message .subtitle{
    margin-bottom:30px;
}

.blog .dgray-bg .sitebtn{
    margin-right:120px;
}



/*------------------------ 5 Contact ------------------------*/


.contact-info{
    text-align: center;
}

.contact-info i{
    width: 60px;
    height: 60px;
    text-align: center;
    background: #000;
    border-radius: 50px;
    color: #fff;
    padding-top: 20px;
    font-size: 20px;
    margin-bottom: 15px;
}

.contact-info p{
    line-height: 20px;
}

.section-title p{
    margin-top:20px;
}

.form-inp {
    width: 100%;
    height: 45px;
    border: 0;
    color: #000;
    border-bottom: solid 1px #dfdfdf;
    font-size: 13px;
    padding-left: 10px;
    margin-bottom: 15px;
    font-family: 'Poppins', sans-serif;
}

.contact-form textarea {
       width: 100%;
    border: 0;
    border-bottom: solid 1px #dfdfdf;
    font-size: 13px;
    padding: 20px 0 0 10px;
    height: 119px;
    margin-bottom: 15px;
    font-family: 'Poppins', sans-serif;
}

.contact-form{
    margin-top: 90px;
}

.contact-form .sitebtn{
    margin: auto;
    margin-top: 30px;
    display: block;
}

.button{
    text-align: center;
    padding: 45px 0;
}

.site-button{
    padding: 10px 50px;
    font-size: 12px;
    background: none;
    border: 2px solid;
    border-radius: 50px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    transition: all ease 0.3s;
}

a.site-button{
    border: 2px solid #000;
    color: #000;
}

.site-button:hover{
    background: #000;
    color: #fff;
    transition: all ease 0.3s;
}




/*------------------------ 6 Responsive ------------------------*/


/*max Width 992px */

@media screen and (max-width: 991px) {

    .home-content h1{
        font-size: 50px;
    }

     .what-can .feature{
        padding: 0 30px;
    }

    .about.type-1 .about-image{
        background: none;
    }

    .about.type-1 .about-image img{
        margin: 0;
    }

}


/*max Width 768px */

@media screen and (max-width: 767px) {



    .home-content h1{
        font-size: 32px;
        margin-bottom: 10px;
    }

    .contact-info{
        margin-bottom: 30px;
        padding: 0 50px;
    }

    .social a{
        margin: 0 10px;
        font-size: 12px;
    }

    /*nav{
        padding:30px 15px;
    }*/

    .nav-menu{
        margin-top: 40px;
        display: none;
        float: none;
        width: 100%;
    }

    .nav-menu li{
        float: none;
        width: 100%;
        text-align: center;
        height: 45px;
        border-top: 1px solid #f7f7f7;
        line-height: 45px;
    }

    .responsive{
        float: right;
        display: block;
    }

    .about {
    padding-top: 0px;
    }

    .about-text{

    display: block;
    }

    .lel-fb{
          margin-left: 0% !important;
    }

    .about h2 {
        margin-top: 30px;
    }

    .gray-bg {
        margin-top: 30px;
    }

    .what-can {
        padding: 45px 0;
    }

    .section-title {
        padding: 60px 0 45px 0;
    }

    .portfolio_filter ul{
        margin-top: 15px;
    }

    .portfolio_filter ul li{
        height: 30px;
    }

    .diagonal, .diagonal-gray, .diagonal-white{
        height: 70px;
    }

    .row.bottom_90{
        margin-bottom: 0;
    }

    .diag .blog{
        padding-bottom: 60px;
    }

}


/*min Width 768px */
@media screen and (min-width: 768px) {

 .nav-menu{
        display: block!important;
    }

}


/*------------------------ 7 Slider & Video Home ------------------------*/


.home-slider{
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
}

.slider{
    background: none !important;
}

.home-video{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}



.wow-removed{
     animation-name: none !important;
        visibility: visible !important;
}



.image-wrap {
		background: url(../images/00.png);
    background-position: center;
    background-size: cover;
    height: 23rem;
    margin: 0rem auto;
    max-width: 60rem;
    position: relative;
    width: 100%;
		border: 0px solid;
border-radius: 10px;
}
.image-wrap .title {
    bottom: 0;
    color: #fff;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
}
.image-wrap .title::before {
    content: "";
    background-color: #fff;
    bottom: calc(100% + 2rem);
    height: 40rem;
    left: 0;
    position: absolute;
    width: 0.25rem;
}
.image-wrap .title::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    height: 0.25rem;
    left: calc(100% + 2rem);
    position: absolute;
    width: 60rem;
}
.image-wrap h2 {
    color: #fff;
    display: block;
    font-family: Arial, sans-serif;
    font-size: calc(1.5rem + 1.5vw);
    font-weight: 800;
    letter-spacing: -0.15rem;
    line-height: 0.90;
    margin: 0;
    text-indent: -0.07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.image-wrap .borders {
    bottom: 2rem;
    left: 2rem;
    overflow: hidden;
    position: absolute;
    right: 2rem;
    top: 1rem;
		    opacity: 0.5;
}


hr.style18 {
  height: 30px;
  border-style: solid;
  border-color: #8c8b8b;
  border-width: 1px 0 0 0;
  border-radius: 20px;
}
hr.style18:before {
  display: block;
  content: "";
  height: 30px;
  margin-top: -31px;
  border-style: solid;
  border-color: #8c8b8b;
  border-width: 0 0 1px 0;
  border-radius: 20px;
}


.image-wrap .borders::before {
    content: "";
    background-color: #fff;
    height: 0.25rem;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.image-wrap .borders::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 0.25rem;
}
.image-wrap::before,
.image-wrap::after {
    content: "";
  /*  background: #777;*/
    bottom: 32px;
  /*  box-shadow: 0 30px 20px rgba(0, 0, 0, 0.45);*/
    left: 8px;
    position: absolute;
    top: 80%;
    transform: rotate(-7deg);
    width: 50%;
    z-index: -1;
}
.image-wrap::after {
    left: auto;
    right: 8px;
    transform: rotate(7deg);
}




.image-wrap2 {
		background: url(../images/002.png);
    background-position: right;
    background-size: cover;
    height: 25rem;
    margin: 0rem auto;
    max-width: 60rem;
    position: relative;
    width: 100%;
		border: 0px solid;
		border-radius: 10px;

}

.image-wrap2 .title {
    bottom: 0;
    color: #fff;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
}
.image-wrap2 .title::before {
    content: "";
    background-color: #fff;
    bottom: calc(100% + 2rem);
    height: 40rem;
    left: 0;
    position: absolute;
    width: 0.25rem;
}
.image-wrap2 .title::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    height: 0.25rem;
    left: calc(100% + 2rem);
    position: absolute;
    width: 60rem;
}
.image-wrap2 h2 {
    color: #fff;
    display: block;
    font-family: Arial, sans-serif;
    font-size: calc(1.5rem + 1.5vw);
    font-weight: 800;
    letter-spacing: -0.15rem;
    line-height: 0.90;
    margin: 0;
    text-indent: -0.07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.image-wrap2 .borders {
    bottom: 2rem;
    left: 2rem;
    overflow: hidden;
    position: absolute;
    right: 2rem;
    top: 1rem;
		opacity: 0.5;
}
.image-wrap2 .borders::before {
    content: "";
    background-color: #fff;
    height: 0.25rem;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.image-wrap2 .borders::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 0.25rem;
}
.image-wrap2::before,
.image-wrap2::after {
    content: "";
  /*background: #777;*/
    bottom: 32px;
    /*box-shadow: 0 30px 20px rgba(0, 0, 0, 0.45);*/
    left: 8px;
    position: absolute;
    top: 80%;
    transform: rotate(-7deg);
    width: 50%;
    z-index: -1;
}
.image-wrap2::after {
    left: auto;
    right: 8px;
    transform: rotate(7deg);
}





.image-wrap3 {
		background: url(../images/003.png);
    background-position: center;
    background-size: cover;
    height: 25rem;
    margin: 0rem auto;
    max-width: 60rem;
    position: relative;
    width: 100%;
		border: 0px solid;
		border-radius: 10px;

}

.image-wrap3 .title {
    bottom: 0;
    color: #fff;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
}
.image-wrap3 .title::before {
    content: "";
    background-color: #fff;
    bottom: calc(100% + 2rem);
    height: 40rem;
    left: 0;
    position: absolute;
    width: 0.25rem;
}
.image-wrap3 .title::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    height: 0.25rem;
    left: calc(100% + 2rem);
    position: absolute;
    width: 60rem;
}
.image-wrap3 h2 {
    color: #fff;
    display: block;
    font-family: Arial, sans-serif;
    font-size: calc(1.5rem + 1.5vw);
    font-weight: 800;
    letter-spacing: -0.15rem;
    line-height: 0.90;
    margin: 0;
    text-indent: -0.07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.image-wrap3 .borders {
    bottom: 2rem;
    left: 2rem;
    overflow: hidden;
    position: absolute;
    right: 2rem;
    top: 1rem;
		opacity: 0.5;
}
.image-wrap3 .borders::before {
    content: "";
    background-color: #fff;
    height: 0.25rem;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.image-wrap3 .borders::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 0.25rem;
}
.image-wrap3::before,
.image-wrap3::after {
    content: "";
  /*background: #777;*/
    bottom: 32px;
    /*box-shadow: 0 30px 20px rgba(0, 0, 0, 0.45);*/
    left: 8px;
    position: absolute;
    top: 80%;
    transform: rotate(-7deg);
    width: 50%;
    z-index: -1;
}
.image-wrap3::after {
    left: auto;
    right: 8px;
    transform: rotate(7deg);
}



















.image-wrap4 {
		background: url(../images/004.png);
    background-position: right;
    background-size: cover;
    height: 25rem;
    margin: 0rem auto;
    max-width: 60rem;
    position: relative;
    width: 100%;
		border: 0px solid;
		border-radius: 10px;

}

.image-wrap4 .title {
    bottom: 0;
    color: #fff;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
}
.image-wrap4 .title::before {
    content: "";
    background-color: #fff;
    bottom: calc(100% + 2rem);
    height: 40rem;
    left: 0;
    position: absolute;
    width: 0.25rem;
}
.image-wrap4 .title::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    height: 0.25rem;
    left: calc(100% + 2rem);
    position: absolute;
    width: 60rem;
}
.image-wrap4 h2 {
    color: #fff;
    display: block;
    font-family: Arial, sans-serif;
    font-size: calc(1.5rem + 1.5vw);
    font-weight: 800;
    letter-spacing: -0.15rem;
    line-height: 0.90;
    margin: 0;
    text-indent: -0.07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.image-wrap4 .borders {
    bottom: 2rem;
    left: 2rem;
    overflow: hidden;
    position: absolute;
    right: 2rem;
    top: 1rem;
		opacity: 0.5;
}
.image-wrap4 .borders::before {
    content: "";
    background-color: #fff;
    height: 0.25rem;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.image-wrap4 .borders::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 0.25rem;
}
.image-wrap4::before,
.image-wrap4::after {
    content: "";
  /*background: #777;*/
    bottom: 32px;
    /*box-shadow: 0 30px 20px rgba(0, 0, 0, 0.45);*/
    left: 8px;
    position: absolute;
    top: 80%;
    transform: rotate(-7deg);
    width: 50%;
    z-index: -1;
}
.image-wrap4::after {
    left: auto;
    right: 8px;
    transform: rotate(7deg);
}










.image-wrap5 {
		background: url(../images/005.png);
    background-position: right;
    background-size: cover;
    height: 25rem;
    margin: 0rem auto;
    max-width: 60rem;
    position: relative;
    width: 100%;
		border: 0px solid;
		border-radius: 10px;

}

.image-wrap5 .title {
    bottom: 0;
    color: #fff;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
}
.image-wrap5 .title::before {
    content: "";
    background-color: #fff;
    bottom: calc(100% + 2rem);
    height: 40rem;
    left: 0;
    position: absolute;
    width: 0.25rem;
}
.image-wrap5 .title::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    height: 0.25rem;
    left: calc(100% + 2rem);
    position: absolute;
    width: 60rem;
}
.image-wrap5 h2 {
    color: #fff;
    display: block;
    font-family: Arial, sans-serif;
    font-size: calc(1.5rem + 1.5vw);
    font-weight: 800;
    letter-spacing: -0.15rem;
    line-height: 0.90;
    margin: 0;
    text-indent: -0.07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.image-wrap5 .borders {
    bottom: 2rem;
    left: 2rem;
    overflow: hidden;
    position: absolute;
    right: 2rem;
    top: 1rem;
		opacity: 0.5;
}
.image-wrap5 .borders::before {
    content: "";
    background-color: #fff;
    height: 0.25rem;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.image-wrap5 .borders::after {
    content: "";
    background-color: #fff;
    bottom: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 0.25rem;
}
.image-wrap5::before,
.image-wrap5::after {
    content: "";
  /*background: #777;*/
    bottom: 32px;
    /*box-shadow: 0 30px 20px rgba(0, 0, 0, 0.45);*/
    left: 8px;
    position: absolute;
    top: 80%;
    transform: rotate(-7deg);
    width: 50%;
    z-index: -1;
}
.image-wrap5::after {
    left: auto;
    right: 8px;
    transform: rotate(7deg);
}


/*button*/

.btn-read {
   position: relative;
  display: inline-block;
font-size: 14px;
  padding: 15px 30px;
  overflow: hidden;
  z-index: 1;
    color: #fff;
    background-color: #3b589e;
    border: none;
    font-weight: 600;
}
.btn--animated:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgb(7, 86, 130);
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition-property: transform;
  transition-duration: 2s;
  transition-timing-function: ease-out;
  z-index: -1;
}
.btn--animated:hover {
  color: #fff;
}
.btn--animated:hover:before {
  transform: scaleX(1);
  transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66);
}
/* end button hover */


hr {
    margin-top: 10px;
    margin-bottom: 10px;
    border: 0;
    border-top: 1px solid #38a9e3;
}



figure {
  display: inline-block;
  position: relative;
  left: 0;
  -moz-transform:rotate(-5deg);
  -webkit-transform:rotate(-5deg);
  -ms-transform:rotate(-5deg);
  transform:rotate(-10deg);
}

img {
  /*border-color: white;*/
  /*border-width: 15px;*/
  -moz-border-image: url(http://tobias-reinhardt.de/img/frame.png) 15 stretch;
  border-image: url(http://tobias-reinhardt.de/img/frame.png) 15 stretch;
  border-style: solid;
  margin: auto;
}

/**********************************************************
* If a caption is supplied the image needs a little space
* at the bottom to include the caption within the frame
***********************************************************/
img.hasCaption {
  padding-bottom: 50px;
}

figcaption {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 16px;
  background-color: white;
  text-align: center;
  color: blue;
  font-family: 'Reenie Beanie', cursive;
  font-size: 30px;
  padding: 10px;
}


.popup{
    width: 900px;
    margin: auto;
    text-align: center
}
.popup img{
    width: 200px;
    height: 200px;
    cursor: pointer
}
.show{
    z-index: 999;
    display: none;
}
.show .overlay{
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.66);
    position: absolute;
    top: 0;
    left: 0;
}
.show .img-show{
    width: 600px;
    height: 400px;
    background: #FFF;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden
}
.img-show span{
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 99;
    cursor: pointer;
}
.img-show img{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
/*End style*/



/*lightbox*/
a:not(.lightbox-close) {
  display:inline-block;
  background: darken(#e74c3c, 10%);


  /*font-size:42px !important;*/
  text-align:center;
  color:#ffffff;
}

.lightbox-close{
	font-size: 40px;
	    color: white;

}

/*LIGHTBOX STYLE*/
.lightbox {
  display:none;
  position:fixed;
  z-index:999;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.5);
	text-align: center !important;

  .lightbox-video {
    width:100%;
    padding-bottom:56%;
  }

  iframe {
    position:absolute;
    height:100%;
    width:100%;
    left:0;
    right:0;
  }

  img {
    display:block;
    margin:0 auto;
  }

  .lightbox-close {
    position:absolute;
    display:block;
    top: 10px;
    right: 10px;
    color:#ffffff;
    font-size:26px;
    height: 50px;
    width: 50px;
    background: rgba(255,255,255,0.3);
    border: 3px solid #ffffff;
    border-radius: 50%;
    line-height:50px;
    text-align:center;

    &:hover {
      text-decoration: none;
    }
  }

  .lightbox-container {
    max-width: 800px;
    margin:100px auto 25px;
		text-align: center !important;


  }
.lightbox-column{
text-align: center !important;

}