/***********
 * Layout
 ***********/
body {
 /*BG Size - 1920x1080*/
  background-color: #111;
  background: url('../images/bg-img-me.jpg') no-repeat center 32% fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;
  background-attachment: scroll;
}

@media only screen and (max-width: 767px)
{
	/** Bootstrap 4 SM window **/
	body {
		-webkit-background-size: 820px auto;
		-moz-background-size: 820px auto;
		background-size: 820px auto;
		-o-background-size: 820px auto;
		background-attachment: fixed;
		background-position:center top;
	}
}

@media only screen and (max-width: 575px)
{
	body{
		background-image: url('../images/bg-sm-img-me.jpg');
	}
}

h1,h2,h3,h4,h5,.h1,.h2,.h3,.h4,.h5 {
	text-transform: uppercase;
}

main {
	/** Wrapper Style **/
	margin-bottom: 4em;
}

footer.fixed, div.footerwrap {
	position: fixed;
    bottom: 0;
	width: 100%
	/*height: 60px;
    line-height: 60px;*/
}

div.footerwrap {
	background-color: #111;
}

@media only screen and (max-width: 575px)
{
	/** Bootstrap 4 SM window **/
	footer.fixed {
		position: relative !important;
	}
}

.img-frame {
	overflow: hidden;
}

@media only screen and (min-width: 576px) and (max-width: 625px)
{
	/** Custom XS/SM window **/
	.img-frame-fix {
		position: relative;
		top:-50%;
	}
}

.img-frame-center {
	position: relative;
}

