@font-face { font-family: OpenSansRegular; src: url(/library/fonts/OpenSans/Regular.otf) format("opentype"); }

/* Layout header */

.layoutheader { background: none; border-bottom: 5px solid var(--blue); }
.layoutheader .nav_simple { background: none;  margin: 0px;  }
.layoutheader .nav_simple ul li a { color: var(--blue); text-transform: capitalize; font-family: GillSansBold; }
.layoutheader .nav_simple ul li a { padding: 0px; }
.layoutheader .nav_simple ul {display: flex;justify-content: right;align-items: center; gap: 30px;}
.layoutheader .nav_simple .level1 li:hover { background: none; }
.layoutheader .nav_simple  .menu330 { background-color: #33cc00; border-radius: 50px;  transition: all .3s ease-in-out; height: fit-content; padding: 5px 20px; }
.layoutheader .nav_simple  .menu330:hover { text-decoration: none; background-color: var(--blue); }
.layoutheader .nav_simple  .menu330 a {color: white;padding: 0px;line-height: 1.2;}
.layoutheader .nav_simple  .menu330 a:hover {text-decoration: none; }

.layoutheader .black { background-color: #222; color: white; padding: 5px 0px; font-size: 90%;}
.layoutheader .black a { color: white; font-family: GillSans; }
.layoutheader .black .items { display: flex; justify-content: space-between; align-items: center;  padding: 0px 0px; max-width: 1240px; margin: 0px auto; font-size: 90%; }
.layoutheader .black .items p { padding: 0px; }
.layoutheader .black .items .content, .layoutheader .black .items ul { display: flex; justify-content: space-between; width: 500px; }
.layoutheader .black .items ul { width: 150px; }

.layoutheader .white .items { display: flex; align-items: center; justify-content: space-between; max-width: 1240px; margin: 0px auto; padding: 0px;}
.layoutheader .white .items img { width: 100px; height: auto;}

.layoutheader_inner .headerlogo { padding: 10px 0px;}

@media ( max-width: 1280px )
{
    .layoutheader .black .items, .layoutheader .white .items { max-width: 96%; }
}

@media ( max-width: 1099px )
{
    .layoutheader .toggle { top: 80px; right: 5px;}
    .layoutheader .toggle svg {  width: 35px; height: 35px; }
    .layoutheader .nav_simple ul { transition: all 1s ease-in; right: -100%;  position: absolute; width: 100%; top: 150px; display: block; overflow: hidden;   }
    .layoutheader .nav_simple ul li { padding: 10px 0px 10px 20px; }
    .layoutheader .nav_simple.toggleon ul { right: 0; background-color: red;   }
    .layoutheader .nav_simple.toggleon ul li a { color: white; ;}
    .layoutheader .nav_simple .menu330 { background-color: transparent; }
}
@media ( max-width: 700px )
{
    .layoutheader .black .items { flex-direction: column; }
    .layoutheader .black .items .content, .layoutheader .black .items ul { width: 100%; gap: 50px; }
    .layoutheader .toggle { top: 100px; }
}
@media ( max-width: 540px )
{
    .layoutheader .black .items .content { flex-direction: column; gap: 0px;}
    .layoutheader .black .items ul {  gap: 10px; }
    .layoutheader .toggle { top: 125px; }
}

.layoutheader { height: 170px; }
.white { position: fixed; top: 40px; width: 100%; z-index: 999;  background: white; }
.scroll .white { top: 0px; box-shadow: 2px 2px 2px #808080; } 
.scroll .white .headerlogo { padding: 2px 0px; }
.scroll .white .headerlogo img { height: 70px; width: auto;}

/* Layout footer */

.layoutfooter {background: none;background-color: black;color: white;}
.layoutfooter .layoutfooter_inner { background-color: #222;}
.layoutfooter a { color: white;}

/* generic */

.page_standarda { max-width: 100%; }
.page_standarda .components>div>div { max-width: 1240px; margin: 0px auto; }
.page_standarda .components>div>.banner { max-width: 100%;}
.homepage2024 .components>div>div {max-width: 100%; }
.spacer { display: none; }

/* Homepage 2024 */

.homepage2024 .homelinks2024 .items { padding: 0px; display: flex; justify-content: space-between;  flex-wrap: wrap; }
.homepage2024 .homelinks2024 .items>div { width: 24.5%; transition: all .5s ease-in-out; position: relative; bottom: 0; }
.homepage2024 .homelinks2024 .items>div:hover { bottom: -10px; }
.homepage2024 .homelinks2024 .items>div .imagetop { height: 400px; background-size: cover;}
.homepage2024 .homelinks2024 .items>div .link { background-color: var(--blue); padding: 10px; font-size: 90%; }
.homepage2024 .homelinks2024 .items>div .link a { color: white; font-family: GillSansBold; }

.homepage2024 .homeabout2024 { background-color: #0078a3; color: white; margin-top: 20px !important; }
.homepage2024 .homeabout2024 p { padding: 30px 50px; box-sizing: border-box; font-size: 150%; text-align: center; }

.homepage2024 .homeproducts { width: 100%;  margin: 0px auto; }
.homepage2024 .homeproducts h2 { font-family: OpenSansRegular;  padding: 20px 0px; }
.homepage2024 .homeproducts .items { display: block; padding: 20px 0px; }
.homepage2024 .homeproducts .items h2 { padding: 0px; }
.homepage2024 .homeproducts .items p { padding: 0px; }
.homepage2024 .homeproducts .items > div .util_textbox_inner { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; }
.homepage2024 .homeproducts .items > div .util_textbox_inner .content { width: 40%; margin-left: auto; padding: 20px; box-sizing: border-box; }
.homepage2024 .homeproducts .items > div:nth-child(even) .util_textbox_inner .content {  margin-right: auto; }
.homepage2024 .homeproducts .items > div .imageleft, .homepage2024 .homeproducts .items > div .imageright { width: 50%; height: 500px; background-size: cover; background-position: center center; }

.homepage2024 .homeproducts .items > div .util_textbox_inner .content h3 { line-height: 1.5;}

.homepage2024 .homewindows, .homepage .homedoors, .homepage .homeconservatories, .homepage2024 .homealuminium, .homepage .homeroofline, .homepage .hometeam { width: 100%; height: 500px; margin: 0px; }
.homepage2024 .homewindows:hover, .homepage .homedoors:hover, .homepage .homeconservatories:hover, .homepage2024 .homealuminium:hover, .homepage .homeroofline:hover, .homepage .hometeam:hover { background: none; opacity: 1;}

@media ( max-width: 701px )
{
    .homepage2024 .homelinks2024 .items>div { width: 49.5%; margin-bottom: 5px; }
    .homepage2024 .homeproducts .items > div { margin-bottom: 200px;}
    .homepage2024 .homeproducts .items > div .util_textbox_inner { flex-direction: column}
    .homepage2024 .homeproducts .items > div .util_textbox_inner .content { width: 100%;}
    .homepage2024 .homeproducts .items > div .imageleft, .homepage2024 .homeproducts .items > div .imageright { width: 100%; height: 400px}
}
@media ( max-width: 602px )
{
    .homepage2024 .homelinks2024 .items>div .imagetop { height: 200px; }
    .homepage2024 .homelinks2024 .items>div { width: 100%;}
}

/* Banner */

.banner {  margin-bottom: 50px !important; padding: 0px !important; }
.banner .util_textbox_inner { display: flex; flex-direction: row-reverse; }
.banner .imageleft { float: none !important; height: 500px; width: 65% !important; background-size: cover; background-position: center center; }
.banner .titletxt { background-color: #0078a3; width: 35%; height: 500px; color: white; font-size: 250%; padding: 250px 50px 50px 50px !important; box-sizing: border-box; text-align: left; }
.banner .content { padding: 0px !important; }

@media ( max-width: 1140px )
{
    .banner .titletxt { padding: 250px 30px 50px 30px !important; }
}

@media ( min-width: 1025px )
{
    .banner { height: 500px; margin-bottom: 50px !important;  }
}
@media ( max-width: 1025px )
{
    .banner .imageleft { height: 400px; width: 100% !important;}
    .banner .util_textbox_inner { flex-direction: column; }
    .banner .titletxt { width: 100%; padding: 20px !important; height: 100% }
    .banner .titletxt { font-size: 200%; }
}

/* CTA */

.cta { margin: 20px auto !important; }
.cta .titletxt { font-size: 180%; }
.cta h2:nth-child(2) { padding-top: 20px; }
.cta a { background-color: #33cc00; border-radius: 50px; transition: all .3s ease-in-out; height: fit-content; padding: 5px 20px; margin-top: 50px; }
.cta a:hover { text-decoration: none; background-color: rgba(255, 255, 255, 0.3); }

/* New layout */

.newlayout .util_textbox_inner { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.newlayout .util_textbox_inner .content { width: 35%; text-align: left; }
.newlayout .util_textbox_inner .content h2, .homepage2024 .homeproducts .items h2 { color: var(--blue); font-size: 180%; font-family: OpenSansRegular; text-align: left;}
.newlayout .util_textbox_inner .content h3, .homepage2024 .homeproducts .items h3 {color: var(--blue);font-size: 110%; font-family: OpenSansRegular;}
.newlayout .util_textbox_inner .content p, .homepage2024 .homeproducts .items p { font-size: 105%; }
.newlayout .util_textbox_inner .imageright, .newlayout .util_textbox_inner .imageleft { height: 500px; background-size: 80% auto; width: 60%; transition: all .6s ease-in-out; background-position: right; }
.newlayout .util_textbox_inner .imageright:hover, .newlayout .util_textbox_inner .imageleft:hover { background-size: 90% auto; }
.newlayout .util_textbox_inner .imageleft { background-position: left; }