@media (min-width:1025px) {
  *#dm .dmInner *.u_1721508574 { text-align:center !important; }

  *#dm .dmInner div.u_1617020276 .copyright { font-size:12px !important; }
}
@media (min-width:768px) and (max-width:1024px) {
  *#dm .dmInner *.u_1721508574 { text-align:center !important; }
}
@media (min-width:0px) and (max-width:767px) {
  *#dm .dmInner *.u_1721508574 { text-align:center !important; }

  *#dm .dmInner div.u_1991322460 *.open-hours-item dt { font-size:60px !important; }

  *#dm .dmInner div.u_1991322460 *.open-hours-item dd { font-size:60px !important; }

  *#dm .dmInner div.u_1991322460 *.open-hours-item time { font-size:60px !important; }

  *#dm .dmInner div.u_1991322460 *.open-hours-special { font-size:60px !important; }
}
@media all {
  *#dm .dmInner div.u_1721508574 p { color:var(--color_8) !important; }

  *#dm .dmInner div.u_1721508574 li { color:var(--color_8) !important; }

  *#dm .dmInner div.u_1721508574 { color:var(--color_8) !important; }

  *#dm .dmInner *.u_1617020276 .copyright { text-align:CENTER !important; }

  *#dm .dmInner div.u_1617020276 .copyright { color:var(--color_8) !important; }

  *#dm .dmInner div.u_1549675135 {
    border-style:solid !important;
    border-color:rgb(0,0,0) !important;
    border-width:0 !important;
    padding:0 !important;
    border-radius:0% !important;
  }

  *#dm .dmInner *.u_1549675135 .svg { width:100% !important; }

  *#dm .dmInner div.u_1693898361 {
    border-style:solid !important;
    border-color:rgb(0,0,0) !important;
    border-width:0 !important;
    padding:0 !important;
    border-radius:0% !important;
  }

  *#dm .dmInner *.u_1693898361 .svg { width:100% !important; }

  *#dm .dmInner div.u_1367838862 {
    border-style:solid !important;
    border-color:rgb(0,0,0) !important;
    border-width:0 !important;
    padding:0 !important;
    border-radius:0% !important;
  }

  *#dm .dmInner *.u_1367838862 .svg { width:100% !important; }

  *#dm .dmInner div.u_1268225084 {
    border-style:solid !important;
    border-color:rgb(0,0,0) !important;
    border-width:0 !important;
    padding:0 !important;
    border-radius:0% !important;
  }

  *#dm .dmInner *.u_1268225084 .svg { width:100% !important; }

  *#dm .dmInner div.u_1217874404 img { border-radius:10px 10px 10px 10px !important; }

  *#dm .dmInner div.u_1643705917 img { border-radius:10px 10px 10px 10px !important; }

  *#dm .dmInner div.u_1449897411 img { border-radius:10px 10px 10px 10px !important; }

  *#dm .dmInner div.u_1020391019 img { border-radius:10px 10px 10px 10px !important; }

  *#dm .dmInner *.u_1643705917 { width:100% !important; }

  *#dm .dmInner *.u_1449897411 { width:100% !important; }

  *#dm .dmInner *.u_1020391019 { width:100% !important; }

  *#dm .dmInner *.u_1217874404 { width:100% !important; }

  *#dm .dmInner *.u_1011056193 { width:100% !important; }

  *#dm .dmInner div.u_1392379571 img { border-radius:15px 15px 15px 15px !important; }

  *#dm .dmInner *.u_1392379571 { width:100% !important; }

  *#dm .dmInner *.u_1806846799 .svg { width:100% !important; }

  *#dm .dmInner *.u_1911501301 .svg { width:100% !important; }

  *#dm .dmInner div.u_1911501301 {
    background-color:var(--color_4) !important;
    background-image:initial !important;
    border-radius:25% !important;
    padding:12.5% !important;
  }

  *#dm .dmInner *.u_1711159968 .svg { width:100% !important; }

  *#dm .dmInner div.u_1711159968 {
    background-color:var(--color_4) !important;
    background-image:initial !important;
    border-radius:25% !important;
    padding:12.5% !important;
  }

  *#dm .dmInner div.u_1806846799 .svg { fill:var(--color_4) !important; }

  *#dm .dmInner div.u_1791371797 {
    border-style:solid !important;
    border-color:rgb(36,36,36) rgb(36,36,36) rgb(36,36,36) rgb(36,36,36) !important;
    border-width:0px 1px 0px 0px !important;
  }

  *#dm .dmInner div.u_1506227519 {
    border-style:solid !important;
    border-color:rgb(36,36,36) rgb(36,36,36) rgb(36,36,36) rgb(36,36,36) !important;
    border-width:0px 1px 0px 0px !important;
  }

  *#dm .dmInner div.u_1657274170 {
    border-style:solid !important;
    border-color:rgb(36,36,36) rgb(36,36,36) rgb(36,36,36) rgb(36,36,36) !important;
    border-width:0px 1px 0px 0px !important;
  }

  *#dm .dmInner *.u_1113925048 { display:block !important; }

  *#dm .dmInner *.u_1677832865 { display:none !important; }

  *#dm .dmInner *.u_1013315465 { display:none !important; }

  *#dm .dmInner *.u_1647042513 { display:block !important; }

  *#dm .dmInner *.u_1527521419 { display:none !important; }

  *#dm .dmInner *.u_1897100493 { display:none !important; }

  *#dm .dmInner *.u_1552670530 { display:block !important; }

  *#dm .dmInner *.u_1756685749 { display:none !important; }

  *#dm .dmInner *.u_1637335801 { display:none !important; }

  *#dm .dmInner *.u_1089937558 { display:block !important; }

  *#dm .dmInner *.u_1792274927 { display:none !important; }

  *#dm .dmInner *.u_1555873776 { display:none !important; }

  *#dm .dmInner *.u_1260905161 { display:block !important; }

  *#dm .dmInner *.u_1864864719 { display:none !important; }

  *#dm .dmInner *.u_1267708068 { display:none !important; }

  *#dm .dmInner *.u_1225014394 { display:block !important; }

  *#dm .dmInner *.u_1827339631 { display:none !important; }

  *#dm .dmInner *.u_1359688097 { display:none !important; }

  *#dm .dmInner *.u_1754838995 { display:block !important; }

  *#dm .dmInner *.u_1411499003 { display:none !important; }

  *#dm .dmInner *.u_1359836830 { display:none !important; }

  *#dm .dmInner *.u_1335442179 { display:block !important; }

  *#dm .dmInner *.u_1582643775 { display:none !important; }

  *#dm .dmInner *.u_1234120321 { display:none !important; }

  *#dm .dmInner div.u_1617680633 {
    background-color:var(--color_2) !important;
    background-image:initial !important;
    border-radius:5px 5px 5px 5px !important;
  }

  *#dm .dmInner div.u_1433797103 img {
    border-radius:15px 15px 15px 15px !important;
    object-fit:cover !important;
  }

  *#dm .dmInner div.u_1991322460 *.open-hours-item dt {
    text-align:left !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1991322460 *.open-hours-item dd {
    text-align:left !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1991322460 *.open-hours-item time {
    text-align:left !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1991322460 *.open-hours-special {
    text-align:left !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1657274170 .svg { fill:var(--color_1) !important; }

  *#dm .dmInner div.u_1506227519 .svg { fill:var(--color_1) !important; }

  *#dm .dmInner div.u_1791371797 .svg { fill:var(--color_1) !important; }

  *#dm .dmInner div.u_1911501301 .svg { fill:var(--color_1) !important; }

  *#dm .dmInner div.u_1711159968 .svg { fill:var(--color_1) !important; }

  *#dm .dmInner div.u_1806846799 {
    background-color:var(--color_1) !important;
    background-image:initial !important;
    border-radius:25% !important;
    padding:12.5% !important;
  }

  *#dm .dmInner div.u_1263437392 img { border-radius:10px 10px 10px 10px !important; }

  *#dm .dmInner *.u_1263437392 { width:100% !important; }

  *#dm .dmInner div.u_1475937965 {
    border-style:solid !important;
    border-color:rgb(0,0,0) !important;
    border-width:0 !important;
    padding:0 !important;
    border-radius:0% !important;
  }

  *#dm .dmInner *.u_1475937965 .svg { width:100% !important; }

  *#dm .dmInner div.u_1709270652 img { object-fit:contain !important; }

  *#dm .dmInner div.u_1190872296 img { object-fit:contain !important; }

  *#dm .dmInner div.u_1850965401 img { object-fit:contain !important; }

  *#dm .dmInner div.u_1045493095 img { object-fit:contain !important; }

  *#dm .dmInner div.u_3105146653 img { object-fit:contain !important; }

  *#dm .dmInner div.u_1363485363 p {
    color:var(--color_1) !important;
    direction:ltr !important;
    text-transform:none !important;
    text-shadow:none !important;
    font-weight:400 !important;
    text-decoration:none solid rgb(36,36,36) !important;
    letter-spacing:normal !important;
    font-family: Raleway !important;
    line-height:24px !important;
    font-style:normal !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1363485363 li {
    color:var(--color_1) !important;
    direction:ltr !important;
    text-transform:none !important;
    text-shadow:none !important;
    font-weight:400 !important;
    text-decoration:none solid rgb(36,36,36) !important;
    letter-spacing:normal !important;
    font-family: Raleway !important;
    line-height:24px !important;
    font-style:normal !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1363485363 {
    color:var(--color_1) !important;
    direction:ltr !important;
    text-transform:none !important;
    text-shadow:none !important;
    font-weight:400 !important;
    text-decoration:none solid rgb(36,36,36) !important;
    letter-spacing:normal !important;
    font-family: Raleway !important;
    line-height:24px !important;
    font-style:normal !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1172074210 p {
    color:var(--color_1) !important;
    direction:ltr !important;
    text-transform:none !important;
    text-shadow:none !important;
    font-weight:400 !important;
    text-decoration:none solid rgb(36,36,36) !important;
    letter-spacing:normal !important;
    font-family: Raleway !important;
    line-height:24px !important;
    font-style:normal !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1172074210 li {
    color:var(--color_1) !important;
    direction:ltr !important;
    text-transform:none !important;
    text-shadow:none !important;
    font-weight:400 !important;
    text-decoration:none solid rgb(36,36,36) !important;
    letter-spacing:normal !important;
    font-family: Raleway !important;
    line-height:24px !important;
    font-style:normal !important;
    font-size:14px !important;
  }

  *#dm .dmInner div.u_1172074210 {
    color:var(--color_1) !important;
    direction:ltr !important;
    text-transform:none !important;
    text-shadow:none !important;
    font-weight:400 !important;
    text-decoration:none solid rgb(36,36,36) !important;
    letter-spacing:normal !important;
    font-family: Raleway !important;
    line-height:24px !important;
    font-style:normal !important;
    font-size:14px !important;
  }

  *#dm .dmInner a.u_1597423342 {
    background-color:var(--color_9) !important;
    background-image:initial !important;
  }

  *#dm .dmInner a.u_1195175973 {
    background-color:var(--color_9) !important;
    background-image:initial !important;
  }

  *#dm .dmInner div.u_1011056193 img {
    border-radius:15px 15px 15px 15px !important;
    box-shadow:var(--color_1) 3px 0px 11px 0px !important;
  }
}
separatorHomeCss{color:red !important}separatorHomeCss{color:red !important}@media all {
    
#e1eaf8f3 {
    min-height: 240px;
    flex-wrap: nowrap;
    column-gap: 4%;
    row-gap: 24px;
    width: 100%;
    padding: 300px 4% 300px 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#ec73fcb3::before, #ec73fcb3 > .bgExtraLayerOverlay {
    border-radius: inherit;
    background-color: var(--color_7);
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    position: absolute;
    opacity: 0.52;
    content: '';
    height: 100%;
}
#ec73fcb3 {
    background-attachment: fixed;
    background-image: url(https://lirp.cdn-website.com/b68e129e/dms3rep/multi/opt/511679037_695670653447114_3656905830877265259_n-1920w.jpg);
}
    
