/* This is style for the banner on all html pages */

            #banner{
            height:100px;
            width: 100%;
            background: -moz-linear-gradient(top,  rgba(30,154,141,1) 0%, rgba(209,188,113,0.46) 54%, rgba(209,188,113,0) 100%);
            background: -webkit-linear-gradient(top,  rgba(30,154,141,1) 0%,rgba(209,188,113,0.46) 54%,rgba(209,188,113,0) 100%);
            background: linear-gradient(to bottom,  rgba(30,154,141,1) 0%,rgba(209,188,113,0.46) 54%,rgba(209,188,113,0) 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e9a8d', endColorstr='#00d1bc71',GradientType=0 );
            /* border: black dotted; */
            padding-top: 5px;
            padding-left: 10px;
            padding-bottom: 15px;
            color: antiquewhite; 
            font-size: 24pt;
            
            }
            
       
            #banner h1  {
            color:  antiquewhite;
            font-size: 40pt; 
            line-height: 50pt;
                }
            
            
            h1 span  {
            color:rgb(14, 0, 3); 
            background-color: rgb(168, 179, 149);
            padding-left: 10px;
            padding-right: 10px;
            font-size: 20pt;
            font-style: italic;
            margin-left: 5px;
            }

            span.red {
                background: rgb(99,1,42);
                background: -moz-linear-gradient(top,  rgba(99,1,42,1) 0%, rgba(122,48,90,1) 44%, rgba(69,79,71,1) 88%);
                background: -webkit-linear-gradient(top,  rgba(99,1,42,1) 0%,rgba(122,48,90,1) 44%,rgba(69,79,71,1) 88%);
                background: linear-gradient(to bottom,  rgba(99,1,42,1) 0%,rgba(122,48,90,1) 44%,rgba(69,79,71,1) 88%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#63012a', endColorstr='#454f47',GradientType=0 );
                color: antiquewhite;
                font-size: 40pt;
                font-style: normal;
                margin-left: 5px;
            }



    
        @media (min-width: 200px) and (max-width:700px){
        #banner{
        height:100px;
        background: rgb(99,1,42);
        background: -moz-linear-gradient(top,  rgba(99,1,42,1) 0%, rgba(122,48,90,1) 44%, rgba(69,79,71,1) 88%);
        background: -webkit-linear-gradient(top,  rgba(99,1,42,1) 0%,rgba(122,48,90,1) 44%,rgba(69,79,71,1) 88%);
        background: linear-gradient(to bottom,  rgba(99,1,42,1) 0%,rgba(122,48,90,1) 44%,rgba(69,79,71,1) 88%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#63012a', endColorstr='#454f47',GradientType=0 );
        font-size:30pt;
        padding-top: 25px;
        width: 100%;
        margin-top: 10%;
        margin-left: 5%;
        margin-right: 0;
        margin-bottom: 50px;
          }
        }


        @media (min-width: 200px) and (max-width:700px){
          h1 #banner {
              font-size: 40pt;
              line-height: 45pt;
              width: 900px;
              background-color: rgb(4,48,9)
        }
      }

        @media (min-width: 200px) and (max-width:700px){
         h1 span {
            
                font-size: 35pt;
                line-height:40pt ;
                margin-left: 20px;
                color: rgba(86,0,73,1)
          
         }
       }
      
            /* This is banner from the NEW tablet */

            @media (min-width: 701px) and (max-width: 959px){
            #banner{
               
                    height:100px;
                    max-width: 960ox ;
                    min-width: 701px;
                    width: 100%;
                    background: -moz-linear-gradient(top,  rgba(30,154,141,1) 0%, rgba(209,188,113,0.46) 54%, rgba(209,188,113,0) 100%);
                    background: -webkit-linear-gradient(top,  rgba(30,154,141,1) 0%,rgba(209,188,113,0.46) 54%,rgba(209,188,113,0) 100%);
                    background: linear-gradient(to bottom,  rgba(30,154,141,1) 0%,rgba(209,188,113,0.46) 54%,rgba(209,188,113,0) 100%);
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e9a8d', endColorstr='#00d1bc71',GradientType=0 );
                    padding-top: 5px;
                    padding-left: 10px;
                    padding-bottom: 5px;
                    color: antiquewhite; 
                    font-size: 24pt;
                    
                    }
                }
                    
                    /* Defining a style for a set of tags not separated by commas applies the style only to all tags within the preceding tag*/
                   
                    @media (min-width: 701px) and (max-width: 959px){
                    #banner h1  {
                    font-size: 24pt; 
                    line-height: 50pt;
                    max-width: 959ox ;
                    min-width: 701px;
                    width: 100%;
                        }
                    }
                    
                    @media (min-width: 701px) and (max-width: 959px){
                    h1 span  {
                    color:rgb(14, 0, 3); 
                    background-color: rgb(168, 179, 149);
                    padding-left: 3px;
                    padding-right: 3px;
                    font-size: 22pt;
                    font-style: italic;
                    margin-left: 5px;
                    }
                }
            
            #footer {
                height:auto;
                background: -moz-linear-gradient(top,  rgba(30,154,141,1) 0%, rgba(209,188,113,0.46) 54%, rgba(209,188,113,0) 100%);
                background: -webkit-linear-gradient(top,  rgba(30,154,141,1) 0%,rgba(209,188,113,0.46) 54%,rgba(209,188,113,0) 100%);
                background: linear-gradient(to bottom,  rgba(30,154,141,1) 0%,rgba(209,188,113,0.46) 54%,rgba(209,188,113,0) 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e9a8d', endColorstr='#00d1bc71',GradientType=0 );
                margin-top: 50px;
                color: hsl(265, 56%, 11%);
                font-size: 14pt;
                padding-top: 15px;
                width: 960px;
                display: inline-flex;
                flex-direction: row;
                }
                #footer a {
                    color: rgb(47, 38, 59);
                    background-color: rgba(209,188,113,0.46)
                }
                #footer a:visited {
                    color: #043f30;
                }
                
                #footer a:hover {
                    color: antiquewhite;
                    text-decoration: none; 
                }
                
                #footer li {
                    font-weight: 800;
                    margin-left: 0;
                    margin-right: 2%;
                    flex-direction: row;
                    background: transparent;
                   
                }
                #footer ul{
                    margin-left: 5%;
                    margin-right: 5%;
                    Text-decoration: none; 
                    display: flex; 
                    flex-direction: row; 
                    justify-content: center;
                    margin-top: 5px; 
                    width: 960px;
                   
                }
    
 @media (min-width: 200px) and (max-width:700px){                 
#footer {
    width: 900px;
    height:auto;
    background-color: rgba(30,154,141,1);   
    color: antiquewhite;
    font-size: 28pt;
    display: flex;
    flex-direction: column;
    margin-left: 6%;
    margin-right: 5%;
      
    }
}

