:root {
    /*Utilities*/
    --sliderHeight: 580px;
}

html {
  scroll-behavior: smooth;
}

body{font-size: 1.0em;}

/* Medium desktops */
@media (min-width: 1099px) {
  .container {max-width: 1080px;}
}
@media (min-width: 1200px) {
  .container {max-width: 1180px;}
}
/* Large desktops */
@media (min-width: 1400px) {
  .container { max-width: 1320px; }
}
/* Extra-large desktops or 4K displays */
@media (min-width: 1600px) {
  .container { max-width: 1440px; }
}
@media (min-width: 1920px) {
    .container { max-width: 1600px; }
}

a{color: var(--primary);font-weight: 400;}
header.Header {position:fixed;z-index: 101;background: var(--primary);box-shadow:none; box-shadow: 0px 0px 2px rgb(0 0 0 / 30%);
    & .logo {display:flex;justify-content: space-between;
        & img {max-height: 70px;padding: 5px 0;transition:all .3s ease;filter: brightness(0) invert(1);}
        & .mobileNavIcons { align-items: center;
            button{display:inline-block;color:var(--dark); padding:0 10px;
                &.search-toggler{font-size:2em;}      
            }                          
        }
    }
    .main-navigation {justify-content:flex-end;
        & ul {width:100%;margin:0;justify-content: flex-end;
            & li {
                a, span {display:block;font-size: 1.2rem;font-weight: 500;color: var(--white);transition:all .3s ease;padding: 21px 21px;}
                &:hover{ 
                    > a, > span{background:var(--primary50); color:var(--dark); cursor:pointer; }
                }                
                ul{
                    li {
                        a{padding:13px 10px; background:var(--primary50); color:var(--dark); border-bottom: 1px solid var(--border);}
                        &:hover > a{color:var(--white); background:var(--primary);}
                        ul{
                            li{
                                a{background:var(--primary); color:var(--white); padding:10px 10px; border-bottom: 1px solid transparent;}
                                &:hover a{ background:var(--highlight); color:var(--dark);}
                            }
                        }
                    }
                }
                &.button-item{
                    a{color:var(--white);}
                    &:hover{background:var(--secondary); color:var(--white);}
                    &.primary{background:var(--primary);   
                        &:hover, ul li a{background:var(--highlight);} 
                        &:hover a{ color:var(--primaryDark);}
                        ul li a:hover{background:var(--primary);}                              
                    }
                    &.secondary {background:var(--secondary);
                        &:hover, ul li a{background:var(--primary);} 
                        ul li a:hover{background:var(--secondary);}
                    }
                    &.highlight{background:var(--highlight);
                        a{color:var(--primaryDark);}
                        &:hover, ul li a{background:var(--primary); color:var(--white);}
                        &:hover a{ color:var(--primaryDark);}
                        ul li a:hover{background:var(--primary50); color:var(--primaryDark);}
                    }
                    &.accent{background:var(--accent);
                        &:hover, ul li a{background:var(--primary);} 
                        ul li a:hover{background:var(--accent);}                              
                    }
                    &.dark{background:var(--dark);
                        &:hover, ul li a{background:var(--secondary);} 
                        ul li a:hover{background:var(--dark);}        
                    }                    
                }
                @media (min-width: 0px) and (max-width: 1199px) {
                    a{font-size: .8em; padding:10px;}
                } 
                @media (min-width: 0px) and (max-width: 1099px) {
                    a{font-size:.70em; font-weight:500;}
                }                  
            }      
        }  
    }    
    &.toFixed{box-shadow: none;transform: none;transition:all .5s ease;box-shadow: 0px 0px 2px rgb(0 0 0 / 30%);}
    &.headBg.toFixed {background: var(--primary);transition: all .5s ease;position: fixed;top: 0;
        & .logo{
            img{transition: all .5s ease;/* filter: none; */}
            span{font-size:1em; transition: all .5s ease;}
        }           
    }               
    &.headBg{
        & .logo {
            & img {filter:brightness(0) invert(1); transition:all .5s ease;}
            button{color:var(--dark); padding:0 10px;
                &.search-toggler{font-size: 2em;}      
            }
        }    
    }
    @media (min-width: 0px) and (max-width: 991px) {
        &.headBg.toFixed{transform: translateY(0px);}
    }
}
 