#a952eaab.flex-element.widget-wrapper > [data-element-type] {
    padding: 5px 30px 5px 30px;
}
#a952eaab {
    align-self: auto;
    max-width: 100%;
    width: 100.01%;
    justify-self: auto;
    height: auto;
    order: 1;
    grid-area: auto / auto / auto / auto;
}
    
#aed9f11f {
    max-width: 100%;
    width: 100%;
    height: auto;
    order: 0;
}
    
#cf439356 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 24px;
    width: 48%;
    align-items: center;
    min-width: 4%;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#ca031354 {
    margin: 0px 0% 0px 0%;
}
    
#group_uqd {
    width: 48%;
    min-width: 4%;
    min-height: 8px;
    column-gap: 4%;
    row-gap: 24px;
    padding: 16px 16px 16px 16px;
}
    
#widget_dal {
    width: 66.47%;
    height: 714px;
    max-width: 100%;
    align-self: center;
    justify-self: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    grid-area: auto / auto / auto / auto;
}
    
#widget_n3i {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
}
    
#\30 c8c0577 {
    max-width: 100%;
    width: 180px;
    height: 52px;
    order: 1;
    justify-self: auto;
    align-self: auto;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#e1eaf8f3 {
    flex-direction: row;
    padding-left: 3%;
    min-height: 240px;
    flex-wrap: nowrap;
    padding-right: 3%;
}
    
