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


  /*---------- paragrah commons -----------------*/
  .paragraph {
    clear: both;
    overflow: hidden;
  }

  .paragraph--type--layout-style .inner {
    /* padding-bottom:4%; */
  }

  /*----------------- style 1 ----------------------------------*/
  .s1 {
    display: block;
    overflow: hidden;
    -webkit-clip-path: polygon(0 15%, 100% 0%, 100% 85%, 0% 100%);
    clip-path: polygon(0 15%, 100% 0%, 100% 85%, 0% 100%);
  }

  .s1 .inner {
    padding: 3%;
  }

  .s1 a {
    text-decoration: none;
  }

  .s1 h2 {
    font-size: 36px;
    line-height: 38px;
    font-weight: lighter;
    margin-top: 0px;
  }
}

@media screen and (max-width: 800px) {
  .s1 {
	  display: block;
	  overflow: hidden;
	  -webkit-clip-path: polygon(0 5%, 100% 0%, 100% 95%, 0% 100%);
	  clip-path:polygon(0 5%, 100% 0%, 100% 95%, 0% 100%);
  }
}

/*----------------------------------------------*/
@media screen and (min-width: 480px) {
  .s2 .inner {
    padding: 3%;
    max-width: 1200px;
    margin: 0 auto;
  }

  .s2 .paragraph--type--cluster-of-figures .inner {
    align-items: stretch;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
  }

  .s2 .paragraph--type--cluster-of-figures .figen {
    min-width: 200px;
    padding: 2%;
    min-height: 210px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    flex: 40%;
    margin: 1%;
    border-radius: 0.5rem;
  }

  .s2 .paragraph--type--cluster-of-figures h2 {
    font-size: 36px;
    line-height: 38px;
    font-weight: lighter;
    margin-top: 0px;
    position: absolute;
    bottom: 70px;
    width: 100%;
  }

  /*----------------------------------------------*/
  .s3 .paragraph--type--cluster-of-figures .inner {
    padding: 3%;
    max-width: 1200px;
    margin: 0 auto;
  }

  .s3 .paragraph--type--cluster-of-figures {
    text-align: center;
    align-items: stretch;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
  }

  .s3 .paragraph--type--cluster-of-figures .figen {
    min-width: 200px;
    padding: 2%;
    min-height: 210px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    flex: 22%;
    margin: 1%;
    border-radius: 0.5rem;
  }

  .s3 .paragraph--type--cluster-of-figures h2 {
    font-size: 36px;
    line-height: 38px;
    font-weight: lighter;
    margin-top: 0px;
  }

  /*-----------------style 4----------------------------------*/
  .s4 {
    display: block;
    overflow: hidden;
    -webkit-clip-path: polygon(0 0, 100% 15%, 100% 100%, 0 85%);
    clip-path: polygon(0 0, 100% 15%, 100% 100%, 0 85%);
  }

  .s4 .inner {
    padding: 3%;
  }

  .s4 a {
    text-decoration: none;
  }

  .s4 h2 {
    font-size: 36px;
    line-height: 38px;
    font-weight: lighter;
    margin-top: 0px;
  }
}

@media screen and (max-width: 800px) {
  .s4 {
	  display: block;
	  overflow: hidden;
	  -webkit-clip-path: (0 0, 100% 5%, 100% 100%, 0 95%);
	  clip-path:polygon(0 0, 100% 5%, 100% 100%, 0 95%);
  }
}

/*----------------------------------------------*/
@media screen and (min-width: 480px) {
  .paragraph--type--image-slider {
    display: block;
    margin: 0 auto !important;
  }


  .zeromargins {
    padding: 0;
  }

  .text-long {
    /* max-width: 700px; */
  }

  .collapseline {
    color: #d7592b;
  }

  .collapseline.iscollapsed {
    color: #2c2c2c;
  }

  .collapseline::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    padding-right: 1rem;
    content: "\f078" !important;
    vertical-align: 0px !important;
    font-size: 14px !important;
  }

  .collapseline.iscollapsed::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    padding-right: 1rem;
    content: "\f054" !important;
    vertical-align: 0px !important;
    font-size: 14px !important;
    color: #23689b;
  }

  .collapseline:not(.none):hover {
    filter: none;
    -webkit-transition: transform 2s ease-in-out;
    color: #e95d0f;
  }


  /*quotedblock*/
  .quotedblock > .inner {
    position: relative;
  }

  .quotedblock .entity-reference-revisions {
    padding: 0.1rem 0;
  }

  .quotedblock .entity-reference-revisions::before {
    content: url(../images/quote.svg);
    position: absolute;
    right: 5%;
  }

  .quotedblock .entity-reference-revisions::after {
    content: "";
    position: absolute;
    top: 25%;
    height: 250px;
    display: block;
    width: 250px;
    background: url(../images/polka-dots-lg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    left: -5%;
  }

  .quotedblock .entity-reference-revisions > div {
    background: #1e355e;
    margin: 3rem 0 !important;
    padding: 5rem 3rem 5rem 14rem !important;
  }

  .quotedblock h2,
  .quotedblock h3 {
    color: #fff;
  }

  .quotedblock p {
    color: #a3c1d6;
  }
}
@media (max-width: 700px) {
  .quotedblock .entity-reference-revisions::after {
display:none;
  }
  .quotedblock .entity-reference-revisions > div {
background: #1e355e;
margin: 3rem 0 !important;
padding: 5rem 3rem 5rem 3rem !important;
  }
}