body.subpage header{background:var(--white);}
.breadcrumb {background:var(--light);font-size: 0;padding: 8px 0;margin-bottom: 0;
    a{color: var(--dark);font-size: 15px;display:inline-flex;align-items: center; 
        &:after{content:" / "; font-size:12px; display:inline-block; padding:0 10px;}
        &:last-child:after{content:'';}
    }            
}

.subpageHeader-block {margin-top: 69px;min-height: 360px;background: var(--primary);position: relative;padding: 0;display: flex;flex-direction: column;justify-content: space-between;
    & .supportSearchBlock {/* position:absolute; *//* z-index: 2; */width:100%;height:100%; text-align:center;
        .SupportHead{color:var(--white); margin-bottom: 30px;}
        h2{color:var(--white);text-align:center;font-size: 2em;text-transform: uppercase;font-weight: 300;font-family: var(--Header);padding-top: 30px;
            strong, span{display:block;} 
           span{font-weight: 500;font-size: 1.5em;font-family: var(--BlockText);}
        }
        div#searchform{position:relative;z-index: 100;display: flex;justify-content: center;margin-top: 5px;padding-bottom: 60px;flex-direction: column;align-items: center;
            & .fieldsRow{display:flex;flex-direction: row-reverse; 
                input{padding: 21px 29px;padding-left: 75px;min-width: 80%;background: var(--primary50);border-radius: 30px;border: 1px solid var(--primary);
                    &:focus, &:focus-visible{outline:none;box-shadow: none;border: 0;}     
                } 
                button{padding: 16px 21px;background: transparent;margin-right: -62px;position: relative;border: 1px solid var(--primary);z-index: 1;border-radius: 30px;background: var(--primary);width: 60px;height: 59px;
                    i{  font-family: bootstrap-icons !important;color: var(--primary50);font-size:0;
                         &:before{font-size: 16px;line-height: 22px;}
                     }
                    & .spinner-border{display:none;color: var(--white);}
                    &.loading{
                        i{display:none;}
                        & .spinner-border{display:block; }
                    }
                }
            }            
        }                          
        div#searchform .fieldsRow {display:flex;align-items:center;justify-content:center;height: 100%;width: 60%;position: relative;z-index: 10;} 
        & .tagsPanel{position:absolute;z-index: 10;top: 65px;width: 60%;background:var(--primary50);padding:15px;border-radius: 15px;box-shadow: 0px 0px 2px rgb(0 0 0 / 30%);
            & .tagGroup{text-align:left;margin-bottom: 30px;
                > strong{display:inline-block;padding: 0px 0 10px 5px;}
                &+.tagGroup{margin:0;}    
            }
            ul{flex-wrap:wrap;display: flex; 
                li{margin: 5px;/* min-width: 20%; */
                    a{display: inline-flex;font-size: .85em;width: 100%;text-align: center;padding: 5px 15px;border:1px solid var(--primary100);border-radius: 20px;background:var(--primary);color:var(--white);align-items: center;
                        &:before{content:"\f586";font-family:bootstrap-icons;font-size: 9px;padding-right: 5px;}
                        &:hover{background:var(--highlight);} 
                    }
                } 
            }            
        }
    }   
    img{opacity:.3;max-height: 350px;width: 100%;object-fit: cover;}
}

#loader {position: fixed;width: 100%;height: 100%;left: 0px;top: 0px;z-index: 9;background: rgba(26, 26, 26, 0.19);text-align: center;}

