/* CSS FILE */
*{
	box-sizing: border-box;
	font-family: sans-serif;
}

body {
	margin :0;
}

@font-face {
	font-family: squaresBold;
    src: url('/fonts/Squares Bold Free.otf');
} 

h1 {
	font-family: squaresBold;
	font-size: 25px;
	color:#06678D;
	line-height: 40px;
	text-decoration: underline;	

}

h2 {
	font-family: squaresBold;
	font-size: 18px;
	color:#06678D;
	line-height: 40px;
	text-align: center;
	padding-top:150px;
}

p {
	font-family: arial, sans-serif;
	font-size: 16px;
	line-height: 30px;
}

.container {
	width:100%;
	margin-bottom: -50px;
	height: 100%;
}

.clearFloat {
	clear: both;
}

/* LOCK ANIMATION*/

#landingBackgroundImage {
	background-image: url('/images/Web1920–1.png');
	background-size: cover;
	height:100%;
}

.lock {
	padding-top:10px;
}

#lockClick {
	width: 100%;
	padding-top:2px;
	text-align: center;    
	font-weight: bold;
	font-family: squaresBold;
	text-decoration: underline;
	font-size: 16px;
	cursor: pointer;
}

#lockSvg, #unlocked{
	width:450px;
	margin:0 auto;
	cursor: pointer;
}

.unlockedIMG {
	width:100%;
	padding-left: 23px;
}

/* HOME PAGE */

.landingpageBackgroundImage {
	background-image:url('/images/landingPageBackground.png');
	background-size: cover;
	height:100%;
	z-index: -1;
	position: relative;
}

.tabletimgBackground {
	display: none;
}

.floatLeft{
	float: left;
	display: none;
}

.hamburger{
	display: none !important;
	float: left;
	margin-top: 20px!important;
}

/* NAVIGATION */

.nav {
	float:right;
	padding:18px 20px 0 20px;
}
ul {
	padding:0;
}

 ul > li {
	float: left;
	font-size:20px;
	padding-top:25px;
	margin-right: 10px;

}

 ul > a >li  {
	padding: 5px 17px;
	display:inline-block;
	text-decoration: none;
}

li {
	text-decoration: none;
	color:#000003;
	font-family: squaresBold;
}

.sliding-u-l-r {
display: inline-block;
cursor: pointer;
}

.sliding-u-l-r:after {
content: '';
display: block;
height: 3px;
width: 0;
background: transparent;
transition: width .5s ease, background-color .5s ease;
margin-top: 5px
}

.sliding-u-l-r:hover:after {
width: 100%;
background: #06678D ;
}

.currentItem {
	border-bottom: #06678D  solid 3px;
}

#fadedImage {
	
	background-size: cover;
	height:100%;
	width:100%;
	position: absolute;
}

.slogan {
	font-family:squaresBold;
	color:#fff;
	width: 35%;
    text-align: center;
    padding: 159px 0 0 75px;
}

.logoSvg {
	width:47%;
	margin:0 auto;
	margin-top: 121px;
}

.SVG {
	position: absolute;
	width:47%;
	bottom: 20px;
}

.navigationBar {
	background-color: #eee;
	height:100px;
	width:100%;
	position: relative;
    z-index: 2;
}

.logoNavBar {
	width: 290px;
	float:left;
}

.images {
	width:100%;
	height:100%;
	background-size: cover;
	background-position: center;
}

/* ABOUT PAGE */

.aboutBackgroundImage {
	background-image:url('/images/aboutBackgroundImage.png');
	background-size: cover;
	background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
	height: 100%;
    position: absolute;
    top: 0;
    padding-top: 100px;
    width: 100%;

}

.info {
	margin: 0 auto;
	width:900px;
}

.profileIMG {
	width:329px;
	height:300px;
	float:left;
}

.whiteBox {
	background-color: #fff;
	opacity: .8;
	width:54%;
	float:left;
	padding:20px;
	margin-left:70px;
	max-height: 356px;
	overflow-y:scroll;
}

/* SERVICES PAGE */

