/* CSS Document */
*{			box-sizing: border-box;
		}
		
		
		.gallery img{
			width: 100%;
			height:auto;
			background-color: aliceblue;
		}
		
		.des{
			padding: 15px;
			text-align: center;
			color: #1d1d1f;
			font-size:16px;
			font-weight: bold;
		}
		
		.responsive{
			padding: 0 6px;
			float: left;
			text-decoration: none;
			margin: 6px 0;
		}

	{
		margin: 0;
		padding: 0;
		box-sizing: border-box;
	}



	footer{
		background-color: #24262b;
		padding: 70px 0;
	}
	
	.certification{
		align-content: center;
		margin: auto;
		padding: auto;
	}

	.banner .familybanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}

	.banner .immigrationbanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}

	.banner .civillitigationbanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}

	.banner .personalinjurybanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}


	.banner .willsprobatebanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}

	.banner .firmbanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}

	.banner .contactbanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}
.banner .paperbanner img{
		align-content: center;
		width: 1366px;
		height: auto;
	}

.banner .feebanner img{
	align-content: center;
	width: 700px;
	height: auto;
}


.column {
	height: auto;
	flex:1 1 0px;
}

.fee_title {
	height: auto;
	flex:1 1 0px;
}



.footer-col {
	height: auto;
	flex:1 1 0px;
}


.contact-form{
	width:250px;
	margin:0 auto;
	padding: 1%;
	
}

.contact-us{
	background-color: #ececec;
	padding: 50px 10px;
	display: flex;
	width:80%;
	height:auto;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	border-radius: 10px;
	box-shadow: 0px 0px 10px 0px #666;
}

.contact-form2{
	padding: 0 10px;
	width:auto;
	height:auto;
	flex: 50%;
}

.contact-map{
	width:100%;
	height:auto;
	flex: 50%;
}

input[type=text], select, textarea{
	width: 100%;
	padding: 12px;
	boarder: 1px solid #ccc;
	border-radius: 5px;
	box-sizing: border-box;
	margin-top:6px;
	margin-bottom: 16px;
	resize: vertical;
}

