@font-face {
	font-family: "CircularStd-Black";
	font-family: "Akkurat-Light";
	font-family: "CircularStd-BookItalic";
	font-family: "CircularStd-Medium";
	src: url('../fonts/CircularStd-Black.otf');
	src: url('../fonts/CircularStd-BookItalic.otf');
	src: url('../fonts/Akkurat-Light.ttf');
	src: url('../fonts/CircularStd-Medium.otf');

}
body {
	margin:0;
	padding:0;

}

::-webkit-scrollbar { 
    display: none; 
}
h1, h2, h3, h4 {   
    font-family: 'CircularStd-Medium', sans-serif;
    color:#281E35;
    opacity: 0.95;
}

.button a {
	font-family: 'CircularStd-Black', 'CircularStd-Medium', sans-serif;
	color:#281E35;
	text-align: center;
	font-size: 18px;
}
h1 {
	font-size: 100px;
	letter-spacing: 20px;
}
h1.foodie {
	color:white;
	letter-spacing: 5px;

}
h1.blocker {
	color:white;
	letter-spacing: 0;

}

h1.weee {
	letter-spacing: 5px;
}

h1.decor {
	letter-spacing: 10px;
}

h1.pandora {
	letter-spacing: 5px;
}

h2 {
	font-size: 24px;
	letter-spacing: 0.6;
	text-align: center;
/*	text-decoration: underline;
	text-underline-position:*/
}
h2.big {
	font-size: 40px;
}
h3 {
	font-size: 20px;
	letter-spacing: 0.2px;
	text-align: center;
	margin-bottom:10px;
	margin-top: 10px;
}
h3.big {
	font-size: 30px;
	line-height: 40px;
}

 h4 {
 	font-size: 18px;

 }


p, li {
	font-family: 'Akkurat-Light', 'Source Sans Pro', sans-serif;
	font-size: 16px;
	letter-spacing: 0.5px;
	line-height: 24px;
	font-weight: 300;
	
}
h2.under-img {
	margin-bottom: 5px;
	margin-top:0;
	font-size: 32px;

}
p.under-img {
	font-family: 'CircularStd-Medium'; 
	font-size:19px;
	letter-spacing: 0;
}
p.two-col {
	padding-left: 7px;
	padding-right: 7px;
}
a {
	display:block;
	overflow: auto;
	color:black;
	text-decoration: none;
	color:white;
}
#header a {
    color:#262626;
}

.social a {
	color:black;
	font-size: 28px;
	margin:0 5px;
	line-height: 28px;
}

.button-box a {
	color:black;
	line-height: 28px;
	opacity: 0.9;
}
.button-box a:hover {

	opacity: 0.6;

}

a.copy {
	margin: 0 0 0 0; 
	text-align: center; 
	color:gray;
	font-size: 12px;
}

ul {
	margin:0;
	padding:0;

}
li {
	list-style: none;
}
h2.left, h3.left, p.left, h4.left {
	text-align: left;
}


h2.foodie {
	color:#006442;
}
h2.blocker {
	color:#00A99D;

}

h2.pandora {
	color:#267fbf;
}
 h2.okios {
 	color:#3E6DB7;
 }
 h2.decor {
 	color:#E8A52F;
 }

h2.task-p {
	text-align: center;
	margin-bottom: 50px;
	margin-top: 0;
	padding:0 30%;
}

h4.small {

	margin-bottom: 0;
}
.nav li a {
	text-decoration: none;
	margin:0 2em;
}

.button {
	margin-top:10%;
}

.button a:hover {
	margin-left:20px;
	transition: 0.5s;
	color:black;
}

.icon img {
	width:60px;
}



.button h3 {
	color:#C8483E;

}
.hidden {
	display:none;
}
.container {
	max-width:1180px;
	margin-right:auto;
	margin-left:auto;
	padding-left: 20px;
	padding-right: 20px;
}
.flex-container {
	display:flex;
	justify-content: space-between;
	align-items: center;
	height:50px;
}

.wrap {
	padding:0 0 0 8%;
}