#ec73fcb3::before, #ec73fcb3 > .bgExtraLayerOverlay {
    border-radius: inherit;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    position: absolute;
    content: '';
    height: 100%;
}
#ec73fcb3 {
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
    
#a952eaab {
    width: 79%;
}
    
#cf439356 {
    width: 48%;
    min-height: 8px;
}
    
#group_uqd {
    width: 48%;
    min-height: 8px;
}
}



@media (max-width: 767px) {
    
#e1eaf8f3 {
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#ec73fcb3 {
    grid-template-rows: minmax(8px, max-content);
}
}



@media (max-width: 767px) {
    
#e1eaf8f3 {
    flex-direction: column;
    min-height: 0;
    flex-wrap: nowrap;
    padding: 50px 20px 50px 20px;
}
    
#ec73fcb3::before, #ec73fcb3 > .bgExtraLayerOverlay {
    border-radius: inherit;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    position: absolute;
    content: '';
    height: 100%;
}
#ec73fcb3 {
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
    
#a952eaab.flex-element.widget-wrapper > [data-element-type] {
    padding-left: 15px;
    padding-right: 15px;
}
#a952eaab {
    width: 100%;
}
    
#cf439356 {
    width: 100%;
    min-height: 80px;
    align-items: flex-start;
    row-gap: 16px;
}
    
#group_uqd {
    width: 100%;
    min-height: 80px;
    align-items: center;
}
    
#\30 c8c0577 {
    width: 186px;
    align-self: center;
    margin-left: 0%;
    margin-right: 0%;
    height: 76px;
}
    
#widget_dal {
    width: 100.01%;
    height: 716px;
    align-self: flex-start;
    margin-left: 0px;
    margin-right: 0px;
}
}



@media all {
    
#\32 0d1f1c9 {
    min-height: 600px;
    column-gap: 0%;
    row-gap: 0px;
    max-width: none;
    width: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#\39 2b44cb0 {
    align-self: auto;
    max-width: 100%;
    width: 100%;
    justify-self: auto;
    height: auto;
    order: 0;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#e42d6328 {
    align-self: auto;
    max-width: 100%;
    width: 55.439525940258804%;
    justify-self: auto;
    height: 500px;
    order: 0;
    grid-area: auto / auto / auto / auto;
}
    
#\36 7c3988b {
    align-self: auto;
    max-width: 100%;
    width: 100%;
    justify-self: auto;
    height: auto;
    order: 1;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#\39 25cc21d::before, #\39 25cc21d > .bgExtraLayerOverlay {
    background-color: var(--color_5);
    border-radius: inherit;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    position: absolute;
    opacity: 0.88;
    content: '';
    height: 100%;
}
#\39 25cc21d {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 24px;
    width: 50.00254125412541%;
    align-items: center;
    background-image: url(https://lirp.cdn-website.com/b68e129e/dms3rep/multi/opt/scraped-sites/roofsbyguardian/scraped/images/gallery-banner-1920w.jpg);
    min-width: 4%;
    order: 0;
    padding: 50px 16px 50px 4%;
    margin: 0px 0% 0px 0%;
}
#\39 25cc21d.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAHAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHxAAAQMDBQAAAAAAAAAAAAAAAQAEEQIDBRITQXHh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwT/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIDEhP/2gAMAwEAAhEDEQA/AKMtjHDNlS4vuahbJ0wOSs0d+TFJjv1EUuOVog+cn//Z');
}
    
#aada9867 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 19px;
    width: 50%;
    min-width: 4%;
    order: 1;
    padding: 50px 5% 50px 5%;
    margin: 0px 0% 0px 0%;
}
    
#b68b1678 {
    margin: 0px 0% 0px 0%;
}
    
#a704b6ac {
    max-width: 100%;
    width: 100%;
    height: auto;
    order: 2;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#\32 0d1f1c9 {
    min-height: auto;
}
    
#e42d6328 {
    width: 89.22%;
}
    
#\39 25cc21d::before, #\39 25cc21d > .bgExtraLayerOverlay {
    
}
#\39 25cc21d {
    background-repeat: no-repeat;
    background-size: cover;
    padding-left: 3%;
}
#\39 25cc21d.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAHAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHxAAAQMDBQAAAAAAAAAAAAAAAQAEEQIDBRITQXHh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwT/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIDEhP/2gAMAwEAAhEDEQA/AKMtjHDNlS4vuahbJ0wOSs0d+TFJjv1EUuOVog+cn//Z');
}
    
#aada9867 {
    row-gap: 12px;
    padding: 20px 20px 20px 3%;
}
}



@media (max-width: 767px) {
    
#\32 0d1f1c9 {
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#b663fcc2 {
    grid-template-rows: minmax(8px, max-content);
}
}



@media (max-width: 767px) {
    
#\32 0d1f1c9 {
    flex-direction: column;
    min-height: unset;
    padding: 0px 0px 0px 0px;
}
    
#\39 2b44cb0 {
    order: 0;
}
    
#e42d6328 {
    width: 87.10%;
    height: 352px;
}
    
#\36 7c3988b {
    order: 1;
}
    
#\39 25cc21d::before, #\39 25cc21d > .bgExtraLayerOverlay {
    
}
#\39 25cc21d {
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    min-height: 269px;
    align-items: center;
    order: 1;
    padding: 36px 36px 36px 36px;
}
#\39 25cc21d.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAHAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHxAAAQMDBQAAAAAAAAAAAAAAAQAEEQIDBRITQXHh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwT/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIDEhP/2gAMAwEAAhEDEQA/AKMtjHDNlS4vuahbJ0wOSs0d+TFJjv1EUuOVog+cn//Z');
}
    
#aada9867 {
    row-gap: 9px;
    width: 100%;
    min-height: 10px;
    align-items: flex-start;
    order: 0;
    height: auto;
    padding: 36px 36px 36px 36px;
}
    
#a704b6ac {
    order: 2;
}
}