input[type=submit]:hover{
	background-color: #0071e3;
	color:white;
	padding: 12px 20px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

input[type=submit]{
	background-color: #7CCE39;
	color:white;
	padding: 12px 20px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

.contact-form2 h3{
	text-align: center;
	padding-top: 15px;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #0071e3;
	font-size: 21px;
	font-weight: 500;	
	padding-left: 50px;
	padding-right: 50px;
}

.contact-map h3{
	text-align: center;
	padding-top: 15px;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #0071e3;
	font-size: 21px;
	font-weight: 500;	
	padding-left: 50px;
	padding-right: 50px;
}

.address h1{
	text-align: left;
	padding-top: 15px;
	padding-bottom: 10px;
	letter-spacing: 1px;
	color: #0071e3;
	font-size: 21px;
	font-weight: 550;	
	padding-left: 10px;
	padding-right: 50px;
}

.address p{
	text-align: justify;
	padding-bottom: 1px;
	letter-spacing: 1px;
	color: #1d1d1f;
	font-size: 15px;
	font-weight: 500;
	padding-left: 10px;
	padding-right: 50px;
}

.address h2{
	text-align: left;
	padding-bottom: 1px;
	letter-spacing: 1px;
	color: #0071e3;
	font-size: 17px;
	font-weight: 500;	
	padding-left: 10px;
	padding-right: 50px;
}

.address p2{
	text-align: left;
	padding-bottom: 1px;
	letter-spacing: 1px;
	color: #0071e3;
	font-size: 17px;
	font-weight: 500;	
	padding-left: 10px;
	padding-right: 50px;
}


.clearfix{
	clear:both;
	float:none;
}

.copyright{
	text-align: center;
	font-size: 13px;
	color: #bbbbbb;
	padding: 0;
	margin:0;
}

.container_two{
	max-width: 1170px;
	margin: auto;
	padding: 0;
	box-sizing: border-box;
}

.row{
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	align-content: center;
	padding-left: 30px;
}

ul{
	list-style: none;
}



.footer-col{
	width: auto;
}

footer p{
	font-size: 13px;
	color: #bbbbbb;
	text-align: center;

}

.footer-col h4{
	font-size: 18px;
	color: #ffffff;
	text-transform: none;
	text-align: left;
	margin-bottom: 35px;
	font-weight: 500;
	position: relative;
}

.footer-col h4::before{
	content: '';
	position: absolute;
	left: 0;
	bottom: -10px;
	background-color: #e91e63;
	height: 2px;
	box-sizing: border-box;
	width: 130px;
}

.footer-col ul li:not(:last-child){
	margin-bottom: 10px;
}

.footer-col ul li a{
	font-size: 11px;
	letter-spacing: 0.5px;
	text-transform: none;
	color: #ffffff;
	text-decoration: none;
	font-weight: 300;
	color: #bbbbbb;
	display: block;
	transitiion: all 0.3s ease;
	padding-right:60px;
}

.footer-col ul li a:hover{
	color: #ffffff;
	padding-left: 8px;
}

.footer-col .social-links a{
	display: inline-block;
	height: 40px;
	width: 40px;
	background-color: rgba (255,255,255,0.2);
	margin: 0 10px 10px 0;
	text-align: center;
	line-height: 40px;
	border-radius: 50%;
	color: #ffffff;
	transition: all 0.5s ease;
}

.footer-col .social-links a:hover{
	color: #24262b;
	background-color: #ffffff;
}


.grid-wrapper{
	text-align: center;
 	display: block;
}

.grid-container{
	list-style: none;
	display: block;
	width: 100%;
	
}
	
.grid-container:after {
	clear: both;	
}
	
.grid-container:after, .grid-item:before {
	clear: "";
	display: table;
}

.grid-container li{
	width: 200px;
	height:70px;
	display: inline-block;
	margin:20px;
}

.grid-item{
	width:100%;
	height:100%;
	position:relative;
	cursor:pointer;
	border-radius:10px;
	-webkit-transition:0.3s ease-in-out, -webkit-transition:0.3s ease-in-out;
	-moz-transition:0.3s ease-in-out, -moz-transition:0.3s ease-in-out; 
	transition:0.3s ease-in-out, transform 0.3s ease-in-out; 
}
	
.grid-item:hover{
	transform: scale(1.05);
	}



.grid-info{
	position: absolute;
	width:inherit;
	height: inherit;
}



body{
	margin: 0;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"
}


nav ul li a{
	text-decoration: none;
	color:#F9F9F9;
	background-color: #9A9494;
	display: block;
	text-align: center;
	padding: 10px 0 10px 0;
	margin-bottom: 5px;
}

nav ul li a:hover{
	background-color: #FF0000;
		
}

nav .current{
	background-color: #FF0000;
		
}

nav ul{
	list-style: none;
	padding-left: 0;
	padding-top: 0;
	margin-top: 0;
}




des{
	text-decoration: none;
}	

.banner{
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
}

.familybanner{
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
}
.banner video{
	position: sticky;
	top: 0;
	left: 0;
	object-fit: cover;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.logo-img h1{
	text-decoration-color: #1d1d1f;
	font-size: 37px;
	padding-top: 0px;
	padding-bottom: 5px;
	letter-spacing: 1px;
	font-weight: 700;
}

.logo-img h2{
	text-decoration-color: #1d1d1f;
	font-size: 27px;	
	padding-top: 0px;
	padding-bottom: 30px;
	letter-spacing: 1px;
	font-weight: 500;
}

.logo-img img {
    display: block;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 0px;
}

.column h1{
	text-align: left;
	padding-bottom: 10px;
	letter-spacing: 1px;
	color: #2E2E2E;
	font-size: 27px;
	font-weight: 550;	
}


.column p{
	text-align: justify;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #1d1d1f;
	font-size: 18px;
	font-weight: 500;

}

.wrapper{
		padding-left: 50px;
		padding-right: 50px;
		
	}

.wrapperbulletpoints{
	width: 90%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	grid-gap:20px;
	padding-left: 10px;
	letter-spacing: 1px;
	line-height:30px;
	text-decoration-color: darkgrey;
	font-size: 17px;
	padding-top: 5px;
}

.wrapperbulletpoints li:before{
	content: "\27b2";
	color: red;
	margin-right:20px;
}

.wrapperbulletpoints{
	height: auto;
	position: relative;
}

.firmtitle h1{
	text-align: left;
	padding-top: 15px;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #2E2E2E;
	font-size: 27px;
	font-weight: 550;	
	padding-left: 50px;
	padding-right: 50px;
}

.firmtitle p{
	text-align: justify;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #1d1d1f;
	font-size: 18px;
	font-weight: 500;
	padding-left: 50px;
	padding-right: 50px;
}

.one h1{
	text-align: left;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #2E2E2E;
	font-size: 27px;
	font-weight: 550;	
	padding-left: 50px;
	padding-right: 50px;
}

.one p{
	text-align: justify;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #1d1d1f;
	font-size: 18px;
	font-weight: 500;
	padding-left: 50px;
	padding-right: 50px;
}

.one p2{
	text-align: justify;
	padding-bottom: 50px;
	letter-spacing: 1px;
	color: #1d1d1f;
	font-size: 18px;
	font-weight: 550;
	padding-left: 50px;
	padding-right: 50px;
}

.two p{
	text-align: justify;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #1d1d1f;
	font-size: 18px;
	font-weight: 500;
	padding-left: 50px;
	padding-right: 50px;
}

.two h1{
	text-align: left;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #2E2E2E;
	font-size: 22px;
	font-weight: 530;
	padding-left: 50px;
	padding-right: 50px;
}

.bulletpoint_heading h1{
	padding-top: 15px;
	padding-bottom: 20px;
	letter-spacing: 1px;
	color: #1d1d1f;
	font-size: 27px;
	font-weight: 500;
}


.container_services{
	width: 100%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	grid-gap:20px;
	padding-left: auto;
	letter-spacing: 1px;
	line-height:50px;
	text-decoration-color: darkgrey;
	font-size: 18px;
	padding-top: 20px;
}

.container_services li:before{
	content: "\27b2";
	color: red;
	margin-right:20px;
}

.box{
	height: 180px;
	position: relative;
}

.bulletpoints{
	width: 90%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	grid-gap:20px;
	padding-left: 30px;
	letter-spacing: 1px;
	line-height:30px;
	text-decoration-color: darkgrey;
	font-size: 17px;
	padding-top: 10px;
}

.bulletpoints li:before{
	content: "\27b2";
	color: red;
	margin-right:20px;
}

.bulletpoints{
	height: auto;
	position: relative;
}


h1 {
	font-size: 21px;
	text-align: center;
	padding-top: 0px;
}

h2 {
	font-size: 18px;
    text-align: center;
	padding-top: 0px;
}

h3 {
    text-align: center;
	padding-top: 0px;
}

h4 {
    text-align: center;
	padding-top: 0px;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: yellow;
	opacity: 1; /* Firefox */
	text-align: center;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size: 15px;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: yellow;
	opacity: 1;
	text-align: center;
	text-align: center;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size:15px;
}

::-ms-input-placeholder { /* Microsoft Edge */
	color: yellow;
	opacity: 1;
	text-align: center;	
	text-align: center;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size: 15px;
}

.contact-us ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: dimgrey;
	opacity: 1; /* Firefox */
	
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	
}

.contact-us :-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: dimgrey;
	opacity: 1;

	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	
}

.contact-us ::-ms-input-placeholder { /* Microsoft Edge */
	color: dimgrey;
	opacity: 1;
	
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	
}


	
.logo{
	text-align: center;
	padding: 0 20px;
}


.container{
	padding: 0;
	text-align: center;
    background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/hotairballoon.jpg"); 
	background-size: cover;	
	background-position: centre;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-top: 0px;
	color: #FFF;
	text-transform: uppercase;
	transition: all 4s ease-in-out;
}

.container h1 {
	font-size: 27px;
	line-height: 90px;
}

.containerF{
	padding: 0;
	text-align: center;
    background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/cont_F.jpg"); 
	background-size: cover;	
	background-position: centre;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-top: 0px;
	color: #FFF;
	text-transform: uppercase;
	transition: all 4s ease-in-out
}

.containerF h1 {
	font-size: 27px;
	line-height: 90px;
}

.containerI{
	padding: 0;
	text-align: center;
    background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/cont_I.jpg"); 
	background-size: cover;	
	background-position: centre;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-top: 0px;
	color: #FFF;
	text-transform: uppercase;
	transition: all 4s ease-in-out
}

.containerI h1 {
	font-size: 27px;
	line-height: 90px;
}

.containerL{
	padding: 0;
	text-align: center;
    background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/cont_L.jpg"); 
	background-size: cover;	
	background-position: centre;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-top: 0px;
	color: #FFF;
	text-transform: uppercase;
	transition: all 4s ease-in-out
}

.containerL h1 {
	font-size: 27px;
	line-height: 90px;
}

.containerP{
	padding: 0;
	text-align: center;
    background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/cont_P.jpg"); 
	background-size: cover;	
	background-position: centre;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-top: 0px;
	color: #FFF;
	text-transform: uppercase;
	transition: all 4s ease-in-out
}

.containerP h1 {
	font-size: 27px;
	line-height: 90px;
}

.containerW{
	padding: 0;
	text-align: center;
    background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/cont_w.jpg"); 
	background-size: cover;	
	background-position: centre;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-top: 0px;
	color: #FFF;
	text-transform: uppercase;
	transition: all 4s ease-in-out
}

.containerW h1 {
	font-size: 27px;
	line-height: 90px;
}

.containerFi{
	padding: 0;
	text-align: center;
    background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/cont_Fi.jpg"); 
	background-size: cover;	
	background-position: centre;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-top: 0px;
	color: #FFF;
	text-transform: uppercase;
	transition: all 4s ease-in-out
}

.containerFi h1 {
	font-size: 27px;
	line-height: 90px;
}

.form {
	margin-top: 50px;
	transition: all 4s ease-in-out;
}

.form-control {
	width:auto;
	background: transparent;
	border: none;
	outline:none;
	border-bottom: 1px solid gray;
	color:#fff;
	font-size: 17px;
	margin-bottom: 16px;
}

input{
	height: 45px;
}

form .submit{
	background: #ff5722;
	border-color: transparent;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 2px;
	height:50px;
	margin-top: 18px;
}

form .submit:hover{
	background-color: #f44336;
	cursor: pointer;
}

image-grid {
	margin: .5vw;
	font-size: 0;
	display: -ms-flexbox;
	-ms-flexbox-wrap: wrap;
	-ms-flexbox-direction:column;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	display: -wekit-box;
	display: flex;
}

image-grid div {
	-webkit-box-flex: auto;
	-ms-flex: auto;
	flex:auto;
	width: 200px;
	margin: .5vw;
}

image-grid div img{
	width: 100%;
	height: auto;
}

.form-invalid{
	outline:1px solid red !important;
}

.content-table{
	border-collapse: collapse;
	margin:25px 0;
	font-size: 0.4cm;
	width:500px;
	border-radius: 5px 5px 0 0;
	overflow: hidden;
	box-shadow: 0 0 20px rgba(0,0,0,0.15);
}
.content-table th,
.content-table td{
	padding: 12px 15px;
}
.content-table tbody tr{
	border-bottom: 1px solid #dddddd;
}
.content-table tbody tr:nth-of-type(even){
	background-color: #f3f3f3;
}

.content-tabler tbody tr:last-of-type{
	border-bottom:2px solid #d30505;
}
.content-tabler tbody tr.active-row{
	font-weight:bold;
	color:#d30505;
}
.content-tabler th{
	background-color:#d30505;
	color:#ffffff;
	text-align:left;
	font-weight:bold;
}

.content-tableb tbody tr:last-of-type{
	border-bottom:2px solid #0b39c4;
}
.content-tableb tbody tr.active-row{
	font-weight:bold;
	color:#0b39c4;
}
.content-tableb th{
	background-color:#0b39c4;
	color:#ffffff;
	text-align:left;
	font-weight:bold;
}

.content-tablep tbody tr:last-of-type{
	border-bottom:2px solid #b70bc6;
}
.content-tablep tbody tr.active-row{
	font-weight:bold;
	color:#b70bc6;
}
.content-tablep th{
	background-color:#b70bc6;
	color:#ffffff;
	text-align:left;
	font-weight:bold;
}

.content-tableg tbody tr:last-of-type{
	border-bottom:2px solid #1fc50a;
}
.content-tableg tbody tr.active-row{
	font-weight:bold;
	color:#1fc50a;
}
.content-tableg th{
	background-color:#1fc50a;
	color:#ffffff;
	text-align:left;
	font-weight:bold;
}

.fixed-fee-1{
	padding-left:50px;
}

.container_three{
	width:auto;
	height:auto;
}

#left{
	width:50%;
	float:left;
	height:auto;
}

