body{
	position:relative;
	min-width: 100%;
	margin: 0 auto;
	color: #000;
	overflow:auto;
}

/*Stickers */

.sticky{
	position: absolute;
	z-index: 3;
}

.img1{
	width: 250px;
	left: 6%;
	top: 60%;
}

.img2{
	width: 50px;
	left: 80%;
	top: 20%;
}

.img3{
	width: 100px;
	left: 80%;
	top: 80%;
}

.img1:before, .img3:before {
  content: "";
  position:absolute;
  top: -20%;
  left: -20%;
  width: 140%;
  height: 140%;
}

.img1:hover,
.img3:hover {
    /* Start the shake animation and make the animation last for 0.5 seconds */
    animation: shake 1s; 
    /* When the animation is finished, start again */
    animation-iteration-count: infinite; 
}

@keyframes shake {
    0% { transform: translate(1px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -2px) rotate(-1deg); }
    20% { transform: translate(-3px, 0px) rotate(1deg); }
    30% { transform: translate(3px, 2px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(1deg); }
    50% { transform: translate(-1px, 2px) rotate(-1deg); }
    60% { transform: translate(-3px, 1px) rotate(0deg); }
    70% { transform: translate(3px, 1px) rotate(-1deg); }
    80% { transform: translate(-1px, -1px) rotate(1deg); }
    90% { transform: translate(1px, 2px) rotate(0deg); }
    100% { transform: translate(1px, -2px) rotate(-1deg); }
}


/*Container Styles*/

.container{
	max-width: 94%;
}

#navbar{
	display:none;
}
.nav-bar{
	position: fixed;
	width: 6%;
	z-index: 5;
	top: 40%;
	left: 0px;
	background-color: #FF3D3D;
}

.nav-bar img{
	display:flex;
	flex-direction: row-reverse;
	padding: 0.5%;
	width: 100%;
}


.container-1{
	background-color: #FF3D3D;
	padding: 3% 3% 5% 3%;
}

.container-2{
	padding: 7%;
	position: relative;
}

.apply{
	padding-top: 3%;
	display:flex;
	justify-content: flex-end;
}


.full{
	background-color: #FF3D3D;
	width: 100% !important!;
		    box-shadow: 0 5px;
}

.flex{
		display: flex;
		width: 96%;
		margin-left: 2%;
		margin-right: 2%;
}

.flex-2{
	display:flex;
		flex-direction: row;
}

.first{
	display: flex;
	flex-direction: row;
	width: 60%;
}

.column-1, .column-2{
	width: 40%;
	text-align: left;
}

.second {
	width: 40%;
}

.container-2{
/*	background-color: #D21108;
*/	background-image: url("/assets/images/inform2.jpg");
/*	     Full height 
    height: 100%; 
*/
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.container-3{
	background-color: #000;
	color: #fff;
		padding: 7% 10% 7% 30%;
	text-align: left;
}

.container-4{
	background-color: #fff;
	color: #000;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	padding: 5% 10%;
	line-height: 1.5em;
	text-align: left;
}

.container-5{
		background-color: #000;
	color: #fff;
		padding: 5% 10%;
	text-align: left;
}


.container-6{
	background-color: #fff;
	color: #000;
	padding: 10% 3% 3% 3%;
}



/* List Details */

ul{
	border-top: 3px solid #000;
	list-style:none;
	display:flex;
	justify-content: space-between;
	margin: 0 !important;
	padding: 1.5% 3% 3% 3%;
	font-weight: bold;
}

/* Logo casing + logo */

header{
	width: 52%;
}
.logo{
	width:70%;
}

/* Overlay styles */

.overlay{
	width: 60%;
	margin: 3%;
	background-color: #fff;
	padding: 3%;
}



/* Link styles */

	a{
	text-decoration:none;
	font-weight: bold;
}

nav{
	border: 0px solid #000;
	padding: 1%;
	margin-left: 0%;
	line-height: .8em;
	height: auto;
	width: 50%
}

nav a{
		color:#000;
    position: relative;
    display: inline-block;
    padding: 8px 0;
    text-decoration: none;
}

nav a:hover {
	color: #fff;
}

.touch{
	border-bottom: 4px solid #000;
}

.touch:hover{
	border-bottom: 4px solid #FF3D3D;
	color: #FF3D3D;
}

.touch{
	color: #000;
}

.credit{
	margin-bottom: 4%;
}

.credit a, .contact a{
	color: #000;
}

.credit a:hover, .contact a:hover{
			color: #FF3D3D;
}

p{
	margin:0;
}
 
@media (max-width : 1024px) {
body{
}
	
header{
	margin-left: 0;
	}
	
.container-1{
}
	
.container-2{
	padding: 5%;
}
	
.container-3{
	padding: 10% 5%;
}

.container-4{
	padding: 5%;
/*	line-height: 2em;
*/}

.container-5{
		padding: 5%;
}

.flex-2{
	display:block;
	text-align: center;
	width: 100%;
}

.first{
	display: block;
	}

	.column-1, .column-2, .first, .second{
		width: 100%;
		text-align: center;
	}

.img1{
	width: 80px;
		top: 90%;
}

.img3{
	width: 100px;
		top: 80%;

}

.overlay{
	width: 85%;
	padding: 5%;
}
	
	
ul{
	display:block;
	text-align: left;
	padding: 5% 5% 5% 5%;
	font-weight: bold;
}



}

@media only screen and (min-width : 200px) and (max-width: 600px) {

body{
}

ul{
padding: 5% 5% 10% 5%;}
	
header{
	width: 70%;
	margin-bottom: %;
}
	
.img1{
	width: 50px;
	}

.img3{
	width: 50px;
}

	nav{
	border: 0;
	width: 50%;
	text-align: right;
	margin-left: 0%;
	}

	.nav-bar{
	width: 10%;
	}

	.logo{
		width: 70%;
	}


.container-2{
	padding: 10%;
}

.container-3, .container-4, .container-5{
	padding: 15% 7%;
}

.contact .display{
	text-align:center;
}
nav a:first-child{
	padding-top: 0;
}


}