.right {
	text-align: right;
}
.left {
	text-align: left;
}

.logo img {
	width:40px;
	float:left;
}

img.gif {
	max-width:450px;
	width:100%;
}

#burger {
	text-align: right;
}

/*This is burger menu*/
.overlay {
    height: 0%;
    width: 100%;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    overflow-y: hidden;
    transition: 0.5s;
}

.overlay-content {
    position: relative;
    top: 25%;
    width: 100%;
    text-align: center;
    margin-top: 30px;
}

.overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 24px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
    color: #f1f1f1;
}

.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 32px;
}

.top-space {
	margin-top: 50px;
}
.bottom-space {
	margin-bottom: 20px;
}
.bottom-line {
	border-bottom: 1px solid lightgray;
}
#burger {
	display:none;
}



.row.flex.social {
	align-items: flex-end;
	justify-content: center;
}


.competitors li {
	list-style: initial;
	text-align: left;
}







/*Phont frame;*/

.phone-box {
	width:380px;
	height:815px;
	position:relative;
	box-shadow: 0 4px 7px 0 rgba(0,0,0,.2);
}






/*header*/


#header{
	position:fixed;
	top:0;
	background-color: white;
	height: 50px;
	display:block;
	width: 100%;
	z-index:9;
	text-align:center;
	color: #2b2b2b;
	padding: 10px 0 5px 0;
	transition: 0.5s;
	/*box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);*/

	  /*left: 50%;
	  transform: translate(0, -50%);
	  -ms-transform: translate(0 -50%);*/
}
#header.active{
	top:-100px;
}

#header .nav li a:hover {
	opacity: 0.5;

}

#footer{
	/*position:absolute;
	bottom:0px;
	left:50%;
	transition: translate(0, -50%);*/
	text-align: center;
	height:50px;

}

.title {
	max-width:760px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 20px;
	padding-right: 5%;
	padding-left: 5%;
}
.box-space {
	margin-top: 560px;
}

.big-img {
	width:100%;
}

.footage {
	padding:0 1%;
	width:95%;
}

.ml10 {
  position: relative;
  font-weight: 900;
  font-size: 4em;
}

.ml10 .text-wrapper {
  position: relative;
  display: inline-block;
  padding-top: 0.2em;
  padding-right: 0.05em;
  padding-bottom: 0.1em;
  overflow: hidden;
}

.ml10 .letter {
  display: inline-block;
  line-height: 1em;
  transform-origin: 0 0;
}
/*section1*/

#section0 h2, a {
	font-family: 'CircularStd-Medium';
}
#section0 h2 {
	font-size: 55px;
	letter-spacing: 1px;
	margin-bottom: 0px;
	margin-top:0px;
	line-height:70px;
	color:#1C3875;
}
#section0 h2.topspace{
    margin-top:40px;
}
/*#section0 p {
	font-size: 33px;
	margin-top: 0;
	line-height: 40px;
}*/

/*#section0 .logo {
	position:absolute;
	width:95%;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
}*/
#section0 .hero-content {
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
	padding:0 60px;
}
#section0 .left-content, #section0 h2 {
	text-align: left;
}

#section0 .hero-content .box {
	margin-top:50px;
}

#section0 .hero-content .box a {
	padding:15px 0;
	border-radius: 5px;
	width:180px;
	background-color:#3B7BE5;
	box-shadow: 0 2px 4px lightgray;
	font-size: 16px;
	text-align: center;
	border:1px solid transparent;
}

#section0 .hero-content .box a:hover {

	background-color:white;
	border:1px solid #3B7BE5;
	color:#3B7BE5;

}
#section0 .left-content h4.mid {
	font-size:24px;
	margin-bottom: 0px;


}
#section0 .left-content p.small {
	font-size:14px;

}

#section0 .left-content {

}
#section0 .right-content img {
	max-width: 500px;

}

#section0 .hint {
	position:absolute;
	top:80%;
	left:50%;
	transform: translate(-50%, -50%);
}

#section0 .scroll-down {
	font-size: 40px;

}

