@charset "utf-8";
/* legalenglishtutoring.com 2023 */

/*html, body {
  height: 100%;
  margin-bottom: 1px;
  padding: 0;
}*/

/*

green #00c0aa
red #ff4433
footer #171717
about blue #0011a1
contact blue #01a5e3
txt 363636


*/

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Medium.woff2') format('woff2'),
        url('../fonts/Montserrat-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-MediumItalic.woff2') format('woff2'),
        url('../fonts/Montserrat-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Regular.woff2') format('woff2'),
        url('../fonts/Montserrat-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-ExtraBold.woff2') format('woff2'),
        url('../fonts/Montserrat-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}




html, body {
	padding:0;
	margin:0;
}

a {
	color:#fff;
	text-decoration:underline;
}

a:hover, a:active {
	color:#444;
	text-decoration: underline;
}

a:visited {
	color:#fff;
}

a:focus {
	outline: none;
}

* {
    box-sizing: border-box;
}

a:hover img {
	opacity:0.8;
}

img {
	border:0;
}

a img {
	border:0;
}


.style01 {
}

.clearboth {
	display:block;
	clear:both;
}

p, form {
	/*font-size: 1.2em;*/
}


.formfield {
	border:none;
	background:#eee;
	width:100%;
	margin: 0 0 1em 0;
	padding: .4em .6em;
}

.formbutton {
	font-size:1em;
	letter-spacing:.1em;
	border:none;
	background:#000;
	width:auto;
	color:#fff;
	padding:.8em 1.2em;
	margin:2% 0;
}

.formbutton:hover {
	background:#333;
}

.placeholder { 
	font-family:sans-serif;
	font-size:1em;
	color:#222;
}

::-webkit-input-placeholder {
	font-family:sans-serif;
	font-size:1em;
	color:#222;
}

:-moz-placeholder { /* Firefox 18- */
	font-family:sans-serif;
	font-size:1em;
	color:#222;
}

::-moz-placeholder {  /* Firefox 19+ */
	font-family:sans-serif;
	font-size:1em;
	color:#222;
}

:-ms-input-placeholder {
	font-family:sans-serif;
	font-size:1em;
	color:#222;
}

.uppercase {
	text-transform: uppercase;
}

.vertalign {
	position: relative;
	top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.img100 {
	width:100%;
}

.img30 {
	width:30%;
	height:auto;
}

.img30c {
	display: block;
	width:30%;
	height:auto;
	margin: 0 auto;
}

.img30l {
	float: left;
	width: 30%;
	margin: 0 2em 1em 0;
}

.trailerplayer {
	margin:0 auto;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
	height: 0;
	overflow: hidden;
	text-align:center;
}
 
.trailerplayer iframe,
.trailerplayer object,
.trailerplayer embed {
	text-align:center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	margin:0;
	background:none;
	border:none;
}

/* Mobile Layout: 480px and below. */

body {
	font-family: 'Montserrat', Helvetica, Arial, "sans-serif";
	color:#363636;
	font-weight: 500;
	background: #fff;
	font-size: calc(18px + (24 - 18) * ((100vw - 400px) / (2000 - 400)));
	
	/*filter:grayscale();*/
}

/*#LayoutDiv1 {
	width: 50%;
	background:rgba(57,51,255,1.00);	
}
*/
.gridContainer {
}

.break-mob {
	display:inline;
}

#LayoutDiv1 {
	float: none;
	width:100%;
	margin:0 auto;
	background: #fff;
}

.showdt {
	display:none;
}

header {
	position: relative;
	top:0;
	left: 0;
	width:100%;
	margin: 0;
	padding: 1em 5% 3em 5%;
	background: #333;
	z-index: 9999;
}

.home header {
	position: absolute;
}

header h1 {
	margin: 0;
	color:#fff;
	font-size: 1.2em;
	text-transform: uppercase;
	line-height: 100%;
}

header h1 small {
	font-weight:normal;
	font-size:.8em;
	text-transform: none;
}


.pagetitle {
	font-size: 1.4em;
	margin: 1.4em 0 0 0;
	color:#fff;
	text-align: center;
}

.showmenu {
	position:absolute;
	top:1em;
	right:5%;
	width:2em;
	height:auto;
	z-index:98;
}

.showmenu img {
	width:100%;
}

nav {
	display: none;
	position: absolute;
	top:4em;
	right: 5%;
	padding: 1em 2em 0 2em;
	background: #f2f2f2;
	text-align: right;

}

nav ul {

}

nav ul li {
	margin: 0 0 2em 0;
}

nav ul li a, nav ul li a:visited {
	color:#000;
	text-decoration: none;

}

nav ul li a:visited {
}


main {
	width:90%;
	max-width: 500px;
	min-height: 70vh;
	margin: 2em auto;
}

.about main p {
	line-height: 180%;
}


/* home */

.home header {
	background: none;
}

.home header h2 {
	display: none;
}

.home main {
	width:100%;
	max-width: none;
	margin:0;
	padding: 0;
}

.homebox1 {
	position: relative;
	float: left;
	width: 100%;
	height: 100vh;
	margin: 0;
	padding: 0;
	/*background: #333;*/
	background: #00c0aa;
	color:#fff;
	z-index: 20;
}

.hb_cont {
	width: 90%;
	max-width: 500px;
	margin: 0 auto;
}

.hb_cont h3 {
	text-align: center;
	font-size: 1.6em;
	margin: 0 0 1em 0;
}

.hb_cont h3 b {
	font-weight: 500;
}

.hb_scroll {
	position: absolute;
	bottom:0;
	width: 100%;
	padding: 1em;
	text-align: center;
	color: #fff;
}

.hb_scroll img {
	width: 1.4em;
}

.scroll_up img {
	transform: rotate(180deg);
}

.hb_scroll span {
	display: none;
}

.hb_scroll:hover, .hb_scroll:visited {
	color:#fff;
	text-decoration: none;
}

.hb_scroll:hover > img {
	display: none !important;
}

.hb_scroll:hover > span {
	display: block !important;
}

.homebox2 {
	position: relative;
	float: left;
	width: 100%;
	height: 100vh;
	margin: 0;
	padding: 0;
	background: #c64438;
	color:#fff;
	z-index: 30;
}

.homebox2 p {
	/*text-indent: 2em;*/
}

.list1 li {
	font-size: .9em;
	margin: 0 0 0 1em;
}

.list1 li:last-child {
	list-style: none;
	margin: 0 2em 0 2.5em;
}



footer {
	padding: 2em 0 4em 5%;
	color:#fff;
	font-size: .8em;
	background: #171717;
}

footer a, footer a:visited {
	color:#fff;
	text-decoration: underline;
}

h1 {
	font-size: 1.1em;
	color:#fff;
}

h2 {
	font-size: 1em;
}


.inner p {

}

.about header {
	background: #0011a1;
}

.contact header {
	background: #01a5e3;
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {
.gridContainer {

}
#LayoutDiv1 {
	
}
}

/* Desktop Layout: 769px and up.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {

body {
	
}

.gridContainer {

}

#LayoutDiv1 {
	position: relative;
	font-size:1em;
	width:100%;
	margin:0 auto;
}


.showmob, .showmenu {
	display:none;
}

.break-mob, .showdt {
	display:inline;
}

.imgfull img {
	width:100%;
	height:100%;
}

header {
	position: relative;
	padding: .5em 4%;
	height: 50vh;
}

header h1 {
	margin: 1em 0 0 0;
	font-size: 1em;
	line-height: 100%;
}

header h1 small {
	font-size:.81em;
}

.pagetitle {
	position: absolute;
	top:40%;
	width: 92%;
	margin: .8em 0 0 0;
	color:#fff;
	text-align: center;
	font-size: 2.4em;
}

nav {
	display: block;
	top:1.6em;
	right:4%;
	padding:0;
	float:right;
	background:none;
	text-align:left;
}

nav ul {
	margin:0 auto;
	padding:0;
}

nav ul li {
	display: inline-block;
	margin:0 0 0 2em;
	padding:0;
	color: #fff;
	text-transform: uppercase;
	font-size: .7em;
	letter-spacing: .3em;
	font-weight: bold;
}

nav ul li a:hover {
	text-decoration: none;
	filter:opacity(.7);
}

nav ul li a, nav ul li a:visited {
	text-decoration: none;
	color: #fff;
}

.hb_cont {
	width: 90%;
	max-width: 760px;
	margin: 0 auto;
}

p {

}

main {
	max-width: 760px;
}

/* home */

.hb_cont h3 {
	text-align: left;
	font-size: 2em;
	margin: 0 0 1em 0;
}

.list1 li {
	font-size: 1em;
	margin: 0 0 0 4em;
}

.list1 li:last-child {
	list-style: none;
	margin: 0 2em 0 5em;
}


footer {
	padding: 4em 4%;
}

/* about */

.about p {
	font-size: .8em;	
}


}