@import url('https://fonts.googleapis.com/css?family=Raleway');
@import url('https://fonts.googleapis.com/css?family=Oswald');

html, body{
	
	margin:0;
	padding:0;
	height:100%;
	width:100%;
	
}


a{
	
	font-family: 'Raleway', sans-serif;
	color:#f9f3f4;
}

/* unvisited link */
a:link {
  color: #f9f3f4;
}

/* visited link */
a:visited {
  color: #f9f3f4;
}

/* mouse over link */
a:hover {
  color: #f9f3f4;
  text-decoration:none;
}

/* selected link */
a:active {
  color: #f9f3f4;
}



.top{
	
	 position: fixed;
	 top:0px;
	 font-family:Georgia;
	 max-width: 1110px;
	 margin:auto;
	 margin-left:120px;
	 z-index: 999;
	/* background-color:#FFFFFF;*/
}

.purpose{
	height:30%;
	width:100%;
	margin:auto;
	display:table;
	background-repeat: no-repeat;
	top:0;
	/*background-size:cover;
	background-image: url('http://www.gismartinvestigator.com/coffee-and-camera.jpg');
	background-image: url('http://www.gismartinvestigator.com/tidy-desk-in-window-light.jpg');
	background-color: #f0ad4e;*/
}

.purpose p{
	
	font-family: 'Raleway', sans-serif;
	color:#f9f3f4;
	text-shadow: 0px 0px 300px #000;
	font-size: 160%;
	padding:30px 0px 0px 0px;
}

.purpose .inner {
	
	display:table-cell;
	/*vertical-align:middle;*/
	padding:200px 0px 0px 0px;
	width:100%;
	max-width:none;
	
}

.content{
	
	max-width:500px;
	margin:0 auto;
	text-align:center;
}

.content h1{
	
	font-family: 'Raleway', sans-serif;
	/*color:#f9f3f4;*/
	color:#000000;
	text-shadow: 0px 0px 300px #000;
	font-size: 300%;
}

.btn{
	border-radius:9px;
	font-family: 'Oswald', sans-serif;
	color:#036A81 3px;
	font-size: 135%;
	padding: 10px 20px;
	border: solid #036A81 3px;
	text-transform:uppercase;
	text-decoration:none;
}

.btn:hover{
	color:#fff;
	border:solid #fff 3px;
}

p{
	font-size:160%;
	line-height:210%;
	text-align:justify;
	margin:0;
	font-family: 'Raleway', sans-serif;
}	
	
.functionality{
	
	height:5%;
	width:100%;
	margin:auto;
	/*background-color: #f7f7f7;*/
	display:table;
	top:0;
	/*background-size:cover;*/
}

.functionality h1{
	
	font-family: 'Raleway', sans-serif;
	color:#000000;
	/*color:#f9f3f4;*/
	text-shadow: 0px 0px 300px #000;
	font-size: 200%;
	padding:30px 0px 0px 0px;
}

.functionality p{
	
	font-family: 'Raleway', sans-serif;
	/*color:#f9f3f4;*/
	text-shadow: 0px 0px 300px #000;
	font-size: 100%;
	padding:30px 0px 0px 0px;
	font-style:bold;
}

.services{
	
	height:20%;
	width:100%;
	margin:auto;
	/*background-color: #f0ad4e;*/
	display:table;
	top:0;
	background-size:cover;
}

.services p{
	
	font-family: 'Raleway', sans-serif;
	color:#f9f3f4;
	text-shadow: 0px 0px 300px #000;
	font-size: 130%;
	padding:60px 0px 0px 0px;
}

.services h1{
	/*
	font-family: 'Raleway', sans-serif;
	color:#f9f3f4;
	text-shadow: 0px 0px 300px #000;
	font-size: 130%;
	padding:30px 0px 0px 0px;*/
	margin-left:-230px;

}
.package{
	
	
	height:10%;
	width:100%;
	margin:auto;
	/*background-color: #f7f7f7;*/
	display:table;
	top:0;
	background-size:cover;	
}

.package p{
	
	font-family: 'Raleway', sans-serif;
	color:#000000;
	text-shadow: 0px 0px 300px #000;
	font-size: 100%;
	padding:30px 0px 0px 0px;
}

.package h1{
	
	font-family: 'Raleway', sans-serif;
	color:#000000;
	font-weight:bold;
	text-shadow: 0px 0px 300px #000;
	font-size: 120%;
	padding:30px 0px 0px 0px;
	margin-bottom:50px;	
}

.package1{
	
	border: 1px solid;
	padding: 10px;
	box-shadow: 5px 10px;
}

.package2{
	
	border: 1px solid;
	padding: 10px;
	box-shadow: 5px 10px;
}

.package3{
	
	border: 1px solid;
	padding: 10px;
	box-shadow: 5px 10px;
}

.article{
	
	
	height:20%;
	width:100%;
	margin:auto;
	/*background-color: #f7f7f7;*/
	display:table;
	top:0;
	background-size:cover;	
}

.article h1{
	
	font-family: 'Raleway', sans-serif;
	color:#000000;
	font-weight:bold;
	text-shadow: 0px 0px 300px #000;
	font-size: 150%;
	padding:30px 0px 0px 0px;
}

.article img{

		width:60%;
		height:50%;
	
}

.article p{
	
	font-family: 'Raleway', sans-serif;
	color:#000000;
	text-shadow: 0px 0px 300px #000;
	font-size: 100%;
	padding:30px 0px 0px 0px;
	margin:30px 0px 0px 0px;
}
.footer{
	
	height:0%;
	width:100%;
	margin:auto;
	/*background-color: #f0ad4e;*/
	display:table;
	top:0;
	background-size:cover;
}

.footer p{
	
	font-family: 'Raleway', sans-serif;
	color:#000000;
	text-shadow: 0px 0px 300px #000;
	font-size: 70%;
	padding:30px 0px 0px 0px;
	font-weight:bold;
	text-align:center;
}

.btn-circle.btn-xl {
    width: 70px;
    height: 70px;
    padding: 10px 16px;
    border-radius: 35px;
    font-size: 24px;
    line-height: 1.33;
}

.btn-circle {
    width: 30px;
    height: 30px;
    padding: 6px 0px;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1.42857;
}


/**This is the pricing section*/

section.pricing {
 /* background: #007bff;
  background: linear-gradient(to right, #0062E6, #33AEFF);*/
  font-family: 'Raleway', sans-serif;
}

.pricing .card {
  border: none;
  border-radius: 1rem;
  transition: all 0.2s;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1);
}

.pricing hr {
  margin: 1.5rem 0;
}

.pricing .card-title {
  margin: 0.5rem 0;
  font-size: 0.9rem;
  letter-spacing: .1rem;
  font-weight: bold;
}

.pricing .card-price {
  font-size: 3rem;
  margin: 0;
}

.pricing .card-price .period {
  font-size: 0.8rem;
}

.pricing ul li {
  margin-bottom: 1rem;
}

.pricing .text-muted {
  opacity: 0.7;
}

.pricing .btn {
  font-size: 80%;
  border-radius: 5rem;
  letter-spacing: .1rem;
  font-weight: bold;
  padding: 1rem;
  opacity: 0.7;
  transition: all 0.2s;
}

/* Hover Effects on Card */

@media (min-width: 992px) {
  .pricing .card:hover {
    margin-top: -.25rem;
    margin-bottom: .25rem;
    box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.3);
  }
  .pricing .card:hover .btn {
    opacity: 1;
  }
}