/*Quick links Side nav*/
.quickLinks { background:var(--primary50); border-radius:3px;
    & .sectionTitle h2{padding: 10px;color: var(--dark);margin: 0;font-size: 1.5em !important;font-weight: 500; border-bottom: 1px solid color-mix(var(--dark)  10%, transparent 100%);}
    ul {list-style: none; margin: 0; padding: 0;
        li {position: relative;
            &:hover > ul {display: block; }
            a {background: var(--highlight100);color:var(--dark);display: block;font-weight: 500;font-size:.9em;padding: 10px 12px;border-bottom: 1px solid color-mix(var(--dark)  10%, transparent 100%);}
            a:hover {background: var(--primary); color: var(--white); }            
            &:last-child a {border: 0;}
        }
        li ul { display: block; left: 0%; position: relative; top: 0; width: 100%;
            li {
                a { padding:5px 10px; border-bottom:0; font-size:.9em;
                    &:hover {background: var(--primary); color: var(--white); } 
                   &:hover:before {visibility:hidden;}
                } 
            }
        }
    }
}
/*Quick links popup menu*/
#quicklinks-wrapper {position: relative;}
#quicklinks {position: fixed;  bottom: 0; right: 50%; z-index: 999; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); text-align: center; -webkit-box-shadow: 0px 3px 24px 2px rgba(0, 0, 0, 0.75); box-shadow: 0px 3px 24px 2px rgba(0, 0, 0, 0.75); text-transform: uppercase; -webkit-transition: 250ms ease-in-out; -o-transition: 250ms ease-in-out; transition: 250ms ease-in-out; display: flex; flex-wrap: nowrap; align-items: stretch; align-content: flex-start; flex-direction: row; justify-content: flex-start; 
    &.collapse  {-webkit-transition: 250ms ease-in-out; -o-transition: 250ms ease-in-out; transition: 250ms ease-in-out;} 
    .quicklinks-hdr {
        .bi {-webkit-transition: 250ms ease-in-out;-o-transition: 250ms ease-in-out;transition: 250ms ease-in-out;writing-mode: tb-rl;transform: rotate(90deg);display: block;}
    } 
    &.collapse {/* min-height:450px; */
        .quicklinks-hdr {
            .bi {-webkit-transition: 250ms ease-in-out;-o-transition: 250ms ease-in-out;transition: 250ms ease-in-out;writing-mode: tb-rl;transform: rotate(0deg);}
        }
    } 
    &.show { -webkit-transition: 250ms ease-in-out; -o-transition: 250ms ease-in-out; transition: 250ms ease-in-out; 
        .quicklinks-hdr {
            .bi {-ms-transform: rotate(270deg);-webkit-transform: rotate(270deg);transform: rotate(180deg);-webkit-transition: 250ms ease-in-out;-o-transition: 250ms ease-in-out;transition: 250ms ease-in-out;}
        }
    } 
    .quicklinks-hdr {position: relative;background: var(--accent);max-width: 36px;min-width: 36px;position: relative;z-index: 55;border: 1px solid var(--border);border-right: 0; 
        button {background:none;border:0;outline:0;line-height: 32px;font-size: 18px;color: var(--dark);font-family: var(--BlockText);margin: 0;padding: 0;display: inline-block;vertical-align: middle;writing-mode: tb-rl;position: relative;z-index: 55;top: 50%;left: 50%;transform: rotate(-180deg) translate(50%, 50%);display: flex;}
    } 
    & .quicklinksWrapper { min-height:450px;  }

    & .quicklinks-list {display:block;list-style: none; background: var(--primaryDark); padding-left: 0; margin: 0; 
        a {color: #ffffff;display: block;padding: 18px 20px;border-color: var(--border);border-width: 0 1px 1px 1px;border-style: solid;font-family: var(--Header);line-height: normal;font-size: 12px;white-space: nowrap; 
        &:hover {color: #f8ba25; text-decoration: none;}
    } 
        li {
            &:last-child {
                a {border-bottom: 0;}
            }
        }
    }
}

@media only screen and (min-width: 991px) {
    #quicklinks { min-height:450px; bottom: auto;top: 50vh;right: 0;-webkit-transform: translateX(0) translateY(-50%);-ms-transform: translateX(0) translateY(-50%);transform: translateX(0) translateY(-50%);height: auto;overflow: hidden;max-width: 36px;min-width: 36px;
        .quicklinks-hdr {
            button {font-size: 16px;}
        }
        a {white-space: nowrap; border-width: 2px 0 0 2px;}
        li {
            &:last-child {
                a {border-bottom: 2px solid #ffffff;}
            }
        }

        .quicklinks-list {/* padding-left: 34px; */}
        &.show {height: auto; max-width: 800px; -webkit-transition: 250ms ease-in-out; -o-transition: 250ms ease-in-out; transition: 250ms ease-in-out;}
    }
    .quicklinks-hdr {}
}

