:root {
	--primary-blue: #1677CD;
	--secondary-blue: #4a78e4;
	--outline-blue : #8fbcff;
	--blue-hover: #3163da;
	--light-gray: #F8F9FA;
	--gray: hsl(220, 11%, 95%);
	--light-gray: #a5a7a8;
	--dark-gray: #41464b;
	--med-gray: #5c5f63;
	--light-blue: #aacdff;
}

/* Generic
*/
.Show {
	display: block !important;
}

.Hide {
	display: none !important;
}

.hidden {
	display: none;
}

.flip-horizontally {
	transform: scaleX(-1);
}

.pr-md-5 {
	padding-right: 0rem;
}

/* Text size
*/
h1, h2, h3, h4, p, li, a, span {
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	font-weight: 400 !important;
	line-height: 1.75rem;
}



.text-h1 {
	font-size: calc(2.2rem + 1.05vw);
}

.text-h2 {
	font-size: calc(1.3rem + 1.05vw);
}

.text-h3 {
	font-size: calc(1.275rem + 0.3vw);
}

.text-h4 {
	font-size: calc(1rem + 0.3vw);
}

.text-h5 {
	font-size: calc(0.85rem + 0.3vw);
}

.text-h6 {
	font-size: calc(0.7em + 0.3vw);
}

.blockquote-sm {
	font-size: calc(0.9rem + 0.3vw) !important;
}


/* Text Color
*/

.text-md-gray {
	color: var(--med-gray);
}

.text-light-gray {
	color: var(--light-gray);
}

/* Icons
*/
.icon-lg {
	font-size: 3rem;
}

.icon-md {
	font-size: 2rem;
}

.icon-sm {
	font-size: 1rem;
}

.icon-lg-hover:hover {
	color: var(--light-blue);
	cursor: pointer;
}

.icon-dark {
	color: #212529 !important;
}

.icon-dark:hover {
	color: var(--light-blue) !important;
	cursor: pointer;
}

/* Text & button color
*/
.text-primary {
	color: var(--primary-blue) !important;
}

.btn-primary {
	background-color: var(--primary-blue) !important;
	transition: background-color 0.2s;
}

.btn-outline-secondary:hover {
	background-color: var(--light-gray) !important;
	color: var(--dark-gray) !important;
	border-color: var(--dark-gray) !important;
}

/* Additional margins
*/
.mb-10 {
	margin-bottom: 6rem !important;
}

.mb-6 {
	margin-bottom: 4rem !important
}

/* Image carousel
*/
.carousel {
	width: 90%;
	height: auto;
	margin: 0 auto;
}

.carousel-item {
	cursor: pointer;
}

/* Individual images
*/
.about-image {
	height: auto;
	width: 100% !important;
	/* clip-path: inset(0% 0% 20% 0%); */
}

.attorney-image {
	height: auto;
	width: 50% !important;
}

/* Footer
*/
.footer-link {
	color: var(--light-blue);
}

.bg-dark-gray {
	background-color: var(--dark-gray) !important;
}

.success-footer {
	position: fixed;
	bottom: 0;
	width: 100%;
}

/*
Alert */
.alert {
	padding: 20px;
	background-color: #f44336;
	color: white;
	opacity: 1;
	transition: opacity 0.6s;
	margin-bottom: 15px;
  }
  
.alert.success {background-color: #04AA6D;}

.closebtn {
	margin-left: 15px;
	color: white;
	font-weight: bold;
	float: right;
	font-size: 22px;
	line-height: 20px;
	cursor: pointer;
	transition: 0.3s;
  }
  
  .closebtn:hover {
	color: black;
  }

/* Content menu side bar
*/
#sidebar-small {
	display: none;
}

.sub-nav:hover {
	background-color: var(--light-gray);
}

.sub-nav:hover .vertical-nav-line {
	background-color: var(--primary-blue) !important;
}

.vertical-nav-line {
	width: 0.2rem;
	height: 0.9rem;
	background-color: var(--dark-gray);
	display: inline-block;
}



#map {
	height: 18rem;
	width: 100%;
	border: 2px solid var(--dark-gray);
	border-radius: .5rem;
  }

.badge-icon {
	max-width: 100%;
	height: auto;
}

#registerCase {
	height: 6.7rem;
}

.mt--4 {
	margin-top: 1rem;
}

