/* ------------------------------------------------------------------
Project: Semantic
Place here your custom CSS styles
------------------------------------------------------------------ */

/* overrides */
@import 'https://fonts.googleapis.com/css?family=Muli';


.wrapper {
    background: #f4f4f4;
}

body {
    background: #f4f4f4;
    font: 400 14px/1.6 'Muli', sans-serif;
    color: #333;
}


h1 {}
h2 {
    font-size:34px; 
}
h3 {}
h4 {}

.module-title {
    margin: 0 0 30px;
}

.module-single-top {
	padding: 160px 0 100px 0;
}

.footer {
    background: #272727;
    padding: 20px 0;
    color:#fff;
}

.font-alt {
    font-family: 'Muli', sans-serif;
}
.font-inc{
     font-family: 'Muli', sans-serif;
     text-transform:none; 
}

.btn {
        font-family: 'Muli', sans-serif;
}
.navbar-custom {
       font-family: 'Muli', sans-serif;

}
.form-control{
     font-family: 'Muli', sans-serif;
}

.hs-caption{
    height: 85%;
}
.caption-content{
    text-align:left; 
    font-size:16px; 
}
    .caption-head {
    }
    .alt-caption-head {
        margin-bottom:0; 
    }
    .caption-head h1 {
        margin-bottom:9px; 
        font-size:32px; 
        line-height: 1.1;
    }
    .caption-head h4{
        margin-top:4px; 
        letter-spacing: 0.15em;  
        font-weight:300;
    }
    .caption-main{
        line-height:1.4; 
        font-weight:400;
    }

/* ------------------------------------------------------------------
Navbar
------------------------------------------------------------------- */


.navbar-logo, .nav-col-dark.navbar-transparent .navbar-logo {
    width: 124px;
    height: 40px;
    background-image: url('../images/logo/bite-medical.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left center;
    margin: 5px 0;
}

.navbar-transparent .navbar-logo {
    background-image: url('../images/logo/bite-medical-transparent.png');
}

.navbar-custom {
	background: #272727;
	border:none !important;
    padding: 0 0 15px 0;
}

.navbar-custom .dropdown-menu {
	background: #272727;
	border:none !important;
}

.navbar-custom .dropdown-menu .dropdown-menu {
	top: 0;
	left: 100%;
	right: auto;
	margin-top: -1px;
}

.navbar-custom .navbar-brand {
	font-family: "Montserrat", sans-serif;
	letter-spacing: 0.1em;
	font-weight: 400;
	font-size: 20px;
	color: #fff;
}

.navbar-custom .nav li > a {
	position: relative;
	color: #fff;
}

.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover,
.navbar-custom .dropdown-menu > li > a:focus,
.navbar-custom .dropdown-menu > li > a:hover {
	background: none;
	color: #ffffff;
}

.navbar-custom .dropdown-menu > li > a:hover {
	/*background: #363636 !important;*/
    background: #363636 !important; 
  
}

.navbar-custom .dropdown-menu > li > a {
	border:none !important;
}

.navbar-custom .dropdown-menu > li:last-child > a {
	border: 0 !important;
}



.navbar-custom .navbar-toggle .icon-bar {
	background: #ffffff;
}




.navbar-transparent .dropdown-menu {
	/*background: rgba(39,39,39,0.3);*/
    background: rgba(255,255,255,0.3); 
	border:none !important;
}

.navbar-nav>li>.dropdown-menu {
    margin-top: 15px;
}

.navbar-toggle {
    margin-top: 22px;
    margin-bottom: 10px;
}





/* ------------------------- new --------------------------------- */

/* --- colours ---*/
.green {color:#8dc63f;}
.red {color:#ed1c24; }
.pink{color:#ec008c;}
.turquoise{color:#48acc6;}
.blue{color:#1b75bc;}
.purple {color:#8065a3;}

.btn.focus, .btn:focus, .btn:hover {
    color: #fff;
    text-decoration: none;
}

.btn-green {background-color:#8dc63f; color:#fff;}
.btn-red {background-color:#ed1c24; color:#fff;}
.btn-pink {background-color:#ec008c; color:#fff;}
.btn-turquoise {background-color:#48acc6; color:#fff;}
.btn-blue {background-color:#1b75bc; color:#fff;}
.btn-purple {background-color:#8065a3; color:#fff;}

.btn-green.focus, .btn-green:focus, .btn-green:hover {
    background-color:#9ece5c;
}
.btn-red.focus, .btn-red:focus, .btn-red:hover {
    background-color:#f14950;
}
.btn-pink.focus, .btn-pink:focus, .btn-pink:hover {
    background-color:#f033a3;
}
.btn-turquoise.focus, .btn-turquoise:focus, .btn-turquoise:hover {
    background-color:#63b8ce;
}
.btn-blue.focus, .btn-blue:focus, .btn-blue:hover {
    background-color:#3d8ac6;
}
.btn-purple.focus, .btn-purple:focus, .btn-purple:hover {
    background-color:#937cb1;
}


#home {
    overflow:hidden;
}

/*--- end colours ---*/
#home-base {
    display:block;
    position:absolute;
    width:100%;
    z-index:1000;
    height:30%;
    bottom:0px;
    background-color:none;
    background:url(../images/bgs/home-swoosh.png) no-repeat top center;
    background-size:cover;
}

    .adboard-plus #home-base {
        background-image: url('../images/bgs/adboard-swoosh.png');
    }

    .attitudes-insight #home-base {
        background-image: url('../images/bgs/attitudes-swoosh.png');
    }

    .bite-digital #home-base {
        background-image: url('../images/bgs/digital-swoosh.png');
    }

    .clinical-forum #home-base {
        background-image: url('../images/bgs/forum-swoosh.png');
    }

    .skills-centre #home-base {
        background-image: url('../images/bgs/skills-swoosh.png');
    }

    .expert-2-expert #home-base {
        background-image: url('../images/bgs/expert2-swoosh.png');
    }
       
    

#bite-splash-captions {
    height: 90%;
    position: absolute;
    display: table;
    margin:0;
    left:50%;
    margin-left:-585px;
    color:#272727;
    line-height:1.6;
    z-index:900;
}

.bite-splash-caption {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    font-size: 18px;
    padding-right:60%;    
}

#bite-splash-caption-holder {
}

    #bite-splash-caption-02, #bite-splash-caption-03 {
        display:none;
    }




#bite-product-captions {
    height: 90%;
    position: absolute;
    display: table;
    margin:0;
    left:50%;
    margin-left:-585px;
    color:#272727;
    line-height:1.6;
    z-index:900;
}



#footer-contact {
    background-color:#363636;
    background:url(../images/bgs/footer-swoosh.png) no-repeat top center;
    background-size:cover;
}