/*section2*/

#section2 .box {

	display: inline-block;
	 overflow: hidden !important;


}


#section2 p.under-img {
	margin-bottom: 5px;
	margin-top: 0px;
}
#section2 p.color {
	color:#C8483E;
}
#section2 .project-item img {
	position:absolute;
	transition: 0.5s ease-in-out;
	width:100%;
	max-width:600px;
	min-width: 400px;
	top:43%;
	left:50%;
	transform: translate(-50%, -50%);


}

/*#section2 .front {
  position: absolute;
  transition: .5s ease;
  width:100%;
  height:100%;
  opacity: 0;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
  background-color: black;
}
#section2 .front p {
	position: absolute;
	top: 30%;
	font-size: 16px;
	color:white;
	margin:0 1.5em;
}*/

#section2 .project-item {
	margin:0 10px;
	padding:0 0 10px 0;
	transition: .15s ;
	position:relative;
}

/*#section2 .project-item:hover {

	box-shadow: 0 3px 3px -2px rgba(0,0,0,.2), 
	0 3px 4px 0 rgba(0,0,0,.14), 
	0 1px 8px 0 rgba(0,0,0,.12);

}*/

#section2 .project-item:hover img {


	top:41%;
	left:50%;


}


/*#section2 .project-item:hover img {
	transform: scale(1.03);
}*/

/*#section2 .project-item:hover img {
  opacity: 0.1;
}*/

/*#section2 .project-item:hover .front {
  opacity: 0.9;
}*/
.footer {
	margin-top: 4%;
}


/*section3*/

#section3 img{
	max-width:300px;
	width:100%;
}

#section3 h2, #section3 p, #section3 .button a {

	text-align: left;
}
#section3 {
	margin-top:12vh;

}

#section3 .content h2, #section3 .content p. #section .portrait .img {
	padding:0 100px;
}

#section3 p {
	margin-top: 0;
}

#section3 h2 {
	margin-bottom: 30px;
}


#section3 .content p, #section3 .content h2, #section3 .content a {
	padding-left:50px;
	padding-right:50px;
}

#section4 .row.flex {
	align-items: initial;
}
#section4  {
	margin-top:15vh;
	width:100%;
	height:75vh;
}

#section4 .nav ul {
	margin-left:100px;
}
#section4 .nav a {
	font-size: 30px;
	letter-spacing: 0.5px;
	text-align: left;
}
/*#section4 .nav a:hover {
	color:#C8483E;
}*/
#section4 .nav {
	margin-top:50px;
}
#section4 .nav a {
	color:#a1a1a1;
}
#section4 .info {
	position:relative;
	display:inline-block;
	margin-top:150px;
}

#section4 .info .para {
	position:absolute;
	top:50%;
	left:50%;

}

#section4 .img {
	text-align: left;
}
#section4 img {
	max-width:450px;
	width:100%;

/*	width:100%;*/

}

#section4 h4, #section4 p {
	text-align: left;
	padding-right:100px;
}
#section4 a {
	display:inline;
}

#section4 li {
	text-align: left;
	margin:20px 0;
}

#section4 .nav .no3  {
	color:#C8483E;
}




/*This is section5*/



#section5 .bj {
	width:100%;
	background-color: #f7f7f7;
}
#section5 .container {
	padding-top:30px;
	padding-bottom:0px;
}

#section5 .wrap.first {
	margin-top:60px;


}

#section5 .sm-img .img img {
	padding:0 0 0 10%;
}

#section5 h1, #section5 h2.detail-h2 , #section5 p, #section5 a, .myContent a, #section5 h4 {

	text-align: left;
}



 #section5 .content h2{
 	font-style: italic;
 	font-size:20px;
 	letter-spacing: 1px;

 }

 #section5 h2 {
	margin-bottom: 20px;
	margin-top:60px;

}

#section5 .img img {
	max-width:600px;
}

#section5 .sm img {
	max-width:250px;
	width:100%;	
}

