/*Grey Concrete Textured Background */

.form-container {
	background-image: url('https://www.heavyhaulers.com/images/hh-label-icons/grey-concrete-bg.jpg');
	background-size: contain;
	background-position: center;
	box-shadow: 1px 1px 10px 1 rgba(0, 0, 0, 0.65);
}


/*White Text Shadow Bad Grudge Font */

.text-shadow-heading {
	font-size: 7em;
	font-family: badgrudge;
	text-shadow: 3px 3px 3px #fff;
	line-height: 75px;
}


/* Featured Transport Archive Scroll Table */

#first-table-header {
	width: 40%;
}

.table td {
	vertical-align: middle;
}

table img {
	border-radius: 5px;
	border: solid 3px black;
	width: 100%;
}

#broker-gradient {
	background: linear-gradient(135deg, #fde487 36%, rgba(0, 0, 0, 0.7542367288712359) 37%);
	border-radius: 7px;
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.65);
	border: solid 7px rgb(29, 29, 29);
	border-left: solid 10px;
	border-right: solid 10px;
	border-image: url(https://wordpress-471411-1479598.cloudwaysapps.com/wp-content/uploads/2021/03/border-image-testing-4.jpg) 20 round;
}

#button {
	width: 150px;
}



.pic-container {
	box-shadow: 3px 3px 10px 0px rgb(0 0 0 / 55%);
	border-bottom: 7px solid transparent;
	border-image: url(https://wordpress-471411-1479598.cloudwaysapps.com/wp-content/uploads/2021/03/border-image-testing-4.jpg) 20 round;
}

.card-img-overlay {
	background-color: rgba(0, 0, 0, 0.65);
	border-radius: 0px;
}

.sub-heading {
	font-size: 2em;
}

#heading {
	font-size: 6rem;
	line-height: 75px;
	font-family: badgrudge
}

.card {
	border: none;
	border-radius: 0px;
}

.heading {
	font-family: badgrudge;
	font-size: 4em;
}

.wrapper {
	display: table;
	height: 100%;
	width: 100%;
}

.container-fostrap {
	display: table-cell;
	padding: 1em;
	text-align: center;
	vertical-align: middle;
}

.fostrap-logo {
	width: 100px;
	margin-bottom: 15px
}

h1.heading {
	color: #fff;
	font-size: 1.15em;
	font-weight: 900;
	margin: 0 0 0.5em;
	color: #505050;
}


.brokerimage {
	width: 33%;
	border-radius: 50%;
	box-shadow: 0px 0px 5px 1px rgb(0 0 0 / 45%);
}

.card-content {
	padding: 15px;
	text-align: left;
}

.card-title {
	font-size: 2.0rem;
	line-height: 2.0rem;
	position: relative;
	margin-top: 0px;
	font-weight: 700;
}

.card-text {
	font-family: 'Yantramanav', sans-serif;
	color: #fff;
	font-size: 18px;
	line-height: 18px;
	font-weight: 400;
}

#shadow {
	-webkit-box-shadow: -1px 0px 11px 2px rgba(77, 77, 77, 0.46);
	-moz-box-shadow: -1px 0px 11px 2px rgba(77, 77, 77, 0.46);
	box-shadow: -1px 0px 11px 2px rgba(77, 77, 77, 0.46);
}

.carousel-control-next,
.carousel-control-prev {
	opacity: 1;
	width: 3%;
}

.img-thumbnail {
	padding: .05rem;
}

.img-thumbnail:hover {
    cursor: pointer;
}

.btn-dark {
	font-weight: bold;
	background-color: black;
}

#size {
	max-width: 150px;
	margin-bottom: 15px;
	filter: invert(1);
}

h1 a:hover {
    color: #fcc850;
}


ol li a:hover {
    color: #fcc850;
}



/* HH Logo Section with Negative Margin */

#vidrow {
	margin-top: -115px;
}

/* Blinking Test */
@keyframes blinker {
    50% {
      opacity: 0.4;
    }
  }

  .blink_me {
    animation: blinker 1.5s linear infinite;
  }


/*----------------------Media Queries------------------- */


/*Media Query: Max Width 450px */

@media (max-width: 450px) {
	.text-shadow-heading {
		font-size: 4.5em;
		line-height: 45px;
	}
	.card-title {
		font-size: 1.5rem;
		line-height: 1.5rem;
	}
	#size {
		max-width: 150px;
	}
	.brokerimage {
		width: 35%;
		border: 2px black;
	}
	.heading {
		font-family: badgrudge;
		font-size: 3em;
	}
	.sub-heading {
		font-size: 1.4em;
	}
	#heading {
		font-size: 3.25rem;
		line-height: 37px;
	}
	#broker-gradient {
		border-right: solid 5px rgb(29, 29, 29);
	}
}


/*Media Query: Max Width 786px */

@media only screen and (max-device-width: 768px) {
	#first-table-header {
		width: 1px;
	}
	.table td,
	.table th {
		padding: 0rem;
	}
	#second-table-cells {
		padding-left: 7px;
		padding-right: 7px;
		padding-top: 15px;
		padding-bottom: 15px;
	}
}


/*Media Query: Max Width 1200px */

@media screen and (min-width: 1200px) {
	#hhlogo {
		margin-bottom: -300px;
		max-width: 450px;
	}
}


/*Media Queries 450px - 1200px */

@media (min-width: 450px) and (max-width: 1200px) {
	#heading {
		font-size: 4rem;
		line-height: 45px;
	}
}


/*Media Queries 786px - 1000px */

@media screen and (min-width: 786px) and (max-width: 1000px) {
	h1 {
		font-size: 3.25em;
		margin: 0 0 0.3em;
	}
	.brokerimage {
		width: 25%;
		margin-top: 25px;
		border: 2px black;
	}
}