/*
   
   Theme Name: MLSN 2019
   Text Domain: mlsn2019
   Author: Zero Defect Design LLC
   Author URI: http://www.zerodefectdesign.com
      
   */
   
   /* fonts */
   
   @import url('fonts/fontawesome.min.css');
   @font-face { font-family: 'lars'; font-weight: 300; font-style: normal; src: url('fonts/0.woff2') format('woff2'),url('fonts/0.woff') format('woff'); }  
   @font-face { font-family: 'lars'; font-weight: 300; font-style: italic; src: url('fonts/2.woff2') format('woff2'),url('fonts/2.woff') format('woff'); }
   @font-face { font-family: 'lars'; font-weight: 400; font-style: normal; src: url('fonts/5.woff2') format('woff2'),url('fonts/5.woff') format('woff'); }  
   @font-face { font-family: 'lars'; font-weight: 400; font-style: italic; src: url('fonts/4.woff2') format('woff2'),url('fonts/4.woff') format('woff'); } 
   @font-face { font-family: 'lars'; font-weight: 600; font-style: normal; src: url('fonts/3.woff2') format('woff2'),url('fonts/3.woff') format('woff'); }
   @font-face { font-family: 'lars'; font-weight: 600; font-style: italic; src: url('fonts/1.woff2') format('woff2'),url('fonts/1.woff') format('woff'); }
   @font-face 
   {
      font-family: 'Font Awesome 5 Pro'; font-style: normal; font-weight: 300;
      src: url('fonts/fa-light-300.woff2') format('woff2'), url('fonts/fa-light-300.woff') format('woff'); 
   }
   .fa, .fal { font-family: 'Font Awesome 5 Pro'; font-weight: 300; }
   @font-face 
   {
      font-family: 'Font Awesome 5 Brands'; font-style: normal; font-weight: normal;
      src: url('fonts/fa-brands-400.woff2') format('woff2'), url('fonts/fa-brands-400.woff') format('woff');
   }
   .fab { font-family: 'Font Awesome 5 Brands'; }
   
   
   /* resets */
   
   * 
   { 
      box-sizing: border-box; border: none; outline: none; text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-kerning: auto; 
   }
   html { height: 100%; -webkit-text-size-adjust: 100%; }
   body { margin: 0px; padding: 0px; }
   *:before, *:after { box-sizing: inherit; } 
   .cf:before, .cf:after { content: " "; display: table; }
   .cf:after { clear: both; }
   table { border: 0; padding: 0; border-spacing: 0px; border-collapse: collapse; }   
   body.modal-open { overflow: hidden; position: fixed; }
   

   /* colour scheme */
   
   :root { --link: #3451A0; --hover: #E29E32; --hot: #D1615E; --warm: #D1615E; } 
   
   /* type */

   body, input, textarea, select, table { font: 300 19px/26px 'lars', sans-serif; color: #000000; }
   .secondary { color: #777777; font-size: 90%; }
   
   input[type=text], input[type=password], textarea, select { -webkit-appearance: none; -moz-appearance: none;  }
   input[type=text], input[type=password], textarea, select { background-color: #d7e6ff; color: #000000; padding: 8px; }
   
   b, strong { font-weight: 600; }
   h2 { font-size: 200%; line-height: 110%; font-weight: 600; margin-top: 0px; color: #000000; }
   h2 select { font-size: inherit; line-height: inherit; font-weight: inherit; }
   h3, h4 { font-size: 125%; line-height: 110%; font-weight: 600; color: #000000; }
   h3, .warm { color: #D1615E; }
   h5 { font-size: 110%; line-height: 110%; font-weight: 600; }
   h5.divided { margin: 0px 0px 25px 0px; border-top: 3px solid #D1615E; padding-top: 15px; color: #000000; }
   h6 { font-size: 90%; line-height: 100%; font-weight: 600; }
   h6.breadcrumb { font-weight: 400; text-transform: uppercase; margin-top: 0px; padding-top: 0px; letter-spacing: 1px; }
   /*
   h5 
   { 
      font-size: 90%; line-height: 100%; font-weight: 400; letter-spacing: 1px; padding: 5px; color: #FFFFFF; 
      background-color: #D1615E; text-transform: uppercase; 
   }
   h5 i.fa { margin-left: 4px; }
   */
   .intro { font-size: 130%; line-height: 120%; font-weight: 300; }
   a h2, a h3 { color: inherit; }
   .light, h2 .light, h3 .light, h5 .light { font-weight: 300; }
   p .light { color: #777777; }
   .date { color: #919D44; font-size: 80%; font-weight: 600; }
   .new { color: #d1615e; font-size: 70%; font-weight: 600; text-transform: uppercase; display: inline-block; margin-left: 5px; }
   .secondary .date { font-size: 100%; padding-top: 10px; border-top: 3px solid #919D44; display: block; }
   .intro { font-size: 110%; line-height: 140%; }
   h2 select { background-color: #FFFFFF; border: 1px solid #CCCCCC; }
   select, label, .btn { cursor: pointer; }
   
   .floaties { margin: 0px -25px -25px 0px; }
   .floaties a { display: inline-block; float: left; margin: 0px 25px 25px 0px; }
   .floaties a img { display: block; width: 90px; height: auto; margin: 0px 0px 6px 0px; }
   

   
   /* structure */
   
   .container { width: 100%; overflow: hidden; }
   .shade { background-color: #D7E6FF; }
   .frame { padding: 50px 5% 50px 5%; text-align: left; }
   .center, .frame.center { text-align: center; }
   
   /* columns : layout */
   
   .columns { display: flex; align-items: flex-start; margin: -25px; }
   .column { flex-basis: 50%; padding: 25px; }
   .column.primary { flex-basis: 66.6666%; padding-right: 35px; }
   .column.secondary { flex-basis: 33.3333%; padding-left: 35px; }
   .column.secondary ul, body.home .column ul { list-style-type: none; margin: 0px; padding: 0px; }
   .column li { padding: 5px 0px; }
   body.home .column li { padding: 10px 0px; }
   body.home .column li a { font-weight: 600; }
   .column li .date { font-weight: 400; text-transform: uppercase; font-size: 70%; letter-spacing: 1px; }
   .column .section { margin: 0px 0px 50px 0px; }
   ul.insection li.current a { color: #D1615E; font-weight: 600; }

   body.onecolumn .columns { flex-wrap: wrap; }
   body.onecolumn .column.primary, body.onecolumn .column.secondary { flex-basis: 100%; padding-left: 25px; padding-right: 25px; }
   body.onecolumn .column.secondary { display: flex; align-items: flex-start; margin: -25px; }
   body.onecolumn .column.secondary .section { flex-basis: 33.3333%; padding: 25px; flex-grow: 1; }
   
   
   /* header */
   
   #hd { margin-bottom: 20px; background-color: #9EC4FF; background: linear-gradient(to right, #3451A0 0px, #3451A0 350px, #83A6E6 100%); }
   #hd .frame { display: flex; justify-content: space-between; align-items: flex-end; padding-top: 20px; padding-bottom: 0px; }
   body.home #hd { margin-bottom: 0px; }
   /* 
	body.home #hd .frame { padding-top: 35px; } 
   #mlsn { display: none; padding-top: 10px; padding-bottom: 30px; }
   #mlsn img { display: block; width: 225px; height: auto; }
   body.home #mlsn { display: block; }
   @media screen and (max-width: 1200px) { #mlsn img { width: 187px; } }
   @media screen and (max-width: 900px) { #mlsn { display: none; } }
	*/
   
   a.badge { flex-grow: 1; white-space: nowrap; padding-bottom: 10px; }
   a.badge img { height: 90px; width: auto; }
   
   /* footer */
   
   #footer { font-size: 17px; line-height: 1.3; }
	#footer .logoline { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 0 20px 0; width: 100%; }
	#footer .footlogo img { height: 52px; width: auto; }
   #footer .columns { justify-content: space-between; margin: 0px; gap: 20px; }
   #footer .columns div { width: calc(25% - 15px); }
   #footer a, #footer .icons { white-space: nowrap; }
   #footer .icons { text-align: right; }
   #footer 
	{ 
		/* background-color: #808D2A; color: #E7EFB2; */
		background: linear-gradient(to right, #3451A0 0%, #3451A0 33%, #83A6E6 100%);
		color: rgba(255,255,255,0.7);
		position: relative; margin-top: 50px; 
	}
   #footer b { color: #FFFFFF; }
   
   /* signup form */
   
   form.signup { display: flex; width: 100%; align-items: stretch; }
   form.signup input.email { flex-grow: 1; margin-right: 5px; }

   /* images */
   
   img.hero { width: 100%; height: auto; }
   .img 
   { 
      width: 100%; height: 0; padding-top: 56.25%; margin: 0px;
      background-position: center center; background-repeat: no-repeat; background-size: cover;
   }
   
   /* tiles */
   
   .tiles { display: flex; align-items: stretch; flex-wrap: wrap; margin: -15px;}
   .tiles.image-grid { align-items: center; }
   .tiles.image-grid .tile { flex-grow: 0; }
   .tile { flex-basis: 25%; padding: 15px; line-height: 1.2; }
   .tile img { width: 100%; height: auto; display: block; margin: 0px 0px 8px 0px; }
	.tile .img { margin-bottom: 8px; }
   .tile .date { font-weight: 400; }
   .image-grid .tile img { width: 70%; height: auto; }
   .thumb 
   { 
      width: 100%; height: 0; padding-top: 50%; display: block; position: relative;
      background: transparent url('images/slug.png') center center no-repeat; background-size: cover; 
   }
   .thumb .caption 
   { 
      position: absolute; bottom: 0px; left: 0px; right: 0px; padding: 20px 8px 8px 8px; color: #FFFFFF; line-height: 105%;
      font-weight: 600; background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.6));
   }
   a.thumb:hover .caption { background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(226,156,50,0.5)); }
   
   .listing 
   { 
      margin: 0px 0px 15px 0px; display: flex; justify-content: flex-start; align-items: flex-start; 
      padding-bottom: 15px; border-bottom: 1px dotted #AFB4BB;
   }
   .listing.first { padding-top: 15px; border-top: 1px dotted #AFB4BB; }
   .tile .listing { border-top: 0px; margin-top: 15px; }
   .listing .date 
   { 
      color: #FFFFFF; background-color: #a8b64f; font-size: 15px; width: 40px; text-align: center; padding: 3px 0px 5px 0px;
      flex-shrink: 0;  margin-right: 15px;
   }
   .listing .date .mo { font-size: 12px; font-weight: 600; letter-spacing: 1px; line-height: 18px; margin: 0px; color: #000000; }
   .listing .date .dy { font-size: 22px; font-weight: 300; line-height: 18px; margin: 0px; }
   .listing .detail {  flex-grow: 1; align-self: center; font-size: 90%; }
   .listing .detail h3 { margin: 0px 0px 3px 0px; }
   
   body.home .listing { border-bottom: none; }
   
   /* cols: 2-columns grid */

   .cols { display: flex; flex-wrap: wrap; gap: 50px; }
   .cols .col { width: calc(50% - 25px); }
   .cols a.col { padding: 15px; background-color: rgba(215,230,255,0.75); color: #000000; }
   .cols a.col:hover { background-color: rgba(215,230,255,1); }
   .cols .col h4 { margin: 10px 0; }
   @media screen and (max-width: 1000px) 
   { 
      .cols { gap: 10px; }
      .cols .col { width: 100%; }
   }

   /* links + controls */
   
   a, a:visited { color: var(--link); text-decoration: none; }
   a:hover, a:active { color: var(--hover); }
   #footer a { color: #FFD85A; font-weight: 400; }
   #footer a:hover, #footer a:active { color: #FFFFFF; }
   #footer a i.fa { color: #FFFFFF; display: inline-block; margin-right: 6px; }
   a.social
   { 
      display: inline-block; text-align: center; overflow: hidden; width: 36px; height: 36px; 
      margin-right: 10px; font-size: 18px; line-height: 38px; border-radius: 18px; color: #FFFFFF; background-color: #8C97A3;
   }
   #footer a.social { color: #83A6E6; /* #919D44; */ background-color: #FFFFFF; }
   #footer a.social:hover, #footer a.social:active { background-color: #FFD85A; }
   .primary p a { border-bottom: 1px dotted #9EC4FF; }
   h3 a { display: inline-block; border-bottom: 2px dotted #9EC4FF; }
   h3 a:hover, .primary p a:hover { color: var(--hover); border-color: var(--hover); }
   .date a, .primary p .date a { border: 0; }
   a.moar { display: inline-block; padding: 6px; border: 1px solid var(--link); }
   a.moar:hover { border-color: var(--hover); }
   .btn, a.btn, h3 .btn, button
   {
      -webkit-appearance: none; -moz-appearance: none; 
      font: 400 20px/34px 'lars', sans-serif;
      color: #FFFFFF; background-color: #3451a0; font-weight: 400; text-transform: lowercase !important;
      cursor: pointer; padding: 4px 8px; border: 0px !important; white-space: nowrap; 
   }
   .wpforms-page-button, .wpforms-submit.btn { color: #FFFFFF !important; background-color: #3451a0 !important; }
   .btn::after, a.btn::after { content: " \f061"; font-family: 'Font Awesome 5 Pro'; font-weight: 300; font-size: 16px; position: relative; top: -1px; padding: 0px 1px; color: #9ec4ff; }
   .btn:hover, a.btn:hover { color: #FFFFFF !important; background-color: #E29E32; } 
   button:hover, .wpforms-page-button:hover, .wpforms-submit.btn:hover { color: #FFFFFF !important; background-color: #e29e32 !important; } 
   .btn:hover::after, a.btn:hover::after, input[type=submit]:hover::after, button:hover::after, .wpforms-page-button:hover::after { color: #FFFFFF; }
   .classbrowser a.btn::after, .classbrowser a.btn:hover::after { color: inherit; }
   

   
   /* wp table */
   
   table.wp-block-table { }
   table.wp-block-table tr { border-bottom: 1px solid rgba(0,0,0,0.2); vertical-align: top; }
   table.wp-block-table th { text-align: left; font-weight: 600; }
   table.wp-block-table th, td { padding: 2px 30px 2px 0px; }
   table.wp-block-table th:last-child, table.wp-block-table td:last-child { padding-right: 0px; }
   
   /* announcement bar */
   
   .announce 
   { 
      padding: 10px 0px; color: #FFFFFF; background-color: #D1615E; font-size: 110%; line-height: 100%; font-weight: 400; 
      margin: 0px 0px 20px 0px;
   }
   a .announce:hover { background-color: var(--hover); }
   .announce .frame { padding-top: 0px; padding-bottom: 0px; }
   a .announce .frame::after 
   { 
      content: " \f061"; font-family: 'Font Awesome 5 Pro'; font-weight: 300; font-size: 16px; position: relative; top: -1px; padding: 0px 1px; 
      color: #FFFFFF;
   }
   
   /* menu system */
   
   #menuside { flex-grow: 1; text-align: right; }
   
   /* main menu */
   
   ul#menu { list-style-type: none; margin: 14px 0px 14px 0px; padding: 0px; text-align: right; }
   ul#menu li { list-style-type: none; display: inline-block; margin: 0px 0px 0px 15px; padding: 0px; font-size: 20px; text-transform: lowercase; }
   ul#menu li:first-child { margin-left: 0px; }
   ul#menu a { font-weight: 400; color: #FFFFFF; }
	ul#menu > li > a:hover { color: #FED067; }
   
   #menu li ul 
   { 
      display: none; position: absolute; z-index: 200; margin: 0px; padding: 0px; list-style-type: none;  
       -webkit-animation: slidein 0.1s ease-in 1;
   }
   #menu li:hover ul { display: block; text-align: left; }
   #menu li ul li { margin: 0px; padding: 0px; list-style-type: none; text-transform: none; display: block; float: none; position: relative; left: -5px; }
   #menu li ul li:first-child::before 
   { 
      content: " "; display: block; height: 16px;  border-bottom: 6px solid var(--link); 
      background: transparent url('images/icon-triangle.svg') 10px 4px no-repeat; background-size: 10px auto;
   }
   #menu li ul li a 
   { 
      color: #FFFFFF; display: block; padding: 4px 10px; background-color: var(--link);
      font-weight: 300; font-size: 17px; line-height: 19px;
   }
   #menu li ul li:last-child { border-bottom: 6px solid var(--link); }
   #menu li ul li a:hover { color: #FFFFFF; background-color: var(--hover); }
   @-webkit-keyframes slidein { 0% { margin-top: -10px; opacity: 0; } 100% { margin-top: 0px; opacity: 1; } }
   
   /* mobile menu */
   
   #mobilenav { font-size: 30px; line-height: 20px; }
   #mobilenav a { display: inline-block; margin-left: 20px; color: #FFFFFF; }
   #mobilenav a:first-child { margin-left: 0px; }
   
   /* secondary menu */
   
   #link-box { white-space: nowrap; text-align: right; }
   #link-bar { list-style-type: none; margin: 0px; padding: 0px; }
   #link-bar li { display: inline-block; }
   #link-bar li::after { content: '\000B7'; padding: 0px 3px 0px 5px; color: rgba(255,255,255,0.5); }
   #link-bar li:last-child::after { display: none; }
   #link-bar li a { font-size: 16px; line-height: 16px; display: inline-block; color: #FFFFFF; }
   #link-bar li a:hover { color: #FED067; }
   
   /* home: slider */
   
	.slide 
   { 
      width: 100%; height: 33.333vw; position: relative; display: block; overflow: hidden;
      background-position: center center; background-repeat: no-repeat; background-size: cover;
   }
   .slide .frame.caption 
   { 
      padding-top: 25px; padding-bottom: 25px;
      position: absolute; bottom: 50px; left: 0px; max-width: 50%; display: block; 
      color: #FFFFFF; background-color: #3451A0;
   }
   .caption h2 { margin-bottom: 5px; font-weight: 300; font-size: 150%; }
   .caption .date { text-transform: uppercase; font-size: 90%; color: #b7cc36; letter-spacing: 1px; }
   .lSSlideOuter { position: relative; }
   .lSSlideOuter .lSPager.lSpg { position: absolute; top: 10px; right: 15px; }
   .lSSlideOuter .lSPager.lSpg > li a { background-color: rgba(255,255,255,0.6); width: 16px; height: 16px; transition: none; }
   .lSSlideOuter .lSPager.lSpg > li:hover a, .lSSlideOuter .lSPager.lSpg > li.active a { background-color: #FFFFFF; }
    
   /* home: class browser */
   
   .classbrowser { background: #2F4F99 url('images/bg-classbrowser.jpg') bottom right no-repeat; background-size: cover; color: rgba(255,255,255,0.7); }
   .classbrowser h2 { color: #FFFFFF; margin-bottom: 5px; }
   .classbrowser p.intro { margin-top: 0px; font-weight: 400; }
   .classbrowser a.btn { color: #3451a0; background-color: #9ec4ff; }
   .classbrowser a.btn:hover { color: #3451a0 !important; background-color: #FFFFFF; }
   .classbrowser form { white-space: collapse; }
   .classbrowser select, .classbrowser input
   { 
      margin: 0px; font-size: 24px; line-height: 28px; font-weight: 600; color: #000000; background-color: #FBCC36;
      border: 0px; padding: 10px; -webkit-appearance: none; -moz-appearance: none; cursor: pointer;
   }
   .classbrowser select { padding-right: 28px; }
   .classbrowser option.divider { font-size: 1px; line-height: 1px; padding: 0px; color: rgba(0,0,0,0.5); background-color: #000000; }
   .classbrowser input { color: #FFFFFF; background-color: #E29E32; }
   .classbrowser input:hover { background-color: #D1615E; }
   .classbrowser .select { display: inline; position: relative; margin: 0px; }
   .classbrowser .select::after 
   { 
      content: ''; position: absolute; top: 0; width: 0; height: 0; right: 10px; bottom: 0;
      margin: auto; border-style: solid; border-width: 8px 4px 0 4px; border-color: #FFFFFF transparent transparent transparent;
      pointer-events: none;
   }
   
   /* home: welcome block */
   
   #membership-feature { padding-right: 30%; background: transparent url('images/membership-image.jpg') right center no-repeat; background-size: 25% auto; }
   
   /* calendar controls */
   
   .controls { float: right; margin: 0px 0px 20px 0px; font-size: 26px; line-height: 26px; letter-spacing: 5px; color: var(--hover); }
   .controls i.fa-list { position: relative; top: 2px; }
   
   /* calendar grid */
   
   h2 i.fa-calendar-alt { margin-right: 10px; }
   table.calendar-grid { border-collapse: separate; border-spacing: 25px 25px; margin: -25px -25px 25px -25px; }
   table.calendar-grid td 
   { 
      width: 14.285714%; vertical-align: top; padding: 30px 0px 0px 0px; border-top: 1px solid #CCCCCC; 
      -webkit-hyphens: auto; hyphens: auto; font-size: 16px; line-height: 21px;
   }
   table.calendar-grid tr:first-child td { border-top: 0px; padding-top: 0px; }
   table.calendar-grid td a { font-weight: 400; display: block; margin: 0px 0px 15px 0px; }
   table.calendar-grid td a.moar { display: block; width: 100%; text-align: center; }
   table.calendar-grid h3 { color: #000000; margin: 0px 0px 20px 0px; }
   table.calendar-grid th { font-weight: 600; text-align: left; padding-bottom: 6px; border-bottom: 3px solid #d1615e; color: #d1615e; }
   table.calendar-grid .empty { color: #CCCCCC; }
   table.calendar-grid .today { border-color: var(--hover); }
   table.calendar-grid .today h3 { color: var(--hover); }
   table.calendar-grid .blank { border: 0px; }
   
   /* calendar listing */
   
   table.event-list { margin: 0px -10px; }
   table.event-list td { padding: 0px 10px 20px 10px; vertical-align: top; }
   table.event-list td h3 { margin: 0px; text-align: center; }
   table.event-list td .date { font-weight: 400; }
   table.event-list td a.anchor { color: #000000; margin-top: -20px; padding-top: 20px; }
   
   /* back-to-top control */
   
   a#totop 
   { 
      position: fixed; width: 100px; height: 100px; bottom: 0px; left: 50%; margin-left: -50px; margin-bottom: -55px; 
      z-index: 25; text-align: center; color: #FFFFFF; background-color: #9EC4ff; border-radius: 50px; display: none; 
      font-size: 30px; line-height: 46px; 
   }
   a#totop:hover { color: #FFFFFF; background-color: #E29E32; }
   
   /* floating anchor bars */
   
   a.anchorbar
   { 
      position: fixed; width: 250px; bottom: 0px; left: 50%; margin-left: -125px; overflow: hidden; padding: 10px 0px;
      z-index: 25; text-align: center; color: #3451A0; background-color: #A9CBFF; border-radius: 50px 50px 0px 0px; 
      opacity: 1; font-weight: 400; text-transform: lowercase;
   }
   a.anchorbar:hover { color: #FFFFFF; background-color: #E29E32; }
   a.anchorbar::before { content: " \f063"; font-family: 'Font Awesome 5 Pro'; font-weight: 300; color: #FFFFFF; display: block; padding-left: 0px; }
   a.anchorbar.inactive, a.anchorbar.inactive::before, a.anchorbar.inactive::after { opacity: 0; width: 0px; margin: 0px; padding: 0px; }
   a.anchorbar, a.anchorbar::before, a.anchorbar::after { transition: all 0.2s; }
   
   /* modal + mobile menu */
   
   .modal 
   { 
      display: none; position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; 
      background-color: var(--link); padding: 30px; overflow: hidden;
      z-index: 600;
   }
   .modal a.badge { display: block; margin-bottom: 20px; }
   .modal ul { list-style-type: none; margin: 0px; padding: 0px; font-weight: 600; }
   .modal ul li ul { display: none; }
   .modal ul.quick { font-weight: 300; }
   .modal ul a { font-size: 24px; line-height: 26px; display: block; padding: 10px 0px; color: #FFFFFF; }
   .modal .modal-close 
   { 
      display: block; text-align: right; margin-bottom: 20px; color: rgba(255,255,255,0.7); 
      font-size: 30px; cursor: pointer;
   }
   
   /* search */
   
   .modal#searchmodal { background-color: #D7E6FF; color: #000000; }
   .modal#searchmodal h2 { color: #000000; margin-bottom: 10px; }
   /* #searchmodal .inner { position: absolute; top: 50%; left: 30px; right: 30px; height: 80px; margin-top: -40px; } */
	#searchmodal .inner { padding: 30px; }
		
   #searchmodal form { display: flex; justify-content: center; align-items: stretch; height: 50px; }
   #searchmodal form #s { flex-grow: 1; margin-right: 10px; background-color: #FFFFFF; border: 0px; }
   #searchmodal .modal-close { color: #3451A0; }
   #searchmodal .modal-close:hover { color: #E29E32; }
		
	/* instagram feed */
	
	#instagram-zone { background-color: #D7E6FF; padding-top: 2px; padding-bottom: 30px; }
	#instagram-id { width: 100%; margin: 20px 0; text-align: center; }
	#instagram-id a { font-weight: 600; }
	#instagram-id a:hover { color: #FFFFFF; }
	#instagram-id .instagram 
	{ 
		width: 36px; height: 36px; border-radius: 18px; background: #D80AAD url('images/icon-instagram.svg') center center no-repeat;
		display: inline-block; background-size: 50% auto; background-repeat: no-repeat; position: relative; top: 13px; margin: 0 5px 0 0;
	}
	#sb_instagram .sb_instagram_header, .sb_instagram_header, #sbi_load { display: none !important; }
	 
   /* large desktop */
   
   @media screen and (min-width: 1600px)
   {
      body, input, textarea, select { font-size: 1.2vw; line-height: 140%; }
		ul#menu li { font-size: 1.2vw; line-height: 1.2; }
		#link-bar li a { font-size: 1vw; line-height: 1; }
		#menu li ul li a { font-size: 0.9vw; line-height: 1; }
      #footer { font-size: 1.1vw; }
      .frame { padding-left: 10%; padding-right: 10%; }
      .frame.caption { padding-right: 5%; }
      .tile { flex-basis: 20%; }
		a.badge img { height: 5vw; }
   }

   /* standard desktop + tablet landscape */
   
   @media screen and (max-width: 1200px)
   {

		#footer .columns div { width: calc(50% - 10px); }
      a.badge img { height: 50px; }
      #footer .frame { flex-wrap: wrap; }
      #footer .exterior { background-position: right center; }
      .classbrowser select, .classbrowser input { font-size: 20px; line-height: 24px; padding: 5px 10px; max-width: 200px; }
      .tile { flex-basis: 33.3333%; }
      .secondary form.signup { flex-wrap: wrap; }
      .secondary form.signup input.email { flex-basis: 100%; margin-bottom: 5px; }
   }
   
   /* tablet portrait (avg 768) */
   
   @media screen and (min-width: 1001px) { #mobilenav { display: none; } }
   @media screen and (max-width: 1000px)
   {
      /* a.badge img { height: 30px; top: 0; } */
      ul#menu, #link-box { display: none; }
      #mobilenav { font-size: 23px; line-height: 20px; }
      #mobilenav a { display: inline-block; margin-left: 10px; }
      #hd .frame { align-items: center; }
      #hd .frame, body.home #hd .frame { padding-top: 5px; padding-bottom: 0px; }
		a.badge { padding-bottom: 5px; }
      
      body.home #welcome .secondary { display: none; }
      section.primary, section.secondary { width: 100%; padding-right: 0px; margin-bottom: 0px; }

		#footer .frame { padding-top: 20px; }
		#footer .columns div { width: 100%; }
      .columns { flex-wrap: wrap; }
      .column, .column.primary, .column.secondary { flex-basis: 100%; padding-left: 25px; padding-right: 25px; }

      body.onecolumn .column.secondary { flex-wrap: wrap; }
      body.onecolumn .column.secondary .section { flex-basis: 100%; padding-bottom: 0px; margin-bottom: 25px; }
   
      .secondary form.signup input.email { flex-basis: auto; margin-bottom: 0px; }
            
		.tile { width: 50%; }

      .slide .frame.caption { bottom: 25px; max-width: 75%; }
      .caption h2 { font-size: 150%; }
      
      .appeal { margin-top: 25px; margin-bottom: 25px; }
   
      .classbrowser select, .classbrowser input { font-size: 18px; line-height: 22px; padding: 5px 10px; }
      .classbrowser .select { width: 25%; }
      .classbrowser select { padding-right: 28px; width: inherit; }
      
      .appeal section:first-child { order: 2; }
      .appeal section:last-child { order: 1; margin-bottom: 0px; }
      .appeal section:last-child .img { padding-top: 33%; }
      
      table.calendar-grid { border-spacing: 10px; margin: -10px; }
      table.calendar-grid td { font-size: 1.7vw; line-height: 120%; }
      table.calendar-grid td a .date { display: none }
         
         
   }
   
   /* phone (avg 360) */
   

   @media screen and (max-width: 600px)
   {
      body { padding-top: 40px; }
		a.badge { padding: 5px 0 0 0; }
      a.badge img { height: 40px; } 
    
/*      #membership-feature { padding-right: 0px; background-image: none; } */
      #membership-feature p.intro { display: none; }
    
      #hd { position: fixed; top: 0px; left: 0px; right: 0px; box-shadow: 0px 2px 10px rgba(0,0,0,0.2); z-index: 500; }
      #hd .frame, body.home #hd .frame { padding-top: 0px; padding-bottom: 0px; }
      body.home #mlsn { display: none; }
      body.home #welcome.frame { padding-top: 25px; padding-bottom: 25px; }

/*      .slide { height: 50vw; } */
      .slide .frame.caption { max-width: 100%; background-color: rgba(52,81,160,0.8); bottom: 0px; padding-top: 15px; padding-bottom: 15px; }
      .slide .frame.caption .date { display: none; }
      
      h2 { font-size: 150%; line-height: 100%; }
      .caption h2 { font-size: 150%; }
      h3, h4 { font-size: 110%; line-height: 100%; }
      h5 { font-size: 100%; }
      
      .tile { flex-basis: 50%; }    
		#footer .columns { margin-bottom: 20px; }
		#footer .footlogo img { height: 36px; }
      #footer p { margin: 0px; padding: 0px; }
		#footer a.social { width: 24px; height: 24px; font-size: 12px; line-height: 26px; }
      .classbrowser .select { width: 100%; }
      .classbrowser select { width: 100%; max-width: 100%; margin-bottom: 5px; }
		.double .tile, .full .tile { width: 100%; }
   }  
   
   /* print */

   @media print
   {
      #hd, .secondary, body.onecolumn .column.secondary { display: none; }
      #mlsn { display: block; }
      .column.primary { flex-basis: 100%; padding-right: 0px; }
      #footer { background-color: #FFFFFF; color: #666666; border-top: 1px solid #999999; padding-top: 30px; }
      #footer .icons { display: none; }
      .frame { padding: 0px; }
   }