@media all {
    
#f8f8ba47 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 34.58%;
    min-width: 4%;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#\37 2472d2c {
    min-height: 243px;
    flex-wrap: nowrap;
    column-gap: 2%;
    row-gap: 12px;
    width: 100%;
    padding: 50px 4% 15px 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#\38 5af87fb {
    max-width: 100%;
    width: 100%;
    justify-self: auto;
    height: auto;
    order: 0;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#bbe5b0c6 {
    background-color: var(--color_4);
    background-image: initial;
}
    
#\33 73bf801 {
    max-width: 100%;
    width: 100%;
    justify-self: auto;
    height: auto;
    order: 0;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#b64114ba {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 63.348598130841125%;
    min-width: 4%;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#f7907c7a {
    margin: 0px 0% 0px 0%;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#f8f8ba47 {
    width: 54.56%;
    min-height: 8px;
}
    
#\37 2472d2c {
    flex-direction: row;
    padding-left: 3%;
    min-height: auto;
    flex-wrap: nowrap;
    padding-right: 3%;
}
    
#b64114ba {
    width: 43.32437671865928%;
    min-height: 8px;
}
}



@media (max-width: 767px) {
    
#\37 2472d2c {
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#bbe5b0c6 {
    grid-template-rows: minmax(8px, max-content);
}
}



@media (max-width: 767px) {
    
#f8f8ba47 {
    width: 100%;
    min-height: 10px;
    align-items: center;
    height: auto;
    padding-bottom: 0px;
}
    
#\37 2472d2c {
    padding-top: 25px;
    flex-direction: column;
    padding-left: 20px;
    min-height: 0;
    flex-wrap: nowrap;
    padding-right: 20px;
}
    
#b64114ba {
    width: 100%;
    min-height: 10px;
    align-items: center;
    height: auto;
    padding-top: 0px;
}
}



@media all {
    
#\37 a3398ae {
    min-height: 240px;
    flex-wrap: wrap;
    column-gap: 2%;
    row-gap: 12px;
    width: 100%;
    padding: 15px 4% 50px 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#\33 5aff9db {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 10px;
    border-radius: 15px 15px 15px 15px;
    background-color: var(--color_5);
    width: 32%;
    justify-content: space-between;
    background-image: initial;
    min-width: 4%;
    flex: 1 1 auto;
    box-shadow: var(--color_1) 3px 0px 11px 0px;
    padding: 16px 16px 16px 16px;
    margin: 0% 0% 0% 0%;
}
    
#c5d36e60 {
    min-height: 8px;
    border-color: #000000 #000000 #000000 #000000;
    column-gap: 4%;
    row-gap: 10px;
    border-radius: 15px 15px 15px 15px;
    background-color: var(--color_5);
    width: 32%;
    justify-content: space-between;
    border-width: 0px 0px 0px 0px;
    background-image: initial;
    border-style: solid;
    min-width: 4%;
    flex: 1 1 auto;
    box-shadow: var(--color_1) 3px 0px 11px 0px;
    padding: 16px 16px 16px 16px;
    margin: 0% 0% 0% 0%;
}
    
#\37 916cbbf {
    background-color: var(--color_4);
    background-image: initial;
}
    
#\39 23c1055 {
    margin: 0px 0% 0px 0%;
}
    
#\34 e19f744 {
    align-self: auto;
    max-width: 100%;
    width: 40px;
    justify-self: auto;
    height: auto;
    order: 2;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#fd023c2c {
    max-width: 100%;
    width: 100%;
    height: 200px;
    order: 3;
}
    
#fbdd5f58 {
    align-self: auto;
    max-width: 100%;
    width: 40px;
    justify-self: auto;
    height: auto;
    order: 2;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#\38 bc1c060 {
    align-self: auto;
    max-width: 100%;
    width: 40px;
    justify-self: auto;
    height: auto;
    order: 2;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#fb2337bc {
    max-width: 100%;
    width: 100%;
    height: 200px;
    order: 3;
}
    
#b4dfd5c2 {
    max-width: 100%;
    width: 100%;
    height: 200px;
    order: 3;
}
    
#b275d09f {
    align-self: auto;
    max-width: 100%;
    width: 40px;
    justify-self: auto;
    height: auto;
    order: 2;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#\39 026c6f6 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 10px;
    border-radius: 15px 15px 15px 15px;
    background-color: var(--color_5);
    width: 32%;
    justify-content: space-between;
    background-image: initial;
    min-width: 4%;
    flex: 1 1 auto;
    box-shadow: var(--color_1) 3px 0px 11px 0px;
    padding: 16px 16px 16px 16px;
    margin: 0% 0% 0% 0%;
}
    
#\30 4b3c804 {
    max-width: 100%;
    width: 100%;
    height: 200px;
    order: 3;
}
    
#b7fe64e0 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 10px;
    border-radius: 15px 15px 15px 15px;
    background-color: var(--color_5);
    width: 32%;
    justify-content: space-between;
    background-image: initial;
    min-width: 4%;
    flex: 1 1 auto;
    box-shadow: var(--color_1) 3px 0px 11px 0px;
    padding: 16px 16px 16px 16px;
    margin: 0% 0% 0% 0%;
}
    
#\31 2e6fc17 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 10px;
    border-radius: 15px 15px 15px 15px;
    background-color: var(--color_5);
    width: 32%;
    justify-content: space-between;
    background-image: initial;
    min-width: 4%;
    flex: 1 1 auto;
    box-shadow: var(--color_1) 3px 0px 11px 0px;
    padding: 16px 16px 16px 16px;
    margin: 0% 0% 0% 0%;
}
    
#\31 2c0584c {
    align-self: auto;
    max-width: 100%;
    width: 40px;
    justify-self: auto;
    height: auto;
    order: 2;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#d59f2b3f {
    max-width: 100%;
    width: 100%;
    height: 200px;
    order: 3;
}
    
#widget_k7v {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
}
    
#widget_0pp {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
}
    
#widget_l8n {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
}
    
#widget_qe8 {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
}
    
#widget_5n6 {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#\33 5aff9db {
    flex: 1 1 auto;
    width: 49%;
    min-height: 8px;
    margin: 0% 0% 0% 0%;
}
    
#\37 a3398ae {
    column-gap: 2%;
    flex-direction: row;
    padding-left: 3%;
    min-height: 240px;
    flex-wrap: wrap;
    padding-right: 3%;
}
    
#c5d36e60 {
    flex: 1 1 auto;
    width: 49%;
    min-height: 8px;
    margin: 0% 0% 0% 0%;
}
    
#\34 e19f744 {
    height: auto;
}
    
#\39 026c6f6 {
    flex: 1 1 auto;
    width: 49%;
    min-height: 8px;
    margin: 0% 0% 0% 0%;
}
    
