/* Start with baseline CSS, for the smallest browsers. 
   Sometimes I put this into a separate css file and load it first.
   These are the "mobile first" styles. */

   
/* Then progressively add bigger sizes from small to large */

/* Smartphones start somewhere around here */

@media (min-width: 300px) {

.navbar-brand img {
	width: 70px;
}

.title p {
  font-size: 35px; 
}

p {
	font-size: 17px;
}

.floating-label-form-group input,
.floating-label-form-group textarea {
  font-size: 17px;
}

}

/* You might do landscape phones here if your content seems to need it */
@media (min-width: 450px) {
	
.navbar-brand img {
	width: 70px;
}	
	
.title p {
  font-size: 40px; 
}

p {
	font-size: 17px;
}	

.floating-label-form-group input,
.floating-label-form-group textarea {
  font-size: 17px;
}
	
}

/* Starting into tablets somewhere in here */
@media (min-width: 600px) {

.navbar-brand img {
	width: 70px;
}

.title p {
  font-size: 50px; 
}

p {
	font-size: 18px;
}

.floating-label-form-group input,
.floating-label-form-group textarea {
  font-size: 18px;
}
		
}

/* A bit bigger if you need some adjustments around here */
@media (min-width: 1100px) {

.navbar-brand img {
	width: 100px;
}

.title p {
  font-size: 60px; 
}

p {
	font-size: 19px;
}

.floating-label-form-group input,
.floating-label-form-group textarea {
  font-size: 19px;
}
	
}

/* Widescreens */
@media (min-width: 1500px) {

.navbar-brand img {
	width: 100px;
}

.title p {
  font-size: 60px; 
}

p {
	font-size: 19px;
}

.floating-label-form-group input,
.floating-label-form-group textarea {
  font-size: 19px;
}

}