a.icon-overlay i.la {
	/*display: none;*/
    position: absolute;
    left: 43%;
    top: 40%;
    filter: drop-shadow(3px 3px 3px #000);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#000,direction=35);
    text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
    -khtml-opacity: 0.6;
    opacity: 0.6;
}

a:hover.icon-overlay i.la {
	display: inline;
	color: rgba(255, 255, 255, .8) !important;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
}

a, a:link, a:hover, a:active {
	text-decoration: none;
}

footer, footer a, footer a:link, footer i {
	color: #A8ABB3;
}

/***************************
/	BootStrap Overwright
***************************/
.btn-dark {
	background-color: #202327;
}

.btn-info {
	color: #202327;
}

/************************
/	BootStrap Add-ons
*************************/
/** General **/
.text-site-blue, .text-site-blue-list h4, 
.text-site-blue-list h5, .text-site-blue-list h6 {
	color: #1dcfeb !important;
}

.btn {
	font-weight: bold;
	text-transform: uppercase;
}

.border-black {
	border-color: rgba(0,0,0,.125) !important;
}

.bg-black {
	background-color: #000!important;;
}


.bg-dark-opacity {
	background-color: #343a40; /*BG Color Fallback*/
	background-color: rgba(52,58,64,.9) !important;
	/* Required for IE 5, 6, 7 */
	/* ...or something to trigger hasLayout, like zoom: 1; */
	width: 100%;
	
	/* Theoretically for IE 8 & 9 (more valid) */
	/* ...but not required as filter works too */
	/* IE 8 */
	/* should come BEFORE filter */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
	/* IE 5-7, IE 8 & 9  */
	filter: alpha(opacity=85);
	/* Gecko */
	/* Older than Firefox 0.9 */
	-moz-opacity: 0.85;
	/* Safari 1.x */
	/* Safari 1.x (pre WebKit!) */
	-khtml-opacity: 0.85;
	/* Modern Browser!
	/* CSS3 */
	/* Firefox 0.9+, Safari 2?, Chrome any?
	/* Opera 9+, IE 9+ */
	opacity: 0.85;
	
}

a:hover.text-white-50, a:focus.text-white-50 {
	color: rgba(255,255,255,1) !important;
}

  /** Responsive **/
@media only screen and (min-width: 768px) and (max-width: 991px)
{
	/** Bootstrap 4 MD window **/
	.text-center-md {
		text-align: center;
	}
}

@media only screen and (min-width: 576px) and (max-width: 767px)
{
	/** Bootstrap 4 SM window **/
	.text-center-sm, .text-center-md {
		text-align: center;
	}
}

@media only screen and (max-width: 575px)
{
	/** Bootstrap 4 XS window **/
	.text-center-xs, .text-center-sm, .text-center-md {
		text-align: center;
	}
}

/** Nav bar **/
.active .nav-link {
	cursor: default;
}
/** Body Content **/
.card-header h1, .card-header h2, .card-header h3,
.card-header h4, .card-header h5, .card-header h6{
	margin: 0;
	padding: 0;
}
.row.card-colum-gap {
	padding-left: .125rem;
	padding-right: .125rem;
}
.card-column-gap {
	padding: 0 .625rem;
}

.card a, .card a:link, dl a, dl a:link {
	/* Bootstrap - TextInfo Color */
	color: #1cc7e2;
}
.card a:focus, .card a:hover, dl a:focus, dl a:hover  {
	font-weight: 600;
}

.card a.btn, .card a.btn:link, dl a.btn, dl a.btn:link {
	color: #202327;
	transition: all .5s;
  	-webkit-transition: all .5s; /* Safari 3.1 to 6.0 */
}

.card a.btn:focus, .card a.btn:hover, dl a.btn:focus, dl a.btn:hover  {
	color: #fff!important;
}

.card-intro, .intro-text {
	font-size: 1.25rem;
}

@media only screen and (min-width: 575px)
{
	/** Display on screens larger then 
		Bootstrap 4 XS window **/
	.card-intro, .intro-text {
		text-align: justify;
	}
}

/*** Nav / Footer ***/
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover,
footer a:hover, footer a:active, footer a>i:hover {
	/* Bootstrap - TextInfo Color */
	color: #17a2b8;
} 

.navbar-dark .navbar-nav .active>.nav-link {
	color: #FFF;
}

/*** Form / Contact Page ***/
.custom-select.is-invalid, .form-control.is-invalid, .was-validated 
.custom-select:invalid, .was-validated .form-control:invalid
{
	/* Danger Text Default - #dc3545 */
	background-color: #ffd5d9;
}

.custom-select.is-valid, .form-control.is-valid, .was-validated 
.custom-select:valid, .was-validated .form-control:valid  {
	/* Success Text Default - #28a745 */
	background-color: #c9f0d3;
}
/** Card / Card Layout **/
.card-body i.la {
	color: #17a2b8;
}

@media (min-width: 625px) and (max-width: 992px)
{
	/* Small and Mid Size - Orginally From 575px to 992 */
	.card-columns {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}
}

@media only screen and (max-width: 625px)
{
	/* XS Size */
	.card-columns {
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}
}

/** Carousel **/
.carousel-caption.no-float {
	position: inherit;
	right: 0;
	left: 0;
}

.carousel-control-prev-icon.text-dark {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23343a40' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.carousel-control-next-icon.text-dark {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23343a40' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

.carousel-control-prev-icon.text-secondary {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%236c757d' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.carousel-control-next-icon.text-secondary{
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%236c757d' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

/** Modal **/
@media only screen and (min-width: 991px)
{
	/** Bootstrap 4 MD window **/
	.modal-dialog {
    	max-width: 800px;
	}
	
	.modal-body .carousel-control-next, .modal-body .carousel-control-prev {
		width: 8%;
	}
}

/****************************
/	End of BootStrap Addon  
****************************/

/************************
/	Page Specific
*************************/
/*.imgsProd1 {
	height: 520px;
}*/

.imgsProd1 img {
	max-height: 520px;
}

/*.imgsProd2 {
	height: 436px;
}*/

.imgsProd2 img {
	max-height: 436px;
}

/*.imgsProd7 {
	height: 650px;
}*/

.imgsProd7 img {
	max-height: 650px;
}

/*.imgsProd9 {
	height: 570px;
}*/

.imgsProd9 img {
	max-height: 570px;
}

@media only screen and (min-width: 991px)
{
	/** Bootstrap 4 MD window **/
	.imgsProd1 {
		height: 420px;
	}

	.imgsProd1 img {
		max-height: 420px;
	}
	
	.imgsProd2 {
		height: 436px;
	}

	.imgsProd2 img {
		max-height: 436px;
	}

	.imgsProd9 {
		height: 570px;
	}

	.imgsProd9 img {
		max-height: 570px;
	}
}


@media (max-width: 575px)
{
	/** Bootstrap 4 XS window **/
	#gallery .img-frame {
		height: inherit;
	}
}

@media only screen and (min-width: 576px) and (max-width: 767px)
{
	/** Bootstrap 4 SM window **/
	#gallery .img-frame {
		height: 7.5rem !important;
	}
}

@media only screen and (min-width: 768px) and (max-width: 991px)
{
	/** Bootstrap 4 MD window **/
	#gallery .img-frame {
		height: 8.75rem !important;
	}
}

@media only screen and (min-width: 992px) and (max-width: 1199px)
{
	/** Bootstrap 4 LG window **/
	#gallery .img-frame {
		height: 7.5rem !important;
	}
}

@media only screen and (min-width: 1200px)
{
	/** Bootstrap 4 XL window **/
	#gallery .img-frame {
		height: 8.5rem !important;
	}
}


/** Templated Media
@media only screen and (max-width: 575px)
{
	/** Bootstrap 4 XS window **
}

@media only screen and (min-width: 576px) and (max-width: 767px)
{
	/** Bootstrap 4 SM window **
}

@media only screen and (min-width: 768px) and (max-width: 991px)
{
	/** Bootstrap 4 MD window **
}

@media only screen and (min-width: 992px) and (max-width: 1199px)
{
	/** Bootstrap 4 LG window **
}

@media only screen and (min-width: 1200px)
{
	/** Bootstrap 4 XL window **
}
