lp menus

css/global-style.css

@@ -18255,10 +18255,7 @@ main,
   border-radius: 6px;
   background-color: white;
   color: #333;
-  padding-top: 1rem !important;
-  padding-right: 2rem !important;
-  padding-bottom: 1rem !important;
-  padding-left: 2rem !important;
+  padding: 1rem 2rem;
   margin-top: 1rem;
 }
 .layout-content > :first-child {
@@ -18460,4 +18457,133 @@ main,
 .region-sidebar-second .block .field--name-body > :last-child {
   margin-bottom: 0;
 }
+
+.page-node-type-landing-page-paragraphs .layout-content {
+  background: none;
+  padding: 0;
+  border: 0;
+}
+
+.help-me {
+  position: relative;
+  margin: 0 0 1rem 0;
+  padding: 1rem;
+  border: 1px solid rgba(51, 51, 51, 0.25);
+  border-radius: 6px;
+  background-color: white;
+  color: #333;
+}
+.help-me .libraryh3lp iframe,
+.help-me .libraryh3lp2 iframe {
+  width: 100% !important;
+}
+.help-me > :first-child {
+  margin-top: 0;
+}
+.help-me > :last-child {
+  margin-bottom: 0;
+}
+@media screen and (min-width: 52.5em) {
+  .help-me {
+    max-width: 90rem;
+    margin-right: auto;
+    margin-left: auto;
+    display: flex;
+    flex-flow: row wrap;
+  }
+  .help-me .left {
+    flex: 0 0 66.6666666667%;
+    max-width: 66.6666666667%;
+    padding-right: 0.625rem;
+    padding-left: 0.625rem;
+  }
+}
+@media screen and (min-width: 52.5em) and (min-width: 40em) {
+  .help-me .left {
+    padding-right: 0.9375rem;
+    padding-left: 0.9375rem;
+  }
+}
+@media screen and (min-width: 52.5em) {
+  .help-me .right {
+    flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+    padding-right: 0.625rem;
+    padding-left: 0.625rem;
+  }
+}
+@media screen and (min-width: 52.5em) and (min-width: 40em) {
+  .help-me .right {
+    padding-right: 0.9375rem;
+    padding-left: 0.9375rem;
+  }
+}
+
+.subject_librarians {
+  text-align: center;
+  max-width: 90rem;
+  margin-right: auto;
+  margin-left: auto;
+  display: flex;
+  flex-flow: row wrap;
+  flex-wrap: wrap;
+}
+.subject_librarians > .subject_librarian__container {
+  flex: 0 0 50%;
+  max-width: 50%;
+}
+@media screen and (min-width: 52.5em) {
+  .subject_librarians {
+    flex-wrap: wrap;
+    justify-content: space-around;
+  }
+  .subject_librarians > .subject_librarian__container {
+    flex: 0 0 25%;
+    max-width: 25%;
+  }
+}
+
+.subject_librarian {
+  transition: all 0.5s ease;
+  padding: 1rem;
+  padding: 0.5rem;
+  width: 161px;
+  border: 1px solid #ddd;
+  height: 215px;
+  margin: 0 auto;
+  margin-bottom: 0.5rem;
+  background: #f5f4f4;
+}
+.subject_librarian:hover {
+  -webkit-box-shadow: 0px 3px 4px 2px rgba(0, 0, 0, 0.46);
+  -moz-box-shadow: 0px 3px 4px 2px rgba(0, 0, 0, 0.46);
+  box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.2);
+}
+.subject_librarian__link {
+  color: #333;
+}
+.subject_librarian__image {
+  margin: 0 auto;
+}
+.subject_librarian__image img {
+  border: 1px solid #ccc;
+}
+.subject_librarian__name {
+  margin: 0;
+  font-size: 1.125rem;
+  line-height: 1.3;
+}
+.subject_librarian__subjects {
+  list-style: none;
+  margin: 0;
+  font-size: 0.875rem;
+  font-family: "Roboto Condensed", sans-serif;
+  line-height: 1.2;
+}
+@media screen and (min-width: 52.5em) {
+  .subject_librarian {
+    margin: initial;
+    margin-bottom: 0.5rem;
+  }
+}
 /*# sourceMappingURL=global-style.css.map */

css/sass/_component_import.scss

@@ -35,4 +35,5 @@
 @import "components/topnav";
 @import "components/page-layout";
 @import "components/blocks";
+@import "components/landingpage";
 

css/sass/components/_landingpage.scss

@@ -0,0 +1,79 @@
+.page-node-type-landing-page-paragraphs .layout-content {
+
+  background: none;
+  padding:0;
+  border:0;
+}
+.help-me {
+  .libraryh3lp iframe,
+  .libraryh3lp2 iframe {
+    width: 100% !important;
+  }
+  @include callout();
+  @include breakpoint(840px) {
+    @include flex-grid-row();
+    .left {
+      @include flex-grid-column(8);
+    }
+    .right {
+      @include flex-grid-column(4);
+    }
+  }
+}
+.subject_librarians {
+  text-align: center;
+  @include flex-grid-row();
+  @include flex-grid-layout(2, '.subject_librarian__container');
+  @include breakpoint(840px) {
+    @include flex-grid-layout(4, '.subject_librarian__container');
+    justify-content: space-around;
+  }
+}
+.subject_librarian {
+  transition: all 0.5s ease;
+  &:hover {
+    -webkit-box-shadow: 0px 3px 4px 2px rgba(0, 0, 0, 0.46);
+    -moz-box-shadow: 0px 3px 4px 2px rgba(0, 0, 0, 0.46);
+    box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.2);
+  }
+  &__link {
+    color: $black;
+  }
+
+  padding: $global-padding;
+  &__image_container {
+  }
+  &__image {
+    //width:100px;
+
+    margin: 0 auto;
+    img {
+      border: 1px solid #ccc;
+    }
+  }
+  &__name {
+    margin: 0;
+    font-size: rem-calc(18);
+    line-height: 1.3;
+  }
+  &__subjects {
+    list-style: none;
+    margin: 0;
+    font-size: rem-calc(14);
+    font-family: $roboto-condensed;
+    //font-weight: bold;
+    line-height: 1.2;
+  }
+  padding: 0.5rem;
+  width: 161px;
+  border: 1px solid #ddd;
+  height: 215px;
+  margin: 0 auto;
+  @include breakpoint(840px) {
+    margin: initial;
+
+    margin-bottom: 0.5rem;
+  }
+  margin-bottom: 0.5rem;
+  background: #f5f4f4;
+}

css/sass/components/_page-layout.scss

@@ -11,7 +11,8 @@ main,
 }
 .layout-content {
   @include callout();
-  @include padding(1, 2, 1, 2);
+  //@include padding(1, 2, 1, 2);
+  padding: 1rem 2rem;
   @include clearfix;
   margin-top: $global-margin;
   h1 {