/*Support Section*/
.audienceBlocksWrapper{}
.sectionTitle{
    & .lead{color: var(--primaryDark);font-size: 0.95em;font-weight: 300; }
    h2{font-weight:500;}
}
.audienceBlock {padding:15px;background:var(--light);border:1px solid var(--border);border-radius:5px;height: 100%;
    & .audienceBlockHead { display:flex;align-items: center; margin-bottom:15px;
        > a{display:flex;align-items: center;}
        & .icon{ padding:10px; border:1px solid var(--accent); border-radius:10px; margin-right:15px; background:var(--white);
            i{font-size:0; 
                &:before{font-size: 26px;font-weight:300!important;color:var(--accent);/* display: block; */}         
            }
        }   
        & .sectionTitle span{display:block;}                          
        h3{font-weight:600;}
    }
    & .topicsListWrapper {margin-top:15px;
        & .topic{padding-bottom: 10px;margin-bottom:10px;border-bottom :1px solid var(--border);
            &:last-child{border:0;  padding:0; }
            a{display:inline-flex; align-items:center;}
            a:before{content:"\f285";font-family:bootstrap-icons;font-weight:600;font-size: 10px;padding: 0 5px;}        
        }                     
    }
}

.popularBlocksWrapper {
    & .topicsListWrapper{margin-top:15px;margin-bottom:15px; 
        & .topic{padding-bottom: 10px;margin-bottom:10px;border-bottom :1px solid var(--border);
            a{display:inline-flex; align-items:center;}
            a:before{content:"\f287";font-family:bootstrap-icons;font-weight:600;font-size: 10px;padding: 0 5px;}        
        }                          
    }
}

.popularFAQWrapper {
    & .topicsListWrapper, .faqListWrapper{margin-top:15px;margin-bottom:15px; 
        & .topic{height:100%;padding-bottom: 10px;margin-bottom:10px;border-bottom :1px solid var(--border);align-items: center;
            a{display:inline-flex; align-items:center;}
            a:before{content:"\f135";font-family:bootstrap-icons;font-weight:300;font-size: 14px;padding: 0 5px;}        
        }                          
    }    
}

.helpCategories{ 
    & .categroyBlock {/* width: 150px; *//* margin: 15px; */}
    & .category {padding: 10px;border:1px solid var(--border);height:100%;text-align:center; border-radius:5px; background:var(--light);
        a{display:inline-flex;height: 100%;justify-content: center;flex-direction: column;}
        img{display:block;margin:0 auto;height: 40px;}  
        span{font-size:0.9em;}
    }
}

.quickTools {
    & .toolsList{
        & .iconBlock{padding: 10px;border:1px solid var(--border);height:100%;border-radius:5px;background:var(--light);
            & > a{width:50px; height:50px; text-align:center;padding:10px;border:1px solid var(--accent);border-radius:10px;margin-right:15px;background:var(--white);display: inline-block; margin-bottom:10px;
                img{filter: invert(21%) sepia(100%) saturate(7414%) hue-rotate(169deg) brightness(94%) contrast(117%);/* width: 100px; */}     
            }
            & .content a{font-weight:500;}
            img{ }
        }
    }
}


#changeparameters_23{display:none;}
.kbRows{
    & .kbSearchRow{
        ul{list-style:none; margin:0; padding:0; display:flex;
            li{margin-right: 10px;
                a{display:inline-block;font-size:0.9em;padding:3px 10px;border:1px solid var(--border);border-radius:8px;background:var(--light);color:var(--primaryDark);
                    &:hover{background:var(--border);} 
                }
            }  
        }
    }
}

.updateLinks{
    ul{display:flex;padding:0;margin:0;align-items: center; 
        li{ margin:15px 15px 0 0;
            a{display:inline-flex; align-items:center;
                &:before{content:"\f231";font-family:bootstrap-icons; font-size: 12px;line-height: 0; */}                    
                &:hover{color:var(--primaryDark);}
            }
        }          
    }
}

.keywordCloud {
    span{font-weight:500;}   
}
ul.tags{list-style:none; margin:0; padding:0; display:flex;
    li{margin-right:15px;
        a{display:inline-block;font-size: 0.85em;padding:3px 10px;border:1px solid var(--border);border-radius:8px;background:var(--light);color:var(--primaryDark);
            &:hover{background:var(--border);} 
        }
        &.current a{ background:var(--border);}
    }
    &.tagsList{flex-wrap:wrap;
        li{margin:10px;}          
    }
} 
.tagCloud{ margin:15px  0; 
    ul.tags{flex-wrap:wrap;
        li{margin: 2px;}       
    }             
}