.flex-item {
	background-color: var(--gray);
	max-width: 12rem;
	max-height: 6rem;
	border-radius: .5rem;
	margin: 1rem;
	font-size: calc(0.7rem + 0.3vw);
	cursor: pointer;
	-webkit-box-shadow: 2px 3px 8px -6px #777;
	   -moz-box-shadow: 2px 3px 8px -6px #777;
	        box-shadow: 2px 3px 8px -6px #777;
}

.page-card {
	/* background-color: var(--gray); */
	max-height: 6rem;
	border-radius: .1rem;
	margin: 1rem;
	font-size: calc(0.7rem + 0.3vw);
	cursor: pointer;
	/* -webkit-box-shadow: 3px 4px 9px -7px #777;
	   -moz-box-shadow: 3px 4px 9px -7px #777;
	        box-shadow: 3px 4px 9px -7px #777; */
	-webkit-box-shadow: 2px 8px 8px -6px #777, 0px -1px 10px -6px #777;
	   -moz-box-shadow: 2px 8px 8px -6px #777, 0px -1px 10px -6px #777;
	        box-shadow: 2px 8px 8px -6px #777, 0px -1px 10px -6px #777;
}

.page-card:hover {
	/* -webkit-box-shadow: 6px 7px 10px -8px #777;
	   -moz-box-shadow: 6px 7px 10px -8px #777;
	        box-shadow: 6px 7px 10px -8px #777; */
			-webkit-box-shadow: 4px 8px 8px -6px #777, 0px -1px 10px -6px #777;
	   -moz-box-shadow: 4px 8px 8px -6px #777, 0px -1px 10px -6px #777;
	        box-shadow: 4px 8px 8px -6px #777, 0px -1px 10px -6px #777;
				
}

.logo-container {
	position: absolute;
	margin: 0 auto;
	background-color: white;
	min-width: 3rem;
	min-height: 3rem;
	border-bottom-left-radius: .25rem;
	border-bottom-right-radius: .25rem;
}

.blog-image {
	margin: 0.5rem 2rem 0.5rem 0.5rem;
	height: calc(4rem + 3vw);
	width: auto;
	padding-right: calc(var(--bs-gutter-x) * .5);
}

.blog-image-container {
	min-width: calc(120px + 5vw);
}

.blog-container {
	-webkit-box-shadow: 2px 8px 8px -6px #777, 0px -2px 10px -6px #777;
	   -moz-box-shadow: 2px 8px 8px -6px #777, 0px -2px 10px -6px #777;
	        box-shadow: 2px 8px 8px -6px #777, 0px -2px 10px -6px #777;
	border-radius: 0.5rem;
	cursor: pointer;
	position: relative;
	top: 0;
	transition: all ease 0.5s;
}
.blog-container:hover {
	transform: translateY(-5px);
	-webkit-box-shadow: 6px 9px 8px -6px #777, 0px -2px 10px -6px #777;
	   -moz-box-shadow: 6px 9px 8px -6px #777, 0px -2px 10px -6px #777;
	        box-shadow: 6px 9px 8px -6px #777, 0px -2px 10px -6px #777;
  }


.blog-type {
	font-size: calc(0.7em + 0.3vw);
	margin-bottom: 0.4rem;
}

.blog-title {
	font-size: calc(1rem + 0.3vw);
	margin-bottom: 0.5rem;
	font-weight: 500 !important;
}

.blog-desc {
	font-size: calc(0.7em + 0.3vw);
}