.servicesBackgroundImage {
	background-image:url('/images/servicesBackgroundImage.png');
	background-size: cover;
	height:100%;
	background-repeat: no-repeat;
    background-position: center;
	background-attachment:fixed;
    position: absolute;
    top: 0;
    padding-top: 100px;
    width: 100%;
}

#scrollHeight {
	max-height: 600px;
    overflow-y: scroll;
}

.widthChange {
	width:100%;
	margin-top: 40px;
	margin-left:0;
	overflow: hidden;
    max-height: none;
}

.servicesIMG {
	width:33.3%;
	height:300px;
	float:left;
	cursor: pointer;
}

.servicesIMGHover {
	display: none;
}

/* FORUM PAGE */

.containSize {
	height: 100%;
	width:100%;
	margin-bottom: -50px;
	margin: 0 auto;
	padding:0 20px 0 20px;
}

.marginAjust {
	margin-bottom: 0 !important;
}

.forumBackgroundImage {
	background-image:url('/images/forumBackgroundImage.png');
	background-size: cover;
	height: 100%;
	background-repeat: no-repeat;
    background-position: center;
	background-attachment:fixed;
    position: absolute;
    top: 0;
    padding:0 20px 0 20px;
    padding-top: 100px;
    width: 100%;
}

.forumContainer {
	width:500px;
	margin:0 auto;
}

.commentContainer{
	width:350px;
	padding:20px;
	border:none;
	margin-right:20px;
	font-family: arial, sans-serif;
	font-size: 14px;
}

.button {
	padding:17px;
	height: 56px;
	font-family: arial, sans-serif;
	font-size: 14px;
	border: 3px solid #06678D;
	background-color: #06678D;
	color: #fff;
}

.positionMiddle {
	margin:0 auto;
	width:485px;
}

.commentBox {
	opacity: .7;
	background-color: #fff;
	width:500px;
	min-height: 200px;
	margin:20px;
}

/* NEWS PAGE */

#newsBackgroundImage {
	background-image:url('/images/newsBackgroundImage.png');
	background-size: cover;
	background-attachment:fixed;
	background-repeat: no-repeat;
    background-position: center;
	height: 100%;
    position: absolute;
    top: 0;
    padding:0 20px 0 20px;
    padding-top: 100px;
    width: 100%;
    overflow-y: scroll;
}

#contain {
	width:80%;
	margin:0 auto;
	padding:20px 0 20px 0;
	overflow-y: scroll;
}

.articles {
	float:left;
	padding: 10px;
}

.invisableText1, .invisableText2, .invisableText3, .invisableText4 {
	position: absolute;
    z-index: 1;
    margin: -76px 0 0 56px;
    color:#000;
    display: none;
}

.newsSnipit {
	width:200px;
	height:110px;
	line-height: 19px;
	white-space: wrap;
    overflow:hidden !important;
    text-overflow: ellipsis;
    font-size: 14px;
    color:#000;
    cursor: pointer;
}

.newsImage {
	width:200px;
	height:143px;
	cursor: pointer;
}

/* CONTACT PAGE */

.contactBackgroundImage {
	background-image:url('/images/contactBackgroundImage.png');
	background-size: cover;
	background-attachment:fixed;
	background-repeat: no-repeat;
    background-position: center;
	height: 100%;
    position: absolute;
    top: 0;
    padding:0 20px 0 20px;
    padding-top: 100px;
    width: 100%;
    overflow-y: scoll;
    
}

.contactForm{
	font-family:arial, sans-serif;
	margin:0 auto;
	width:50%;
	padding-top:30px;
}

.inputs {
	padding:10px;
	border:1px solid #06678D;
	width:100%;
	margin-bottom:17px;
	opacity: .8;
}

.messageInput {
	height:200px;
}

.sendMessage{
	padding: 10px;
    font-size: 14px;
    border: 3px solid #06678D;
    background-color: #06678D;
    color: #fff; 
    -webkit-appearance: none;  
}

.sendMessage:hover {
	border: 3px solid #06678D;
	background-color: #fff;
    color: #06678D;
    -webkit-appearance: none;
}

.positionAjust {
	width:194px;
	margin: 0 auto;
	text-decoration: none;
}

