@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Averia+Serif+Libre:wght@400;700&family=Lato:ital,wght@0,400;0,700;1,700&family=Paprika&family=Philosopher:ital,wght@0,400;1,700&display=swap'); 

/* CSS Document */


body {background-image:url(/images/mp_bg2020.jpg); background-size:100% auto; background-repeat:repeat-y; margin:0; padding:0; font-size:110%; text-align:center; color:#333;}
html {margin:0; font-family: Lato, Geneva, Arial, Helvetica, SunSans-Regular, sans-serif;   }
img {max-width: 100%; height: auto; border:0; }
img:hover {border:1px; }
* {box-sizing: border-box;}
table {line-height:1.2em; padding:2px; }
form {width:95%; margin:8px auto; border-radius:12px; border:inset #90F; }
input[type=submit] {max-width:90%; text-align:center;}
iframe {border:none; border-radius:12px; border:inset #90F; }
button {padding: 1px; border:1px inset #309; border-radius:8px; background-color:rgba(255,255,255,0.5); display:inline; vertical-align:middle; }
button:hover { background-color:transparent; color:#609; }



h1, h2, h3, h4, h5 { font-family: Philosopher, "Averia Serif Libre", Geneva, sans-serif; font-weight: bold; text-align: center; padding-top: 4px; }
h1 {font-size: 26px; color:#000; }
h2    { font-size: 24px; color: #609; }
h3   { font-size: 22px; color: #009;  }
h4  { font-size: 20px; color: #800; }
@media only screen and (max-width: 800px) { h1 {font-size: 125%; color:#000; } }
@media only screen and (max-width: 800px) { h2 {font-size: 120%; color:#609; } }
@media only screen and (max-width: 800px) { h3 {font-size: 115%; color:#009; } }
@media only screen and (max-width: 800px) { h4 {font-size: 115%; color:#800; } }
.main h1 {font-size: 26px; color:#000; }
.main h2    { font-size: 24px; color: #609; }
.main h3   { font-size: 22px; color: #009;  }
.main h4  { font-size: 20px; color: #800; }
@media only screen and (max-width: 800px) { .main h1, .main h2 {font-size: 125%; color:#000; } }
@media only screen and (max-width: 800px) { .main h3, .main h4 {font-size: 115%; color:#000; } }

p, .main p {padding-left:8px; padding-right:8px; color:#333; font-size:110%;}
li, ul, ol, .main li, .main ul .main ol { font-size: 100%; margin-top: 0; color:#333; text-align:left; }
a:link { color: #00c; font-weight: bold; text-decoration: underline; }
a:visited { color: #000099; font-weight: bold; text-decoration: underline; }
a:hover { color: #609; font-weight: bold; text-decoration: none;  }
a:active { color: #333; font-weight: bold; text-decoration: underline;}

.main a:link { color: #00c; font-weight: bold; text-decoration: underline; }
.main a:visited { color: #000099; font-weight: bold; text-decoration: underline; }
.main a:hover { color: #609; font-weight: bold; text-decoration: none;  }
.main a:active { color: #333; font-weight: bold; text-decoration: underline;}

#hdr { margin:0;  padding:8px;  z-index:5; position:fixed; top:0; left:0; width:100%; height:auto; border-top:inset medium #009; background-image:linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.6)); border-radius:8px; } 
@media only screen and (max-width: 600px) { #hdr { padding:4px 4px 0 4px;  } }
#hdr:hover { background-image:linear-gradient(rgba(255,255,255,1.0), rgba(255,255,255,0.8)); }
.hdrscrl { background-image:linear-gradient(rgba(255,255,255,1.0), rgba(255,255,255,0.8)); }
#hdr h2 { color: #000; margin: 0; padding: 8px;  font-size: 26px; font-weight: bold; text-align: center; }
#hdr h3 { color: #000; margin: 0; padding: 8px;  font-size: 100%; font-weight: bold; text-align: left; }
@media only screen and (max-width: 800px) { #hdr h2{ margin: 0; padding: 2px;  font-size: 100%;  }}
@media only screen and (max-width: 800px) { #hdr h3 { margin: 0; padding: 4px;  font-size: 80%;  }}
#hdr p { color:#000; font-size:80%; }
#hdr img {padding: 2px; border:0;}	
#hdr .floatlft50 {width:68%; float:left; }
@media only screen and (min-width:551px) and (max-width: 800px) { #hdr .floatlft50 {width:82%; }  }
@media only screen and (max-width: 550px) { #hdr .floatlft50 {width:83%; }  }
#hdr .floatrt25 {width:19%; float:right; }
@media only screen and (max-width: 550px) { #hdr .floatrt25 {max-width:14%; }  }
@media only screen and (min-width: 1100px) {#hdr .margins0 {margin-top:8pt!important; padding:0; } }
.margins00 {margin-top:0!important; padding:0!important; }

#hdrfb { background: #ffffff;	padding: 0 10px;  	width:100%;} 
.imghdr {width:94px; height:96px; float:left; }
@media only screen and (min-width: 601px) and (max-width: 800px) { .imghdr {width:71px; height:72px; float:left; }  }
@media only screen and (max-width: 600px) { .imghdr {width:56px; height:55px; float:left; }  }
.imgicon {padding:0; margin:0; float:left; }
@media only screen and (max-width: 800px) { .imgicon {width:42px; height:42px; float:left; }  }

#top {position:fixed; right:0; bottom:0; z-index:8; width:48px; height:48px; padding:6px; border:none; }

#cent { max-width: 1440px; width: 97%; background:transparent; margin: 0 auto; padding:0; text-align: center; } 
#cent_hdr { max-width: 1440px; width: 97%; background:transparent; margin: 0 auto; padding:0; text-align: center; opacity:1.0!important; z-index:7; } 
#cent_ftr { max-width: 1440px; width: 97%; background:transparent; margin: 0 auto; padding:0; text-align: center; opacity:1.0; } 

#contdrop  { width: 100%; background:transparent; margin:144px 0 0 0; padding: 0; border:none; text-align: left; }
@media only screen and (max-width: 800px) { #contdrop { width: 100%; background:transparent; margin:72px 0 0 0; padding: 0; border:none; text-align: left; } }
#container { width: 100%; background:transparent; margin:0 auto; padding: 0; border:none; text-align: left; }
#container li {margin-left:8px; }
@media only screen and (max-width: 800px) {#container li {margin-left:4px; } }

.slide {position: relative; height:100vh; width:100%; z-index:0; }
.slide h1, h2, h3, h4, p, li {color:#fff; }
.slide a:link {color:#fff; }
.slide a:visited {color:#fff; }
.slide a:hover {color:#fff; }
.slide a:active {color:#fff; }

.desc, .desc h2, .desc h1, .desc a {font-size: 60px; line-height:1em; font-family:"Averia Serif Libre", Philosopher, Geneva, sans-serif; font-weight: bold; text-align:left; position: absolute; top: 20%; left:12%; width:80%; color: white!important; text-shadow: 0 3px 3px #333; z-index:5; background-color:transparent; }
@media only screen and (min-width:801px) and (max-width: 1080px) { .desc, .desc h2, .desc h1 {font-size: 42px; line-height:1em; position: absolute; top: 15%; left:10%; width:85%; }  }
@media only screen and (max-width: 800px) { .desc, .desc h2, .desc h1 {font-size: 125%; position: absolute; top: 15%; left:5%; width:93%; }  }

.desc2 {position: absolute; right:18%; top:45%; color: white!important; z-index:5; background-image:linear-gradient(rgba(0,0,0,0.8), rgba(102,0,204,0.8)); width:38.57%; padding:10px; border-radius:8px; text-align:center; height:auto;  }
.desc2 p {font-size: 120%; line-height:1.5em; color: white!important; text-shadow: 0 3px 3px #333; z-index:6;     }

@media only screen and (max-width: 800px) { .desc2 { position: absolute; right:0; top:35%; color: white!important; z-index:5; background-image:linear-gradient(rgba(0,0,0,0.8), rgba(102,0,204,0.8)); padding:4px; border-radius:8px; width:100%; height:auto;  }  }
@media only screen and (max-width: 800px) { .desc2 p {font-size: 100%; line-height:1.5em; color: white!important; text-shadow: 0 3px 3px #333; z-index:6;  } }

.desc3 {font-size: 120%; position: absolute; right:8%; top:45%; color: white!important; text-shadow: 0 3px 3px #333; z-index:5; background-image:linear-gradient(rgba(0,0,0,0.7), rgba(102,0,204,0.7)); width:61.43%; line-height:1.5em;   padding:10px; border-radius:8px; text-align:left; }
@media only screen and (max-width: 800px) { .desc3 {font-size: 100%; position: absolute; right:0; top:30%; width:100%; padding:4px; }  }

.desc4 {font-size: 120%; position: absolute; right:8%; top:45%; color: white!important; text-shadow: 0 3px 3px #333; z-index:5; background-image:linear-gradient(rgba(0,0,0,0.7), rgba(102,0,204,0.7)); width:88%; line-height:1.5em;   padding:10px; border-radius:8px; text-align:left; }
@media only screen and (max-width: 800px) { .desc4 {font-size: 100%; position: absolute; right:0; top:30%; width:100%; padding:4px;  }  }

.bgimg-1, .bgimg-2, .bgimg-3, .bgimg-4, .bgimg-5, .bgimg-5t, .bgimg-6 {opacity: 1.0; background-attachment: fixed;   background-position: center; background-repeat: no-repeat; background-size: cover; border-bottom:.1px thin #003; }
@media only screen and (max-width: 800px) { .bgimg-1, .bgimg-2, .bgimg-3, .bgimg-4, .bgimg-5 {background-attachment:scroll; background-size:cover; height:100vh; width:auto;  } }

@media only screen and (max-width: 800px) { .bgimg-5t {background-attachment:scroll; background-size:cover; width:auto;  } }


.bgimg-1 { background-image: url("/images/MP_1920_IndependenceRock_GJ.png"); min-height: 100%; }
@media only screen and (max-width: 800px) {.bgimg-1 { background-image: url("/images/MP_1920_v_IndependenceRock_GJ.png"); height: 100vh; width:auto; } }

.bgimg-2 { background-image: url("/images/MP_1920_LandsEnd.png"); min-height: 400px; }
@media only screen and (max-width: 800px) {.bgimg-2 { background-image: url("/images/MP_1920_v_LandsEnd.png"); height: 100vh;  width:auto; } }

.bgimg-3 { background-image: url("/images/MP_1920_Redwoods_Bridge_Heart.png"); min-height: 400px; }
@media only screen and (max-width: 800px) {.bgimg-3 { background-image: url("/images/MP_1920_v_Redwoods_Bridge_Heart.png"); height: 100vh;   width:auto; } }

.bgimg-4 { background-image: url("/images/MP_1920_ocean.png"); min-height: 100%; }
@media only screen and (max-width: 800px) {.bgimg-4 { background-image: url("/images/MP_1920_v_ocean.png"); height: 100vh;  width:auto; } }

.bgimg-5 { background-image: url("/images/MP_1920_office_building_reflection.png"); min-height: 100%; }
@media only screen and (max-width: 800px) {.bgimg-5 { background-image: url("/images/MP_1920_v.office_building_reflection.png"); height: 100vh;  width:auto; } }
.bgimg-5t { background-image: url("/images/MP_1920_office_building_reflection.png"); min-height: 100%; }
@media only screen and (max-width: 800px) {.bgimg-5t { background-image: url("/images/MP_1920_v.office_building_reflection.png"); } }

.bgimg-6 { background-image: url("/images/MP_1920_Windmill.png"); min-height: 100%; }
@media only screen and (max-width: 800px) {.bgimg-6 { background-image: url("/images/MP_1920_v_Windmill.png"); height: 100vh;  width:auto; } }


.screen50 {width:100%; background-color:rgba(255,255,255,0.75); height:auto; padding:10%; text-align:center; display: inline-block; position:absolute; vertical-align: middle; }

#container2 { width: 100%; background-image:url(/images/lol_pursm.jpg); margin: 0 auto; padding:0; background:#93C;	border: 1px solid #e2d6ea; text-align: left; }
#container3 { width: 100%; background:transparent; margin:0 auto; padding: 0; border:none; text-align: left; }


#container50 {width:47%; display:block; background-image:url(/images/LM_Logo_Brand_bg_white_10.png); float:left; padding:8px; margin:8px 1.5% 8px 1.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (max-width: 800px) { #container50 {width:100%; display:block; background-image:url(/images/LM_Logo_Brand_bg_white_10.png); float:none; padding:8px; margin:8px; border:inset 2px #90F; border-radius: 8px; }   }
#container50_2 {width:47%; display:block; background-image:url(/images/LM_Logo_Brand_bg_white_10.png); float:left; padding:8px; margin:8px 1.5% 8px 1.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (max-width: 800px) { #container50_2 {width:100%; display:block; background-image:url(/images/LM_Logo_Brand_bg_white_10.png); float:none; padding:8px; margin:8px; border:inset 2px #90F; border-radius: 8px; }   }

.container50 {width:47%; display:block; background-image:url(/images/LM_Logo_Brand_bg_white_10.png); float:left; padding:8px; margin:8px 1.5% 8px 1.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (max-width: 800px) { .container50 {width:100%; display:block; background-image:url(/images/LM_Logo_Brand_bg_white_10.png); float:none; padding:8px; margin:8px; border:inset 2px #90F; border-radius: 8px; }   }

#container50clr {width:47%; display:block; float:left; padding:8px; margin:8px 1.5% 8px 1.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (max-width: 800px) { #container50clr {width:100%; display:block; float:none; padding:8px; margin:8px; border:inset 2px #90F; border-radius: 8px; }  }
#container50clr2 {width:47%; display:block; float:left; padding:8px; margin:8px 1.5% 8px 1.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (max-width: 800px) { #container50clr2 {width:100%; display:block; float:none; padding:8px; margin:8px; border:inset 2px #90F; border-radius: 8px; }  }

.container50clr {width:47%; display:block; float:left; padding:8px; margin:4px 8px; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (max-width: 800px) { .container50clr {width:100%; display:block; float:none; padding:8px; margin:4px 8px; border:inset 2px #90F; border-radius: 8px; }  }

#container33 {width:32%; display:block; float:left; padding:8px; margin:.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (min-width:801px) and (max-width: 1216px) { #container33 {width:32%; display:block; float:left; padding:8px; margin:4px; border:inset 1px #90F; border-radius: 8px; } }
@media only screen and (max-width: 800px) { #container33 {width:100%; display:block; float:none; padding:8px; margin:4px; border:inset 1px #90F; border-radius: 8px; }  }

#container33_2 {width:32%; display:block; float:left; padding:8px; margin:.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (min-width:801px) and (max-width: 1216px) { #container33_2 {width:32%; display:block; float:left; padding:8px; margin:4px; border:inset 1px #90F; border-radius: 8px; } }
@media only screen and (max-width: 800px) { #container33_2 {width:100%; display:block; float:none; padding:8px; margin:4px; border:inset 1px #90F; border-radius: 8px; }  }

#container33_3 {width:32%; display:block; float:left; padding:8px; margin:.5%; border:inset 2px #90F; border-radius: 8px; }
@media only screen and (min-width:801px) and (max-width: 1216px) { #container33_3 {width:32%; display:block; float:left; padding:8px; margin:4px; border:inset 1px #90F; border-radius: 8px; } }
@media only screen and (max-width: 800px) { #container33_3 {width:100%; display:block; float:none; padding:8px; margin:4px; border:inset 1px #90F; border-radius: 8px; }  }




#call2action { margin: 10px auto; padding: 10px; background-color:rgba(0,0,102,0.4); width:68.57%; background-image: linear-gradient(to bottom, white, rgba(0,0,102,0.4)); border: inset 2px #990000; border-radius:12px; } 
@media only screen and (max-width: 800px) { #call2action { width:100%; }  }
#call2action1 { margin: 10px auto; padding: 10px; background-color:rgba(0,0,102,0.6); width:80%; background-image: linear-gradient(to bottom, white, rgba(0,0,102,0.6)); border: inset 2px #990000; border-radius:12px;} 
@media only screen and (max-width: 800px) { #call2action1 { width:100%; }  }
.call2action100 { margin: 12px 0 12px 0; padding: 4px; text-align:center;  background-color:rgba(204,204,255,1.0); width:100%; background-image: linear-gradient(to bottom, white, rgba(204,204,255,1.0)); border: inset 2px #990000; border-radius:12px; } 
.call2_det { margin: 0; padding: 0; background-color:rgba(0,0,102,0.1); width:100%; background-image: linear-gradient(to bottom, white, rgba(0,0,102,0.1)); border-bottom: inset 1px #990000; border-radius:12px; } 
.call2action { margin: 10px auto; padding: 10px; background-color:rgba(0,0,102,0.4); width:68.57%; background-image: linear-gradient(to bottom, white, rgba(0,0,102,0.4)); border: inset 2px #990000; border-radius:12px; } 
@media only screen and (max-width: 800px) { .call2action { width:100%; }  }
.call2action1 { margin: 10px auto; padding: 10px; background-color:rgba(0,0,102,0.4); width:100%; background-image: linear-gradient(to bottom, white, rgba(0,0,102,0.4)); border: inset 2px #990000; border-radius:12px;} 

#reelflt {float:left; width:450px; height:253px; margin:10px auto; padding:10px; max-width:100%;  }
@media only screen and (max-width: 600px) { #reelflt {float:none; width:320px!important; height:180px; margin:0 auto; max-width:100%; padding:0; }  }
#myreel{ border:2px solid #660397; border-radius:12px; max-width:100%; margin:0 auto;; }
.paginate{width: 450px; margin:0 auto;; font:bold 12px; text-align:center; padding-bottom:10px; max-width:100%; }
@media only screen and (max-width: 600px) { .paginate{width:100%; margin:0 auto;; font:bold 12px; text-align:center; padding-bottom:10px; }  }

#sidebar4 {	float: left; width: 360px; max-width:100%; background: #93c; background-image:url(/images/lol_pursm.jpg); padding: 8px; margin: 0 12px 0 4px; }
@media only screen and (min-width:601px) and (max-width: 1200px) { #sidebar4 { width:32%; } }
@media only screen and (max-width: 600px) { #sidebar4 {	background: #93c; background-image:url(/images/lol_pursm.jpg); padding: 8px; margin: 0px; float:none; width:100%; }   }
#sidebar4 li {margin-left:2px; }

#sidebarfrm { float: left; 	width: 30%; background: #99cccc; padding: 5px 10px 5px 10px; text-align:right; margin: 0 12px 0 0; }
@media only screen and (max-width: 600px) { #sidebarfrm { float: none; width:100%; background: #99cccc; padding: 5px 10px 5px 10px; text-align:left; margin: 0; }  }
#mainContentfrm { margin: 0px; 	padding: 5px 10px 5px 10px; width:65%; background-color:#FFF; float:left; border-bottom:inset 3px #e2d6ea; }
@media only screen and (max-width: 600px) { #mainContentfrm { width:100%; margin: 0px; padding: 5px 10px 5px 10px; background-color:#fff; float:none; }   }

#mainContent { width:100%; margin: 0px; padding:10px; background-color:#FFF; } 
#mainContent p {padding: 0 8px 0 18px; margin: 0 8px; }
#mainContent2 { width:100%; margin: 0px; padding: 10px;	background-color:#FFF; } 
#mainContent2 p {padding: 0 8px 0 18px; margin: 0 8px; }
#mainContent3 { width:100%; margin: 0px; padding: 10px;	background-color:#FFF; } 
#mainContent3 p {padding: 0 8px 0 18px; margin: 0 8px; }

#mainCont2fltrt { width: 61%; margin-left:8px; padding:10px; float:right; }
@media only screen and (max-width: 600px) { #mainCont2fltrt { max-width: 98%; margin:0 auto; padding:10px; float:none; }   }
#mainCont2fltrt ul {margin-left:16px; padding-left:8px; }
#mainCont2fltrt ol li {margin-left:8px; padding-left:4px; }
#mainCont2fltrt p {margin:8px; padding-left:4px; }

#crosslav { margin: 0 auto; padding: 10px; background-color:#e2d6ea; background-image:url(/images/mplavbg.jpg); min-width:20%; } 


#lav {background-color:#e2d6ea; background-image:url(/images/mplavbg.jpg); margin:0 10px 0 10px; padding:10px; border: 2px groove #9933cc;  }
#white {background-color:#FFF; margin:0; padding:0px; width:100%; }
#white100 {background-color:#FFF; margin:0; padding:10px 0 0 0; width:100%; text-align:left; color:#333; }

#fltr25w {float:right; width:25%; 	background: #ffffff; padding: 0px 8px 0px 8px; display:block; margin:8px;  } 
@media only screen and (max-width: 600px) { #fltr25w {width:38.2%; } }
#fltr260w {float:right; width:30%; 	background: #ffffff; padding: 0px 10px 8px 10px; display:block; margin: 0; }
@media only screen and (max-width: 600px) { #fltr260w {float:none; width:90%; margin:0 auto; padding:8px; }   }

#fltlft320w { float: left; width: 39%; background: #FFFFFF; margin:4px; padding: 10px; min-height:420px; height:auto; border: 2px groove #9933cc; text-align:left;}
#fltrt320w {float:right; width:39%; 	background: #FFFFFF; padding:10px; margin:4px; min-height:420px; height:auto; border: 2px groove #9933cc; text-align:left; }
@media only screen and (max-width: 600px) { #fltlft320w, #fltrt320w { float: none; width:100%; padding:8px;  }  }

#fltlft320wse { float: left; width: 44%; background: #FFFFFF; color:#333; margin:8px; padding: 10px; border: 2px groove #9933cc; text-align:left; }
#fltlft320wse a {color:#00C; }
#fltrt320wse a {color:#00C; }
#fltrt320wse {float:right; width:45%; 	background: #FFFFFF; padding:10px; margin:8px; border: 2px groove #9933cc; text-align:left; }	
@media only screen and (max-width: 600px) { #fltlft320wse, #fltrt320wse { float: none; width:100%; padding:8px;  }  }

#ftr { margin: 0; padding: 0; background-color:rgba(255,255,255,0.5); width:100%; background-image: linear-gradient(to bottom, white, rgba(255,255,255,0.5)); border-bottom: inset 1px #990000;border-top: inset 1px #990000; }
#ftr p { margin: 0; padding: 10px 0; font-size:.8em; line-height:1.2em; font-weight:bold; }
#ftr05 {background-color:#e2d6ea; background-image:url(/images/mplavbg.png); background-repeat: no-repeat; background-size:cover;  padding:10px; margin:0 auto; width:100%; height:auto; border-bottom:inset medium #609; font-size: 9pt; font-weight: bold; border-radius:8px;  }
#ftr .floatrt30 {width: 35%; float:right; font-size:9pt; }
#ftr05 .floatrt30 {width: 35%; float:right; font-size:9pt; }

#ftr05 a:link { color: #00c; font-weight: bold; text-decoration: underline; }
#ftr05 a:visited { color: #000099; font-weight: bold; text-decoration: underline; }
#ftr05 a:hover { color: #609; font-weight: bold; text-decoration: none;  }
#ftr05 a:active { color: #333; font-weight: bold; text-decoration: underline;}


.bglav { background:#e2d6ea; background-image:url(/images/mplavbg.jpg); }
.bgLMBrand {background-image:url(/images/LM_Logo_Brand_bg_white_10.png); background-repeat:repeat; }
.bgfunnel {background-image:url(/images/Whats_Funnel_600.png); background-repeat: no-repeat; background-size:contain; width:100%; height:auto; background-position:center; }
.bgrrtrk {background-image:url(/images/rrtrkng_1000.png); background-repeat:repeat-x; width:100%; padding:0; margin:0; }
.bgteal {background-image:url(/images/bg_teal.png); background-repeat: no-repeat; background-size:cover; width:100%; height:auto; }
.bgtealup {background-image:url(/images/bg_teal_arrowup.png); background-repeat: no-repeat; background-size:cover; width:100%; height:auto; }
.bgtealup p { color:#000; }

.bgteallt { background-color:#0CC; color:#fff; border:.5px #0CC solid; }
.bgteallt12 { background-color:#0CC; color:#fff; border:.5px #0CC solid; padding:12px; }

.bgmegaphone { background-image: url(/images/Whats_megaphone.png); background-repeat: no-repeat; background-size:cover; width:100%; height:auto; }
.bgimgsize {position:relative; background-size:cover; background-position:center;  }
.bgimg_ctrtxt {position:absolute; top:0; left:0; overflow:hidden; font-size:130%; color:#fff; font-weight:bold; margin:5%; padding:0 8px; width:88%; z-index:3;  }
@media only screen and (max-width: 600px) { .bgimg_ctrtxt {font-size:120%; width:100%; } }
.bgimg_txtwbg {position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); overflow:hidden; font-size:130%; color:#fff; font-weight:bold; background-color:rgba(0,0,102,0.7); border-radius:8px; padding:8px; border: inset 2px #990000; }
@media only screen and (max-width: 600px) { .bgimg_txtwbg {font-size:120%; width:100%;  background-color:rgba(0,0,102,0.8); max-height:88px;  } }

.bgimg_txtwbg95 {
	position:absolute;
	left:1px;
	bottom:0;
	margin:12px 0 0 0;
	overflow:hidden;
	font-size:130%;
	color:#fff;
	font-weight:bold;
	background-color:rgba(0,0,102,0.4);
	border-radius:8px;
	padding:8px;
	border: inset 2px #990000;
	width:100%;
}
@media only screen and (max-width: 600px) { .bgimg_txtwbg95 { font-size:100%; } }
.bgimg_txtwbg95 img { max-width:17%; height:auto; }
@media only screen and (max-width: 600px) { .bgimg_txtwbg95 img { max-width:20%; height:auto; } }

.bgwhite {background-color:#fff;  }
.bgwhitepurp {border-bottom:inset medium #609; background-image:linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.7), rgba(226,214,234,0.6)); border-radius:12px; text-align:left;  padding: 8px; margin-top:12px; height:100%;}
@media only screen and (max-width: 720px) {.bgwhitepurp {background-image:linear-gradient(rgba(255,255,255,1.0), rgba(255,255,255,1.0), rgba(226,214,234,1.0));  }}
.bgwhitepurp:hover {background-image:linear-gradient(rgba(255,255,255,1.0), rgba(255,255,255,1.0), rgba(226,214,234,0.8));  }

.bgwhite77 {background-image:url(/images/bg_white77.gif); background-repeat:repeat; border-radius:12px; text-align:left; padding-top:8px; width:auto; margin-top:0; color:#000; }
.bgblkpurp {border-bottom:inset medium #609; background-image:linear-gradient(rgba(102,0,204,0.8), rgba(0,0,0,0.7)); border-radius:12px; text-align:left; transition:0.5s; padding-top:8px; color:#fff; width:auto; margin-top:0px; }
.bgblkpurp:hover { background-image:linear-gradient(rgba(102,0,204,0.8), rgba(0,0,0,1.0)); }

.bgblkpurp a:link { color: #99f; font-weight: bold; text-decoration: underline; }
.bgblkpurp a:visited { color: #e2d6ea; font-weight: bold; text-decoration: underline; }
.bgblkpurp a:hover { color: #cff; font-weight: bold; text-decoration: none;  }
.bgblkpurp a:active { color: #ccc; font-weight: bold; text-decoration: underline;}

.bgdk_linkclr {background-image:linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.8)); }
.bgdk_linkclr a:link { color: #99f; font-weight: bold; text-decoration: underline; }
.bgdk_linkclr a:visited { color: #e2d6ea; font-weight: bold; text-decoration: underline; }
.bgdk_linkclr a:hover { color: #cff; font-weight: bold; text-decoration: none;  }
.bgdk_linkclr a:active { color: #ccc; font-weight: bold; text-decoration: underline;}

.btncta {background-image:linear-gradient(rgba(0,204,204,0.7), rgba(0,204,204,0.9)); padding:2px; border-radius:2px; }
.btncta a:link { color: #99f; font-weight: bold; text-decoration: underline; }
.btncta a:visited { color: #e2d6ea; font-weight: bold; text-decoration: underline; }
.btncta a:hover { color: #cff; font-weight: bold; text-decoration: none;  }
.btncta a:active { color: #ccc; font-weight: bold; text-decoration: underline;}


.bgpinkrose { background-image:url(/images/Whats_pink_rose.png); background-repeat: no-repeat; background-size:cover; width:100%; height:auto; }

.big {font-size:140%; }
@media only screen and (max-width:800px) { .big {font-size:120%; } }
.brdr {border-radius:12px; border:inset #90F 1px; }
.ctr_68 {width:68.57%; margin:0 auto; background:transparent; color:inherit; height:auto; }
@media only screen and (min-width:601px) and (max-width:900px) { .ctr_68 {width:88%; height:auto; }  }
@media only screen and (max-width:600px) { .ctr_68 {width:100%; height:auto; }  }
.ctr_68bg {width:68.57%; margin:0 auto; background:inherit; color:inherit; height:auto; }
@media only screen and (max-width:800px) { .ctr_68bg {width:95%; height:auto; }  }
.drop {padding-top:144px; background:transparent; }
.img_middle {display:inline; padding:0 12px; margin:0; vertical-align:middle; }
@media only screen and (max-width:800px) { .img_middle {max-width:50%; height:auto; padding:0 4px; }  }

.img50 img {max-width:35%; height:auto; }
@media only screen and (min-width:600px) and (max-width:990px) { .img50 img {max-width:25%; height:auto; } }
@media only screen and (min-width:991px) { .img50 img {max-width:50%; height:auto; }  }
.p11  {font-size: 12pt; }
.p11r  {font-size: 9pt; text-align:right; }
@media only screen and (max-width:800px) { .p11r  {font-size: 8pt; text-align:right; } }
.p10bold  {font-size: 10pt; font-weight:bold; }
.pbold {font-weight:bold; }
.pcenter { text-align: center; }
.pcenter10  { font-size: 90%; text-align: center; }
.pcenter10bold  { font-size: 90%; font-weight: bold; text-align: center; }
.pcenter12bold  { font-size: 12pt; font-weight: bold; text-align: center; }
.pleft {text-align:left; }
.pleft10bold  { font-size: 90%; font-weight: bold; text-align: left; }
.pright10bold { font-size: 90%; font-weight: bold; text-align: right; }
.pleft12bold { font-size: 12pt; font-weight: bold; text-align: left; }
.pright12bold { font-size: 12pt; font-weight: bold; text-align: right; }
.src {font-size:10pt; text-align:left; }
.caption { color: #800000; font-size: 11pt; font-weight: bold; text-align: center; }
.emphasis-teal { color: #099; font-weight: bold; }
.emphasis-teallt { color:#0CC; font-weight: bold; }

.margins0 {margin:0!important; padding:0!important; }
.pad10 {padding:5%; text-align:center; vertical-align:middle; }
@media only screen and (max-width:800px) { .pad10 {padding:2%; text-align:center; vertical-align:middle; } }
.pad8p {padding:8px; }
@media only screen and (max-width:980px) { .pad8p {padding:2px;} }
.padtopbtm {padding-top:48px; padding-bottom:48px; }

.clearfloat { clear:both; font-size: 1px; line-height: 1em; padding:0; margin:0; }
.floatrt50 {display:block; float:right; width:50%; margin:0; }
@media only screen and (max-width:719px) { .floatrt50 {display:block; float:none; width:100%; margin:0; }
  } 
.floatrt30 {display:block; float:right; width:26%; text-align:left; font-size:10pt; font-weight:bold; margin:8px 4px 8px 0; }
@media only screen and (min-width:420px) and (max-width:719px) {.floatrt30 {display:block; float:right; width:33%; text-align:left; font-size:10pt; font-weight:bold; margin:8px 4px 8px 0; } }
@media only screen and (max-width:419px) {.floatrt30 {display:block; float:none; width:100%; text-align:left; font-size:10pt; font-weight:bold; margin:8px; } }
.floatrt33 {display:block; float:right; width:32%; text-align:left; font-size:11pt; font-weight:bold; margin:8px; }
@media only screen and (min-width:720px) and (max-width:1220px) {.floatrt33 {display:block; float:right; width:31%; text-align:left; font-size:11pt; font-weight:bold; margin:8px; } }
@media only screen and (max-width:719px) {.floatrt33 {display:block; float:none; width:100%; margin:0; } }
.floatrt40 {display:block; float:right; width:44%; text-align:right; font-size:10pt; font-weight:bold; margin:8px 4px 8px 0; }
.floatrt25 {display:block; float:right; width:24%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; }
@media only screen and (max-width:719px) {.floatrt25 {display:block; float:right; width:48%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; } }
.floatlft25 {display:block; float:left; width:24%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; }
@media only screen and (min-width:471px) and (max-width:900px) {.floatlft25 {display:block; float:left; width:47%; text-align:left; font-weight:bold; margin:0; vertical-align:middle; height:auto; } }
@media only screen and (max-width:470px) {.floatlft25 {display:block; float:none; width:100%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; } }

.floatlft25reg {display:block; float:left; width:24%; text-align:left; margin:2px; vertical-align:middle; height:auto; }
@media only screen and (min-width:471px) and (max-width:900px) {.floatlft25reg {display:block; float:left; width:48%; text-align:left; margin:2px; vertical-align:middle; height:auto; } }
@media only screen and (max-width:470px) {.floatlft25reg {display:block; float:none; width:100%; text-align:left; margin:2px; vertical-align:middle; height:auto; } }

.floatlft25_121 {display:block; float:left; width:24%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; }
@media only screen and (max-width: 470px) {.floatlft25_121 {display:block; float:none; width:100%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; } }

.floatlft25nr {display:block; float:left; width:24%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; }
/* @media only screen and (max-width: 800px) {.floatlft25nr {display:block; float:left; width:48%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; } } */

.floatlft25pkg {display:block; float:left; width:24%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; }
@media only screen and (min-width:471px) and (max-width: 1080px) {.floatlft25pkg {display:block; float:left; width:48%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; } }
@media only screen and (max-width: 470px) {.floatlft25pkg {display:block; float:none; width:100%; text-align:left; font-weight:bold; margin:2px; vertical-align:middle; height:auto; } }

.floatlft50 {display:block; float:left; width:50%; margin:0; }
@media only screen and (min-width:471px) and (max-width: 900px) {.floatlft50 {display:block; float:none; width:100%; text-align:left; margin:2px; vertical-align:middle; height:auto; } }
@media only screen and (max-width: 470px) { .floatlft50 {display:block; float:none; width:100%; margin:0; }  }

.floatlft50_121 {display:block; float:left; width:50%; margin:0; }
@media only screen and (max-width: 470px) { .floatlft50_121 {display:block; float:none; width:100%; margin:0; }  }

.flt_gmw0 {float:left; width:68.57%; height:auto; }
.flt_gmn0 {float:left; width:31.43%; height:auto; }
.flt_gmw {float:left; width:68.57%; height:auto; padding:24px; margin:0; }
.flt_gmn {float:left; width:31.43%; height:auto; padding:12px; margin:0;}
@media only screen and (max-width: 800px) { .flt_gmw {float:none; width:100%; height:auto; padding:10px; margin:0; }  }
@media only screen and (max-width: 800px) { .flt_gmn {float:none; width:100%; height:auto; padding:10px; margin:0;}  }

.floatlft38 { display:block; float:left; width:46%; text-align:center; font-size:10pt; font-weight:bold; margin:8px; }
@media only screen and (max-width: 740px) { .floatlft38 { float:none; width:100%; text-align:center; font-size:11pt; margin:8px; } }
.fltrt { float: right; margin-left: 8px; }
.fltrt_img {float: right; padding:0 8px; margin-right: 4px; margin-left:8px;}
@media only screen and (max-width: 800px) { .fltrt_img {float: right; padding:0 4px; margin-right: 8px; margin-left:8px; max-width:50%;} }
.fltlft { float: left; margin-right: 8px; }
.fltlft-r { float: left; margin: 0 8px; }
@media only screen and (max-width: 470px) { .fltlft-r { float: right; margin: 0 4px; }  }
.fltlft_img {float:left; padding: 0 8px; margin-right: 8px; margin-left:4px; }
@media only screen and (max-width: 800px) { .fltlft_img {float:left; padding: 0 4px; margin-right: 8px; margin-left:8px; max-width:50%; } }
.fltlft6up { float:left; width:16%; padding:.25%; margin:0; }
@media only screen and (max-width: 470px) { .fltlft6up { float:left; width:32%; padding:.5%; margin:0; }  }
.fltlft6up2 { float:left; width:16%; padding:.25%; margin:0; }
@media only screen and (min-width:601px) and (max-width: 900px) { .fltlft6up2 { float:left; width:32%; padding:.5%; margin:0; }  }
@media only screen and (max-width: 600px) { .fltlft6up2 { float:left; width:100%; padding:.5%; margin:0; }  }
.fltlft3up { float:left; width:32%; padding:.5%; margin:0; }
@media only screen and (max-width: 600px) { .fltlft3up { float:none; width:100%; padding:.5%; margin:0 auto; }  }

.lmlogo {font-family:  Calligrapher, Geneva, Arial, Helvetica, sans-serif;}
.listIn { display:inline-block; width:48%; padding:2px; float:left; margin:0; list-style:none; border-right:inset 2px #3C9; }
@media only screen and (min-width: 800px) { .listIn { display:inline-block; width:23%; padding:2px 4px 0 4px; float:left; margin:0; list-style:none; border-right:inset 2px #3C9; } }
.mplogo {font-family: "Maiandra GD", Philosopher, "Averia Serif Libre", Geneva, sans-serif; color:#609; font-weight:bold; }
.floatrtpad {width:100%; margin:0 auto; padding:0; text-align:center; }
.white {color:#fff; }
.black {color:#000; }
.green {color:#0C3; }
.maroon { color: #800000; font-weight: bold; }

.navbtn {padding: 1px 2px 1px 2px; border:1px #309; }
.hide700 { display:inline; }
@media only screen and (max-width: 700px) { .hide700 { display:none; }  }
.hide700m {display:none; }
@media only screen and (max-width: 700px) { .hide700m {display:inline; } }
.navhidem { display:inline; }
@media only screen and (max-width: 600px) { .navhidem { display:none; }  }
.navhidec { display:inline; }
@media only screen and (max-width: 800px) { .navhidec { display:none; }  }

.navhide { display:none;  }
@media only screen and (max-width: 600px) { .navhide { display:inline; text-align:right; font-size:9pt; line-height:20pt;  }  }
.navhide a { display:inline; background-color:#fff; padding:4px; border:1px inset #900; border-radius:5px; line-height:20pt; text-align:right;   }
.hide {display:none; }
.ind12 {margin-left:12px; margin-right:12px; }
@media only screen and (max-width: 600px) { .ind12 {margin-left:8px; margin-right:8px; }  }
.wid88 {width:88%; height:auto; margin:0 auto; }
@media only screen and (max-width: 600px) { .wid88 {float:none; width:95%; height:auto; }  }
.wida {width:auto; height:auto; margin:0 auto; padding:12px; border-radius:8px;  }
@media only screen and (max-width: 600px) { .wida {float:none; width:100%; height:auto; padding:8px; }  }



/* Animations */


[data-aos="anim3"] {
  transform: rotate(360deg);
  opacity: 0;
  transition-property: transform, opacity; }
.aos-animate { transform: rotate(0); opacity: 1; } 


@keyframes zoom1 {from { transform: scale(2); }
  to { transform: scale(1); } } 
  
  
  
 /* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
	background-color:#fff;  
	width:320px;
  height:320px;
  max-width:100%;
  max-height:100%;
  border: none;
  border-radius: 8px;
  margin:0 auto; padding:0;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
	position: absolute;
	width: 100%;
	height: 100%;
	padding:0;
	margin:0;
	border-radius: 8px;
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;
	left: -1px;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front { background-color:#fff; color:#333; }
.flip-card-front-more { position:absolute; bottom:-12px; right:2px; z-index:3; color:#999; font-size:14px; background-color:rgba(255,255,255,.5);   }

/* Style the back side */
.flip-card-back {
	background-image:linear-gradient(rgba(0,0,0,.8), rgba(102,0,204,.8));
	color: white;
  transform: rotateY(180deg);
}   
/* end flip-card css */



/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 7; /* Sit on top */
  padding-top: 78px; /* Location of the box */
  right: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: transparent; /* Fallback color */
  background-color: rgba(255,255,255,0.1); /* Black w/ opacity */
}

/* Modal for nav Content */
.modal-content {border-bottom:inset medium #609; background-image:linear-gradient(rgba(0,0,0,0.7), rgba(102,0,204,0.7)); background-size:cover; background-repeat:no-repeat; border-radius:8px; 
  text-align:left; font-size:110%; transition: 0.5s; position:absolute; right:0; padding-top: 8px; color:#fff;	
  width:100%; margin-top:12px;}

@media only screen and (min-width:1281px) { .modal-content {margin-top:26px; }  }
@media only screen and (min-width:801px) and (max-width: 1280px) { .modal-content {margin-top:28px; padding-top: 4px; font-size:100%;  }  }
@media only screen and (max-width: 800px) { .modal-content {padding-top: 4px; font-size:100%; width:100%;  }  }

.modal-content a:link, a:visited { padding: 4px 4px 4px 18px; text-decoration: none; color: #fff; display: inline-block; transition: 0.5s; }
@media only screen and (max-width: 550px) { .modal-content a {padding-right:12px; }  }
.modal-content a:hover { color: #cff; }
.modal-content a:active {color: #eee; }

/* The Close Button - modal*/
.close { float:right; font-size: 100%; margin-left:12px; padding-bottom:2px; color:#fff; }
.close:hover, .close:focus { color: #ccc; text-decoration: none; cursor: pointer; }

/* fm toggle_nav 4 modal */
hdr.button {border-radius:1px; padding:1px; margin:0px 0 0 8px; display:inline;  }
.openbtn { height:auto; width:auto; font-size: 14px; cursor: pointer; background:transparent; color:#000; padding: 1px; margin:0px 0 0 8px; border: none; font-weight:bold; transition: 0.5s; display:inline; vertical-align:middle; }

.openbtn:hover { background-image:linear-gradient(rgba(0,0,0,0.7), rgba(102,0,204,0.7)); color:#fff; display:inline; }

/* end Modal Content */

/*  Modal 1 (background) */
.modal1 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 7; /* Sit on top */
  padding-top: 78px; /* Location of the box */
  right: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: transparent; /* Fallback color */
  background-color: rgba(255,255,255,0.1); /* Black w/ opacity */
}

/* Modal 1 Content 50% wide from left > need to add .modal1 css to use this  */
.modal-content1 {border-right:inset medium #609; background-image:linear-gradient(rgba(0,0,0,0.7), rgba(102,0,204,0.8)); background-size:cover; background-repeat:no-repeat; border-radius:8px; 
  text-align:left; transition: 0.5s; position:absolute; left:0; top:0; padding-top: 8px; color:#fff; width: auto; margin-top:0px; z-index:8;}

@media only screen and (min-width:1281px) { .modal-content1 {margin-top:0px; max-width:50%; height:100vh; }  }
@media only screen and (min-width:801px) and (max-width: 1280px) { .modal-content1 {margin-top:0px; padding-top: 4px; font-size:100%; max-width:50%; height:100vh; }  }
@media only screen and (max-width: 800px) { .modal-content1 {padding-top: 4px; font-size:100%; max-width:90%; height:auto;  }  }

.modal-content1 a { padding: 4px 4px 4px 18px; text-decoration: none; color: #fff; display: inline-block; transition: 0.5s; }
@media only screen and (max-width: 550px) { .modal-content1 a {padding-right:12px; }  }
.modal-content1 a:hover { color: #e2d6ea; }

/* The Close Button - modal*/
.close1 { float:right; font-size: 100%; margin-left:12px; padding-bottom:2px; color:#fff; }
.close1:hover, .close1:focus { color: #ccc; text-decoration: none; cursor: pointer; }

/* fm toggle_nav 4 modal */
.openbtn1 { height:auto; width:100%; font-size: 14px; cursor: pointer; background:transparent; color:#000; padding: 4px; border: none; font-weight:bold; transition: 0.5s; }
.openbtn1:hover { background-image:linear-gradient(rgba(0,0,0,0.7), rgba(102,0,204,0.7)); color:#fff; }

/* end Modal 1 Content */


#Tgl1 { width: 100%; height:auto; background-color:#cdcde1; background-image: linear-gradient(to bottom, white, rgba(0,0,153,0.2)); border-bottom: inset 1px #990000; border-radius:12px;; margin-top: 20px; display:none; }

#Tgl2 { width: 100%; height:auto; background-color:#cdcde1; background-image: linear-gradient(to bottom, white, rgba(0,0,153,0.2)); border-bottom: inset 1px #990000; border-radius:12px;; margin-top: 20px; display:none; }

#Tgl3 { width: 100%; height:auto; background-color:#cdcde1; background-image: linear-gradient(to bottom, white, rgba(0,0,153,0.2)); border-bottom: inset 1px #990000; border-radius:12px;; margin-top: 20px; display:none; }

#Tgl4 { width: 100%; height:auto; background-color:#cdcde1; background-image: linear-gradient(to bottom, white, rgba(0,0,153,0.2)); border-bottom: inset 1px #990000; border-radius:12px;; margin-top: 20px; display:none; }

#Tgl5 { width: 100%; height:auto; background-color:#cdcde1; background-image: linear-gradient(to bottom, white, rgba(0,0,153,0.2)); border-bottom: inset 1px #990000; border-radius:12px;; margin-top: 20px; display:none; }