#b7fe64e0 {
    flex: 1 1 auto;
    width: 49%;
    min-height: 8px;
    margin: 0% 0% 0% 0%;
}
    
#\31 2e6fc17 {
    flex: 1 1 auto;
    width: 49%;
    min-height: 8px;
    margin: 0% 0% 0% 0%;
}
}



@media (max-width: 767px) {
    
#\37 a3398ae {
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#\37 916cbbf {
    grid-template-rows: minmax(8px, max-content);
}
}



@media (max-width: 767px) {
    
#\33 5aff9db {
    width: 100%;
    min-height: 80px;
    align-items: flex-start;
}
    
#\37 a3398ae {
    flex-direction: column;
    padding-left: 20px;
    min-height: 0;
    flex-wrap: nowrap;
    padding-right: 20px;
    padding-bottom: 25px;
}
    
#fb2337bc {
    height: 240px;
}
    
#c5d36e60 {
    width: 100%;
    min-height: 80px;
    align-items: flex-start;
}
    
#b4dfd5c2 {
    height: 240px;
}
    
#\34 e19f744 {
    height: auto;
}
    
#fd023c2c {
    height: 240px;
}
    
#\39 026c6f6 {
    width: 100%;
    min-height: 80px;
    align-items: flex-start;
}
    
#b7fe64e0 {
    width: 100%;
    min-height: 80px;
    align-items: flex-start;
}
    
#\30 4b3c804 {
    height: 240px;
}
    
#\31 2e6fc17 {
    width: 100%;
    min-height: 80px;
    align-items: flex-start;
}
    
#d59f2b3f {
    height: 240px;
}
}



@media all {
    
#cee8c23c {
    align-self: auto;
    max-width: 100%;
    width: 55.439525940258804%;
    justify-self: auto;
    height: 500px;
    order: 0;
    grid-area: auto / auto / auto / auto;
}
    
#e1aa8f6a {
    max-width: 100%;
    width: 100%;
    height: auto;
}
    
#\39 ae27f5b {
    min-height: auto;
    column-gap: 0%;
    row-gap: 0px;
    max-width: none;
    width: 100%;
    padding: 0px 0px 0px 0px;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#\34 f3af795::before, #\34 f3af795 > .bgExtraLayerOverlay {
    background-color: var(--color_5);
    border-radius: inherit;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    position: absolute;
    opacity: 0.88;
    content: '';
    height: 100%;
}
#\34 f3af795 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 24px;
    width: 50.00254125412541%;
    align-items: center;
    background-image: url(https://lirp.cdn-website.com/b68e129e/dms3rep/multi/opt/scraped-sites/roofsbyguardian/scraped/images/gallery-banner-1920w.jpg);
    min-width: 4%;
    order: 1;
    padding: 50px 4% 50px 16px;
    margin: 0px 0% 0px 0%;
}
#\34 f3af795.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAHAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHxAAAQMDBQAAAAAAAAAAAAAAAQAEEQIDBRITQXHh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwT/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIDEhP/2gAMAwEAAhEDEQA/AKMtjHDNlS4vuahbJ0wOSs0d+TFJjv1EUuOVog+cn//Z');
}
    
#\30 96f0d8f {
    margin: 0px 0% 0px 0%;
}
    
#\30 b5fadc5 {
    max-width: 100%;
    width: 100%;
    height: auto;
}
    
#\39 f5703cd {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 19px;
    width: 50%;
    min-width: 4%;
    order: 0;
    padding: 50px 5% 50px 5%;
    margin: 0px 0% 0px 0%;
}
    
#\39 affe11d {
    align-self: auto;
    max-width: 100%;
    width: 180px;
    justify-self: auto;
    height: 52px;
    order: 0;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#cee8c23c {
    width: 89.22%;
}
    
#\39 ae27f5b {
    min-height: auto;
}
    
#\34 f3af795::before, #\34 f3af795 > .bgExtraLayerOverlay {
    
}
#\34 f3af795 {
    background-repeat: no-repeat;
    background-size: cover;
    padding-right: 3%;
}
#\34 f3af795.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAHAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHxAAAQMDBQAAAAAAAAAAAAAAAQAEEQIDBRITQXHh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwT/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIDEhP/2gAMAwEAAhEDEQA/AKMtjHDNlS4vuahbJ0wOSs0d+TFJjv1EUuOVog+cn//Z');
}
    
#\39 f5703cd {
    row-gap: 12px;
    padding: 20px 20px 20px 3%;
}
}



@media (max-width: 767px) {
    
#\39 ae27f5b {
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#\34 19b44ff {
    grid-template-rows: minmax(8px, max-content);
}
}



@media (max-width: 767px) {
    
#cee8c23c {
    width: 87.10%;
    height: 352px;
}
    
#\39 ae27f5b {
    flex-direction: column;
    min-height: unset;
    padding: 0px 0px 0px 0px;
}
    
#\34 f3af795::before, #\34 f3af795 > .bgExtraLayerOverlay {
    
}
#\34 f3af795 {
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    min-height: 269px;
    align-items: center;
    padding: 36px 36px 36px 36px;
}
#\34 f3af795.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAHAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHxAAAQMDBQAAAAAAAAAAAAAAAQAEEQIDBRITQXHh/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwT/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIDEhP/2gAMAwEAAhEDEQA/AKMtjHDNlS4vuahbJ0wOSs0d+TFJjv1EUuOVog+cn//Z');
}
    
#\39 f5703cd {
    row-gap: 9px;
    width: 100%;
    min-height: 440px;
    align-items: flex-start;
    padding: 36px 36px 36px 36px;
}
}



@media all {
    
#\36 7618870 {
    min-height: auto;
    flex-wrap: nowrap;
    column-gap: 4%;
    row-gap: 24px;
    width: 100%;
    padding-top: 50px;
    padding-right: 4%;
    padding-left: 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#c53c45a4 {
    margin: 0px 0% 0px 0%;
}
    
#ea44e81d {
    max-width: 100%;
    width: 100%;
    justify-self: auto;
    height: auto;
    order: 1;
    align-self: auto;
    grid-area: auto / auto / auto / auto;
}
    
#c4091e13 {
    max-width: 100%;
    width: 100%;
    justify-self: auto;
    height: auto;
    order: 0;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
    
#\33 8e77382 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 100%;
    align-items: center;
    min-width: 4%;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#f302fc1f {
    background-color: var(--color_4);
    background-image: initial;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#\36 7618870 {
    flex-direction: row;
    padding-left: 3%;
    min-height: auto;
    flex-wrap: nowrap;
    padding-right: 3%;
}
    
