@media only screen and (max-width: 1024px) and (min-width: 990px){

}

@media only screen and (max-width: 990px) and (min-width: 770px){

}

@media only screen and (max-width: 767px) and (min-width: 550px){



.introductoryinpic {
    width: 50%;
    float: left;
    padding: 0 5px;
}

}



@media only screen and (max-width: 770px) and (min-width: 550px){
.navbar-brand > img{     width: 20%!important;
    float: left!important;
    padding-top: 4px!important;
    height: auto;}
	
nav.navbar {
    width: 80%!important;
    top: 3px!important;
}	
	
}

@media only screen and (max-width: 770px) and (min-width:768px){
.navbar-brand>img {
    width: 120px!important;
}
}

@media only screen and (max-width: 550px) and (min-width: 480px){
	
	.navbar-brand > img{    width: 20%!important;
    float: left!important;
    padding-top: 16px!important;
    height: auto;}
	
	
nav.navbar {
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
    float: left!important;
    width: 64%!important;
}	

.slide-text {
      right: 0 !important;
    left: 0 !important;
    margin: 0 auto !important;
    top: 80px !important;
    padding: 0 10px 0 10px !important;
    /* width: 480px !important; */
}
	
}


@media only screen and (max-width: 480px) and (min-width: 320px){
.navbar-brand>img {
    width: 60%;
     padding: 0px 0 0 0!important; 
}



nav.navbar {
    margin-bottom: 0!important;
    margin-top: 0!important;
    padding: 0!important;
    width: 100%!important;
}

#cssmenu ul {
    width: 80%;
}

.slide-text {
    top: 60% !important;
    right: 0px !important;
}

}