#section5 .md  {
	overflow:hidden;
}
#section5 .md img{
	max-width:400px;
	width:100%;	
	padding:0 25px;

	
}
#section5 h2.detail-h2 {
	margin:15px 0 15px 0;
}

#section5 .part h2.detail-h2, #section5 .part p {
	padding-left:80px;
	padding-right:80px;
	margin-top:0;
	margin-bottom: 10px;
}
#section5 .part p {
	padding-bottom: 30px;
}


/*#section5 h4.task-h4{
	color:#C8483E;


}*/

#section5 .white {
	color:white;
}

#section5 .persona-p {

/*	margin-bottom: 10px;
	margin-top: 0;*/

}

#section5 .part h2.detail-h2 {
	margin-top:20px;
}
#section5 .img img.media-img {
	margin-top:20px;
	max-width: 420px;

}
#section5 .img img.small-img {
	margin-top:20px;
	max-width: 200px;

}

#section5 .form {
	margin:0;
}
#section5 .form h4{
	margin-top:0;
	margin-bottom:0px;
	line-height:24px;
	padding-left:25px;
	padding-right:25px;
}

#section5 p {
	padding-top:5px;
}
#section5 .up p {
	padding:5px 25px;
}

#section5 .row.flex.up {
	align-items: flex-start;

}

#section5 .task-flow .task-flow-content {
	margin:80px 0 0;
}
#section5 .task-flow p{
	font-size: 18px;
	text-align: center;
	max-width: 400px;
	margin-right:auto;
	margin-left: auto;
	padding:0 0 10px 0;

}






/*Section6*/



.myContent h2 {
	margin-bottom: 20px;
	margin-top: 50px;
}


.myContent .mid {
	padding:5%;


}

.myContent .mid p{
	margin:12px 0;

}

.myContent .final {
	margin-left:10%;
	margin-right:15%;
}

.myContent .final p, .myContent .final h3, .myContent .final h4{
	text-align: left;
}








/*This is footer in detail page*/

.bj-footer {
	padding:0 20px 10px 20px;
	background-color: #f7f7f7;
	position: relative;
}

.bj-footer.white {
	background-color: white;

}
.bj-footer .button-box img{
	max-width:180px;
	width:100%;
}
/*.bj-footer .button-box a {
	margin:10px 0;
}
*/



/*pandora  css*/

#section5 p.part-3 {
	padding:0 15px 20px 15px;
}

#section5 h3.part-3 {
	text-align: left;
	padding-left:15px;

}


img.wire {
    max-width:200px;
    width:100%;
    margin:0 15px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);

}

/*.video {
	height:100%;
	width:100%;
}

.video iframe {
	height:40%;
}
*/
.video-box {
		position: relative;
        padding-bottom: 56.25%;
        padding-top: 0;
        height: 0;
        overflow: hidden;
        margin-bottom: 10%;
}


.video-box iframe,
.video-box object,
.video-box embed {
	    position: absolute;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	}






.bj-footer .social img {
	width:30px;
	opacity: 0.3;
	transition: 0.15s;
}

.bj-footer .social img:hover{

	opacity: 0.8;
	
}

.bj-footer.contact1 {
	position:absolute;
	right: 0;
	bottom: 0;
	left: 0;
}

.bj-footer.contact2 {
	position:absolute;
	right: 0;
	bottom: -150px;
	left: 0;
}



/*#section5 .half {
	position:relative;
}

#section5  .half img {
	position: absolute;
	width:600px;
	top:30%;
	left:50%;
	transform: translate(-35%,-50%);
}
*/

















/*This is the fullPage css changed content.*/
.myContent {
	max-width:1140px;
	margin-right:auto;
	margin-left:auto;
	margin-top:30px;
	margin-bottom:30px;

}



.fp-controlArrow.fp-next {
    right: 30px;
border-width: 22px 0 22px 18px;
border-color: transparent transparent transparent lightgray;
}

.fp-controlArrow.fp-prev {
    left: 30px;
    width: 0;
    border-width: 22px 18px 22px 0;
    border-color: transparent lightgray transparent transparent;
}







