.CategoryWrapper{
	display: flex !important;
	flex-flow: row wrap !important;
}
.CategoryWrapper .categoryItem .categoryTitle{
	font-size: 32px;
	padding: 30px 0;
}
.CategoryWrapper .categoryItem:after{
background-color: rgba(15,88,91,0.5) !important;
}
.CategoryWrapper .categoryItem:hover:after{
background-color: rgba(232,50,39,0.5) !important;
}
.Security .pageHeader{
	height: 130px !important;
}
.Security .centerRight h1{
	margin-bottom: 0px !important;
}
.Security .centerLeft{
	background-image: url(../images/login_logo.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.welcomeBottom{
	opacity: 1 !important;
}
.attendanceWrapper{
	width: calc(100% - 40px);
    text-align: center;
    padding: 0px 20px 0 20px;
    background-color: #F1F1F1;
}

.attendanceWrapper .attendanceInner {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.attendanceWrapper h4 {
    font-size: 30px;
    text-transform: uppercase;
}

.welcomeSection{
	height: 1170px;
}

.SchoolAttendance {
	width: calc((100% / 6) - 44px);
    /*min-width: 200px;*/
    display: inline-block;
	/*width: 100%;
	max-width: 600px;*/
	height: 210px;
	background-repeat: repeat-x;
	background-image: url(../images/a.png);
	margin: 2em auto;
	background-position: center bottom;
	position: relative;
	margin-bottom: 150px !important;
	/*margin-top: 100px !important*/
}

.SchoolBar {
	position: absolute;
	bottom: 0px;
	left: 50%;
	height: 0%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	background-color: #0f585b;
	-webkit-border-radius: 20px 20px 0px 0px;
	-moz-border-radius: 20px 20px 0px 0px;
	-ms-border-radius: 20px 20px 0px 0px;
	border-radius: 20px 20px 0px 0px;
	width: 100px
}

.SchoolBar .Perc {
	position: absolute;
	top: -50px;
	font-size: 2em;
	color: #666;
	width: 100%;
	text-align: center
}

.bottomSchoolAttendance {
	position: absolute;
	bottom: 0px;
	width: 100%;
	padding: 20px 0;
	font-size: 2em;
	text-align: center;
	left: 0px;
	background-color: #fff;
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%)
}
.tagline{
	color: white !important;
}
.tagline strong{
	color: white;
}
.tagline span{
	font-size: 20px;
	color: white;
}
.welcome-switch{
	text-align: center;
}
.welcome-switch span{
	border: 1px solid;
	padding: 1em;
}
.heads-welcome{
	position: absolute;
}
.welcomeSection h4{
	text-align: center;
}
.welcomeSection .contentTop{
	padding: 0 30px 0 30px;
}
.scrollToTop i{
	-webkit-animation: shake 2s cubic-bezier(0.36, 0.07, 0.19, 0.97) 2s infinite;
    -moz-animation: shake 2s cubic-bezier(0.36, 0.07, 0.19, 0.97) 2s infinite;
    -ms-animation: shake 2s cubic-bezier(0.36, 0.07, 0.19, 0.97) 2s infinite;
    -o-animation: shake 2s cubic-bezier(0.36, 0.07, 0.19, 0.97) 2s infinite;
    animation: shake 2s cubic-bezier(0.36, 0.07, 0.19, 0.97) 2s infinite;
}
.wildernLogo{
	width: 39px;
    height: 36px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    top: 10px;
    left: 6px;
}

@keyframes shake {
	28%,
	40% {
		transform: rotate(30deg)
	}
	32%,
	44% {
		transform: rotate(-30deg)
	}
	24%,
	36%,
	48% {
		transform: rotate(0deg)
	}
}
@media (max-width: 1280px){
	header nav.main{
		position: fixed !important;
		z-index: 9990 !important;
	}
}

.introAnimWrapper .trust{
    position: absolute;
    bottom: 0;
    right: 10px;
}

.introAnimWrapper .trust p{
    color: white;
}

.introAnimWrapper .trust .wildernLogoSplash{
    width: 177px;
    height: 100px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;   
}

body.activeIntroAnim .introAnimWrapper .trust{
    -webkit-animation: introFadeIn 5s 3s forwards;
	-moz-animation: introFadeIn 5s 3s forwards;
	-ms-animation: introFadeIn 5s 3s forwards;
	-o-animation: introFadeIn 5s 3s forwards;
	animation: introFadeIn 5s 3s forwards
}