#right{
	width:50%;
	float:right;
	height:auto;
}


.fee_title h1{
	text-align: left;
	padding-top: 0px;
	padding-bottom: 0px;
	letter-spacing: 1px;
	font-size: 23px;
	font-weight: 545;	
	padding-left: 50px;
	padding-right: 50px;
}

.fee_titler h1{
	color: #d30505;
} 

.fee_titleb h1{
	color: #0b39c4;
} 

.fee_titlep h1{
	color: #b70bc6;
}
.fee_titleg h1{
	color: #1fc50a;
}

.fee_title p{
	text-align: justify;
	padding-top: 5px;
	padding-bottom: 0px;
	letter-spacing: 1px;
	line-height: 27px;
	font-size: 16px;
	font-weight: 500;	
	padding-left: 50px;
	padding-right: 50px;
}

.terms{
	text-align: justify;
	font-size: 11px;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 0px;
	margin-top: 0px;
	
}

.conditions p{
	text-align: left;
	font-size: 15px;
	padding-left: 50px;
	padding-right: 50px;
	padding-bottom: 20PX;
	
}

.conditions{
	width: 90%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	grid-gap:20px;
	padding-left: 30px;
	letter-spacing: 1px;
	line-height:30px;
	text-decoration-color: darkgrey;
	font-size: 15px;
	padding-top: 5px;
}