@media screen and (min-width: 480px) {
  /*imagedotted */
  .imagedotted,
  .imagedotted .paragraph {
    overflow: visible !important;
    position: relative;
  }

  .imagedotted .image {
    display: inline-block;
    position: relative;
    float: left;
  }

  .imagedotted .image::before {
    left: -20%;
    top: 30%;
    content: "";
    position: absolute;
    height: 73px;
    display: block;
    width: 262px;
    background: url(../images/wave.svg);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .imagedotted .string {
    display: inline-block;
    vertical-align: top;
    font-size: 2.1rem;
    color: #1e355e;
    font-weight: bold;
    margin: 1rem 0;
  }

  .imagedotted .image {
    display: inline-block;
    position: relative;
    float: left;
    margin-right: 1em;
  }

  .imagedotted .text-long {
    border: 3px dotted #1e355e;
    margin-left: 20%;
    color: #929292;
    padding: 1rem;
  }


  /*noimagedotted */
  .noimagedotted {
    padding-top: 3rem;
    border: 3px dotted #1e355e;
    overflow: visible !important;
    position: relative;
  }

  .noimagedotted .string {
    display: inline-block;
    vertical-align: top;
    font-size: 2.1rem;
    color: #1e355e;
    font-weight: bold;
    margin: 0;
  }

  .noimagedotted .text-long {

    color: #929292;
    padding: 1rem;
  }


  /*imageleftwave */
  .imageleftwave .inner,
  .imageleftwave .paragraph {
    overflow: visible !important;
    position: relative;
  }

  .imageleftwave .image {
    display: inline-block;
    position: relative;
    float: left;
    margin-right: 1em;

  }

  .imageleftwave .image::before {
    content: "";
    position: absolute;
    height: 103px;
    display: block;
    background: url(../images/blue-wave-lg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 7%;
    left: -20%;
    width: 70%;
  }

  .imageleftwave .string {
    display: inline-block;
    vertical-align: top;
    color: #1e355e;
    font-weight: bold;
    margin: 1rem 0;
    font-size: 1.5rem;
    font-family: 'Roboto Slab', serif;
  }

  .imageleftwave .text-long {
    margin-left: 20%;
    color: #929292;
  }

  /*image paragraph waves*/
  .imagewavered .image,
  .imagewaveblue .image {
    position: relative;
    margin-left: 20%;
  }

  .imagewavered .image::before {
    content: "";
    position: absolute;
    left: -20%;
    top: 30%;
    height: 73px;
    display: block;
    width: 262px;
    background: url(../images/wave.svg);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .imagewaveblue .image::before {
    content: "";
    position: absolute;
    height: 103px;
    display: block;
    background: url(../images/blue-wave-lg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 7%;
    left: -20%;
    width: 70%;
  }

  /*imageright */
  .imageright .inner,
  .imageright .paragraph {
    /* overflow: visible !important; */
    position: relative;
  }

  .imageright .image {
    display: inline-block;
    position: relative;
    float: right;
    margin-right: 1em;

  }

  .imageright .string {
    display: inline-block;
    vertical-align: top;
    color: #1e355e;
    font-weight: bold;
    margin: 0;
    font-size: 1.5rem;
    font-family: 'Roboto Slab', serif;
  }

  .imageright .text-long {
    color: #929292;
  }


  /*partial title underline*/
  .collapsed.collapsebigtitle .string,
  .collapsible.collapsebigtitle .string {
    font-size: 1.5rem;
    position: relative;
    color: #1e355e;
    margin-bottom: 30px;
  }

  .collapsed.collapsebigtitle .string:after,
  .collapsible.collapsebigtitle .string:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 3px;
    bottom: -14px;
    border-bottom: 3px solid #a3c1d6;
    left: 0;
  }

  h1.partialtitleunderline
  h2.partialtitleunderline,
  h3.partialtitleunderline,
  h4.partialtitleunderline,
  h5.partialtitleunderline,
  h6.partialtitleunderline,
  .searchapi h3 {
    position: relative;
    color: #1e355e;
    margin-bottom: 30px;
    font-family: 'Roboto Slab', serif;
  }

  h1.partialtitleunderline:after,
  h2.partialtitleunderline:after,
  h3.partialtitleunderline:after,
  h4.partialtitleunderline:after,
  h5.partialtitleunderline:after,
  h6.partialtitleunderline:after,
  .searchapi h3:after {
    content: "";
    position: absolute;
    width: 50px;
    height: 3px;
    bottom: -14px;
    border-bottom: 3px solid #a3c1d6;
    left: 0;
  }

  .partialtitleunderline .collapseline::after {
    left: 24px;
  }

  /* inline paragraphs */
  .inlinepara > .inner > .entity-reference-revisions {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-evenly;
  }

  .inlinepara > .inner > .entity-reference-revisions > div {
    display: contents;
  }

  .texttabs .inner:not(.btns) {
    border: 1px solid #ccc;
  }

  /*-------backgrounds---------------*/
  .lighttext {
    padding-top: 3rem;
    background-color: #fbfbfb;
  }

  .whitebg {
    background-color: #ffffff !important;
  }

  /*----------------------------------*/
  .searchapi h3 {
    padding-bottom: 1rem !important;
    margin-bottom: 60px;
  }

  .searchapi .views-field-field-social-share-image {
    float: left;
    padding: 0 20px;
  }

  .w50:not(.contentwidth),
  .w50.contentwidth .paragraph {
    max-width: 50%;
  }

  .w60:not(.contentwidth),
  .w60.contentwidth .paragraph {
    max-width: 60%;
  }

  .w70:not(.contentwidth),
  .w70.contentwidth .paragraph {
    max-width: 70%;
  }

  .w80:not(.contentwidth),
  .w80.contentwidth .paragraph {
    max-width: 80%;
  }

  .w90:not(.contentwidth),
  .w90.contentwidth .paragraph {
    max-width: 90%;
  }

  .w100:not(.contentwidth),
  .w100.contentwidth .paragraph {
    max-width: 100%;
  }

  .mwp250:not(.contentwidth),
  .mwp250.contentwidth .paragraph {
    max-width: 250px;
  }

  .mwp350:not(.contentwidth),
  .mwp350.contentwidth .paragraph {
    max-width: 350px;
  }

  .mwp450:not(.contentwidth),
  .mwp450.contentwidth .paragraph {
    max-width: 450px;
  }

  .mwp550:not(.contentwidth),
  .mwp550.contentwidth .paragraph {
    max-width: 550px;
  }

  .mwp650:not(.contentwidth),
  .mwp650.contentwidth .paragraph {
    max-width: 650px;
  }

  .mwp750:not(.contentwidth),
  .mwp750.contentwidth .paragraph {
    max-width: 750px;
  }

  .vh10 {
    min-height: 10vh;
  }

  .vh20 {
    min-height: 20vh;
  }

  .vh30 {
    min-height: 30vh;
  }

  .vh40 {
    min-height: 40vh;
  }

  .vh50 {
    min-height: 50vh;
  }

  .vh60 {
    min-height: 60vh;
  }

  .vh70 {
    min-height: 70vh;
  }

  .vh80 {
    min-height: 80vh;
  }

  .vh90 {
    min-height: 90vh;
  }

  .vh100 {
    min-height: 100vh;
  }

  .vh150 {
    min-height: 150vh;
  }

  .vh200 {
    min-height: 200vh;
  }

  .pvh5 {
    padding-top: 5vh;
    padding-bottom: 5vh;
  }

  .pvh10 {
    padding-top: 10vh;
    padding-bottom: 10vh;
  }

  .pvh20 {
    padding-top: 20vh;
    padding-bottom: 20vh;
  }

  .layoutwidth.w100 .inner {
    max-width: 100vw;
    margin: 0;
    overflow: hidden;
    padding: 0;
  }

  .layoutwidth.w90 .inner {
    max-width: 90vw;
    margin: 0;
    overflow: hidden;
    padding: 0;
  }

  .layoutwidth.w80 .inner {
    max-width: 80vw;
    margin: 0;
    overflow: hidden;
    padding: 0;
  }

  .layoutwidth.w70 .inner {
    max-width: 70vw;
    margin: 0;
    overflow: hidden;
    padding: 0;
  }

  .layoutwidth.w60 .inner {
    max-width: 60vw;
    margin: 0;
    overflow: hidden;
    padding: 0;
  }

  .layoutwidth.w50 .inner {
    max-width: 50vw;
    margin: 0;
    overflow: hidden;
    padding: 0;
  }

  .flexcol {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-evenly;
  }

  .flexcol.center {
    justify-content: center;
  }

  .masonry {
    -moz-column-gap: 75px;
    -webkit-column-gap: 75px;
    column-gap: 75px;
    -moz-column-count: 3;
    -webkit-column-count: 3;
    column-count: 3;
  }

  .masonry_item {
    display: inline-block;
    padding: 10px 20px;
    min-width: 440px;
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 440px) {
.masonry {
-moz-column-count: 1;
-webkit-column-count: 1;
column-count: 1;
}
}

@media only screen and (min-width: 880px) {
.masonry {
-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;
}
}

@media only screen and (min-width: 1320px) {
.masonry {
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
}