#\33 8e77382 {
    width: 100%;
    min-height: 8px;
}
}



@media (max-width: 767px) {
    
#\36 7618870 {
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#f302fc1f {
    grid-template-rows: minmax(8px, max-content);
}
}



@media (max-width: 767px) {
    
#\36 7618870 {
    padding-top: 25px;
    flex-direction: column;
    padding-left: 20px;
    min-height: 0;
    flex-wrap: nowrap;
    padding-right: 20px;
}
    
#\33 8e77382 {
    width: 100%;
    min-height: 171px;
    align-items: flex-start;
    height: auto;
}
}



@media all {
    
#feaa341f {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 10px;
    border-radius: 15px 15px 15px 15px;
    background-color: var(--color_8);
    width: 100%;
    align-items: center;
    background-image: initial;
    min-width: 4%;
    padding: 16px 16px 16px 16px;
}
    
#\33 119a61c {
    background-color: var(--color_4);
    background-image: initial;
}
    
#\31 d8d8ed5 {
    margin: 0px 0% 0px 0%;
}
    
#bb75c713 {
    max-width: 100%;
    width: 100%;
    height: auto;
    order: 0;
}
    
#\34 46e28eb {
    min-height: 110px;
    flex-wrap: nowrap;
    column-gap: 2%;
    row-gap: 12px;
    width: 100%;
    padding: 15px 4% 15px 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#feaa341f {
    width: 100%;
    min-height: 8px;
    margin: 0% 0% 0% 0%;
}
    
#\34 46e28eb {
    column-gap: 2%;
    flex-direction: row;
    padding-left: 3%;
    padding-bottom: 15px;
    min-height: 240px;
    flex-wrap: nowrap;
    padding-right: 3%;
}
}



@media (max-width: 767px) {
    
#\33 119a61c {
    grid-template-rows: minmax(8px, max-content);
}
    
#\34 46e28eb {
    grid-area: 1 / 1 / span 1 / span 1;
}
}



@media (max-width: 767px) {
    
#feaa341f {
    width: 100%;
    min-height: 80px;
    align-items: center;
}
    
#\34 46e28eb {
    flex-direction: column;
    padding-left: 20px;
    padding-bottom: 15px;
    min-height: 0;
    flex-wrap: nowrap;
    padding-right: 20px;
}
}



@media all {
    
#\35 6122bef {
    min-height: auto;
    flex-wrap: nowrap;
    column-gap: 4%;
    row-gap: 24px;
    width: 100%;
    padding-right: 4%;
    padding-bottom: 50px;
    padding-left: 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#c8942abe {
    max-width: 100%;
    width: 100%;
    justify-self: auto;
    height: auto;
    order: 1;
    grid-area: auto / auto / auto / auto;
}
    
#fb2dc9f3 {
    background-color: var(--color_4);
    background-image: initial;
}
    
#\38 c12c400 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 100%;
    align-items: center;
    min-width: 4%;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#\36 a24c6a5 {
    margin: 0px 0% 0px 0%;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#\35 6122bef {
    flex-direction: row;
    min-height: auto;
    flex-wrap: nowrap;
    padding: 15px 3% 50px 3%;
}
    
#\38 c12c400 {
    width: 100%;
    min-height: 8px;
}
}



@media (max-width: 767px) {
    
#\35 6122bef {
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#fb2dc9f3 {
    grid-template-rows: minmax(8px, max-content);
}
}



@media (max-width: 767px) {
    
#\35 6122bef {
    flex-direction: column;
    min-height: 0;
    flex-wrap: nowrap;
    padding: 15px 20px 50px 20px;
}
    
#\38 c12c400 {
    width: 100%;
    min-height: 77px;
    align-items: flex-start;
    height: auto;
}
}



@media all {
    
#a4449c30 {
    width: 250px;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 0;
    grid-area: auto / auto / auto / auto;
}
    
#\35 c3ba599 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 24px;
    width: 33%;
    min-width: 4%;
    background-color: rgba(0, 0, 0, 0);
    background-image: initial;
    align-items: center;
    border-radius: 0px 0px 0px 0px;
    order: 1;
    padding: 16px 16px 16px 16px;
}
    
#\32 9991d8d {
    min-height: auto;
    column-gap: 2%;
    row-gap: 12px;
    width: 100%;
    flex-wrap: nowrap;
    padding: 50px 4% 50px 4%;
}
    
#\34 8b3c549 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 24px;
    width: 65%;
    min-width: 4%;
    order: 0;
    padding: 16px 16px 16px 16px;
}
    
#\31 269a6ff {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
    justify-self: auto;
    align-self: auto;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#\32 9991d8d {
    padding-left: 2%;
    padding-right: 2%;
    padding-bottom: 15px;
}
}



@media (max-width: 767px) {
    
#\35 c3ba599 {
    width: 100%;
    min-height: 80px;
    align-items: center;
    padding-top: 0px;
}
    
#\32 9991d8d {
    min-height: unset;
    flex-direction: column;
    padding-left: 4%;
    padding-right: 4%;
    padding-top: 25px;
}
    
#\34 8b3c549 {
    width: 100%;
    min-height: 80px;
    align-items: center;
}
    
#a4449c30 {
    width: 200px;
}
}



@media all {
    
#b4d67a23 {
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    min-height: auto;
    max-height: 100%;
    row-gap: 16px;
    column-gap: 4%;
    background-color: var(--color_1);
    background-image: initial;
    border-radius: 15px 15px 15px 15px;
    order: 0;
    align-self: auto;
    padding: 16px 16px 16px 16px;
    grid-area: auto / auto / auto / auto;
}
    
#\30 ac6ebdc {
    min-height: auto;
    flex-wrap: nowrap;
    column-gap: 2%;
    row-gap: 12px;
    width: 100%;
    padding: 30px 4% 30px 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#\39 a5f928b {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 2;
}
    
#b81bc302 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 49%;
    min-width: 4%;
    justify-content: flex-start;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#d44a6b7f.flex-element.widget-wrapper > [data-element-type] {
    padding: 5px 5px 5px 5px;
}
#d44a6b7f {
    width: 60px;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 0;
    grid-area: auto / auto / auto / auto;
}
    
#\34 a891ac0 {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    min-height: auto;
    max-height: 100%;
    row-gap: 24px;
    column-gap: 4%;
    margin-left: -40px;
}
    
#\35 c5d02af {
    width: 100%;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 1;
    grid-area: auto / auto / auto / auto;
}
    
