/* *****footer css ****/
/**********************/
/***********start  set up - for smallest screen of  280 x 653px screen **************/

.FooterNav {
    width: 100%;
    }

.FooterUL{
    margin-top: 120px;
    width: 100%;
    text-align: center;
    background-color:rgb(8, 5, 95);
    height: 75px;
    cursor: pointer;

}

.FooterUL li {/**** Formats list  items area ***/
        display: inline-block;
        margin-left: 0px;
        margin-top: 10px;
        width: 55px;
    
} 
       
       
.FooterUL li a{ /** formats all list text **/
        margin-top: 6px;
        display: block; 
        font-size: 13px;
        color: rgb(204, 156, 12);
        text-decoration: none;
        cursor: pointer;
                
} 
       
       
       .FooterUL p { /* paragraph area  **/
               margin-top: 10px;
                
               color: rgb(225, 221, 221);
               text-align: center;
               background-color: rgb(8, 5, 95);
                font-size: 12px;
           }
 
/** end of Start Setup for smallest screen  - 280px x 653 px ***/

/************************** min 320px *****************************/
@media only screen and (min-width: 320px) { 
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 14px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
             font-size: 12px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            width:90px;
        }

    }/* end of media only screen and using min width of 320px */

/************************** min 375px *****************************/
@media only screen and (min-width: 375px) { 
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 14px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
             font-size: 12px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            width:90px;
        }
    }/* end of media only screen and using min width of 375px */

/*** css  variation of Min 414 x 896PX px screen *****/
@media only screen and (min-width: 414px) {


    
        footer ul a{ /** formats all list text **/
      
            font-size: 22px; /*resize font  for 360PX min ****/   
        } 
        
        
            footer p { /* paragraph area  **/
                 font-size: 16px;/*resize font  for 360PX min ****/ 
            }
    
            footer li {
                width:115px;
            }



}/* end of media only screen and using min width of 414 * 896px */
    
/*** css  variation of Min 512px X 717 px  screen *****/
    @media only screen and (min-width: 512px) {
            .FooterUL{
                    margin-top: 160px;
            }
            
            .FooterUL li {/**** Formats list  items area ***/
                    margin-top: 12px;
                    width: 100px;
            } 
                   
            .FooterUL li a{ /** formats all list text **/
                    font-size: 16px;
            } 
                   
            .FooterUL p { /* paragraph area  **/
                    margin-top: 14px;
                    font-size: 12px;
            }
          
    } /*** end 512 x 717px ***/
    
/*** css  variation of Min 540px X 720 px  screen *****/
@media only screen and (min-width: 540px) {
    .FooterUL{
            margin-top: 160px;
    }
    
    .FooterUL li {/**** Formats list  items area ***/
            margin-top: 12px;
            width: 90px;
    } 
           
    .FooterUL li a{ /** formats all list text **/
            font-size: 16px;
    } 
           
    .FooterUL p { /* paragraph area  **/
            margin-top: 14px;
            font-size: 12px;
    }
  
} /*** end 540 x 720px ***/

/*** css  variation of Min 653 x 280PX px( & 717 x 512px ) screen *****/
@media only screen and (min-width: 653px) {
        .FooterUL{
                margin-top: 160px;
        }
        
        .FooterUL li {/**** Formats list  items area ***/
                margin-top: 12px;
                width: 155px;
        } 
               
        .FooterUL li a{ /** formats all list text **/
                font-size: 17px;
        } 
               
        .FooterUL p { /* paragraph area  **/
                margin-top: 14px;
                font-size: 16px;
        }
      
} /*** end 653 x 280px ***/

/*** css  variation of Min 658 x 320PX px screen *****/
@media only screen and (min-width: 658px) {
    
    .FooterUL{
        margin-top: 160px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 18px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 14px;
            font-size: 16px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 12px;
            width: 155px;
        }

} /*** end 658 x 320px ***/
    
/*** css  variation of Min 820 px screen *****/
@media only screen and (min-width: 820px) {
    
    .FooterUL{
        margin-top: 160px;
        }
        
    footer ul a{ /** formats all list text **/
      
        font-size: 28px; /*resize font  for 360PX min ****/   
    } 
    
        footer p { /* paragraph area  **/
            margin-top: 4px;
            font-size: 28px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 4px;
            width: 155px;
        }

}

/*** css  variation of Min 844 x 390 px  px screen *****/
@media only screen and (min-width: 844px) {
    
    .FooterUL{
        margin-top: 160px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 24px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 10px;
            font-size: 18px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 4px;
            width: 155px;
        }

}

/*** css  variation of Min 896 x 414 px screen *****/
@media only screen and (min-width: 896px) {
    
    .FooterUL{
        margin-top: 160px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 24px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 4px;
            font-size: 18px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 4px;
            width: 155px;
        }

}

/*** css  variation of Min 912 px screen *****/
@media only screen and (min-width: 912px) {
    
    .FooterUL{
        margin-top: 210px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 30px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 4px;
            font-size: 22px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 4px;
            width: 155px;
        }

}

/*** css  variation of Min 1024 px screen *****/
@media only screen and (min-width: 1024px) {
    
    .FooterUL{
        margin-top: 310px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 30px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 4px;
            font-size: 22px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 4px;
            width: 155px;
        }

}

/*** css  variation of Min 1600 px screen *****/
@media only screen and (min-width: 1600px) {
    
    .FooterUL{
        margin-top: 460px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 62px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 4px;
            font-size: 32px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 4px;
            width: 155px;
        }

}

/*** css  variation of Min 1920 px screen *****/
@media only screen and (min-width: 1920px) {
    
    .FooterUL{
        margin-top: 460px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 32px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 4px;
            font-size: 32px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 4px;
            width: 155px;
        }

}

/*** css  variation of Min 2560 px screen *****/
@media only screen and (min-width: 2560px) {


    .FooterUL{
       
        margin-top: 196px;
        height: 170px;
        list-style-type:none;
        }
    
        footer ul a{ /** formats all list text **/
            text-decoration: none;
            font-size: 60px; /*resize font  for 360PX min ****/   
        } 
        
        
            footer p { /* paragraph area  **/
                margin-top: 14px;
                font-size: 42px;/*resize font  for 360PX min ****/ 
                text-decoration: none;
            }
    
            footer li {
                text-decoration: none;
                margin-top: 34px;
                margin-left: 150px;
                width: 355px;
            }

}

/*** css  variation of Min 5120 px screen *****/
@media only screen and (min-width: 5120px) {
    .FooterUL{
        margin-top: 450px;
        height: 240px;
        }
    
    
    
    footer ul a{ /** formats all list text **/
      
        font-size: 70px; /*resize font  for 360PX min ****/   
    } 
    
    
        footer p { /* paragraph area  **/
            margin-top: 54px;
            font-size: 42px;/*resize font  for 360PX min ****/ 
        }

        footer li {
            margin-top: 44px;
            margin-left: 150px;
            width: 355px;
        }
}