@font-face {
    font-family: 'Lato';
    src: url('/fonts/Lato-Regular.woff2') format('woff2'), url('/fonts/Lato-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Merriweather Sans';
    src: url('/fonts/MerriweatherSans-Regular.woff2') format('woff2'), url('/fonts/MerriweatherSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root{
    --primary: #ffffff;
    --secondary: #1f1e1b;
    --accent: #ffd119;
    --text: #2b2a27;
    --background-gradient: linear-gradient(180deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}


*{margin:0;padding:0;box-sizing: border-box;}
html{margin:0;padding:0;}
body {font-family: 'Lato'; font-size:16px;color: #040404;margin:0;padding:0;background-color:#222222;}
.clear{clear:both;}
sub{font-size:x-small;}

main{padding:0 10px;}

h1{font-family: 'Lato';color:#ffffff;font-size:48px;text-shadow: #000000 2px 2px 15px;text-align:left;margin-bottom:8px;}
h1.region{font-family: 'Lato';color:#ffffff;font-size:28px;text-shadow: #000000 2px 2px 15px;margin-bottom:8px;text-align:left;}
h2{font-family: 'Lato';margin-bottom:4px;}
h2.header{font-family: 'Lato';margin-bottom:4px;color:#ffffff;font-size:24px;text-shadow: #000000 1px 0 10px;text-align:center;}
div.feature{font-weight:bold;font-family: 'Merriweather Sans';margin:0px;margin-top:3px;color:#ffffff;font-size:24px;font-weight:bold;}
h3{font-weight:bold;font-family: 'Merriweather Sans';margin:0px;}
h4{font-weight:bold;font-family: 'Merriweather Sans';margin:0px;font-size:14px;color:#000000;}
h4.header{font-weight:bold;font-family: 'Merriweather Sans';margin:0px;font-size:18px;color:#ffffff;text-align:center;margin:7px 0;}


small {font-size: 12px; font-weight: normal; font-family: 'Merriweather Sans'; margin: 0px;}

header{}
footer{background-color:#fff5cf;margin:0 10px;padding:10px;border-radius:7px;margin-top:10px;}
#divFooter a, a:visited{color:#111111;}
#divFooter a:hover{color:#000000;}

.featureText{border-radius:7px;background:rgba(255,245,207,.6);padding:7px;margin-bottom:13px;}

#fade {background-color: #7c7c7c;width: 100%;text-align: center;border-radius: 7px;}

.dropdown {visibility:hidden; opacity:0; position:absolute; top:100%; left:0; display:none; width: 100%; z-index:50; list-style:none; }

/* Scroll indicator */
.scroll-indicator {position: fixed;bottom: 18px;left: 20px;background: rgba(111, 111, 111, 0.4);color: #111111;
                   padding: 15px;border-radius: 50%;font-size: 1.2rem;cursor: pointer;transition: all 0.3s ease;z-index: 1001;}
.scroll-indicator:hover {background: #ffd119;color: #000000;}

.stars{color: gold;font-size:smaller;text-shadow: 0 0 20px white, 0 0 30px white, 0 0 40px white;-webkit-text-stroke: 1px black;}
.starsSM{color: gold;font-size:18px;text-shadow: 0 0 20px white, 0 0 30px white, 0 0 40px white;-webkit-text-stroke: 1px #444444;;}
.icon_certaineed{position:relative;margin-top:22px;margin-left:22px;}

.container {margin: 0;padding:0;max-width:1200px;margin:0 auto;}
.container-offering{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
.offering {margin-top:10px;margin-right:20px;float: left;width: 540px;
           font:normal 14px 'Merriweather Sans';color:#000000;background:rgba(255,255,255,0.8);border-radius: 15px;}

.main-content {display: flex;flex-direction: column;margin-bottom:10px;}
.sidebar {border-radius:7px;background-color:#f7f6ea;}

.boxme{background: rgba(255,255,255,1);padding:21px;border-radius:7px;}

.card {background: rgba(255,255,255,.9);padding:21px;border-radius:7px;}
.card h2{display:contents;padding-top:10px;margin-left:10px;float:left;margin-bottom:7px;}
.card h3{display:contents;padding-top:10px;margin-left:10px;float:left;margin-bottom:7px;}
.card2 {background: rgba(235,235,235,0.8);padding:7px;border-radius:7px;margin-bottom:10px;}
.card p.flex{margin-top:7px;display:flex;margin-bottom:11px;}
.card p{margin-top:7px;margin-bottom:17px;}
.card img{margin-right:10px;}
.card a, .card a:visited{color:#7a650f;  font-family: 'Merriweather Sans', sans-serif;text-decoration:none;transition: all .7s ease;}
.card a:hover {transition: all .3s ease;color: #ffd119; text-shadow: 1px 1px 1px black;}
.card ul{margin-left:20px;}
.card li{margin-bottom:7px;}

#divLogos {margin-bottom:10px;height:85px;border-bottom:1px solid #999999;display:flex;justify-content:center;}
#divLogos img {float:left;margin:0 20px 10px 20px;}

/* Contact Form Styles */
        .contact-form {padding: 20px;border-radius:7px;}
        .contact-form-header{font-family: 'Lato';margin-bottom:4px;color:#000000;font-size:20px;font-weight:bold;text-shadow: #ffffff 1px 0 15px;text-align:left;}
        .contact-form-confirmation{padding: 20px;border-radius:7px;text-align:center;display:none;}
        .form-group {margin-bottom: 15px;}
        label {display: block;margin-bottom: 5px;}
        input, textarea {padding: 8px; border: 1px solid #ddd; border-radius: 4px;}        
        input[type='image']{border:0;}
        textarea {min-height: 100px;}
        .grid {display: grid;grid-template-columns: 1fr;gap: 10px;}

        .divthankyou{margin:10px;padding:10px}

        .social_media_icons{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;}
        
  /* **** THE STYLES BELOW ARE FOR THE REGIONAL PAGES **** */
  .content-area-region h1{font-family: 'Lato';color:#ffffff;font-size:36px;text-shadow: #000000 2px 2px 15px;margin-bottom:8px;text-align:left;filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.5))}
  .content-area-region h2{font-size:18px;color:#ffd119;line-height:26px;filter: drop-shadow(0 0 3px rgba(0, 0, 0, 1))}
  

  /* **** THE STYLES ABOVE ARE FOR THE REGIONAL PAGES **** */

/* ==================== ALL SIZES */
.txtError{color:#dd0000;font-size:10px;}

        
   /* ==================== MOBILE */
   @media (max-width: 550px) {
            body{background-color:#000000;}
            h1{font-family: 'Lato';color:#ffffff;font-size:32px;text-shadow: #000000 2px 2px 15px;text-align:left;margin-bottom:8px;}
            h2{font-family: 'Lato';margin-bottom:4px;}
            h2.header{font-family: 'Lato';margin-bottom:4px;color:#ffffff;font-size:18px;text-shadow: #000000 1px 0 10px;text-align:center;}
            h3{font-weight:bold;font-family: 'Merriweather Sans';margin:0px;}
            h4{font-weight:bold;font-family: 'Merriweather Sans';margin:0px;}
            
            
            .video_container{box-sizing:border-box;border-radius:11px;margin-bottom:20px;width:100%;}
            #h1video{width:100%;text-align:left;margin-top:10px;}
            #h1video>h1{width:100%;font-family: 'Lato' !important;font-weight:bold;color:#ffffff; font-size:30px !important;text-shadow: #000000 2px 2px 15px;}
            
            #h2video{width:100%;text-align:left;margin-top:50px;}
            #h2video>h2{width:100%;font-family: 'Lato' !important;font-weight:bold;color:var(--accent); font-size:18px;text-shadow: #000000 2px 2px 10px;}
            
            .logo-brands{display: grid;grid-template-columns:1fr 1fr 1fr 1fr; gap:10px;width:100%;margin-top:10px;}
            .logo-brands img{display:block;width:100%;filter: drop-shadow(0 0 1px rgba(255, 255, 255, 1)) 
                    drop-shadow(0 0 3px rgba(255, 255, 255, 0.7));
                    transform: translateY(-50%);position:relative;top:50%;}

            .icon_certaineed_video{display:none;}

            .container-header {max-width: 480px;margin: 0 auto;padding: 1rem;}
            .container-main{display:block;}
            .container-roofing{display:grid;grid-template-columns:1fr;gap:10px;margin:0;}
        
            .stars{font-size:24px;display:block;text-shadow: 0 0 20px white, 0 0 30px white, 0 0 40px white;-webkit-text-stroke: 1px black;}
            .rating-container{text-align:center;color: #111111;font-size: 12px;font-family: 'Merriweather Sans', sans-serif;border-radius:7px;margin-bottom:10px;padding: 7px 0;background: rgba(225,225,225,0.9);}

            #divLogos img {float:left;margin:0 2px 2px 2px;width:70px;}
            
            .div-logo{text-align:center;padding-top:10px;}
            .navDesktop{display:none;}
            .navDesktop-region{display:none;}
            #fade{display:none;}
            .newnav{display:none;}
            
            .container-brands{display:none;}
            .icon_certaineed{position:absolute;right:10px;top:22px;}
            
            .googlemap{width:100%;margin:11px;border:0;}
            .googleReviews{width:100%;border-radius:7px;}
            .googleGuarantee{width:125px;margin:10px 10px 0 10px;}

            .sidebar{margin-bottom:10px;}
            .sidebar-region {width: 100%;margin-top: 0;background: rgba(247,246,234, 0.8);border-radius:7px;}
            .content-area{margin-bottom:10px;}
            .content-area-region {display:flex;flex: 1;align-items: center;padding:10px;margin:20px 10px 40px 0;}
            .content-area-region h2{font-size:18px;color:#fff6c1;}

            #divFooter {display:grid;grid-template-rows: repeat(auto, 1fr); text-align: center;color: #111111;font-size: 12px;margin-bottom:10px;width:100%;
                        font-family: 'Merriweather Sans', sans-serif;}
            #divFooter > div {margin-bottom: 10px;text-align:left;}

            /* **** THE STYLES BELOW ARE FOR THE REGIONAL PAGES **** */
          .content-area-region h1{font-family: 'Lato';color:#ffffff;font-size:36px;text-shadow: #000000 2px 2px 15px;margin-bottom:8px;text-align:left;filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.5))}
          .content-area-region h2{font-size:18px;color:#ffd119;line-height:26px;filter: drop-shadow(0 0 3px rgba(0, 0, 0, 1))}
  
        
        /* **** THE STYLES ABOVE ARE FOR THE REGIONAL PAGES **** */
            

       }
   


   /* ==================== TABLET */
   @media (min-width: 551px) {
       /* body{background:url('/images/back_jtaylor_2025.jpg') no-repeat #222222;background-position-y:250px;} */
       
       .grid {grid-template-columns: repeat(1, 1fr);}
       .navDesktop{display:none;}
       .navDesktop-region{display:none;}
       .newnav{display:grid;grid-template-columns:3fr 1fr;background-color:#444444;text-align:center;gap:10px;right:0;border-radius:7px;
                    background: linear-gradient(to bottom, #444444, #999999);}
        .newnav a, .newnav a:visited{color:#ffffff;  font-family: 'Merriweather Sans', sans-serif;text-decoration:none;transition: all .7s ease;}
        .newnav a:hover {transition: all .7s ease;color: #ffcd04;}
        .container-hours{width:max-content;color: var(--accent);font-size: 14px;font-family: 'Merriweather Sans', sans-serif;padding:3px;line-height:30px;margin-left:60px;}

        .container-main{margin-bottom:10px;}
        .container-brands{display:none;}

        .stars{font-size:36px;display:block;line-height:30px;text-shadow: 0 0 20px white, 0 0 30px white, 0 0 40px white;-webkit-text-stroke: 1px black;}
        .rating-container{text-align:center;color: #111111;font-size: 14px;font-family: 'Merriweather Sans', sans-serif;border-radius:7px;margin-bottom:10px;padding: 7px 0;background: rgba(225,225,225,0.9);}

       .video_container{box-sizing:border-box;overflow:hidden;border-radius:11px;margin-bottom:10px;width:100%;padding-left:10px;padding-right:10px;}
        #h1video{width:100%;text-align:left;}
        #h1video>h1{font-family: 'Lato' !important;font-weight:bold;color:#ffffff;font-size:42px;text-shadow: #000000 2px 2px 15px;}
        
        #h2video{width:100%;text-align:left;margin-top:45px;}
        #h2video>h2{font-family: 'Lato' !important;font-weight:bold;color:var(--accent);width:500px;font-size:20px;text-shadow: #000000 2px 2px 10px;}

        .logo-brands{display: grid;grid-template-columns:1fr 1fr 1fr 1fr; gap:10px;width:90%;margin-top:10px;}
        .logo-brands img{display:block;filter: drop-shadow(0 0 1px rgba(255, 255, 255, 1))
                    drop-shadow(0 0 3px rgba(255, 255, 255, 0.7));transform: translateY(-50%);position:relative;top:50%;max-width:125px;}

       #fade{display:none;}
       .container-roofing{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding: 0;}
        .icon_certaineed_video{position:absolute;top:0;margin-top:0px;right:-10px;}
       #divLogos img {float:left;margin:0 2px 2px 2px;width:100px;}
       

       .sidebar-region {width: 100%;margin-top: 0;background: rgba(247,246,234, 0.8);border-radius:7px;}
        
       .content-area{margin-bottom:10px;}
       .content-area-region {display:flex;flex: 1;align-items: center;padding:10px;margin-bottom:40px;}

        #divFooter {display:grid;grid-template-rows: repeat(auto, 1fr); text-align: center;color: #111111;font-size: 12px;margin-bottom:10px;width:100%;
                        font-family: 'Merriweather Sans', sans-serif;}
        #divFooter > div {margin-bottom: 10px;text-align:left;}
       }



   /* ==================== DESKTOP */
   @media (min-width: 875px) {
            /* body{background:url('/images/back_desktop_1.jpg') no-repeat center #222222;background-position-y:250px;} */
            .call-button{display:block;}
            .grid {grid-template-columns: repeat(2, 1fr);}
            .main-content {flex-direction: row;margin-right:0;}
            .content-area {display:flex;flex: 1;margin-bottom:0;margin-right:10px;}
            .content-area-region {display:flex;flex: 1;margin:40px 10px 40px 0;align-items: center;padding:10px;}
            .content-area-region {font-size:16px;}
            .sidebar {width: 300px;margin-top: 0;background: #f7f6ea;border-radius:7px;}
            .sidebar-region {width: 400px;margin-top: 0;background: #f7f6ea;border-radius:7px;}
            .grid {display:grid;grid-template-columns: 1fr 1fr;}
            .burger{display:none;}

            .navClassic{display:block;}

            .newnav{display:grid;grid-template-columns:6fr 1fr;background-color:#444444;text-align:center;gap:10px;right:0;border-radius:7px;
                    background: linear-gradient(to bottom, #444444, #999999);
            }
            .newnav a, .newnav a:visited{color:#ffffff;  font-family: 'Merriweather Sans', sans-serif;text-decoration:none;transition: all .7s ease;}
            .newnav a:hover {transition: all .7s ease;color: #ffcd04;}

            #fade{display:block;margin-bottom:10px;}
            .googlemap{width:490px;height:350px;margin:11px;border:0;}
            .googleReviews{width:290px;max-width:350px;border-radius:7px;}
            .googleGuarantee{width:125px;margin:20px 10px 0 10px;float:left;}
            /* main{background:url('/images/back_jtaylor_2025.jpg') no-repeat top;} */

            .div-logo{float:left;margin-left:10px;padding-top:10px;}
            .icon_certaineed_video{position:absolute;top:140px;right:0;}

            .navDesktop{z-index:99;display:flex;text-align:center;margin-top:44px;}
            .navDesktop a, .navDesktop a:visited{font-size:16px;color:#ffffff;  font-family: 'Merriweather Sans', sans-serif;text-decoration:none;transition: all .7s ease;}
            .navDesktop a:hover {transition: all .7s ease;color: #ffcd04;}
            .navDesktop li:hover {cursor: pointer;background: rgba(0,0,0,0.7);border-radius: 8px;}

            .navDesktop-region{z-index:99;margin:0 10px;padding: 4px 0;display:flex;text-align:center;}
            .navDesktop-region a, .navDesktop-region a:visited{color:#ffffff;  font-family: 'Merriweather Sans', sans-serif;text-decoration:none;transition: all .7s ease;}
            .navDesktop-region a:hover {transition: all .7s ease;color: #ffcd04;}
            .navDesktop-region li:hover {cursor: pointer;background: rgba(0,0,0,0.7);border-radius: 8px;}

            .video_container{width:870px;max-width:870px;height:550px;overflow:hidden;border-radius:11px;margin-bottom:0px;}
            #h1video{width:500px;text-align:left;position:absolute;margin:140px 0 20px 10px;}
            #h1video>p{font-family: 'Lato' !important;font-weight:bold;color:#ffffff;font-size:48px;text-shadow: #000000 2px 2px 15px;}

            #h2video{width:800px;text-align:left;position:absolute;margin:345px 0 20px 10px;}
            #h2video>h2{font-family: 'Lato' !important;font-weight:bold;color:var(--accent);width:500px;font-size:24px;text-shadow: #000000 2px 2px 10px;}
            
            .logo-brands{display: flex;justify-content: space-between;align-items: center;margin-top:50px;}
            .logo-brands img{display:block;filter: drop-shadow(0 0 1px rgba(255, 255, 255, 1))
                    drop-shadow(0 0 3px rgba(255, 255, 255, 0.7));transform: translateY(-50%);position:relative;top:50%;}

            .topnav{display:flex;flex-direction: row; margin: auto 4px;}
            .topnav li {list-style: none;width: 138px;text-align: center;padding: 7px 0;text-shadow: #000000 1px 0 10px;position:relative;}            
            .topnav li:hover > ul, .topnav li ul:hover {
            visibility: visible;opacity: 1;padding:4px;display: block;text-align: left;
            box-shadow: 0px 3px 5px -1px #000000;background: rgba(55,55,55,0.8);border-radius: 8px;
            animation: slide-in 250ms;animation-timing-function: linear;width: 225px;top:100%;}

            .dropdown li {clear: both;width: 215px;text-align: left;border-style: none;padding:2px;}
            .call-button{display:none;}

            .container-brands{margin:0 30px;display:block;}

            .container-roofing{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin:0;}
             .container-main{display:grid;grid-template-columns:auto 1fr;gap:10px;margin-bottom:10px;}            

            .cardwide{display:block;margin-top: 20px;border-radius:7px;height:fit-content;vertical-align:middle;}

            .stars{font-size:36px;display:block;line-height:30px;text-shadow: 0 0 20px white, 0 0 30px white, 0 0 40px white;-webkit-text-stroke: 1px black;}
            .rating-container{text-align:center;color: #111111;font-size: 14px;font-family: 'Merriweather Sans', sans-serif;border-radius:7px;margin-bottom:10px;padding: 7px 0;background: rgba(225,225,225,0.9);}            
            .container-hours{width:max-content;color: var(--accent);font-size: 14px;font-family: 'Merriweather Sans', sans-serif;padding:3px;line-height:30px;margin-left:10px;}
            
            .boxme{background: rgba(255,255,255,1);padding:21px;border-radius:7px;}

            #divFooter {display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;text-align: center;color: #111111;font-size: 12px;margin-bottom:7px;width:100%;vertical-align:middle;font-family: 'Merriweather Sans', sans-serif;}             
            #divFooter div{text-align:left;margin-bottom:10px;}

            

        }   /* ==================== DESKTOP */


.phone-container {width: 210px;height: 30px;overflow: hidden;position: relative;}
.phone-slider {position: absolute;width: 100%;}
.phone-number {height: 36px;line-height: 36px;text-align: left;font-size: 20px;color:#ffffff;font-weight:bold;font-family:'Merriweather Sans',Arial, sans-serif; align-items: center; text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.7);}        
.phone-number img {vertical-align: middle;}
        
.certainteed_shingle {color:#000000;background-color:#eeeeee;display:block;margin-bottom:5px;font-size:10px;border-radius:8px;overflow:hidden;position:relative;}
.certainteed_shingle img {width:100%;border-radius:8px;}
.certainteed_shingle span {font-size: 18px;font-weight: bold;font-family: 'Merriweather Sans';margin: 0px;margin-bottom:-7px;display:flex;}

.certainteed_shingle_text{color:#000000;position:absolute;height:87px;margin-top:-90px;margin-left:10px;margin-right:10px;background:rgba(255,255,255,0.7);padding:7px;font-size:12px;border-radius:7px;line-height:14px;}

.one_column{width:100%;border-radius:8px;text-align:center;}
.one_column img{border-radius:8px;}

   
/* Call Button Styles */
.call-button {
    position: fixed;bottom: 10px; left: 50%;transform: translateX(-50%);
    font-weight:bold;
    font-family:'Arial', sans-serif;
    font-size:24px;
    background-color: var(--accent); color: black;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    border: none; border-radius: 50px; padding: 15px 25px;
    text-decoration: none;
    align-items: center;gap: 8px; 
    cursor: pointer; transition: all 0.3s ease;
}
.call-button:hover {transform: translateY(-2px);box-shadow: 0 6px 12px rgba(0,0,0,0.3);}
.call-button svg {width: 20px;height: 20px;}


.call-button-region {
    position:absolute;; 
    background-color: var(--accent); color: black;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    border: none; border-radius: 22px; padding: 5px 15px;
    text-decoration: none;
    align-items: center;gap: 8px; 
    cursor: pointer; transition: all 0.3s ease;
}
.call-button-region:hover {transform: translateY(-2px);box-shadow: 0 6px 12px rgba(0,0,0,0.3);}
.call-button-region svg {width: 20px;height: 20px;}

.call-button-region2 {
    position:relative; 
    display:inline-block;
    background-color: var(--accent); color: black;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    border: none; border-radius: 22px; padding: 5px 15px;
    text-decoration: none;
    align-items: center;gap: 8px;
    cursor: pointer; transition: all 0.3s ease;
}
.call-button-region2:hover {transform: translateY(-2px);box-shadow: 0 6px 12px rgba(0,0,0,0.3);}
.call-button-region2 svg {width: 20px;height: 20px;}



.logo{border-radius:8px;}
#divAreasWeServe{width:100%;text-align:center;}
.section1{width:500px;margin:auto;}
.city_list{flex-flow: column wrap;float:left;}
.city_list li{list-style: none;width:150px;text-align:center;}


#divFooterCities {}

.button-3 {
    appearance: none;
    background-color: #f9cd0a;
    border: 1px solid rgba(27, 31, 35, .15);
    border-radius: 6px;
    box-sizing: border-box;
    color: #222222;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system,system-ui,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
    font-size: 14px; font-weight: 600;
    line-height: 20px;
    position: relative;
    text-align: center;
    text-decoration: none;user-select: none;-webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: middle;
    white-space: nowrap;
}

.button-3:focus:not(:focus-visible):not(.focus-visible) {box-shadow: none;outline: none;}
.button-3:hover {background-color: #ffdc41;color:#000000;}
.button-3:focus {box-shadow: rgba(46, 164, 79, .4) 0 0 0 3px;outline: none;}
.button-3:disabled {background-color: #f9cd0a;border-color: rgba(27, 31, 35, .1);color: rgba(255, 255, 255, .8);cursor: default;}
.button-3:active {background-color: #298e46;box-shadow: rgba(20, 70, 32, .2) 0 1px 0 inset;}


.testimonials{border-radius:7px;padding:7px;text-align: left;overflow: hidden;height: fit-content;margin-bottom:10px;background:rgba(255, 209, 25, .8);
font-family: -apple-system,system-ui,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";font-size: 12px;}



.navMobile{position:fixed;top:0;left:0;width:300px;height:100%;margin:0 0 0 -354px;
    -moz-transition:all 200ms ease-in;
    -webkit-transition:all 200ms ease-in;
    -o-transition:all 200ms ease-in;
    transition:all 200ms ease-in;
    z-index:99;
}

.navMobile ul{width:260px;height:100%;padding:0;margin:0;list-style:none;background:#222222;overflow:hidden;}
.navMobile li{margin:0;}
.navMobile ul li ul{width:230px;height:100%;padding:0;margin:0;margin-left:30px;list-style:none;background:#222222;overflow:hidden;}

.navMobile a, .navMobile a:visited {
    color:#ffffff;
    text-decoration:none;
    display:block;
    padding:12px 15px;
    letter-spacing:2px;
    border-bottom:1px solid #333;
}
.navMobile a:hover{ background:#111111;color:#ffd119;}

.burger{overflow:hidden;z-index:1005;position:fixed;}
.burger > label{display:block;width:42px;height:42px;line-height:42px;position:fixed;
    color:#fff;text-align:center;z-index:500;
    -moz-transition:all 200ms ease-in;
    -webkit-transition:all 200ms ease-in;
    -o-transition:all 200ms ease-in;
    transition:all 200ms ease-in;
}
.burger > input[type="checkbox"]{display:none;}
.burger > input[type="checkbox"]:checked ~ .navMobile{margin:0;}
.burger > input[type="checkbox"]:checked ~ label{left:260px;}
.burger > input[type="checkbox"]:checked ~ section{
    -webkit-transform:translate3d(260px, 0, 0);
    -moz-transform:translate3d(260px, 0, 0);
    -o-transform:translate3d(260px, 0, 0);
    transform:translate3d(260px, 0, 0);
}




#slideshow {text-align: center;overflow: hidden;height: 38px;width: 700px;margin: 0 auto;}
.slide-wrapper {width: 3500px;-webkit-animation: slide 41s ease infinite;}
.slide {float: left;height: 38px;width: 700px;}
.slide:nth-child(1) {}
.slide:nth-child(2) {}
.slide:nth-child(3) {}
.slide:nth-child(4) {}
.slide:nth-child(5) {}
.slide-number {color: #7c7c7c;text-align: center;font-size: 10em;}

@-webkit-keyframes slide {
    10% {margin-left: 0px;}
    20% {margin-left: -700px;}
    30% {margin-left: -700px;}
    40% {margin-left: -1400px;}
    50% {margin-left: -1400px;}
    60% {margin-left: -2100px;}
    70% {margin-left: -2100px;}
    80% {margin-left: -2800px;}
    90% {margin-left: -2800px;}
    100% {margin-left: 0px;}
}
#slideshow2 {text-align: left;overflow: hidden;height: 58px;width: 700px;margin: 0 auto;}
.slide-wrapper2 {width: 700px;-webkit-animation: fadein 4s;animation: fadein 4s;transition-delay: 2s;}
.slide2 {width:700px;height:58px;}
.slide2:nth-child(1) {}
.slide2:nth-child(2) {}

@-webkit-keyframes fadein {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes fadein {
  0% { opacity: 0; }
  100% { opacity: 1; }
}


@keyframes slide-in {
    0% { opacity: 0; }
  100% { opacity: 1; }
}







  .scrolling-text-container {
    width: 100%;
    height: 30px;
    overflow: hidden;
    position: relative;
  }
  
  .scrolling-text {
    position: absolute;
    top: 0;
    animation: scroll 20s infinite;
    display: flex;
    flex-direction: column;
    width: 100%;
    text-align: center;
  }
  
  .scrolling-text span {
    height: 30px;
    line-height: 30px;
    font-size: 14px;
  }
  
  @keyframes scroll {
    0%, 20% { transform: translateY(0); }
    25%, 45% { transform: translateY(-30px); }
    50%, 70% { transform: translateY(-60px); }
    75%, 95% { transform: translateY(-120px); }
    100% { transform: translateY(-180px); }
  }