/*!
 * Start Bootstrap - Modern Business (http://startbootstrap.com/)
 * Copyright 2013-2016 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
 */

/* Global Styles */

html,
body {
    height: 100%;
}

body {
    padding-top: 60px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
}

.img-portfolio {
    margin-bottom: 30px;
}

.img-hover:hover {
    opacity: 0.8;
}

.img-news {
	width: 100%;
}

/* Home Page Carousel */

header.carousel {
    height: 100%;
}

header.carousel .item,
header.carousel .item.active,
header.carousel .carousel-inner {
    height: 100%;
}

header.carousel .fill {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
}

/* 404 Page Styles */

.error-404 {
    font-size: 100px;
}

/* Pricing Page Styles */

.price {
    display: block;
    font-size: 50px;
    line-height: 50px;
}

.price sup {
    top: -20px;
    left: 2px;
    font-size: 20px;
}

.period {
    display: block;
    font-style: italic;
}

/* Footer Styles */

footer {
    margin: 50px 0;
}

/* Responsive Styles */

@media(max-width:991px) {
    .customer-img,
    .img-related {
        margin-bottom: 30px;
    }
}

@media(max-width:767px) {
    .img-portfolio {
        margin-bottom: 15px;
    }

    header.carousel .carousel {
        height: 70%;
    }
}

/* custom CSS */
/* set navbar color*/
.navbar-color{
	background-color: rgba(2,2,2,.70);
	border-width: 0px;
}

/* navbar height */
.navbar-height{
	min-height: 60px;
}

/* navbar height */
.navbar-nav > li > a, .navbar-brand {
    padding-top: 15px;
    padding-bottom: 15px;
    height: 60px;
	line-height: 30px;
	font-size: 15px;
}

/* mobile menu button */
.navbar-toggle {
	margin-top: 13px !important;
}

/* set height of navbar logo */
.navbar-logo{
	height: 100%;
}

/* set navbar logo no padding */
.navbar-logo-container{
	padding-top: 0px;
	padding-bottom: 0px;
}

/* set navbar option color */
.nav-style > li > a{
	color: #FFFFFF !important;
}

/* set navbar option color when hover */
.nav-style > li > a:hover{
	color: #9d9d9d !important;
	/* background-color: #f5f5f5 !important; */
}

.nav-style > li > a:active{
	color: #9d9d9d !important;
	/* background-color: #f5f5f5 !important; */
}

.dropdown-menu>li>a {
    padding: 3px 20px !important;
}

/* @media (max-width: 767px) */
/* .navbar-inverse .navbar-nav .open .dropdown-menu>li>a { */
    /* color: #ffffff !important; */
/* } */

/* not in use */
.photo-page {
	padding-top: 0px;
}

/* set caption in the center */
.fillphoto {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

/* set caption in the center */
.important-caption{
	top: 50%;
	transform: translateY(-50%);
	bottom: initial;
	left: 15%;
	right: 15%;
	text-shadow: none;
	padding-bottom: 0px !important;
}

/* set caption in the center */
@media(max-width:767px){
	.important-caption{
		top: 50%;
		transform: translateY(-50%);
		bottom: initial;
		left: 5%;
		right: 5%;
		text-shadow: none;
	}

	.contacticon {
		max-height: 35px;
		max-width: 35px;
		margin-right: 16px !important;
		margin-bottom: 20px;
	}

}

/* @media(max-width:516px){ */
	/* .companyicon { */
		/* display: none; */
	/* } */
	
	/* .companytext{ */
		/* margin-top: 30px; */
	/* } */
/* } */

@media(max-width:405px){
	.collectiontypeselectionfield{
		float: none !important;
	}
}

.collectiontypeselectionfield{
	float: right;
}
	
.companyicon {
	max-height: 100px;
	max-width: 100px;
	margin-bottom: 30px;
	margin-top: 40px;
}

.fullpagecontent{
	max-height: 500px;
	overflow-y: auto;
}

::-webkit-scrollbar { 
    display: none; 
}

/* apply layer on photo */
.layer{
	background-color: rgba(2, 2, 2, 0.2);
    position: absolute;
    width: 100%;
    height: 100%;
}

.contactinfo{
	margin: 0 auto; 
	max-width: 500px;
}

.contacttext{
	color: rgba(3, 3, 3, 1);
	margin-top: 20px;
}

.contactheading{
	margin-bottom: 30px;
}

.contacticon {
	max-height: 35px;
	max-width: 35px;
	margin-right: 20px;
	margin-bottom: 20px;
}

.contactline{
	padding-top: 6px;
}

.contactsocial{
	margin-top: 40px;
}

.divisiontext {
	font-size: 10px;
}

.shareicon {
	max-height: 50px;
	max-width: 50px;
	padding-right: 10px;
}

.collectionicon {
	max-height: 100px;
	max-width: 100px;
	padding-right: 20px;
}

.collectiontypeicon {
	max-height: 70px;
	max-width: 70px;
	padding-right: 10px;
	margin-left: 10px;
	padding-top: 15px;
	padding-bottom: 10px;
}

.collectionwrap{
	font-size: 2em;
}

.collectionwrap:hover .collectioncaption,
.collectionwrap:focus .collectioncaption,
.collectionwrap:active .collectioncaption {
	visibility: visible;
	opacity: 1;
}

.collectionwrap:hover .collectionbg,
.collectionwrap:focus .collectionbg,
.collectionwrap:active .collectionbg {
	visibility: visible;
	opacity: 1;
}

.collectionimage{
	
}

.collectionbg{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(3, 3, 3, 0.3);
	visibility: hidden;
	opacity: 0;
	
    margin-right: 15px;
    margin-left: 15px;
	
	/* transition effect. not necessary */
	transition: opacity .2s, visibility .2s;
}

.collectioncaption{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate( -50%, -50% );
    text-align: center;
    color: white;
    font-weight: bold;
	visibility: hidden;
	opacity: 0;
	
	/* transition effect. not necessary */
	transition: opacity .2s, visibility .2s;
}

.collectiontypeselection{
	margin-bottom: 1em;
}

.tilecaption{
	position: absolute;
	bottom: 0;
	left: 15px;
	right: 15px;
    text-align: center;
    color: white;
    font-weight: bold;
	background: rgba(3, 3, 3, 0.3);
}

.facebookicon {
	margin-top: 6px;
}

.fb-page, 
.fb-page span, 
.fb-page span iframe[style] { 
    width: 100% !important; 
}

div.click-to-top span {
	display: none;
	width: 160px;	
	position: absolute;
	border-radius: 6px;
	/* left: 26%; */
	margin-left: 95px;
	bottom: 110%;
	padding: 5px 0;
	z-index: 1;
	text-align: center;
	background: #333; 
	color: #fff; }
	
div.click-to-top:hover span {
	display: block; 
}

.squareimage {
	/* height: 100%; */
	width: 100%;
    padding-bottom:100%;
    overflow:hidden;
    position:relative;
}

.squareimage img{
    position:absolute;
	width:auto;
    min-width:100%;
    min-height:100%;
	max-width: none;
	max-height: 100%;
}

/* modal close button */
button.close {
    top:3px;
    right:6px;
    z-index:100;
	position: absolute;
}

.btn-more{
	color: #fff;
    background-color: #FFFFFF;
    border-color: #FFFFFF;
}