#section0 .ele-r, #section0 .ele-b {
	max-width:180px;
	width:100%;

}




#a {
	width: 30px;
	height:30px;
	top:20%;
	left:30%;
	background-color:#BBD3FC;
	position:fixed;
	border-radius: 50%;
	border:3px solid #BBD3FC;
	opacity: 0.35;
	    
}

#b {
	width: 40px;
	height:40px;
	top:60%;
	left:80%;
	background-color:#BBD3FC;
	position:fixed;
	border-radius: 50%;
	border:3px solid #BBD3FC;
	opacity: 0.35;
    
}
#c {
	width: 30px;
	height:30px;
	top:35%;
	left:50%;
	background-color:#FFC861;
	position:fixed;
	border-radius: 50%;
	border:3px solid #FFC861;
	opacity: 0.35;

    
}
#d {
	width: 35px;
	height:35px;
	top:70%;
	left:30%;
	background-color:#FFC861;
	position:fixed;
	border-radius: 50%;
	border:3px solid #FFC861;
	opacity: 0.35;
    
}



/*This is animation cssx*/





#section0 .ele-b {
	position:relative;
	/*top:33%;*/
	left:130%;
	transition: all 3000ms ease;

}
#section0 .ele-r {
	position:relative;
/*	top:-33%;*/
	right:130%;
	transition: all 3000ms ease;
	
}



/*#section0 p{
	right: 130%;
	position:relative;
    transition: all 1000ms ease;
}*/


/*#section0 h2{
	left: 130%;
	position:relative;
    transition: all 1000ms ease;
}
#section0 p{
	right: 130%;
	position:relative;
    transition: all 1000ms ease;
}*/

.scroll-down {
  opacity: 1;
  -webkit-transition: all .5s ease-in 3s;
  transition: all .5s ease-in 3s;
}




.scroll-down {
  position: absolute;
  bottom: -100px;
  left: 50%;
  display: block;
  margin-left: -14px;
  display: block;
  width: 30px;
  height: 30px;
/*  border: 2px solid black;*/
  background-size: 14px auto;
  border-radius: 50%;
  z-index: 2;
  -webkit-animation: bounce 2s infinite 2s;
  animation: bounce 2s infinite 2s;
  -webkit-transition: all .2s ease-in;
  transition: all .2s ease-in;
}
.scrollTop {
  position: absolute;
  bottom: 120px;
  left: 50%;
  display: block;
  margin-left: -14px;
  /*display: block;*/
  width: 30px;
  height: 30px;
/*  border: 2px solid black;*/
  background-size: 14px auto;
  border-radius: 50%;
  z-index: 2;
  -webkit-animation: bounce 2s infinite 2s;
  animation: bounce 2s infinite 2s;
  -webkit-transition: all .2s ease-in;
  transition: all .2s ease-in;
}

.scrollTop:before {
    position: absolute;
    top: calc(50% - 8px);
    left: calc(50% - 6px);
    transform: rotate(135deg);
    display: block;
    width: 14px;
    height: 14px;
    content: "";
    border: 3px solid black;
    border-width: 0px 0 3px 3px;
}

.scroll-down:before {
    position: absolute;
    top: calc(50% - 8px);
    left: calc(50% - 6px);
    transform: rotate(-45deg);
    display: block;
    width: 14px;
    height: 14px;
    content: "";
    border: 3px solid black;
    border-width: 0px 0 3px 3px;
}

@keyframes bounce {

	0%,
	100%,
	20%,
	50%,
	80% {
	    -webkit-transform: translateY(0);
	    -ms-transform: translateY(0);
	    transform: translateY(0);
	}
	40% {
	    -webkit-transform: translateY(-10px);
	    -ms-transform: translateY(-20px);
	    transform: translateY(-20px);
	}
	60% {
	    -webkit-transform: translateY(-5px);
	    -ms-transform: translateY(-10px);
	    transform: translateY(-10px);
	}
}





/*random animation*/



/*Tag class animation*/

/* Tab group */
.tabgroup {
	padding: 1%;
}
.tabgroup ul {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  list-style-type: none;
}

