body, html {
	height: 100%;
	width: 100%;
}

body, h1, h2, h3, h4, h5, h6 {
	font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 700;
}

.lead {
	font-size: medium;
	font-weight: normal;
}
li a, .footer-menu-divider{
  color:grey;
}

li a:hover{
  color:white;
  text-decoration: none;
  transform: translateY(-2px);
 
}

.intro-header {
	padding-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
	padding-bottom: 50px;
	color: #f8f8f8;
	background: url(../img/intro-bg.webp) no-repeat center center;
	background-size: cover;
	text-align: center;
}

#logo {
  display: inline-block;
  width:23px;
  height:23px;
  border-radius:50%;
  
}


#shadow{
  text-shadow: grey 2px 2px 2px;
}
h1 > span{
  text-shadow: grey 2px 2px 2px;
}
h1 > small {
  padding-top: 0px;
  color: white;
  
}

.carousel-inner {
  box-shadow:20px 20px 50px #c7bfc6;
} 
#transparent-bg {
  background-color: #f8f8f8;
}
.panel-heading {
  background-color: #f8f8f8;
}
/* myButton style */
.myButton, .myButton2{
  margin:auto;
	background-color:#44c767;
	border-radius:24px;
	border:1px solid #18ab29;
	display:flex;
	cursor:pointer;
	justify-content: center;
	font-size:13px;
  width:200px;
}


.fa-facebook-messenger span, .fa-address-book span, .fa-paper-plane span{
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color:#3C3633;
}
.myButton i, .myButton2 i, .myModalButton i{
  color:#3C3633;
}

.myButton:hover, .myButton2:hover, .myModalButton:hover {
	background-color:#02f339;
  box-shadow:10px 10px 30px #47f7a3;
  transform: scale(1.05);
}

#box1, #box2, #box3, #box4 {
  height: 300px;
}
#box1inner, #box2inner, #box3inner, #box4inner{
 
  height:280px;
  border-radius:8px;
  color:grey;
  text-align:center;
  padding-top: 15%;
  box-shadow:20px 20px 50px #c7bfc6;
}



#box1inner {
  background-color:#86f7b7;
 
}
#box2inner {
  background-color:#f1c5fe;
}
#box3inner {
  background-color:#f3a9b9;
}
#box4inner {
  background-color:#b0edfd;
  overflow: hidden;
  text-overflow:ellipsis;
}

#box1inner:hover, #box2inner:hover, #box3inner:hover, #box4inner:hover{
  transform: scale(1.05, 1.05);
  -webkit-box-shadow: 10px -8px 10px -4px rgba(69,176,230,1);
  -moz-box-shadow: 10px -8px 10px -4px rgba(69,176,230,1);
  box-shadow: 10px -8px 10px -4px rgba(69,176,230,1);
}


/* testimonial section */
.panel-default {
  margin-top:20px;
}
.panel-heading >img {
   margin:auto;
   width:150px;
   height:150px;
   border-radius:50%;
   box-shadow:20px 20px 50px pink;
}

.panel-footer{
  color:black;
  font-weight: bolder;
}
.glyphicon-ok-circle {
  color:#05c513;
}
  
  /* Modal Form */


.modal-footer .btn-default {
  padding-top:0;
  padding-bottom:0;
  color:#99a4a6;
  border-radius:15px;
}
.myModalButton {
  margin:auto;
  width:200px;
	background-color:#44c767;
	border-radius:24px;
	border:1px solid #18ab29;
	display:flex;
	cursor:pointer;
	color:#ffffff;
	justify-content: center;
	font-size:13px;
	text-decoration:none;
}
  /* Heading */
.intro-message {
	position: relative;
	padding-top: 20%;
	padding-bottom: 20%;
}

.intro-message > h1 {
	margin: 0;
	font-size: 5em;
	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
}

.intro-divider {
	width: 400px;
	border-top: 1px solid #f8f8f8;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.intro-message > h3 {
	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
}

@media (max-width: 767px) {
	.intro-message {
		padding-bottom: 15%;
	}

	.intro-message > h1 {
		font-size: 3em;
	}

	.intro-divider {
		width: 100%;
	}
}
#social {
  margin:auto;
  display:block;
}
.network-name {
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 2px;
}

.content-section-a {
	background-color: #F2F2F2;
	padding: 50px 0;
}

.content-section-b {
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
	padding: 50px 0;
}

.section-heading {
	margin-bottom: 20px;
}