.conditions li:before{
	content: "\27b2";
	color: #b70bc6;
	margin-right:20px;
}

.conditions{
	height: auto;
	position: relative;
}

.costs{
	text-align:center;
}

.btn1{
  background: none;
  border: 2px solid #d30505;
  font-family: "montserrat",sans-serif;
  text-transform: uppercase;
  padding: 12px 20px;
  width: 270px;
  margin: 10px;
  cursor: pointer;
  transition: color 0.4s linear;
  position: relative;
}

.btn2{
  background: none;
  border: 2px solid #0b39c4;
  font-family: "montserrat",sans-serif;
  text-transform: uppercase;
  padding: 12px 20px;
  width: 270px;
  margin: 10px;
  cursor: pointer;
  transition: color 0.4s linear;
  position: relative;
}
.btn3{
	  background: none;
	  border: 2px solid #b70bc6;
	  font-family: "montserrat",sans-serif;
	  text-transform: uppercase;
	  padding: 12px 20px;
	  width: 270px;
	  margin: 10px;
	  cursor: pointer;
	  transition: color 0.4s linear;
	  position: relative;
}

.btn4{
	background: none;
	border: 2px solid #1fc50a;
	font-family: "montserrat",sans-serif;
	text-transform: uppercase;
	padding: 12px 20px;
	width: 270px;
	margin: 10px;
	cursor: pointer;
	transition: color 0.4s linear;
	position: relative;
}