@media (min-width: 200px) and (max-width:700px){
    .footer {
    Text-decoration: none; 
	display: flex; 
	flex-direction: column; 
	margin-top: 50px; 
    margin-bottom: 50px;
	margin-right: 20px; 
    width: 900px;
 }
}
    
@media (min-width: 200px) and (max-width:700px){   
    #footer a {
        color: antiquewhite:
    }
}
@media (min-width: 200px) and (max-width:700px){
#footer a:visited {
        color: #d5eb88;
    }
}
    
@media (min-width: 200px) and (max-width:700px){    
    #footer a:hover {
        color: rgb(71, 4, 31);
        text-decoration: none; 
    }
}
 
@media (min-width: 200px) and (max-width:700px){
     #footer li {
        width: 900px;
        font-size: 40pt;
        font-weight: 800;
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 15px;
        color: antiquewhite;
        background: transparent; 
        text-decoration: none; 
        flex-direction: column;
     }
    }

    @media (min-width: 200px) and (max-width:700px){
       #call li span {
        display: none;
        }
    }

    @media (min-width: 200px) and (max-width:700px){
    #footer ul {
        margin-left: 0;
        margin-right: 0;
        text-decoration: none;
        display: flex;
        flex-direction: column;
        align-content: center;
        margin-top: 25px;
        width: 900px;
        color: antiquewhite;
        height: auto;
    }    
    
    }

    @media (min-width: 701px) and (max-width:960px){
    #footer {
        max-width: 960ox;
        min-width: 701px;
        width: 100%;
    }
}

@media (min-width: 701px) and (max-width:960px){
    #footer  #ul{
        max-width: 960ox;
        min-width: 701px;
        width: 100%;
        
    }
}