.section-heading-spacer {
	border-top: 3px solid #e7e7e7;
	width: 100%;
	float: left;
}

.banner {
	padding: 100px 0;
	color: #f8f8f8;
	background: url(../img/banner-bg.webp) no-repeat center;
	background-size: cover;
}

.banner h3 {
  display:flex;
  margin-bottom:20px;
	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6); 
	font-size: 14px;
	justify-content: center;
}


@media (max-width: 767px) {
	.banner h3 {
		margin: 0;
		text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
		font-size: 16px;
	}
}	
 #btconnect {
   display:flex;
   justify-content:center;
   padding-bottom:10px;
 }
 
.fab{
  color:white;
} 

footer {
  padding-top:40px;
	background-color: #f8f8f8;
}

#navfooter {
  display:flex;
  justify-content:center;
  padding-top:10px;
  padding-bottom:-10px;
}


p.copyright {
  padding-top:0;
	padding-bottom:3px;
	text-align:center;
	font-size:10px;
}

/* Testimonial styling */
.fa-star, .fa-star-half {
  color: #ffd700;
}

@media (min-width: 1025px) {
  .star {
    font-size: 45px !important;
    color: #ffd700 !important;
  }
}

@media (min-width: 961px) {
  .star {
    font-size: 45px !important;
    color: #ffd700 !important;
  }
}



@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) {
  .star {
    font-size: 28px !important;
    color: #ffd700 !important;
  }
}

@media (min-width: 600px) {
  .star {
    font-size: 20px !important;
    color: #ffd700 !important;
  }
}

@media (max-width: 480px) {
  .list-inline li a{
    justify-content: center;
    margin: auto;
    font-size: 12px !important;
}
p.copyright {
	font-size:8px;
}
}

.clearfix{
  background-color: grey;
  height:15px;
}

.card{
  margin: 20px 0 20px 0;
}
.card-content>img{
  border-radius: 50%;
}
.card-header h4{
 border-radius: 3px;
  border: 1px solid grey;
}

.card-header h4 small{
 color:black;
}

/* Photo Edwin hover*/

.card-content img[alt="pic2"]:hover{
  border: 1px solid #5fb8ff;
-webkit-box-shadow: 5px 5px 0px 0px #289FED, 10px 10px 0px 0px #5FB8FF, 15px 15px 0px 0px #A1D8FF, 20px 20px 0px 0px #CAE6FF, 25px 25px 0px 0px #E1EEFF, 5px 5px 15px 5px rgba(0,0,0,0); 
box-shadow: 5px 5px 0px 0px #289FED, 10px 10px 0px 0px #5FB8FF, 15px 15px 0px 0px #A1D8FF, 20px 20px 0px 0px #CAE6FF, 25px 25px 0px 0px #E1EEFF, 5px 5px 15px 5px rgba(0,0,0,0);
}
/* Rachel Photo hover */


.card-content img[alt="pic1"]:hover{
  border: 1px solid #5fb8ff;
-webkit-box-shadow: 5px 5px 0px 0px #289FED, 10px 10px 0px 0px #5FB8FF, 15px 15px 0px 0px #A1D8FF, 20px 20px 0px 0px #CAE6FF, 25px 25px 0px 0px #E1EEFF, 5px 5px 15px 5px rgba(0,0,0,0); 
box-shadow: 5px 5px 0px 0px #289FED, 10px 10px 0px 0px #5FB8FF, 15px 15px 0px 0px #A1D8FF, 20px 20px 0px 0px #CAE6FF, 25px 25px 0px 0px #E1EEFF, 5px 5px 15px 5px rgba(0,0,0,0);
}
/* Isabel Photo hover */
.card-content img[alt="pic3"]:hover{
  border: 1px solid #5fb8ff;
-webkit-box-shadow: 5px 5px 0px 0px #289FED, 10px 10px 0px 0px #5FB8FF, 15px 15px 0px 0px #A1D8FF, 20px 20px 0px 0px #CAE6FF, 25px 25px 0px 0px #E1EEFF, 5px 5px 15px 5px rgba(0,0,0,0); 
box-shadow: 5px 5px 0px 0px #289FED, 10px 10px 0px 0px #5FB8FF, 15px 15px 0px 0px #A1D8FF, 20px 20px 0px 0px #CAE6FF, 25px 25px 0px 0px #E1EEFF, 5px 5px 15px 5px rgba(0,0,0,0);
}
.bticon{
  margin:2px;
}
.fa-facebook-f:hover{
   color:dodgerblue;
}

