@charset "ISO-8859-1";
/* .container{
	 display: grid;
	  grid-template-rows: 8rem calc(100vh - 8rem) min-content;
    grid-template-rows: 8rem minmax(100vh, max-content) min-content;
   grid-template-columns:[full-start] minmax(6rem, 1fr) [center-start] repeat(9, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];
}
 */.container{
	 display: grid;
  grid-template-rows: 8rem minmax(calc(100vh - 10rem), max-content) min-content;
   grid-template-columns:[full-start] minmax(6rem, 1fr) [center-start] repeat(9, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];

}
.aboutWatfy{
grid-column: center-start / col-end 5;
 /*background-image:linear-gradient(
      rgba(255, 254, 255, 0.93),
      rgba(254, 254, 255, 0.93)
    ),url(../images/apjKalam1.png);
    
  background-position: center;
  background-size: cover;*/
 /* padding: 8rem;
  padding-top: 4rem; */
  margin:5rem auto;
   }
.quotetext{
	font-size:var(--fs-th);
	color:var(--color-primary);
	font-family:var(--font-display);
	line-height:1.3;
	margin-bottom:3rem;
	}
.nametext{
	font-size:1.4rem;
	color:var(--color-primary);
	font-family:var(--font-display);
	font-style: italic;
	float:right;
}
.quote{
	padding:5rem .5rem;
}

.abtHats{
	padding:2rem .5remrem 1rem;
	color:var(--color-primary);
}
.paraHats{
	font-family:var(--font-display);
	font-size:var(--fs-input);
	line-height:1.5;
	letter-spacing:var(--lr-s-p);
	 text-align: justify;
	 padding-top:1rem;
	 padding:1rem .5rem 0rem;
}
.quHats{
	margin:5rem .5rem 0rem;
	font-size:var(--fs-input);
	color:var(--color-primary);
}

/*************************************/

 .signwith_google{
	grid-column:col-start 7 / center-end;
	width:100%;
	height:500px;
	background-color:var(--color-grey-light-1);
	padding:0rem 1rem;
	border-top: 1rem solid var(--color-primary);
	border-bottom: 1rem solid var(--color-primary);
	margin:10rem auto;
	
	display:flex;
	align-items:center;
	justify-content:center;

}
.signwith_google a:link{
	 text-decoration: none;
} 
 .signIn-btn{
width:30rem;
    max-width: 40rem;
    min-width: min-content;
    border-radius: 2rem;
   padding:1.5rem 2rem;
display:flex;
align-items:center;
justify-content:center;
border:1px solid var(--color-primary);
background-color:white;
	cursor:pointer;
 }
 .signIn-btn:hover{
  background-color:var(--color-primary); 
  background-image: linear-gradient(rgba(252, 252, 255, 0.93),
      rgba(252,252, 255, 0.93));
        transform: scale(1.03); 
} 
.fa-brands{
margin-right:2rem;
font-size:2.5rem;
	color:var(--color-primary);
}
.G-sign{
	font-size:2rem;
	letter-spacing:.25px;
	color:var(--color-primary);
}
/***********Responsive***********/
@media only screen and (max-width: 56em) {
 
  /*  900 / 16 = 56.25**/
  .container{
	 display: grid;
    grid-template-rows: 8rem max-content max-content min-content;
   grid-template-columns:[full-start] minmax(6rem, 1fr) [center-start] repeat(9, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(6rem, 1fr) [full-end];

}
.aboutWatfy{
	grid-column:center-start / center-end;
	grid-area:2 /center-start/ 3/ center-end;
	padding:0rem 1rem;
	margin-bottom:3rem;
	} 
 .signwith_google{
	grid-column:center-start / center-end;
	grid-area:3 /center-start/ 4/ center-end;
	height:48vh;
	margin:5rem auto;
	}
	
	
	
}
@media only screen and (max-width: 27em) {	
	
	/*** 432 / 16 = 27 **/
	.container{
	 grid-template-rows: 8rem max-content max-content min-content;
    grid-template-columns:[full-start] minmax(2rem, 1fr) [center-start] repeat(9, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(2rem, 1fr) [full-end];
}
.signIn-btn{
width:28rem;

}
	
}	
	
	
	