.btn:hover{
  color: #fff;
}

.btn1::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #d30505;
  z-index: -1;
  transition: transform 0.5s;
  transform-origin: 0 0;
  transition-timing-function: cubic-bezier(0.5,1.6,0.4,0.7);
}

.btn2::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #0b39c4;
  z-index: -1;
  transition: transform 0.5s;
  transform-origin: 0 0;
  transition-timing-function: cubic-bezier(0.5,1.6,0.4,0.7);
}

.btn3::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #b70bc6;
  z-index: -1;
  transition: transform 0.5s;
  transform-origin: 0 0;
  transition-timing-function: cubic-bezier(0.5,1.6,0.4,0.7);
}

.btn4::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #1fc50a;
  z-index: -1;
  transition: transform 0.5s;
  transform-origin: 0 0;
  transition-timing-function: cubic-bezier(0.5,1.6,0.4,0.7);
}

.btn1::before{
  transform: scaleX(0);
}
.btn2::before{
  transform: scaleY(0);
}
.btn3::before{
  transform: scaleX(0);
}
.btn4::before{
  transform: scaleY(0);
}
.btn1:hover::before{
  transform: scaleX(1);
}
.btn2:hover::before{
  transform: scaleY(1);
}
.btn3:hover::before{
  transform: scaleX(1);
}
.btn4:hover::before{
  transform: scaleY(1);
}