.relatedContent{background:var(--light);padding:15px;border:1px solid var(--border);margin-bottom:30px;border-radius: 3px;
    h2{margin-bottom: 15px;font-size: 1.5em !important;font-weight: 500;border-bottom: 1px solid color-mix(var(--primary)  15%, transparent 100%);color:var(--primary) !important;}
    ul{margin:0; padding:0; list-style:none; 
        li{display:flex;align-items:center;margin-bottom:5px;/* flex-wrap: wrap; */padding-bottom: 5px;border-bottom: 1px solid var(--lightGray);
            span{font-weight:500; padding-right:5px;}
            a{font-size:0.95em;}
        }  
    }
}

/*FAQs*/
.relatedContent {
    & ul.category-list {
        li {display:block; 
            &:before{content:'';}
            a{display:inline-block; padding:5px 0 ;font-weight:500;}
            ul{
                li{border:0;margin: 0;padding: 0; 
                    a{padding: 0 0 10px 0;padding-left:15px;font-weight:300;}
                }
            }
        }
    }    
}
.categoryBlock, .subCategory{scroll-margin-top: 100px; 
    & a.toTop{position: absolute;right: -45px;bottom: 35px;display: block;width: 40px;height: 40px;background: #23527c;text-align: center;line-height: 40px;color: #FFF;font-size: 0;
        &:after{content:"\f281";font-family:bootstrap-icons!important;font-size: 20px;}         
    }                            
}
.sectionBody-Hdr {padding: 10px;background:var(--primary);
    h2{color:var(--white);font-size: 1.5em;text-transform:uppercase;font-family: var(--BlockText);margin: 0;}                 
}
.subCategory {position:relative;padding-bottom: 30px;
    & .sectionBody-Hdr{background:var(--accent);font-size: 1.2em;font-weight: 500;padding: 10px 15px;color:var(--white);margin-top: 5px;}
    & .sectionBody-item{ }
}
.panel { margin-bottom:5px;padding:15px; border:1px solid var(--border);
    h3{margin:0; font-size: 1.0em;
        a{font-family: var(--subheader);font-weight:500;position: relative;display: flex;align-items: center;justify-content: space-between; 
            &:focus, &:focus-visible{outline:none;} 
            &:after{ font-family:bootstrap-icons!important;font-weight: 100;font-size: 1.5em;content:"\f2e5"; color: #119b8e;}
            &.collapsed:after{content:"\f4f9";}
        }  
    }
    & .panel-body{padding: 0 15px;
        table{float:none !important;}             
    }
    & .meta{display:flex;align-items:center;flex-wrap: wrap;padding: 10px 0;
        ul{list-style:none; margin:0; padding:0; display:flex;
            li{margin-right:15px;
                a{display:inline-block;font-size:0.9em; padding:3px 10px; border:1px solid var(--border); border-radius:8px; background:var(--light); color:var(--primaryDark);
                    &:hover{background:var(--border);} 
                }
            }  
        } 
        & .related{display:flex; align-items:center;
            & div{ padding-right:10px;}
        }
    }
}
.faqsBlock{
    & .faq{border-bottom: 1px solid var(--border);padding: 10px;margin-bottom: 15px; background:var(--light);
        & .accordion-title a {display:flex;justify-content: space-between;color: var(--dark);  font-weight:500;
            &:after{content:"\f4f9"; font-family:bootstrap-icons!important; color:var(--primary);} 
            &:focus, &:focus-visible{ border:none; outline:none;}
        }      
        & .accordion-collapse{ padding:5px 15px; }
    }    
}

/*Knowledge Base*/
.KB_Topics{
    .categoryBlock{position:relative;padding-bottom: 25px;}
    .sectionBody-Hdr {padding:0; background:none; padding-bottom:15px;
        h2{/* display:inline-block; */padding-right:60px;color:var(--primary);font-size: 1.5em;border-bottom:2px solid var(--primaryDark);text-transform:uppercase;font-family: var(--BlockText);margin: 0;}                 
    }
}
.KB_TopicRow{ margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid var(--border);
    .lead{margin:0; font-size: 1.0em;
        a{
            strong{font-weight:500;} 
         } 
    }
    & .meta {display:flex;flex-wrap:wrap;align-items:center;margin:10px 0;
        & > em{margin-right:30px;}         
    }    
}

.supportArticleDetails{
    & .meta{display:flex;align-items:center;flex-wrap: wrap;padding: 10px 0;
        ul{list-style:none; margin:0; padding:0; display:flex;
            li{margin-right:15px;
                a{display:inline-block;font-size:0.9em; padding:3px 10px; border:1px solid var(--border); border-radius:8px; background:var(--light); color:var(--primaryDark);
                    &:hover{background:var(--border);} 
                }
            }  
        } 
        & .related{display:flex; align-items:center;
            & div{ padding-right:10px;}
        }
        &.relatedContent{display:block; padding: 15px;
            ul{display:flex;flex-direction: column; 
                li{flex-wrap:wrap;}   
            }                
        }
    }     
    & .topicsListWrapper{display:flex;flex-wrap: wrap;justify-content: space-between;
        & .topic{min-width: 49%;}                        
    }
    & .categoryResources{margin-top:15px;margin-bottom:15px; 
        & .topic{height:100%;padding-bottom: 10px;margin-bottom:10px;border-bottom :1px solid var(--border);align-items: center;
            a{display:inline-flex; align-items:center;}
            a:before{content:"\f135";font-family:bootstrap-icons;font-weight:300;font-size: 14px;padding: 0 5px;}        
        }                          
    } 
}

/*Tags Page*/
.dataRows {margin-bottom:30px; padding-bottom:30px; scroll-margin-top: 100px;
    & .tagDataRow, & .resourceRows{ margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid var(--border);
        a{ 
            strong{font-weight:500;}
        }
        & .meta {display:flex;flex-wrap:wrap;align-items:center;margin:10px 0;
            & > em{margin-right:30px;}         
        }
        &.videoRow{border:1px solid var(--border);
            a .h3{padding: 10px 10px 0 10px;display:inline-block;margin: 0;}
            & .details{padding: 0 10px;text-align: justify;}          
        }
    }
    &#faqs{
         & .tagDataRow{ margin-bottom:15px; padding-bottom:15px;}    
    }
}