#de57065a::before, #de57065a > .bgExtraLayerOverlay {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--color_8);
    opacity: 0.72;
    border-radius: inherit;
}
#de57065a {
    background-attachment: fixed;
    background-image: url(https://lirp.cdn-website.com/b68e129e/dms3rep/multi/opt/scraped-sites/roofsbyguardian/scraped/images/reviews-banner-1920w.jpg);
    border-style: solid;
    border-color: #000000 #000000 #000000 #000000;
    border-width: 0px 0px 0px 0px;
}
#de57065a.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAADAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHBAAAQMFAAAAAAAAAAAAAAAAAAECEQMEBSEi/8QAFAEBAAAAAAAAAAAAAAAAAAAABP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AIchq0WDLuqPlelAFiP/2Q==');
}
    
#\30 b3e993f {
    margin: 0px 0% 0px 0%;
}
    
#\38 fcac51a {
    width: 49%;
    min-width: 4%;
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    justify-content: flex-start;
    padding: 16px 16px 16px 16px;
}
    
#d922a6bd {
    justify-content: flex-start;
    align-items: flex-start;
    width: 99.99845876576968%;
    min-height: auto;
    max-height: 100%;
    row-gap: 12px;
    column-gap: 4%;
    background-color: var(--color_4);
    background-image: initial;
    border-radius: 15px 15px 15px 15px;
    align-self: auto;
    order: 0;
    padding: 16px 16px 16px 16px;
    grid-area: auto / auto / auto / auto;
}
    
#\31 a6d0506 {
    width: 92.68430152488095%;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 1;
    grid-area: auto / auto / auto / auto;
}
    
#f991ecd8 {
    width: 99.99890823202615%;
    height: auto;
    max-width: 100%;
    order: 3;
    justify-self: auto;
    align-self: auto;
    margin-top: -20px;
    grid-area: auto / auto / auto / auto;
}
    
#\38 610436f.flex-element.widget-wrapper > [data-element-type] {
    padding: 5px 5px 5px 5px;
}
#\38 610436f {
    width: 60px;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 0;
    grid-area: auto / auto / auto / auto;
}
    
#\34 1712a7f {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    min-height: auto;
    max-height: 100%;
    row-gap: 24px;
    column-gap: 4%;
    justify-self: auto;
    align-self: auto;
    order: 0;
    margin: 0px -40px 0px -40px;
    grid-area: auto / auto / auto / auto;
}
    
#c9d2ab9e {
    width: 100%;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 1;
    grid-area: auto / auto / auto / auto;
}
    
#\34 4c6cb0f {
    justify-content: flex-start;
    align-items: flex-start;
    width: 99.99845876576968%;
    min-height: auto;
    max-height: 100%;
    row-gap: 12px;
    column-gap: 4%;
    background-color: var(--color_4);
    background-image: initial;
    border-radius: 15px 15px 15px 15px;
    align-self: auto;
    order: 1;
    padding: 16px 16px 16px 16px;
    grid-area: auto / auto / auto / auto;
}
    
#\31 feda3ed {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    min-height: auto;
    max-height: 100%;
    row-gap: 24px;
    column-gap: 4%;
    justify-self: auto;
    align-self: auto;
    order: 0;
    margin: 0px -40px 0px -40px;
    grid-area: auto / auto / auto / auto;
}
    
#\39 5ba2cb7.flex-element.widget-wrapper > [data-element-type] {
    padding: 5px 5px 5px 5px;
}
#\39 5ba2cb7 {
    width: 60px;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 0;
    grid-area: auto / auto / auto / auto;
}
    
#\35 0ac8e5f {
    width: 100%;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 1;
    grid-area: auto / auto / auto / auto;
}
    
#\33 1ae5822 {
    width: 92.68430152488095%;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 1;
    grid-area: auto / auto / auto / auto;
}
    
#\33 da582e0 {
    width: 99.99890823202615%;
    height: auto;
    max-width: 100%;
    order: 3;
    justify-self: auto;
    align-self: auto;
    margin-top: -20px;
    grid-area: auto / auto / auto / auto;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#b81bc302 {
    width: 100%;
    min-height: 80px;
    padding-bottom: 0px;
}
    
#de57065a::before, #de57065a > .bgExtraLayerOverlay {
    
}
#de57065a {
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: 50% 50%;
}
#de57065a.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAADAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHBAAAQMFAAAAAAAAAAAAAAAAAAECEQMEBSEi/8QAFAEBAAAAAAAAAAAAAAAAAAAABP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AIchq0WDLuqPlelAFiP/2Q==');
}
    
#\30 ac6ebdc {
    flex-direction: column;
    padding-left: 3%;
    min-height: 0;
    flex-wrap: nowrap;
    padding-right: 3%;
    row-gap: 16px;
}
    
#\38 fcac51a {
    width: 100%;
    min-height: 80px;
    padding-top: 0px;
}
}



@media (max-width: 767px) {
    
#de57065a {
    grid-template-rows: minmax(8px, max-content);
}
#de57065a.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAADAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHBAAAQMFAAAAAAAAAAAAAAAAAAECEQMEBSEi/8QAFAEBAAAAAAAAAAAAAAAAAAAABP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AIchq0WDLuqPlelAFiP/2Q==');
}
    
#\30 ac6ebdc {
    grid-area: 1 / 1 / span 1 / span 1;
}
}



@media (max-width: 767px) {
    
#b81bc302 {
    width: 100%;
    min-height: 10px;
    align-items: center;
    padding-bottom: 0px;
}
    
#de57065a::before, #de57065a > .bgExtraLayerOverlay {
    
}
#de57065a {
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: 50% 50%;
}
#de57065a.lazy {
    background-image: url('data:image/jpeg; base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAADAAoDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAQG/8QAHBAAAQMFAAAAAAAAAAAAAAAAAAECEQMEBSEi/8QAFAEBAAAAAAAAAAAAAAAAAAAABP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AIchq0WDLuqPlelAFiP/2Q==');
}
    
#\30 ac6ebdc {
    flex-direction: column;
    min-height: 0;
    flex-wrap: nowrap;
    row-gap: 16px;
    padding: 0px 20px 25px 20px;
}
    
#\38 fcac51a {
    width: 100%;
    min-height: 10px;
    align-items: center;
    padding-top: 0px;
}
}



@media all {
    
#\37 a3b65f3 {
    margin: 0px 0% 0px 0%;
}
    
#widget_j8v {
    order: 1;
}
    
#\31 93ec584 {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 32%;
    align-items: center;
    min-width: 4%;
    flex-direction: row;
    order: 2;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#\35 ce8b8ef {
    background-color: var(--color_4);
    background-image: initial;
}
    