.positionAjust:hover {
	background-color: #fff;
	color:#06678D;

}

#mc-embedded-subscribe {
	 -webkit-appearance: none;
}

footer {
	height:162px;
	background-color: #3c3c3c;
	position: relative;
}

.whiteSpan {
	color:white;
	padding:10px 0 0 20px;
	float:left;
	margin:0;
}

.floatRight {
	float:right;
	padding-top:10px;
	padding-right:20px;
}

.icons {
	height:35px;
	width:35px;
	float:left;
	padding:5px;

}

@media screen and (max-width: 980px){
	ul > a >li  {padding: 5px 11px;}
	.logoNavBar {width:270px;}
	.info{width:858px;}
	#main, #addCommentContainer{width:880px;}
	.whiteBox{margin-left: 48px;}
}


@media screen and (max-width: 880px){
	.floatLeft {display: block;}
	.hamburger {display: block !important;}
	.logoNavBar {float: right;}
	.nav {float:none; display:none; width:90%; margin:0 auto; margin-top:66px; position: fixed; padding-left:63px; opacity: 0.9;}
	ul {padding:0;}
	ul > li {float:none;}
	.sliding-u-l-r, ul > a > li {display: block; text-decoration:none !important; text-align: center;}
	li {float: none; background-color: #eee;}
	a{text-decoration: none;}
	/*#lockSvg, #unlocked {width: 67%;}*/
	.logoSvg {width:79%; margin:0 auto;}
	.hexagon {display: block;}
	.landingBackgroundImage {background-image: url('/images/tabletLandingImage.png');}
	.laptopimg {display: none;}
	.tabletimgBackground {display: block;}
	.landingPageBackgroundImage {background-image: url('/images/tabletImageBackground.png');}
	.slogan {background-image: url('/images/hexagon.png'); background-size: 300px 300px; background-repeat: no-repeat; width: 300px; height:300px; padding: 119px 20px 0 20px; margin: 0 auto; margin-top: 29px;}
	.SVG { position: absolute; width: 80%; bottom: 20px;}
	.info {width:90%;}
	.servicesIMG{width:300px;float: none; margin:0 auto;}
	#info{overflow-y: scroll;}
	.profileIMG {float: none; margin:0 auto;}
	.whiteBox{width:100%; margin: 0; margin-top:20px;}
	.contactForm {width:70%;}

}

@media screen and (max-width: 813px){
	 .textarea  {width:60%!important;}
}


@media screen and (max-width: 818px){
	 #contain  {width:81%;}
}

@media screen and (max-width: 722px){
	.floatLeft {display: block;}
	.hamburger {display: block;}
	.nav {display:none; width:90%; margin:0 auto; margin-top:66px; position: fixed; padding-left:63px; opacity: 0.9;}
	ul {padding:0;}
	ul > li {float:none;}
	.sliding-u-l-r, ul > a > li {display: block; text-decoration:none !important; text-align: center;}
	li {float: none; background-color: #eee;}
	a{text-decoration: none;}
	.info{width:90%;}
	#info{overflow-y: scroll;}
	.profileIMG {float: none; margin:0 auto;}
	.whiteBox{width:100%; margin: 0; margin-top:20px; overflow: inherit!important; max-height:none!important;}
}


@media screen and (max-width: 580px){
	.newsSnipit{width:100%;}
	.newsImage {margin:0 auto;}

}

@media screen and (max-width: 450px){
	#lockSvg, #unlocked {width:300px; height:480px; margin-top: 50px;}
	.contactForm {width:100%;}
}


@media screen and (max-width: 400px){
	.SVG { width: 81%;}
	.logoSvg {width:320px;}
	.logoNavBar {width: 248px; height: 93px;}
}

@media screen and (max-height: 534px){
	.SVG { position: inherit!important; width: 100%;}
	.slogan {margin-bottom: 20px;}
	.landingpageBackgroundImage {height:inherit!important;}
	.logoNavBar {width: 248px; height: 93px;}
	#main {max-height: 27%!important;}
#logoSvg, #unlocked {width:55%;}
}