.categoryGroup .typeGroup{
    &[data="Video"]{display:flex;flex-wrap: wrap;justify-content: space-between;}
    & .resourceRows.videoRow{width:30%; margin-bottom:15px; height:100%;
        img{width:100%;max-height: 320px;object-fit:cover;}                        
    } 
    @media all and (min-width: 0px) and (max-width: 991px) {
         & .resourceRows.videoRow{width: 48%;}
    }    
    @media all and (min-width: 0px) and (max-width: 769px) {
         & .resourceRows.videoRow{width:100%; }
    }        
}

/*Modal Window*/
.modal.show{
    .modal-body iframe {border: 0px;width: 100%;background: rgb(255,255,255);}
    .close {position: absolute;right: 0;top: 0;background: rgb(255,0,0);z-index: 100;text-shadow: none;color: rgb(255,255,255);line-height: 25px;width: 25px;font-size: 24px;padding: 0px;}
}


footer {background:var(--dark);position:relative;z-index:1;padding-top: 30px;
    & .footerImage{
        img{filter:brightness(0) invert(1);}               
    } 
    & .footerInfoBlock{display:flex;justify-content: flex-end; 
        & .address{/* width:50%; */font-size:.9em;
            div{display:flex;
                i{margin-right: 10px;} 
                address{margin:0;}
            }          
        }                  
    }

    & .copyright{ color:var(--white); margin-top:15px;
        & .subfooter-nav { 
            ul {margin:0;padding: 0;} 
            ul li{display:inline-block!important; vertical-align: middle;            
                a{padding: 0 10px 0 0!important;color:var(--white);
                    &:hover{background:none!important;} 
                }           
            } 
        }                             
    }
    @media all and (min-width: 0px) and (max-width: 767px) {
        & .footerInfoBlock{flex-direction:column; }
        & .address{text-align:left;margin-bottom: 15px;}
        & .footerNav { margin-top:10px;
            ul{display:block;}
        }
    }    
}

@media all and (min-width: 0px) and (max-width: 579px) {
 
}
@media all and (min-width: 0px) and (max-width: 479px) {
 
}