#ef2f6756 {
    min-height: 152px;
    flex-wrap: nowrap;
    column-gap: 2%;
    row-gap: 12px;
    width: 100%;
    padding: 25px 4% 25px 4%;
    margin: 0px 0% 0px 0%;
    grid-area: 1 / 1 / span 1 / span 1;
}
    
#widget_767.flex-element.widget-wrapper > [data-element-type] {
    padding-right: 10px;
}
#widget_767 {
    width: 60px;
    height: auto;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#widget_k4f {
    width: 100%;
    height: auto;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#b2393a8a {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 32%;
    align-items: center;
    min-width: 4%;
    flex-direction: row;
    order: 1;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#\37 7ba6bf7.flex-element.widget-wrapper > [data-element-type] {
    padding-right: 10px;
}
#\37 7ba6bf7 {
    width: 60px;
    height: auto;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#e9cb93ee {
    min-height: 8px;
    column-gap: 4%;
    row-gap: 16px;
    width: 32%;
    align-items: center;
    min-width: 4%;
    flex-direction: row;
    order: 0;
    padding: 16px 16px 16px 16px;
    margin: 0px 0% 0px 0%;
}
    
#\37 e0b2c8c.flex-element.widget-wrapper > [data-element-type] {
    padding-right: 10px;
}
#\37 e0b2c8c {
    width: 60px;
    height: auto;
    max-width: 100%;
    order: 0;
    margin: 0px 0% 0px 0%;
}
    
#widget_5sg {
    width: 100%;
    height: auto;
    max-width: 100%;
}
    
#\31 438ba0f {
    width: 100%;
    height: auto;
    max-width: 100%;
    justify-self: auto;
    align-self: auto;
    order: 1;
    margin: 0px 0% 0px 0%;
    grid-area: auto / auto / auto / auto;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#\31 93ec584 {
    width: 49%;
    min-height: 8px;
    justify-content: flex-start;
    flex: 1 1 auto;
    margin: 0% 0% 0% 0%;
}
    
#ef2f6756 {
    flex-direction: row;
    min-height: 240px;
    flex-wrap: wrap;
    padding-left: 3%;
    padding-right: 3%;
    column-gap: 2%;
}
    
#b2393a8a {
    width: 49%;
    min-height: 8px;
    flex: 1 1 auto;
    margin: 0% 0% 0% 0%;
}
    
#e9cb93ee {
    width: 49%;
    min-height: 8px;
    flex: 1 1 auto;
    margin: 0% 0% 0% 0%;
}
    
#widget_k4f {
    width: 38.09%;
}
    
#widget_767 {
    width: 50px;
}
}



@media (max-width: 767px) {
    
#\35 ce8b8ef {
    grid-template-rows: minmax(8px, max-content);
}
    
#ef2f6756 {
    grid-area: 1 / 1 / span 1 / span 1;
}
}



@media (max-width: 767px) {
    
#\31 93ec584 {
    row-gap: 16px;
    padding-left: 16px;
    width: 100%;
    min-height: 10px;
    align-items: center;
    padding-right: 16px;
    height: auto;
}
    
#ef2f6756 {
    flex-direction: column;
    min-height: 0;
    flex-wrap: nowrap;
    row-gap: 16px;
    padding: 25px 20px 25px 20px;
}
    
#b2393a8a {
    row-gap: 16px;
    padding-left: 16px;
    width: 100%;
    min-height: 10px;
    align-items: center;
    padding-right: 16px;
    height: auto;
}
    
#e9cb93ee {
    row-gap: 16px;
    padding-left: 16px;
    width: 100%;
    min-height: 10px;
    align-items: center;
    padding-right: 16px;
    height: auto;
}
    
#\31 438ba0f {
    align-self: center;
    margin-bottom: 0px;
    margin-top: 0px;
    width: 52.49%;
}
    
#widget_5sg {
    width: 51.06%;
}
    
#widget_767 {
    width: 54.2109px;
}
    
#widget_k4f {
    width: 76.58%;
}
}



@media all {
    
#f33beedb {
    min-height: 80px;
    column-gap: 4%;
    row-gap: 24px;
    width: 100%;
    min-width: 4%;
    padding: 16px 16px 16px 16px;
}
    
#d1d4c090 {
    min-height: 80px;
    column-gap: 4%;
    row-gap: 24px;
    width: 100%;
    min-width: 4%;
    flex-direction: row;
    padding: 16px 16px 16px 16px;
}
    
#\33 ddbfb21 {
    padding-bottom: 4%;
    min-height: 0;
    column-gap: 4%;
    row-gap: 24px;
    width: 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    max-width: none;
}
    
#widget_c8i {
    width: 100%;
    height: auto;
    max-width: 100%;
    order: 0;
}
    
#widget_t0f {
    width: 10%;
    height: 100px;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#e8e6a9e1 {
    width: 10%;
    height: 100px;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#\30 8bce0d4 {
    width: 10%;
    height: 100px;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#\31 bdaa9f1 {
    width: 10%;
    height: 100px;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#\31 710fd4b {
    width: 26.44%;
    height: 100px;
    max-width: 100%;
    margin: 0px 0% 0px 0%;
}
    
#widget_do5 {
    width: 100%;
    height: auto;
    position: relative;
    min-width: 10px;
    min-height: 10px;
    max-width: 100%;
    order: 0;
    margin-top: 54px;
}
}



@media (min-width: 768px) and (max-width: 1024px) {
    
#\33 ddbfb21 {
    padding-left: 2%;
    padding-right: 2%;
}
}



@media (max-width: 767px) {
    
#f33beedb {
    width: 100%;
    min-height: 80px;
    align-items: center;
}
    
#d1d4c090 {
    width: 100%;
    min-height: 80px;
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
}
    
#\33 ddbfb21 {
    min-height: unset;
    flex-direction: column;
    padding-left: 4%;
    padding-right: 4%;
}
    
#widget_t0f {
    height: 120px;
    width: 40%;
    margin: 0px 0% 0px 0%;
}
    
#e8e6a9e1 {
    height: 120px;
    width: 40%;
    margin: 0px 0% 0px 0%;
}
    
#\30 8bce0d4 {
    height: 120px;
    width: 40%;
    margin: 0px 0% 0px 0%;
}
    
#\31 bdaa9f1 {
    height: 120px;
    width: 40%;
    margin: 0px 0% 0px 0%;
}
    
#\31 710fd4b {
    height: 100px;
    width: 100.01%;
    margin: 0px 0% 0px 0%;
}
}