#footer-contact a {
    color:#fff; 
}

#footer-contact a:hover {
    color:#8dc63f; 
}


.contact-list{
    list-style:none; 
    padding:0; 
    margin:0 0 15px 0; 

}
.contact-list li {
    font-size:14px; 
}

.contact-list li a {
    color:#fff; 
}

.contact-list li a:hover {
    color:#8dc63f; 
}
.contact-box {
    color:#fff; 
}

.copyright {
    font-size:10px; 
}


.footer-links, .footer-social-links {
    margin: 0;
    padding: 0;
    list-style: none; 
    
}
.footer-links li, .footer-social-links li {
    display: inline;
    padding-left:15px; 
}
.footer-social-links li a {
    color:#fff; 
    font-size: 20px;
}

.footer-social-links li a:hover {
    color:#8dc63f; 
   
}

.module-title {
    letter-spacing: 0;
    font-size:36px;
}

.product-logo {
    padding:20px 0;
    width:100%; 
}

.product-min-height {
    min-height:300px; 
}

.download {
  padding-bottom:10px; 
}
    .download img {
        max-height: 100px;
    }
.download-text {
    font-size:14px; 
    line-height:1.5; 
}

.team-name {
    margin-bottom:10px; 
}


#map-section {
    width:50%; 
    padding: 10px 10px;
    background-color: #fff;
    
}
/* -------------------------------------------------------------------
Responsive Media Querries
------------------------------------------------------------------- */

@media (min-width: 768px) {

    .nav{
        margin-top:15px;
    }

	.navbar-transparent {
		background: transparent;
		border: 0 !important;
		border-color: #f5f5f5 !important;
		padding-bottom: 45px;
		padding-top: 15px;
	}

	.navbar-transparent .nav li > a,
    .navbar-transparent .nav li > a:hover,
    .navbar-transparent .nav .open > a,
    .navbar-transparent .nav .open > a:focus,
    .navbar-transparent .nav .open > a:hover,
    .navbar-transparent .nav > li > a:focus,
	.navbar-transparent .navbar-brand {
		/*color: #fff;*/
        color:#272727; 
	}

	.navbar-transparent .dropdown-menu > li > a {
		/*color: #fff;*/
        color:#272727; 
	}
    .navbar-custom .dropdown-menu > li > a:hover {
	/*background: #363636 !important;*/
    background: rgba(255,255,255,0.6) !important; 
}

	

	


}


@media (max-width: 767px) {

	/* Navbar */

	.navbar-custom .navbar-nav {
		margin-top: 0;
		margin-bottom: 0;
        border:none;
	}

	.navbar-custom li a:hover {
		background: #363636 !important;
	}

	.navbar-custom .navbar-nav .open .dropdown-menu .dropdown-header,
	.navbar-custom .navbar-nav .open .dropdown-menu > li > a {
		padding: 10px 25px;
	}

	.navbar-custom .navbar-nav .open .dropdown-menu .dropdown-menu .dropdown-header,
	.navbar-custom .navbar-nav .open .dropdown-menu .dropdown-menu > li > a {
		padding: 10px 35px;
	}

	.navbar-custom li a,
	.navbar-custom .dropdown-menu > li:last-child > a {
		border-bottom: none !important;
	}

    .navbar-custom .navbar-collapse {
        border-top: 1px solid #f4f4f4;
        -webkit-box-shadow: none;
        box-shadow: none;
        margin-top:15px;
    }

	.footer-links, .copyright {
        text-align:center;

	}
    .copyright {
    margin-bottom:0; 
    }
    .contact-form {
        padding-top:30px; 
    }

    #map-section {
    width:100%; 
    
    
}

}


/* GENERAL MEDIA QUERIES */

@media (max-width: 767px) {
    /*container = 750px*/
    #bite-splash-captions {
        display:none;
    }
    #bite-product-captions {
        margin-left:-50%;
        max-width:100%;
    }
    #about {
        display:block;
    }
}

@media (min-width: 768px) {
    /*container = 750px*/
    #bite-splash-captions, #bite-product-captions {
        margin-left:-375px;
    }
    
    #about {
        display:none;
    }
}

@media (min-width: 992px) {
    /*container = 970px*/
    #bite-splash-captions, #bite-product-captions {
        margin-left:-485px;
    }
}

@media (min-width: 1200px) {
    /*container = 1170px*/
    #bite-splash-captions, #bite-product-captions {
        margin-left:-585px;
    }
}



@media (min-width: 768px) and (max-width: 1199px) {

    .caption-head h4 {
    display:none; 
    }

    .caption-head h1 {
    font-size:30px; 
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    
    .bite-splash-caption {
         padding-right:55%; 
    }
        .caption-head h1 {
    font-size:26px; 
    }
}