.tabgroup .tab {

	font-family: 'CircularStd-Medium', sans-serif;

}


.tabgroup .tab {
  display: inline-block;
  border-radius:5px 5px 0 0;
  padding-top:0.8em;
  padding-bottom:0.8em;
  cursor: pointer;
  width: 32.5%;
  text-align: center;
  letter-spacing: .05em;
  font-size:18px;

}

.blocker .tabgroup .tab.active {
/*  border: 1px solid #ddd;*/
  background-color: #00A99D;
  color: white;
  border-bottom-width: 0;
}


.tabgroup .tab.active {
/*  border: 1px solid #ddd;*/
  background-color: #3E6DB7;
  color: white;
  border-bottom-width: 0;
}

/*.tabgroup .tab:hover {
  background-color: #FFD98D;
  color: #4B4B8F;
}*/

.tabgroup .contentlist {
  border-top:2px solid #3E6DB7;
  border-radius:0px 0px 5px 5px;
  /*box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.1);*/
  box-shadow: 0 8px 8px 0 rgba(0,0,0,.07);
  background-color: rgba(254,254,254,0.5);
}

.blocker .tabgroup .contentlist {
  border-top:2px solid #00A99D;

}

.tabgroup .content {
  padding:30px 30px 0 30px;
}

.tabgroup .content:not(.active) {
  display: none;
}

.tabgroup .content>:first-child {
  margin-top: 0;
}

.tabgroup .content>:last-child {
  margin-bottom: 0;
}

.contentlist ul {
	letter-spacing: .02em;
}











/*Screen smaller than 500px*/

@media (max-width: 1200px) {
    #section0 .right-content img {
    width: 420px;
  }
  #section0 h2 {
      font-size:42px;
      line-height:58px;
  }
}

@media (max-width: 1000px) {
    #section0 .right-content img {
    width: 360px;
  }
  #section0 h2 {
      font-size:38px;
      line-height:52px;
  }
}
@media (max-width:950px) {

	.wrap {
		padding:5%;
	}

	h1 {
		font-size: 80px;
		letter-spacing: 10px;
	}



	#section4 .nav ul {
		margin-left:0;
	}

	#section4 p {
		padding-right:0;
	}

	#section4 img {
		max-width:350px;
	}

	#section4 .info .para {
		left:55%;
	}



	#section5 h2.detail-h2 {
		margin:5px 0 0 0;

	}

	#section5 .part h2.detail-h2{
		padding-left:6%;
	}
	#section5 .img img {

		max-width:450px;
	}

	#section5 .sm-img .img img {
	    padding: 0 0 0 6%;
	}

	/*#section5 .content h2 {

	    display:none;

	}*/
	#section5 .part p {
	    padding-left: 6%;
	    padding-right: 6%;
	    margin-top: 0;
	    margin-bottom: 10px;
	}

}

@media (max-width: 800px) {

	.show, .show.row.flex {
	display:none;
	}


	.persona .hidden {
		display:initial;
	}
	.show.hidden {
		display:initial;

	}
	#section0 .right-content img {
		width:300px;
	}
	
	#section0 h2 {
	    font-size:40px;
	    line-height:55px;
	}

}


@media (max-width:600px) {

h1 {
	font-size: 65px;
	letter-spacing: 5px;
}

h1.foodie {

	letter-spacing: 2px;

}
h1.blocker {
	
	letter-spacing: 0;

}

h1.weee {
	letter-spacing: 5px;
}

h1.decor {
	letter-spacing: 5px;
}

h1.pandora {
	letter-spacing: 2px;
}

h2 {
	font-size: 20px;
	letter-spacing: 0;
}

h2.big {
	font-size: 24px;
}
h2.under-img {
	font-size: 22px;
}
h3 {

	letter-spacing: 0.2px;
	font-size:18px;

}

h3.big {
	font-size: 22px;
	line-height: 25px;
	letter-spacing: 0;
}

h4 {
	line-height: 24px;
}
p.under-img {
	font-size:18px;
}

.button-box a {

	margin:20px 0;


}
.bj-footer.contact2 {

	bottom: 0px;

}


#section0 p {

line-height: 24px;
}
.wrap {

padding:0;
}


