@import url('https://fonts.googleapis.com/css?family=Nunito+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');


body
	{background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     overflow-x: hidden;
     text-align: center !important;
   }

h1,h2,p
	{margin:0;padding:1% 0 0 0;
	font-family: Montserrat,sans-serif;}

button
	{border:none;cursor:pointer;font-size:15px}

button,h2{color:#fff}
h1{color:#fcd000;
	font-size:18px;
font-family: Montserrat,sans-serif;}
h2{font-size:16px;
font-family: Montserrat,sans-serif;
color: black;}

p,.tooltips
	{font-size:16px;
	font-family: Montserrat,sans-serif;}

.front_card,
.team{
	padding: ;
	background-color: #fff;
    overflow: hidden;
    border-radius: 20px 20px 20px 20px;
    backface-visibility: hidden;
    box-shadow: 0 10px 15px #e0dfdfc2;
	}

.col-2 a,
[class*="thumbnail"] span{
	background-size:32px 32px;
	width:32px;
	height:32px;
	border-radius:50%
	}

.container {
    width: 100%;
    padding: 3% 0% 0% 0%;
}


.quote{
	left:0%;
	padding: 10% 0% 0% 0%;
	margin: 15% 0% 0% 0%;
}

.front_img_content{
	height:53vh;
	width: auto;
	background-size: cover;
	background-repeat: no-repeat;
	padding: 0 0 0 0;
	border: none;
	outline: none;
}

.domain{
	color: grey;
	font-family: Signika Negative;
	font-size: 24px;
	padding: 0.5rem 1rem 1rem 1rem;
}

.content{
	width:22rem;
	height:32rem;
	left:30%;
	top:5%;
	padding: 0rem 0rem 0rem 0rem;
	margin: 1rem 0rem 0rem 0rem;
	display:block;
	position:absolute;
	perspective:100%;
	}

.object{
	position:relative;
    width: 24rem;
    height: 20rem;
    opacity: 8;
    top: -7.5rem;
    left: 11rem;
}

.object2{
    z-index: -1;
    position: absolute;
    height: 27rem;
    opacity: 5;
    top: 0rem;
    left:4rem;
}

.box{
	width:100%;
	height:100%;
	display:block;
	position:relative;
	transform:rotateY(0deg);
	transform-style:preserve-3d;
	transition:all .6s ease;
	
	}

.front_card{
	margin-top: -20rem;
	width:100%;
	height:100%;
	display:block;
	position:absolute;
	transform:translate3d(0,0,125px)
	}

.bg-hello,
.hello{
	width:100% ;
	display:block;
	}

.bg-hello
	{background-size:cover;border-radius:10px 10px 0 0}

.hello
	{   background: #fff;
		text-align:center;
		border-radius:0 0 10px 10px;
	}

.name{
	color:rgb(70, 70, 70); 
	font-size: 2rem;

}

.domain{
	margin-top:0rem;
	text-align: center;
}

.btnOpen{
	background: linear-gradient(40deg,#45cafc,#303f9f);
	margin:rem 0 0 0;
	padding:14px;
	border-radius:40px;
	transition:all .3s ease;
	box-shadow:0 8px 8px -8px #fff;
	width: 50%;
	}

.btnOpen:hover
	{transform:translateY(4px);box-shadow:none}


.software{
color: #3f95e9;
font-family: 'Montserrat', sans-serif;
letter-spacing: 1px;
font-size: 22px;
font-weight: bold;
}

.incubator{
font-weight: bold;
color:#111;
font-family: 'Montserrat', sans-serif;
font-size: 22px;
}

.si{
	display: inline-block;
	padding: 10% 5% 5% 5%;
}

.silogo{
	display: inline-block;
	margin: ;
	width: 38%;
    padding: 0% 0% 5% 10%;
}

.team{
	margin-top: -20rem;
	background-image:linear-gradient(45deg,#fff,#fff);
	width:100%;
	height:100%;
	display:block;
	position:absolute;
	transform:rotateY(180deg) translate3d(0,0,125px)
	}

.team:hover .btnClose{display:block}

.btnClose{ 
	background:rgba(255,0,0,0.7);
	margin:10px 10px 0 0;
	padding:8px 10px;
	display:none;
	float:right;
	border-radius:5px
	}

.data-for-thumbnail{
	width:100%;
	height:100%;
	display:none;
	position:absolute;
	border-radius:10px;
	z-index:-1;
	animation:fade 1.5s ease
	}

@keyframes fade{
	from{opacity:0}
	to{opacity:1}
	}

.bg-header{
	background-size:cover;
	width:100%;
	height:180px;
	top:0;
	display:block;
	position:absolute;
	border-radius:10px 10px 0 0
	}

.strip{
	height: 0.3%;
    width: 18rem;
    background-color: black;
    margin-top: 10rem;
    right: 4rem;
    left: 0rem;
    position: absolute;
    margin-left: 2rem;
}

.bg-header:before{
	background:rgba(145, 144, 144, 0);
	width:100%;
	height:100%;
	display:block;
	position:absolute;
	content:"";
	border-radius:10px 10px 0 0;
	}


.title{
	width:100%;
	padding:0 25px;
	top:50%;
	display:block;
	position:absolute;
	transform:translate(0,-50%);
	}



.about{
	margin:0 0 0 0;
	background:white;
	width:100%;
	padding:0px 16px 8px 16px;
	top:175px;
	display:block;
	position:absolute;

	}

.about p{color:#b6b6b6;}

.tooltips{
	background:#fff;
	padding:8px;
	top:-42px;
	display:none;
	position:absolute;
	z-index:1;
	border-radius:5px
	}

.tooltips:before{
	background:transparent;
	width:10px;
	bottom:-6px;
	display:block;
	position:absolute;
	content:"";
	border-left:5px solid transparent;
	border-right:5px solid transparent;
	border-top:10px solid #fff
	}

.prev
	{left:60px;border-right:20px solid #000}

.next
	{right:60px;border-left:20px solid #000}

.people{
	background:transparent;
	width:210px;
	height:100%;
	left:20px;
	display:block;
	position:absolute;
	transform-style:preserve-3d;
	transition:all 1s ease
	}

[class*="thumbnail"]{
	width:100%;
	height:100%;
	display:block;
	position:absolute;
	backface-visibility:hidden
	}

.thumbnail_1{transform:rotateY(0deg) translateZ(180px)}


[class*="thumbnail"] span{
	margin:1rem;

	position:relative;
	}

.rotate-box .box{transform:rotateY(-180deg)}

.center {
	display: table;
	width: 100%;
	bottom: 0;
	margin-top: 20px;
	position: absolute;;
  }
  #social-test {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	font-size: 30px;
  }
  #social-test .social {
	padding-left: 0px;
  }
  #social-test li {
	display: inline-block;
  }
  #social-test li a {
	color: rgba(107, 102, 102, 0.904);
	border-radius: 10px;
	list-style-type: none;
	display: inline-block;
	width: 70px;
	height: 50px;
	line-height: 50px;
	padding: 5%;
	cursor: pointer;
	transition: ease 0.3s;
  }
  #social-test li a:hover {
	color: #111;
  }
  .social:hover > li {
	opacity: 0.5;
  }
  .social:hover > li:hover {
	opacity: 1;
  }
  .credits,
  .credits a {
	font-size: 20px;
	font-family: Open Sans;
	color: rgba(255, 255, 255, 0.6);
  }

 

@media (max-width: 420px) {
	.row{
		padding: 0% 0% 0% 0%;
		margin: 0% 0% 0% 0%;
	}
	.container{
		position:absolute !important ;
		padding-left: 8% !important;
		transform: translate();
		left:;
	}
	.quote{
    display:;
	height: 50% !important;
	width:100% !important;
	padding: 10% 0% 0% 0% !important;
	justify-content: center;
}
.content{
	width: 22rem !important;
    height: 32rem !important;
    left: 0% !important;
    top: 25% !important;
    padding: 0rem 0rem 0rem 0rem;
    margin: 0rem 0rem 0rem 0rem;
    display: block;
    position: absolute;
    perspective: 100%;
}
.quote_content{
	font-size: 22px !important;
}
.object{
    left: 2rem;
}
.object2{
	position:absolute;
	height: 15rem;
    top: 1rem;
    left: inherit;
}

.box{
	padding: 0% 0% 0% 0%;
	margin: -15% 0% 0% 0%;
}
.pro_img{
	height: 42vh !important;
}
}

@media(min-width: 768px){
.object2{
	left: -3rem;
}
}