.policy {
		padding: 0px 50px;
		text-align: justify;
		line-height: 25px;
	}

.policy h1{
	text-align: left;
	color:#4366bf;
	font-size: 21px;
}

.policy h2{
	text-align: left;
	color:#4366bf;  
	font-size: 18px;
}

.policy p{
	padding-bottom: 10px;
}

.points ol li{
	line-height: 30px; 
}

.tablep{
	font-size: 14px;
	align-content: flex-start;
}

.tablep td{
	vertical-align: text-top;
}

.tablep td p{
	padding: 0px;
	line-height: 10px;
}

}

/*Mobile Device*/

@media only screen and (min-width: 10px) and (max-width: 380px){
	
.responsive{
	width: 100%;
	margin: 6px 0;
}
		
.banner .familybanner img{
	width:380px;
}
.banner .immigrationbanner img{
	width:380px;
}
.banner .civillitigationbanner img{
	width:380px;
}
.banner .personalinjurybanner img{
	width:380px;
}
.banner .willsprobatebanner img{
	width:380px;
}
.banner .firmbanner img{
	width:380px;
}
.banner .contactbanner img{
	width:380px;
}	
.banner .paperbanner img{
	width:380px;
}
.banner .feebanner img{
	width:400px;
	padding-left: 20px;
}	
.coffee img{
	width:500px;	
}
.books img{
	width: 500px;
}
.fixed-fee-1{
	padding-left:1px;
}
.content-table{
	width:300px;
	padding-left: 1px;
	padding-right: 1px;
	margin: 0px auto;
}
.fee_title h1{
	padding-left: 1px;
	padding-right: 1px;
	text-align: center;
}
.fee_title p{
	padding-left: 1px;
	padding-right: 1px;
}
.condtions{
	padding-left: 0px;
	margin: 0px;
}
.foot-col{
	width: 100%;
	margin-bottom: 30px;
}
.footer-col ul li a{
	font-size: 11px;
	text-transform: inherit;
}
	
}


/*Tablet View*/
	