.title {
	margin-bottom: 0;
	padding-right: 0;
	padding-left: 0;

}

.box-space {
	margin-top: 460px;
}


.button {
	display:inline-block;
	width:95%;
/*	border:1px solid black;*/
	line-height: 50px;
	margin-top:20px;
	margin-bottom: 30px;
	background-color: #281E35;
	border-radius: 5px;
	box-shadow: 0 3px 3px -2px rgba(0,0,0,.2), 
	0 3px 4px 0 rgba(0,0,0,.14), 
	0 1px 8px 0 rgba(0,0,0,.12);
}
.button a {
	color:white;
}

.button.color {
	display:inline-block;
	width:95%;
/*	border:1px solid black;*/
	line-height: 50px;
	margin-top:20px;
	margin-bottom: 30px;
	background-color: white;
	border-radius: 5px;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);
}


#section5 .button  a.white {
	color:#281E35;
}


.button a {
	text-align: center;
}

.task-p {
    margin-bottom: 50px;
    padding: 0 8%;
}


.tabgroup .tab {
    display: inline-block;
    border-radius: 5px 5px 0 0;
    padding-top: 0.4em;
    padding-bottom: 0.4em;
    cursor: pointer;
    width: 32%;
    text-align: center;
    letter-spacing: 0;
    color: #4B4B8F;
}


.tabgroup .tab {
  padding-top:0.4em;
  padding-bottom:0.4em;
  width: 32.5%;
  font-size:16px;

}


.tabgroup .content {
	padding:0;
}



.visiable {
	display:none;
}

.bottom-line {
	border:none;
}


#section0 h2 {
	font-size: 35px;
    line-height: 50px;
}

#section0 p {
	font-size: 16px;

}
#section3, #section4{
	width:85%;
}

.container {
	max-width:90%;
	margin-right:auto;
	margin-left:auto;
}
.hidden.portrait{
	display:initial;
}

#burger {
	display:initial;
}

/*Animation*/

.logo img {
	width:30px;
}

 
 /*Nav*/
.nav .main-nav {
	display:none;
}

#header, #footer{
	padding: 0;
}

.gutters>[class*='col-'] {
    margin-bottom: 0px;
}


.project-item {
	padding:0;
}


/*section0*/



/*section3*/

#section3 img{
	max-width:200px;
	width:100%;
	margin-top:30px;
}


#section3 {
	margin-top:40px;
}

#section3 p {
	margin-top: 0;
}

#section3 h2 {
	margin-bottom: 15px;
}

#section3 h2, #section3 p {

	text-align: left;
}

#section3 .content p, #section3 .content h2, #section3 .content h3 {
	padding-left:0px;
	padding-right:0px;
}

#section3 .colon {
	display:none;
}

#section3 .button a {
	text-align: center;
}




#section5 h2, .myContent h2 {
	margin-top:10px;
	margin-bottom:20px;
	text-align: left;
}

#section5 .container {
	
	margin-bottom: 15px;
	padding-top:0;
	padding-bottom:10px;
}

#section5 .wrap.first {
	margin-top:100px;
	margin-bottom: 0px;
}

#section5 a {
	text-align: center;
}
#section5 .img img {
	display:none;
}
.visiable.hidden {
	display:block;
}
#section5 .sm-img img {
	max-width:100%;
	margin-left: auto;
	margin-right: auto;
}
#section5 .md img{

	padding:0 0 15px 0;

	
}

#section5 .part h2.detail-h2, #section5 .part p, #section5 .task-p {
	padding:0;
	margin:0 0 10px 0;
	text-align: left;
}


#section5 .content h2 {
	font-size: 18px;
	letter-spacing: 1px;
	line-height: 27px;
}


#section5 img.wire {
	max-width:120px;
}

#section5 .persona-p{
	padding:0 0;
	text-align: left;
}