.blog-text {
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

.mt-6 {
	margin-top: 4rem !important;
}

.bold {
	font-weight: 600 !important;
}

.show-large {
	display: none !important;
}

.show-small {
	display: flex !important;
}

.show-if-small {
	display: block !important;
}
.show-lg {
	display: none !important;
}

.show-sm {
	display: block !important;
}

.small-icon {
	font-size: 1.5rem;
}

.large-icon {
	font-size: 1.5rem;
}

.carousel-border {
	-webkit-box-shadow: 1px 8px 8px -6px #777, -1px -3px 8px -6px #777;
	   -moz-box-shadow: 1px 8px 8px -6px #777, -1px -3px 8px -6px #777;
	        box-shadow: 1px 8px 8px -6px #777, -1px -3px 8px -6px #777;
}

.about-text-container {
	/* background-color: var(--gray); */
	padding: 1.5rem;
	border-radius: 0.5rem;
	line-height: 2.5rem !important;
}

/*
New Home Page
**********/

.background-image-container {
	position: relative;
	overflow: hidden;
}

.background-image {
	height: 350px;
	width: auto;
}

.homepage-content-container {
	position: absolute;
	top: calc(40% - calc(2.2rem + 1.05vw));
	left: 0;
	text-align: center;
	width: 100%;
}

.homepage-title {
	font-size: calc(1.8rem + 1.05vw);
	font-family: 'Cormorant Garamond', serif;
	color: white;
	font-weight: 600 !important;
}

.homepage-subtext {
	color: white;
	font-family: 'Cormorant Garamond', serif;
	font-weight: 300 !important;
	line-height: 1.2rem;
}

  .show-if-large {
	  display: none !important;
  }

  .btn-primary {
	  background-color: var(--secondary-blue) !important;
	  border-color: var(--secondary-blue) !important;
  }

  .btn-primary:hover {
	  background-color: var(--blue-hover) !important;
  }

  .effect {
	text-align: center;
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: #fff;
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	padding: 0.4rem;
	overflow: hidden;
	background-color: rgba(0, 0, 0, 0.2);
	border-style: none;
	border: 1px solid white;
	border-radius: 0.1rem;
	color: white !important
}
/* effect-5 styles */
.effect.effect-5 {
	transition: all 0.2s linear 0s;
}
.effect.effect-5:before {
	content: "\f054";
	font-family: FontAwesome;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	left: 0px;
	height: 100%;
	width: 30px;
	background-color: rgba(255, 255, 255, 0.3);
	border-radius: 0 50% 50% 0;
	transform: scale(0, 1);
	transform-origin: left center;
	transition: all 0.2s linear 0s;
}
.effect.effect-5:hover {
	text-indent: 30px;
}
.effect.effect-5:hover:before {
	transform: scale(1, 1);
	text-indent: 0;
}

.mt-25 {
	margin-top: 2.5rem;
}

.card {
	border-radius: 0.1rem !important;
}

.homepage-button-container {
	margin-top: 2rem;
}

.practice-area-title {
	color: white;
	position: relative;
	font-size: calc(1.6rem + 1.1vw);
	letter-spacing: 0.08em;
	text-align: center;
	font-weight: 300 !important;
	z-index: 99999;
}

.practice-area-image {
	background-repeat: no-repeat;
	background-position: right center;
	background-size: cover;
	min-height: 150px;
	margin-top: 1rem;
	margin-bottom: 1rem;
	border-radius: .2rem;
	z-index: 1;
	cursor: pointer;
	position: relative;
	top: 0;
	opacity: 1;
	transition: all ease 0.5s;
	-webkit-box-shadow: 4px 4px 9px -7px #777;
	   -moz-box-shadow: 4px 4px 9px -7px #777;
	        box-shadow: 4px 4px 9px -7px #777;
	
}

.practice-area-image:hover {
	opacity: 0.95;
	transform: translateY(-5px);
	-webkit-box-shadow: 9px 9px 9px -7px #777;
	   -moz-box-shadow: 9px 9px 9px -7px #777;
	        box-shadow: 9px 9px 9px -7px #777;

}



.criminal-defense-image-container {
	background-image: linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0, 0, 0, 0.2)), url("../assets/practice-area-images/criminal_defense_wide_bg.webp");
}

.student-services-image-container {
	background-image: linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0, 0, 0, 0.2)), url("../assets/practice-area-images/beer.webp");
	background-position: center;
}

.patents-image-container {
	background-image: linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0, 0, 0, 0.2)), url("../assets/practice-area-images/patent_wide_bg.webp");
}

.trademarks-image-container {
	background-image: linear-gradient(0deg, rgba(0,0,0,0.3), rgba(0, 0, 0, 0.3)), url("../assets/practice-area-images/question_mark3.webp");
	margin-bottom: 0rem;
	background-position: center center !important;
}

.container-lg-margin {
	max-width: 100% !important;
}

.avatar-4x3 {
	width: 4rem !important;
	margin-top: 0.5rem;
	height: auto;
}

.back-arrow-img {
	opacity: 0.8;
	height: 35px;
	width: 35px;
	position: absolute;
	transition: opacity ease 0.2s, height ease 0.2s, width ease 0.2s;
}

