/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 3 Feb, 2017, 12:10:06 AM
    Author     : Shwetabh
*/

/* Header Image Background - Change the URL below to your image path (example: ../images/background.jpg) */
.h-full{
    height: 100%;
}
@media (max-width: 540px){
    .h-banner{
        height: 400px;
    }
}
@media (max-width: 768px) {
    .display-4{
        font-size:2em;
    }
}
@media (min-width: 540px){
    .h-banner{
        height: 400px;
    }
}
@media (min-width: 768px){
    .h-banner{
        height: 500px;
    }
}
@media (min-width: 960px){
    .h-banner{
        height: 100%;
    }
}
.w-full{
    width: 100%;
}
#home-banner img{
	width:100%;
}
#home-banner-text{
	position: relative;
	top:-300px;
	text-align:center;
}
#home-banner-text h3{
	display:inline;
	padding:5px;
	background-color: #fff;
}
#home-banner-text p{
	display:inline;
	padding:4px;
	background-color: #fff;
}
#banner-first, #banner-second{
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.navbar{
    padding: 0;
}
.font-9{
    font-size: .9em;
}
#banner-first{
    background: url('images/woman_phone_dark.jpg') no-repeat center center;
}
#banner-second{
    background: url('images/man_mockup_n.jpg') no-repeat center center;
}
nav{
    box-shadow: 0px 3px 5px #888888;
}
nav, nav div{
    z-index: 100;
}
.primary-color{
    color: #3b8ec2 !important;
}
.primary-color:hover{
    color: #0e5886 !important;
}
.secondary-color{
    color: #f2902f !important;
}
.btn-orange {
  color: #fff;
  background-color: #f2902f;
  border-color: #f2902f;
}

.btn-orange:hover {
  color: #fff;
  background-color: #bf6811;
  border-color: #bf6811;
}

.btn-orange:focus, .btn-orange.focus {
  -webkit-box-shadow: 0 0 0 2px rgba(242, 144, 47, .5);
          box-shadow: 0 0 0 2px rgba(242, 144, 47, .5);
}

.btn-orange.disabled, .btn-orange:disabled {
  background-color: #f2902f;
  border-color: #f2902f;
}

.btn-orange:active, .btn-orange.active,
.show > .btn-orange.dropdown-toggle {
  color: #fff;
  background-color: #f2902f;
  background-image: none;
  border-color: #f2902f;
}
.carousel-caption{
    bottom: 100px;
}
@media (max-width: 768px) {
    .carousel-caption{
        bottom: 0px;
    }
}
.grey-color{
    color: rgba(0,0,0,.5);
}
#packages a{
    color: rgb(41, 43, 44);
}
#packages a:hover{
    text-decoration: none;
}
.carousel-indicators{
    bottom: 0px !important;
    /*margin-bottom: -50px;*/
}
.carousel-indicators li{
    background: #3b8ec2;
}
.carousel-indicators li.active{
    background: #f2902f;
}
footer{
    background: #3D4350;
    color: #adadad;
}
footer a{
    color: #adadad;
}
#expert-img{
    width: 200px;
}
@media (max-width: 991px) {
    #expert-img{
        width: 100%;
    }
}
@media (min-width: 400px) and (max-width: 576px){
    nav .container {
        width: 350px;
        max-width: 100%;
    }
}
@media (min-width: 300px) and (max-width: 400px){
    nav .container {
        width: 300px;
        max-width: 100%;
    }
}

/*******************************
* Does not work properly if "in" is added after "collapse".
* Get free snippets on bootpen.com
*******************************/
    .panel-group .panel {
        border-radius: 0;
        box-shadow: none;
        border-color: #EEEEEE;
    }

    .panel-default > .panel-heading {
        padding: 0;
        border-radius: 0;
        color: #212121;
        background-color: #ddd;
        border-color: #ccc;
    }

    .panel-title {
        font-size: 14px;
    }

    .panel-title > a {
        display: block;
        padding: 15px;
        text-decoration: none;
    }

    .more-less {
        float: right;
        color: #212121;
    }

    .panel-default > .panel-heading + .panel-collapse > .panel-body {
        border-top-color: #EEEEEE;
    }
	.panel-body {
		padding-left:5px;
		font-size: .9rem;
	}