@media only screen and (min-width: 381px) and (max-width: 949px){
	
.responsive{
	width: 50%;
	margin: 6px 0;
}
.banner .familybanner img{
	width:700px;
}
.banner .immigrationbanner img{
	width:950px;
}
.banner .civillitigationbanner img{
	width:950px;
}
.banner .personalinjurybanner img{
	width:700px;
}
.banner .willsprobatebanner img{
	width:700px;
}
.banner .firmbanner img{
	width:950px;
}
.banner .contactbanner img{
	width:800px;
}
.banner .paperbanner img{
	width:950px;
}
.banner .feebanner img{
	width:500px;
	padding-left: 20px;
}
.coffee img{
	width: 300px;	
}
.books img{
	width: 300px;
}
.foot-col{
	width: 50%;
	margin-bottom: 30px;
}
.footer-col ul li a{
	font-size: 13px;
	text-transform: inherit;
}
#law{
	padding-top: 20px;
	padding-bottom: 10px;
 }
#SRA{
	padding-top: 20px;
	padding-bottom: 10px;
}
.nav_list:hover ~ .nav_droplist{
	max-height: inherit;
	opacity: 1;
	transition-delay: 0.25s;
}
.nav_droplist{
	list-style-type: none;
	padding: 0px;
	margin: 0px;
	max-height: 0px;
	opacity: 0;
	overflow: hidden;
}	
nav ul li.sub-menu:before{
	content: "\23F7";
	position:absolute;
	line-height: 50px;
	color:#fff;
	right:50px;
}
nav ul li ul li a{
	text-decoration: none;
	color:#F9F9F9;
	background-color:#4A464E;
	display: block;
	text-align: center;
	padding: 10px 0 10px 0;
	margin-bottom: 5px;
}
nav ul li.submenu:before{
	content: "\23F7";
	position:absolute;
	line-height: 50px;
	color:#fff;
	right:50px;
}
.fixed-fee-1{
	padding-left:1px;
}
.content-table{
	width:300px;
	padding-left: 1px;
	padding-right: 1px;
	margin: 0px auto;
}
.condtions{
	padding-left: 0px;
	margin: 0px;
}
.fee_title h1{
	padding-left: 1px;
	padding-right: 1px;
	text-align: center;
}
.fee_title p{
	padding-left: 1px;
	padding-right: 1px;
}
	
}


/*Desktop View*/
@media only screen and (min-width: 950px){
	
.responsive{
	width: 25%;
	margin: 6px 0;
}
header{
	position: sticky;
	width:100%;
	top:0;
}	
nav ul {
	display:flex;
}
nav ul li{
	flex: 1;
}
.banner .familybanner img{
	width:1366px;
}
.banner .immigrationbanner img{
	width:1366px;
}
	
.banner .civillitigationbanner img{
	width:1366px;
}
	
.banner .personalinjurybanner img{
	width:1366px;
}
.banner .willsprobatebanner img{
	width:1366px;
}
.banner .firmbanner img{
	width:1366px;
}
.banner .contactbanner img{
	width:1366px;
}
.coffee img{
	width: 400px;
}
.books img{
	width: 400px;
}
.foot-col{
	width: 25%;
	margin-bottom: 30px;
}
.footer-col ul li a{
	font-size: 15px;
	text-transform: inherit;
}
.wrapper{
	display: flex;
	flex-direction: row;
}
.row{
	display: flex;
	flex-direction: row;
}
.nav_droplist li{
	line-height:1rem;
}
.nav_droplist{
	width:7rem;
	display: block;
	position: absolute;
	border-top: 3px solid #eb3007;
	z-index:100;
	top:4rem;
	opacity: 0;
	visibility: hidden;
	transition: all 650ms ease;
}
.nav_droplist::before{
	content:"";
	position:absolute;
	top:-2.5rem;
	left:4rem;
	border:1.2rem solid transparent;
	border-bottom-color:#eb3007;
}
nav ul li:hover> .nav_droplist{
	opacity: 1;
	visibility: visible;
}
	
}

	
@media screen and (min-width: 768px) {	
.wrapper{
	display: flex;
}
.row{
	display: flex;
}

}