@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');

html { position: relative; min-height: 100%;}
body { font-family: 'Roboto', sans-serif; font-size:14px; padding:0px; margin:0px;}

a { transition: 1s;}
a:hover { transition: 1s;}

h1, h2, h3, h4, h5, h6 { font-weight:300;}

h2 { font-size:38px;}
h3 { font-size:32px;}
h3 small { font-size:20px; color:#666; font-weight:300;}
h4 { font-size:28px;}
h5 { font-size:20px;}
h6 { font-size:16px;}

#topline { background:#219ed9; height:5px; }
#toparrow { cursor:pointer; transition: 1s;}
#toparrow:hover {  opacity: 0.8; filter: alpha(opacity=80); /* For IE8 and earlier */ transition: 1s;}
.topsection { margin-top:10px; -webkit-box-shadow: 1px 10px 9px -10px rgba(0,0,0,0.2); -moz-box-shadow: 1px 10px 9px -10px rgba(0,0,0,0.2); box-shadow: 1px 10px 9px -10px rgba(0,0,0,0.2);}
ul.a { list-style:none;} 
ul.a li { display:inline-block;}
ul.a li a { font-size:13px; color:#767676;}
ul.a li a:hover { color:#000;} 
ul.a li.active a { font-weight:500;}
ul.a li.active a:hover { color:#1b315d !important;}
ul.a li a.btn { color:#FFF !important;}

ul.b { list-style:none; margin-top:10px; padding-left:0px;} 
ul.b li { line-height:26px; }
ul.b li span { width:30%; float:right;}

.whitebackground { background-color:#fff; padding:60px 0px;}
.lightgraybackground { background-color:#f7f7f7; padding:60px 0px;}

.coffeecup { background-image:url(../images/coffee_cup.jpg); background-repeat:repeat; background-size: 100% 100%; padding:80px 0px;}

.btn-primary { font-size:13px; padding:10px 30px; border-color: transparent;}
.btn-primary:hover { background-color:#1b315d; border-color: transparent;}

.btn-lg { font-size:18px; padding:15px 30px; border-color: transparent;}

.margintopbottom50 { margin:50px 0px;}
.margintopbottom50 h2 { margin-bottom:20px;}
.margintopbottom50 h4 { margin-bottom:30px;}
.margintopbottom50 h5 { margin-bottom:30px;}

.margintopbottom80 { margin:80px 0px;}
.margintopbottom80 i { font-size:60px; }
.margintopbottom80 h2 { margin:0px; color:#219ed9;}

.peopleimage { margin-top:-50px;}

.footersection { background:#fff; border-top:1px solid #219ed9; padding:40px 0px;}
.footersection a { color:#219ed9;}
.socailicons { margin-top:20px;}
.socailicons a { font-size:28px; margin-right:10px;}
.socailicons a:hover { color:#1b315d;}

.copyright { background-color:#219ed9; font-size:12px; color:#fff; padding:10px 0px;}
.copyright a { color:#fff; margin-left:10px; } 

.lightgray { color:#959595;}

.clear { clear:both;}

/* Carousel base class */
.carousel { margin-bottom: 0;}
/* Since positioning the image, we need to help out the caption */
.carousel-caption { background-repeat:repeat; z-index: 10; bottom: 30%; left:10%; padding:30px;}

/* Declare heights because of positioning of img element */
.carousel-item { height: 500px; background-color: #777;}
.carousel-item > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.carousel-caption h1 { font-weight:300; font-size:32px;}
.carousel-caption p { font-weight:100; font-size:18px; margin-top:20px;}
.carousel-caption a { font-size:13px; padding:10px 30px; }

.carousel-control-prev { background-color:#000; width: 4%; top:auto; left:91.9%; bottom: 0; padding:12px 0px;}
.carousel-control-next { background-color:#000; width: 4%; top:auto; left:96%; bottom: 0; padding:12px 0px;}
.carousel-indicators li { background-color: #aeaeae;}
.carousel-indicators .active { background-color: #219ed9;}

/* Home Page Searchbox & Scroll Top Section */
#searchbox { position:absolute; top:160px; left:72px; z-index:100;}
#scrolltopicon { position:absolute; top:4px; right:0px; z-index:100;}
#scrolltopicon button { background-color:#219ed9; font-size:20px; color:#fff; padding:7px 14px; border-radius:0px; border:0px; cursor:pointer; transition: 1s;}
#scrolltopicon button:hover { background-color:#1b315d; transition: 1s;}
#topsectiondiv { background-color:#219ed9; width:100%; height:350px; color:#fff; position:fixed; top:0px; left:0px; padding:20px 0px 50px 0px; z-index:100;  -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.36); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.36);box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.36);}
#topsectiondiv hr { border-top:1px solid #fff;}
#topsectiondiv a { color:#1b315d; }
#topsectiondiv a:hover { color:#fff; }
#topsectiondiv img { position:absolute; bottom:20px; right:20px;}
#topsectiondiv a img { opacity: 1; transition: 0.5s ease; }
#topsectiondiv a:hover img { opacity: 0.5; transition: 0.5s ease; }
#scrolldownicon { position:fixed; top:350px; right:0px; z-index:100;}
#scrolldownicon button { background-color:#219ed9; font-size:20px; color:#fff; padding:7px 14px; border-radius:0px; border:0px; cursor:pointer; transition: 1s;}
#scrolldownicon button:hover { background-color:#1b315d; transition: 1s;}
/* Home Page Searchbox & Scroll Top Section */

.card { padding:20px 0px 0px 0px; margin-bottom:20px; transition: 1s;}
.card:hover { background-color:#f1fbff; transition: 1s;}

.navbar { padding:0px;}

#signupforfree { position:fixed; left:-70px; top:48%; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); z-index:100;}

.loginform { margin:50px 0px;}

.form-group.has-error .form-control { border-color:#dd4b39; box-shadow:none;}

.maincontain { margin-bottom:180px;}
.footer { position: absolute; bottom: 0; width: 100%; height: 180px;}

.alert { margin-top:40px;}

.red { color:#ff0000;}

@media only screen and (min-width:768px) and (max-width:1024px){
	h2 { font-size:38px;}
	h3 { font-size:30px;}
	h3 small { font-size:18px; color:#666; font-weight:300;}
	h4 { font-size:28px;}
	h5 { font-size:20px;}
	h6 { font-size:16px;}
}

@media only screen and (min-width:481px) and (max-width:767px){
}

@media only screen and (min-width:320px) and (max-width:480px){
	.margintopbottom50 { margin:0px 0px 50px 0px;}	
	.col-md-7:last-child .margintopbottom50 { margin:50px 0px 0px 0px;}	
	.col-md-6:last-child .margintopbottom50 { margin:50px 0px 0px 0px;}	
	.coffeecup { background-image:url(../images/coffee_cup.jpg); background-repeat:repeat; background-size: auto 100%; padding:40px 0px;}
	#scrolltopicon button, #scrolldownicon button { display:none;}
	.carousel-item { height: 220px; background-color: #777;}
}