/*animation*/


.fp-controlArrow {
    top: 40%;
    margin-top: 108px;

}
.fp-controlArrow.fp-next {
	right:100px;
}
.fp-controlArrow.fp-next {
	right:100px;
	border-width: 15px 0 15px 12px;
}
.fp-controlArrow.fp-prev {
	left:100px;
	border-width: 15px 12px 15px 0;
}

}


@media (max-width:500px) {

.title:{
		padding-top:350px;
	}

.button a:hover {
    color:black;
}
#section0 .hero-content .box {
	margin-top:20px;
}
#header a {
    color:#cecece;
}
#section0 p {
	line-height: 21px;
}
#section0 .left-content h4.mid {
	font-size:16px;
	margin-top:5px;
	letter-spacing: 0.2px;
}
#section0 h2 {
	font-size: 27px;
	margin:5px 0;
	letter-spacing: 0.5px;
	line-height:30px;
}

#section0 .right-content img {
	width:240px;
}
#section0 .hero-content .box a {
	width:100%;
}

.landing-page .col-lg-6 {

    margin-bottom: 0;
}

#a {
	width: 20px;
	height:20px;	    
}

#b {
	width: 25px;
	height:25px;    
}
#c {
	width: 15px;
	height:15px;   
}
#d {
	width: 20px;
	height:20px;
}

}



/*@keyframes rot {
  0.0000% { -webkit-transform: translate(-423.0px, 190.0px) ; }
  7.6340% { -webkit-transform: translate(-332.4px, 182.7px) ; }
  14.4277% { -webkit-transform: translate(-252.2px, 173.0px) ; }
  20.4446% { -webkit-transform: translate(-181.6px, 161.2px) ; }
  25.7497% { -webkit-transform: translate(-119.9px, 147.4px) ; }
  30.4099% { -webkit-transform: translate(-66.7px, 131.9px) ; }
  34.4945% { -webkit-transform: translate(-21.2px, 114.8px) ; }
  38.0751% { -webkit-transform: translate(17.2px, 96.3px) ; }
  41.2253% { -webkit-transform: translate(49.2px, 76.7px) ; }
  44.0200% { -webkit-transform: translate(75.3px, 56.1px) ; }
  46.5330% { -webkit-transform: translate(96.2px, 34.8px) ; }
  48.8331% { -webkit-transform: translate(112.6px, 12.9px) ; }
  50.9801% { -webkit-transform: translate(125.1px, -9.4px) ; }
  53.0207% { -webkit-transform: translate(134.3px, -31.9px) ; }
  56.8903% { -webkit-transform: translate(145.5px, -76.6px) ; }
  63.9097% { -webkit-transform: translate(156.7px, -159.3px) ; }
  65.4772% { -webkit-transform: translate(160.8px, -177.5px) ; }
  66.9747% { -webkit-transform: translate(166.9px, -194.3px) ; }
  68.4355% { -webkit-transform: translate(175.3px, -209.5px) ; }
  69.9225% { -webkit-transform: translate(186.9px, -222.9px) ; }
  71.5267% { -webkit-transform: translate(202.2px, -234.3px) ; }
  73.3537% { -webkit-transform: translate(221.9px, -243.5px) ; }
  75.5081% { -webkit-transform: translate(246.6px, -250.3px) ; }
  78.0848% { -webkit-transform: translate(277.0px, -254.5px) ; }
  81.1680% { -webkit-transform: translate(313.7px, -256.0px) ; }
  84.8335% { -webkit-transform: translate(357.3px, -254.4px) ; }
  89.1507% { -webkit-transform: translate(408.4px, -249.7px) ; }
  94.1853% { -webkit-transform: translate(467.8px, -241.6px) ; }
  100.0000% { -webkit-transform: translate(536.0px, -230.0px) ; }
}*/

.fly-item img {
	width: 40px;
	height: 40px;
	position: absolute;
	top: 200px;
	left: 50%;
	margin: -20px;
	font-size: 100px;
	animation: rot 5s infinite linear;
}