.back-arrow-img:hover {
	opacity: 1;
	height: 40px;
	width: 40px;
}

.footer-icon {
	font-size: 1.5rem;
}

.footer-icon:hover {
	color: #4267B2;
}

.grecaptcha-badge { opacity:0;}

.card-body {
	padding: 1rem 1rem 0.5rem 1rem !important;
}

.card-body-small {
	padding: 1rem 1rem 1rem 1rem !important;
}
/*
*/
/* Media Queries
*/
@media (min-width: 768px) {
	.mt-10 {
		margin-top: 6rem !important
	}

	.text-right-end {
		text-align: right !important;
	}

	.col-content {
		width: 80% !important;
	}

	.flex-item {
		max-width: 12rem;
	}

	.show-large {
		display: flex !important;
	}

	.show-small {
		display: none !important;
	}

	.show-if-large {
		display: block !important;
	}

	.background-image {
		height: auto;
		width: 100%;
		margin-left: 0;
	}

	.homepage-button-container {
		margin-top: 1rem;
	}

	.pr-md-5 {
		padding-right: 3rem;
	}

	.show-if-small {
		display: none !important;
	}

	.container-lg-margin {
		max-width: 768px !important;
	}
}

@media (min-width: 992px) {
	.sub-container {
		max-width: 960px;
	}

	.Hide {
		display: block !important;
	}

	.Show {
		display: none !important;
	}

	#sidebar-small { 
		display: none !important;
	}

	.text-h3 {
		font-size: 1.5rem;
	}

	.mt--4 {
		margin-top: calc(-4rem - 1.05vw) !important;
	}
	.mb--4 {
		margin-bottom: calc(-4rem - 1.05vw) !important;
	}

	.show-lg {
		display: flex !important;
	}

	.show-sm {
		display: none !important;
	}

	.homepage-title {
		font-size: calc(2.2rem + 1.05vw);
		text-align: center !important;
	}

	.homepage-button-container {
		margin-top: 1.5rem;
	}

	.container-lg-margin {
		max-width: 900px !important;
	}
}

@media (min-width: 1200px) {
	.homepage-button-container {
		margin-top: 2rem;
	}

	.container-lg-margin {
		max-width: 1000px !important;
	}
}

@media (min-width: 1400px) {
	.homepage-button-container {
		margin-top: 6rem;
	}

	.container-lg-margin {
		max-width: 1200px !important;
	}
}

/* Typed Animation 
*/
.typed_wrap {
	display: block;
	border: 4px solid #ecf0f1;
	width: 290px;
	height: auto;
	padding: 30px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}

.typed_wrap h1 {
	display: inline;
}

.typed::after {
	content: '|';
	display: inline;
	-webkit-animation: blink 0.7s infinite;
	-moz-animation: blink 0.7s infinite;
	animation: blink 0.7s infinite;
}

.typed-cursor{
   opacity: 0;
	display: none;
}

@keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}

/* Slider Animation
*/


/* Radio button 
*/

label.radio {
    cursor: pointer;
    min-width: 150px;
	max-width: 300px;
	width: 100%;
	position: relative;
}

label.radio input {
    position: absolute;
    /* visibility: hidden; */
	opacity: 0;
    pointer-events: none;
	top: 35%;
}

label.radio span {
    padding: 7px 14px;
    border: 1px solid #ced4da;
    display: inline-block;
    color: var(--secondary-blue);
    border-radius: .25rem;
    width: 100%;
    height: 48px;
    line-height: 32px !important;
}

label.radio span:hover {
    color: var(--blue-hover);
}

label.radio input:checked+span {
    border-color: var(--outline-blue);
    background-color: var(--secondary-blue);
    color: #fff;
    border-radius: .25rem;
    height: 48px;
    line-height: 32px !important;
}

.form-control {
    margin-top: 10px;
    height: 48px;
    border: 2px solid #eee;
    border-radius: 10px
}

.form-control:focus {
    box-shadow: none;
    border: 2px solid #039BE5
}

.agree-text {
    font-size: 12px
}

.terms {
    font-size: 12px;
    text-decoration: none;
    color: #039BE5
}

.confirm-button {
    height: 50px;
    border-radius: 10px
}

.review-container img {
	height: 16px;
}