/*   USING FONTS Arial, Arial & 'Acme', sans-serif;   */
body
{
    font-family: "Arial" , sans-serif;
    font-size: 15px;
    color: #282828;
    background-color: #ffffff;
    text-align: center;
    margin: 0 auto;
}


div.bodyBlogFrame
{
	margin-left:		auto;
	margin-right:		auto;
	padding-top:        3px;
	padding-bottom:     30px;     /* to create visual space before the footer */
	background-color:	#fffffC;
	width:				1280px;
}
ul.specialBullet
{
	list-style-image:	url(https://citrusdalcellars.co.za/images/bullet1.png);
}

a.textlink
{
    font-family: Arial;
    font-size: 15px;
    font-weight: normal;
    color: #02864d;
    text-decoration: underline;
    background-color:transparent;
}

a.textlink:visited 
{
    font-family: Arial;
    font-size: 15px;
    font-weight:  normal;
    color: #02864d;
    text-decoration: underline;
    background-color:transparent;
}

a.textlink:hover 
{
    font-family: Arial;
    font-size: 15px;
    font-weight: normal;
    color: #89be2e;
    text-decoration: underline;
    background-color:transparent;
}

a.CTAlink
{
    font-family: 'Acme', sans-serif;
    font-size: 18px;
    font-weight: normal;
    color: #02864d;
    text-decoration: underline;
    background-color: transparent;
    text-align: right;
}

a.CTAlink:visited 
{
    color: #02864d;
}

a.CTAlink:hover 
{
    color: #89be2e;
}

a.h3link
{
    font-size:  inherit;
    color:  inherit;
    text-decoration: none;
    background-color:transparent;
}

a.h3link:visited 
{
    font-size:  inherit;
    color:  inherit;
    text-decoration: none !important;
    background-color:transparent;
}

a.h3link:hover 
{
    font-size:  inherit;
    color:  inherit;
    text-decoration: underline;
    background-color:transparent;
}



/* HEADER CSS */
.container { max-width: 1280px;        margin: 0 auto;        width: 100%;    }


.header-main
{
    width: 100%;
    float: left;
    background-color: #FFFFFF;
    position: fixed;
    margin-top: 0px;
    top: 0;
    left: 0;
    border-bottom: thick solid #89be2e;
    border-bottom-width: medium;
    box-sizing: border-box;
    z-index: 9999;
    height: 198px;
    display: flex;
    will-change: transform;
}
    
.header-unpin{
  transform: translateY(-100px);
}
.header-pin{
  transform: translateY(0);
}


.header-container {   width: 100%; padding: 0;   margin: 0 auto; 
                       }
                          
.header-inner { max-width: 1280px; width: 100%;  height: 198px; position: relative; padding: 0;   margin: 0 auto; }

 
.logo
{
    position: absolute;
    left: 0px;
    top: 2px;
    max-width: 38%;
    text-align: left;
    float: left;
    padding: 1px;
}

.logo img
{
    max-width: 100%; }
                       
.menu-banner { position: relative;    top: 10px;   right: 10px; width: 62%;    float: right;  background-color:  transparent }

.heading { width: 100%; top: 0px; float: right; }
    
.heading h1 {  font-family: Arial;  text-align: right;    margin: 0px 5px 0px 0px;    font-size: 18px;    font-style:  normal;    
                                           font-weight: normal;    color: #89be2e;}


.menu{  width: 100%; top: 55px; float: right; position: relative; }

.menu ul{    width: 100%; float: left; margin: 0;padding: 0; text-align: right;}
.menu ul li{ float: none; list-style: none; display: inline-block; vertical-align: middle; } 
    
    
.menu ul li a{ overflow: hidden; float: left;  padding: 1px 15px 1px 15px; margin: 1px 5px 1px 5px; color: #02864d; 
                             font-family: 'Acme', sans-serif; font-size: 16px;  font-weight: normal;  text-decoration: none;    
                             text-align: center;    vertical-align: middle;    min-width: 48px;}
.menu ul li a:hover {text-decoration: underline; position: relative; color: #89be2e;} 
.menu ul li img {width: 35px; height: 35px; }
/* header css end*/


/* BODY CSS */

.main { width: 100%; float: left; padding: 0; margin: 0 auto; 
    margin-top: 198px; /* Add a top margin to avoid content overlay with STATIC MENU BAR */
}

.hero-inner{  width: 100%; float: left; }
.hero-image
{
    position: relative;
    left: 0px;
    top: 0px;
    width: 100%;
    text-align: center;
    float: left;
    padding: 0;
}
.hero-image img { max-width: 100%; text-align: center; border-top-left-radius: 15px;}



.cols2-main{ width: 100%; float: left; padding: 0; }
 
.cols2_inner-green {  width: 100%; float: left; text-align: center; background-color: #89be2e; padding: 0; margin: 0px 0px 0px 0px; } 
.cols2_inner-green h2 { text-align: left;   line-height: 25px; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-weight:  bold; font-size: 24px; font-style:  normal; color: #d3e3a5;  } 
.cols2_inner-green p { vertical-align: top; text-align: left;  padding: 0px 0px 5px 0px; font-family: Arial; line-height: 15px; font-size: 15px; font-weight: bold; color: #fffffc;  }
.cols2_inner-green ul { vertical-align: top; text-align: right;  margin: 0; padding: 0 10px 10px 20px;  list-style: none;}
.cols2_inner-green ul li { font-family: Arial; font-size : 16px; color: #fffffc;  margin: 0; padding: 0 0px 7px 5px; }
 
.cols2_inner{  width: 100%;float: left; background: #fff; text-align: left;} 
.cols2-shadowbox
{
    width: 49%;
    float: left;
    padding: 0 15px 15px 10px;
    margin: 10px 0.3% 10px 0.7%;
    border-radius: 3px;
    box-sizing: border-box;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);
}
.cols2-noshadowbox
{
    width: 49%;
    float: left;
    padding: 0 15px 0px 15px;
    margin: 15px 0.3% 15px 0.7%;
    box-sizing: border-box;
}
.cols2-quizbox
{
    width: 99%;
    float: left;
    padding: 0 15px 15px 15px;
    margin: 20px 0.3% 15px 0.7%;
    border-radius: 3px;
    box-sizing: border-box;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);
}
.cols2-img { width: 100%; float: left; text-align: center; padding-top: 5px;}
.cols2-img img { max-width: 100%; text-align: center; }
.cols2_inner h2{ vertical-align: top; text-align: right;   line-height: 24px; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-weight:  bold; font-size: 24px; font-style:  normal; color: #89be2e;}  
.cols2_inner h3
{
    text-align: left;
    line-height: 18px;
    font-family: Arial;
    font-weight: normal;
    font-size: 18px;
    font-style: italic;
    color: #89be2e;
    margin-top: 25px;
}
.cols2_inner  p { vertical-align: top; text-align: left;  padding: 0px 0px 0px 0px; font-family: Arial; line-height: 15px; font-size : 15px;    color: #282828; }
.cols2_inner  ul { vertical-align: top; text-align: left;  font-family: Arial; font-size : 15px;  margin: 0; padding: 0 10px 10px 20px; }
.cols2_inner  ol { vertical-align: top; text-align: left; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size : 15px;  margin: 0; padding: 0 10px 10px 20px;}
.cols2_inner  li { padding: 0px 0px 8px 0px; }
.cols2_inner  b { font-family: Arial; font-size : 15px; font-weight: bold; color: #363232;}
.cols2_inner table.subs  { width: 98%; text-align: center; padding-top: 0px; border-collapse: separate; border-spacing: 3px 12px;}
.cols2_inner td.subsField  { width: 40%; text-align: right; padding-top: 0px; }
.cols2_inner td.subsEntry { width: 60%; text-align: left; padding-top: 0px; }
.cols2_inner td.subsEntry2 { width: 60%; text-align: left; padding-top: 0px; font-size:12px;}


.cols3-main { width: 100%; float: left; padding: 0; }
.cols3_inner {  width: 100%;float: left; background: #fff; text-align: left;}  
.cols3-shadowbox
{
    width: 32.33%;
    float: left;
    padding: 0 15px 15px 10px;
    margin: 10px 0.3% 10px 0.7%;
    border-radius: 3px;
    box-sizing: border-box;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);
}
.cols3-noshadowbox
{
    width: 32.3%;
    float: left;
    padding: 0 5px 20px 5px;
    margin: 0px 0.3% 0px 0.7%;
    box-sizing: border-box;
}
.cols3-img
{
    width: 100%;
    float: left;
    text-align: center;
    padding: 0;
    margin: 0px 0px 20px 0px;
    font-size: 0px;
}
.cols3-img img { max-width: 100%; text-align: center; border-top-left-radius: 15px; }

.cols3_inner h2{  text-align: center;   line-height: 25px; font-family: 'Acme', sans-serif; font-weight:  bold; font-size: 24px; font-style:  normal; color: #89be2e;  }
  
.cols3_inner h3
{
    text-align: center;
    line-height: 25px;
    font-family: 'Acme', sans-serif;
    font-weight: normal;
    font-size: 20px;
    font-style: italic;
    color: #b06bfe;
}
.cols3_inner  p { vertical-align: top; text-align: left;  padding: 0px 15px 5px 15px; font-family: Arial; font-size : 15px;    color: #282828; }
.cols3_inner  ol { vertical-align: top; text-align: left; font-family: Arial; font-size : 15px;  margin: 0; padding: 0 15px 10px 20px;}
.cols3_inner  ul { vertical-align: top; text-align: left; margin: 0; padding: 0 20px 15px 15px; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size : 15px; }
.cols3_inner  li { padding: 10px 10px 10px 10px; 
                               list-style-type: none;
                                width: auto;
                                min-width: 51%;
                                display: inline-block;
                                float: left;
                                margin: 5px;
                                box-sizing: border-box;
                                border: medium solid #b7d574;
                                border-top-right-radius: 15px;
                                border-bottom-right-radius: 15px;
                                box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2); }
 
.cols3_inner  li  a { font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size: 18px; color: #282828;  text-decoration: none; }  
.cols3_inner  li  a:visited {text-decoration: none; position: relative; color: #282828;} 
.cols3_inner  li  a:hover {text-decoration: underline; position: relative; color: #89be2e;}            
                  
.cols3_inner  b { font-family: Arial; font-size : 15px; font-weight: bolder; color: #363232;}

.cols3_inner table.subs  { width: 98%; text-align: center; padding-top: 0px; border-collapse: separate; background-color: #b7d574; border-spacing: 3px 10px; font-size:14px;}
.cols3_inner td.subsField  { width: 40%; text-align: right; padding-top: 0px;}
.cols3_inner td.subsEntry { width: 60%; text-align: left; padding-top: 0px;}
.cols3_inner td.subsEntry2 { width: 60%; text-align: left; padding-top: 0px;}


.cols4-main{ width: 100%; float: left; padding: 0; }
.cols4_inner{  width: 100%;float: left; background: #fff; text-align: left;}  
.cols4-shadowbox
{
    width: 24%;
    float: left;
    padding: 0 15px 15px 10px;
    margin: 10px 0.3% 10px 0.7%;
    border-radius: 3px;
    box-sizing: border-box;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);
}
.cols4-noshadowbox
{
    width: 24%;
    float: left;
    padding: 0 5px 15px 5px;
    margin: 10px 0.3% 10px 0.7%;
    box-sizing: border-box;
    border-right: 2px solid #b7d574;
}

.cols4-img  { width: 100%; float: left; text-align: center; padding: 0; margin: 0px 0px 20px 0px; font-size: 0px;}
.cols4-img img { max-width: 100%; text-align: center; }

.cols4_inner h2{ text-align: center;   line-height: 25px; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-weight:  bold; font-size: 24px; font-style:  normal; color: #89be2e;  }
.cols4_inner h3
{
    text-align: center;
    line-height: 20px;
    font-family: 'Acme', sans-serif;
    font-weight: bolder;
    font-size: 20px;
    color: #89be2e;
}
.cols4_inner  p { vertical-align: top; text-align: left;  padding: 0px 10px 5px 10px; font-family: Arial; font-size : 15px;    color: #282828; }
.cols4_inner  ul { vertical-align: top; text-align: left; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size : 15px;  margin: 0; padding: 0 15px 10px 10px;}
.cols4_inner  ul li { padding: 0px 0px 8px 0px; }

.cols4_inner  ol { vertical-align: top; text-align: left; margin: 0px 0px 0px 5px; padding: 0px 15px 15px 0px; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size : 15px; }
.cols4_inner  ol li { padding: 10px 10px 10px 10px; 
                               list-style-type: none;
                               width: auto;
                               min-width: 51%;
                                display: inline-block;
                                float: left;
                                margin: 5px;
                                box-sizing: border-box;
                                border: medium solid #b7d574;
                                border-top-right-radius: 15px;
                                border-bottom-right-radius: 15px; 
                                box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);}
 
.cols4_inner  li  a { font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size: 18px; color: #282828;  text-decoration: none; }  
.cols4_inner  li  a:visited {text-decoration: none; position: relative; color: #282828;} 
.cols4_inner  li  a:hover {text-decoration: underline; position: relative; color: #89be2e;}             

.cols4_inner  b { font-family: Arial; font-size : 15px; font-weight: bolder; color: #363232;}



.cols75-25-main{ width: 100%; float: left; padding: 0; }
.cols75-25_inner{  width: 100%; padding-top: 15px; padding-bottom: 15px; float: left; background: #fff; text-align: center; 
                   border-top-left-radius: 15px; border-top: medium solid #02864d; }
 
.cols75-25-widebox
{
    width: 74.8%;
    float: left;
    padding: 0 40px 5px 40px;
    margin: 10px 0.1% 10px 0.1%;
    box-sizing: border-box;
}
.cols75-25-narrowbox
{
    width: 24.8%;
    float: left;
    padding: 0px 10px 0px 10px;
    margin: 10px 0.1% 10px 0.1%;
    box-sizing: border-box;
}
.cols75-25-img { width: 100%; float: left; text-align: center; padding-top: 10px;}
.cols75-25-img img { max-width: 100%; text-align: center; border-top-left-radius: 15px; }

.cols75-25_inner h2{ vertical-align: top;  text-align: center;   line-height: 24px; 
                     font-family: 'Acme', sans-serif; font-weight:  bold; font-size: 24px; font-style: normal; color: #89be2e;}    
.cols75-25_inner h3
{
    text-align: center;
    line-height: 25px;
    font-family: 'Acme', sans-serif;
    font-weight: normal;
    font-size: 20px;
    font-style: italic;
    color: #b06bfe;
}
.cols75-25_inner p { vertical-align: top; text-align: justify;  padding: 0px 0px 5px 0px; font-family: Arial; font-size : 15px;    color: #282828; }
.cols75-25_inner ul { vertical-align: top; text-align: left;  font-family: Arial; font-size : 15px;  margin: 0; padding: 0 10px 10px 20px;}
.cols75-25_inner ol { vertical-align: top; text-align: left; font-family: Arial; font-size : 15px;  margin: 0; padding: 0 10px 10px 20px;}
.cols75-25_inner li { padding: 0px 0px 8px 0px; }
.cols75-25_inner b { font-family: Arial; font-size : 15px; font-weight: bold; color: #363232;}


.p-right { vertical-align: top; text-align: right;  padding: 0px 5px 5px 0px; }

.red-star { color: #CC0000; font-size: xx-large;  }

/* FOOTER CSS */

.footer-main { background: #89be2e;  width: 100%; float: left; padding: 0; margin-top: 15px; }
                        
.footer_inner
{
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 0px;
}  



.footer-quarterbox
{
    width: 24%; 
    float: left;
    padding: 5px 2px 5px 10px;
    margin: 10px 0.3% 5px 0.7%;
    text-align: left;
    color: #FFFFFC;
    font-family: Arial;
    font-size: 14px;
    font-weight: normal;
    box-sizing: border-box;  
}

.footer-quarterbox h3
{
    text-align: left;
    vertical-align: top;
    line-height: 25px;
    font-family: 'Acme', sans-serif;
    font-weight: bold;
    font-size: 24px;
    font-weight: bold;
    font-style: normal;
    color: #02864d;
    margin-bottom: 25px;
}

.footer-quarterbox p { vertical-align: top; text-align: left;  padding: 0; 
                                                                            font-family: Arial; font-size : 13px;   color: #d3e3a5; text-decoration: none;}
.footer-quarterbox b { text-align: center; font-family: Arial; font-size : 16px; font-weight: bold; color: #FFFFFC;}
.footer-quarterbox img { max-width: 100%; text-align: center; }
.footer-quarterbox a { padding: 0px 0px 0px 0px; color: #FFFFFC; font-family: Arial; font-size: 13px;  font-weight: normal;  
                                                            text-decoration: underline;    text-align: left;     min-width: 48px;}
.footer-quarterbox a:hover {text-decoration: underline; position: relative; color: #02864d;}


.copyright { text-align: center; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size: 18px; color: #02864d; font-weight: bold; }
.copyright p  { text-align: center; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size: 18px; color: #02864d; font-weight: bold; }
.copyright a { text-align: center; font-family: "Arial Narrow", Arial; font-stretch: condensed;font-size: 18px; color: #02864d; font-weight: bold; text-decoration: none;}



/* RESPONSIVE CSS */

@media screen and (max-width:1600px){
    /*none now*/
}

@media screen and (max-width:1200px){
    .logo { top: 0px; }
    .logo img { width: 98%; height: 98%; }
    
    .header-main {  height: 173px;}
    .header-inner {  height: 173px;}
    .main { margin-top: 173px;}
    
    .menu { top: 20px;  }
    .menu ul li a {  margin: 1px 1px 1px 1px;  padding: 1px 6px 1px 7px;  font-size: 15px; line-height: 15px;   }
    
    .cols2_inner h2 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; }  
    .cols2_inner h3 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; }  
        
    .cols3_inner h2 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; }  
    .cols3_inner h3 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; } 

    .cols4_inner h2 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; }  
    .cols4_inner h3 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; }  
    
    .cols75-25_inner h2 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; }  
    .cols75-25_inner h3 {  padding: 5px 8px;  font-size: 18px; line-height: 20px; }  
    
    .footer-quarterbox h3   { line-height: 22px; font-size: 21px; }
    .form-inputbox { width: 220px; } 
}

@media screen and (max-width:991px){
    a.CTAlink { font-size: 16px; }
    
    .header-main {  height: 50px;}
    .header-inner {  height: 50px;}
    
    .menu { top: 8px;  }
    .menu ul li a { padding: 1px 5px 1px 6px;  margin: 1px 0px 1px 0px; font-size: 13px; line-height: 13px;   }
        
        
    .main { margin-top: 50px;}

    .cols2-img img{   text-align: center; width: 99%;} 
    .cols2_inner h2 {  line-height: 18px;   font-size: 18px;    padding: 0 15px 0;}
    .cols2_inner h3 {  line-height: 18px;  font-size: 18px;    padding: 7px 0px;}    
    .cols2_inner-green ul li { padding: 10px 5px 10px 5px; }
    
    .cols3-img img{   text-align: center; width: 99%;}  
    .cols3_inner h2 {  line-height: 18px;   font-size: 18px;    padding: 0 15px 0;}
    .cols3_inner h3 {  line-height: 17px;  font-size: 17px;    padding: 7px 0px;}
    .cols3_inner table.subs  { font-size:13px;}

      
    .cols4img img{   text-align: center; width: 99%;}  
    .cols4_inner h2 {  line-height: 18px;  font-size: 18px;    padding: 0 15px 0;}
    .cols4_inner h3 {  line-height: 17px;  font-size: 17px;    padding: 7px 0px;}   
   
    .cols75-25img img{   text-align: center; width: 99%;}  
    .cols75-25_inner h2 {    font-size: 18px;    padding: 0 15px 0;}
    .cols75-25_inner h3 {    font-size: 17px;    padding: 7px 0px;}
    .cols75-25_inner p {   text-align: left; line-height: 14px; font-size: 14px;}
    
    .red-star { font-size: x-large;  }
    
    .footer-quarterbox
    {
    width: 49%; /* 4 blocks to split into 2 groups of 2 */
    margin: 20px 0.3% 5px 0.7%;
    line-height: 14px;
    font-size: 14px;
    }
    
    .footer-quarterbox b { line-height: 15px; font-size : 15px; }
    .footer-quarterbox p { line-height: 14px; font-size : 14px;  }
    .footer-quarterbox a { line-height: 14px; font-size: 14px;  min-width: 48px;}  
    
}


@media screen and (max-width:896px){
    
    .header-main {  height: 138px;}
    .header-inner {  height: 138px;}
    .main { margin-top: 138px;}

}


@media screen and (min-width:768px){
    .toggle-menu { display: none;    }
    .menu { display: block !important;}

}

@media screen and (max-width:767px){   /* Hamburger Menu enters */
    .container { width: 98%;}

    .header-main { height: 130px; padding: 0;}
    .header-inner { height: 130px;width: 98%;}
    
    .logo {  width: 50%; max-width: 50%; position: absolute;    top: 3px;  float: left;    bottom: auto;}
    .logo img {text-align: center; width: 99%; height: 99%; } 
    
    .menu-banner { width: 50%; max-width: 50%; float: right; top: 5px; right: 2px; }
    .heading { width: 99%; top: 0px; float: right; text-align: center; }
    .heading h1 { width: 92%; line-height: 16px; font-size: 16px;  text-align: right; padding: 5px 5px 5px 5px; margin: 0; }
      
    .menu {  position: relative; top: 5px;  width: 60%; float: right; text-align: right; background-color:  transparent; padding : 0px 0px 1px 0px; 
                                        display: none; z-index: 9999999 !important;}

    .toggle-menu { width: 85%;    float: right;    text-align: right;    padding: 5px 20px 1px 5px;   background-color:  transparent; }
    .toggle-menu a { float: right; text-align: right; padding: 0;  margin-right:10px;  }
    .toggle-menu a img { width: 32px; height: 32px; }
    .menu ul { float: right; text-align: right; background-color: #89be2e; z-index: 9999999 !important;}
    .menu ul li { width: 99%; padding : 5px 0;}
    .menu ul li a { color: #fffffc; padding: 1px 5px 1px 5px;  margin: 1px 5px 1px 5px;  }
    .menu ul li a:hover
    {
        text-decoration: underline;
        color: #02864d;
        position: relative;
    }
    .menu ul li a br {display: None;}   

       
    .main { margin-top: 130px; padding: 0;}
    
    .hero-inner { text-align: center; padding: 0px 0px 0px 0px;}
    .hero-image img { width: 99%; }           

    a.textlink { font-size: 16px; }
    a.textlink:visited { font-size: 16px; }
    a.textlink:hover { font-size: 16px; }

    .cols2-main { padding: 0;} 
    .cols2_inner { text-align: center; padding: 0;}
    .cols2-noshadowbox { width: 98%;  padding: 0px 5px 10px 5px; margin: 0; }
    .cols2-shadowbox { width: 99%;  padding: 0px 5px 10px 5px; margin: 0;}  
    .cols2_inner h2 { text-align: center; line-height: 20px; font-size: 20px; padding: 0; margin: 20px 0px 0px 0px;} 
    .cols2_inner h3 { text-align: center; line-height: 18px; font-size: 18px; padding: 0;} 
    .cols2_inner p { text-align: left; line-height: 16px; font-size: 16px; padding: 0; margin: 10px 0px 0px 0px;}
    
    .cols2_inner-green { padding: 5px 0px 5px 0px; }
    .cols2_inner-green ul { margin: 5px 0px 0px 0px; }
    .cols2_inner-green ul li { text-align: left; padding: 0px 0px 15px 0px; margin: 0;}
    .cols2_inner-green ul li a { line-height: 15px; font-size: 15px; text-align: left; }
    .cols2_inner-green h2 { text-align: right; padding: 0px 15px 0px 0px; margin: 0; }

       
    .cols3-main { padding: 0;} 
    .cols3_inner { text-align: center; padding: 0px 0px 0px 0px;}
    .cols3-shadowbox { width: 99%;  padding: 0px 5px 10px 5px;}  
    .cols3-noshadowbox { width: 99%;  padding: 0px 5px 15px 5px; margin: 0;} 
    .cols3-img img { margin-top: 10px; } 
    .cols3_inner h2 { line-height: 20px; font-size: 20px; text-align: center; padding: 0;}
    .cols3_inner h3 { line-height: 18px; font-size: 18px; text-align: center; padding: 0;}
    .cols3_inner p { text-align: left; line-height: 16px; font-size: 16px; padding: 0;}
    .cols3_inner ul { text-align: center; padding: 0; margin-left: 20%; width: 80%;} 
    .cols3_inner ul li { text-align: left; padding: 5px 5px 5px 5px; } 
    .cols3_inner ul li a { line-height: 20px; font-size: 20px; text-align: center; padding: 5px 15px 5px 15px; }           


    .cols4-main { padding: 0;} 
    .cols4_inner { text-align: center; padding: 10px 0px 0px 0px;}
    .cols4-shadowbox { width: 99%;  padding: 0px 5px 10px 5px;}  
    .cols4-noshadowbox { width: 99%;  padding: 0px 5px 15px 5px; margin-bottom: 20px; border-right: none; border-bottom: 2px solid #b7d574;} 
    .cols4_inner h2 { text-align: center; line-height: 18px; font-size: 18px; padding: 0;} 
    .cols4_inner h3 { text-align: center; line-height: 16px; font-size: 16px; padding: 0;}  
    .cols4_inner p { text-align: left; line-height: 15px; font-size: 15px; padding: 0;}
    .cols4_inner ul { text-align: center; margin: 5px 5% 0px 5%; }
    .cols4_inner ul li { text-align: left; padding: 0px 0px 15px 0px; margin: 0;}
    .cols4_inner ul li a { line-height: 18px; font-size: 18px; text-align: left; }
    .cols4_inner ol { text-align: center; padding: 0; margin: auto; width: 95%;} 
    .cols4_inner ol li { text-align: left; padding: 5px 5px 5px 5px; } 
    .cols4_inner ol li a { line-height: 20px; font-size: 20px; text-align: center; padding: 5px 15px 5px 15px; } 

    .cols75-25-main{ padding: 0; }
    .cols75-25_inner { text-align: center; padding: 10px 0px 0px 0px;}
    .cols75-25-widebox { width: 99%;  padding: 0px 5px 5px 5px;}  
    .cols75-25-narrowbox { width: 99%; margin-top: 3px; padding: 0px 5px 0px 5px;} 
    .cols75-25_inner h2 { text-align: center; line-height: 18px; font-size: 18px; padding: 0;} 
    .cols75-25_inner h3 { text-align: center; line-height: 16px; font-size: 16px; padding: 0;}  
    .cols75-25_inner p { text-align: left; line-height: 15px; font-size: 15px; padding: 0;}
    .cols75-25-img { width: 99%; padding-top: 0px; padding-bottom: 10px;}
       
    .footer-main { padding: 0; }
    
    .logoImg
    {
    width: 24%; /*since there are 8 logos to split into 2 groups of 4 */
    }

    .footer-quarterbox
    {
    width: 49%; /* since there are 4 blocks to split into 2 groups of 2 */
    margin: 10px 0.3% 5px 0.7%;
    padding: 2px;
    line-height: 11px;
    font-size: 11px;
    }
    .footer-quarterbox h3 { line-height: 1.3; font-size: 16px; margin: 15px 0px 18px 0px; }
    .footer-quarterbox b  { line-height: 1.3; font-size: 15px; }
    .footer-quarterbox p  { line-height: 1.3; font-size: 15px;  }
    .footer-quarterbox a  { line-height: 1.3; font-size: 15px;  min-width: 48px;} 
    .footer-quarterbox img { max-width: 99%; text-align: center; }
    
    .copyright p  { line-height: 15px; font-size: 15px; }
    .copyright a { line-height: 15px; font-size: 15px; }
  

}

@media screen and (max-width:479px){
    .header-main {  height: 80px;}
    .header-inner {  height: 80px;}
    
    .heading h1 { line-height: 14px; font-size: 14px; }
    
    .toggle-menu a img { width: 29px; height: 29px; }
    .menu {  width: 98%;  }
    
    .main { margin-top: 80px;}
    
        
    .cols2_inner h2 { width: 96%;  line-height: 18px; font-size: 18px; }
    .cols2_inner h3 { width: 96%;  line-height: 17px; font-size: 17px; }
    
    .cols3_inner h2 { width: 96%;  line-height: 18px; font-size: 18px;  }
    .cols3_inner h3 { width: 96%;  line-height: 18px; font-size: 18px;  }    
    .cols3_inner ul { text-align: center; padding: 0; margin-left: 10px; width: 99%;} 
    .cols3_inner ul li { text-align: left; padding: 8px 2px 8px 2px; } 
    .cols3_inner ul li a { line-height: 14px; font-size: 14px; text-transform: uppercase; text-align: center; padding: 5px 2px 5px 2px; }
    
    .cols4_inner h2 { width: 96%;  line-height: 18px; font-size: 18px;  }
    .cols4_inner h3 { width: 96%;  line-height: 16px; font-size: 16px;  }
    .cols4_inner ol { text-align: center; padding: 0; } 
    .cols4_inner ol li { text-align: left; padding: 8px 2px 8px 2px; min-width: 30%; } 
    .cols4_inner ol li a { line-height: 14px; font-size: 14px; text-transform: uppercase; text-align: center; padding: 5px 2px 5px 2px; }
    
    .cols75-25_inner h2 { width: 96%;  line-height: 18px;  font-size: 18px; }
    .cols75-25_inner h3 { width: 96%;  line-height: 18px;  font-size: 18px; }
     
     .footer-quarterbox
    {
    width: 99%; /* since there are 4 blocks to split into 2 groups of 2 */
    margin: 10px 0.5% 5px 0.5%;
    padding: 2px;
    line-height: 1.5;
    font-size: 16px;
    }
    .footer-quarterbox h3 { line-height: 1.5; font-size: 18px; margin: 15px 0px 18px 0px; }
    .footer-quarterbox b  { line-height: 1.5; font-size: 16px; }
    .footer-quarterbox p  { line-height: 1.5; font-size: 16px;  }
    .footer-quarterbox a  { line-height: 1.5; font-size: 16px;  min-width: 48px;} 
    .footer-quarterbox img { max-width: 99%; text-align: center; }
    
    .copyright p  { font-size: 15px; }
    .copyright a { font-size: 15px; }
    
    .form-inputbox { width: 130px; }   
    .form-button { margin: 10px; font-size: 13px;  }

}