/* -- -- */
/* -- -- */
/* ------------------------  ---------------------- */
/* 
Great Links!
https://getcssscan.com/css-box-shadow-examples
*/

body{
width: 100%;
margin:0;
overflow-x:hidden; 
padding-bottom:0;
color:black;
background-color:white;
scroll-behavior:smooth;
/*font-family:Copperplate Gothic Light;*/
font-family:Arial, Helvetica, sans-serif; 
}

/* -- 
.respWrp:
this puts a white space on the edges of the screen
so your content doesn't butt up right against
the left and right sides
-- */

.respWrp{
padding-left:1.5rem;
padding-right:1.5rem;
}


.infoDiv{
padding-top:1rem;
padding-bottom:1rem;
margin-bottom:1rem;
}

.st{
display:block;
margin-left: auto;
margin-right: auto;
margin-bottom:3rem;
width:100%;
}

.img60{
display:block;
margin-left: auto;
margin-right: auto;
margin-bottom:3rem;
width:60%;
}

.leaderIcons{
width:250px;  
height:250px;
display:block;   
}

.sideImage{
width:700px;  
height:250px;  
object-fit:cover;
display: inline-block;
margin-top:2rem;
margin-left:2rem;
padding:3rem;
}

.abd{
width:250px; 
 
display:block;  
}

.webhostIcons{
width:600px;  
display:block;   
}

/* --  https://getcssscan.com/css-box-shadow-examples -- */
.boxShadow0{
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;   
}

.boxShadow1{
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px; 
}

.boxShadow2{
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}

.boxShadowWrapper2{
display: inline-block;
margin-top:2rem;
margin-left:2rem;
padding:3rem;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; 
}

.boxShadowBotom{
box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;   
}

#tableRoot{
padding:1.5rem;
}
/* ************************************************************************ */
/* ------------------------ MEDIA QUERY BREAK POINT ---------------------- */
/* ************************************************************************ */
@media screen and (min-width: 576px) and (max-width: 992px){
.st{
display:block;
/* margin-left: auto;
margin-right: auto; */
margin-bottom:3rem;
width:100%;
}

#tableRoot{
width:98%;   
padding:1.5rem;
}

}
/* -- ******************************************************** -- */
/* -- ********************** MEDIA QUERY ********************* -- */
@media screen and (max-width: 575px){


.abd{
width:250px;  
display:block;  
}

.webhostIcons{
width:250px;  
display:block;   
}

.respWrp{
padding-left:1rem;
padding-right:1rem;
}

.st{
display:block;
/* margin-left: auto;
margin-right: auto; */
margin-bottom:3rem;
width:90%;
}

.sideImage{
/* width:90%;   */
width:220px;  
height:110px;  
/* width:400px;   */
/* height:250px;   */
object-fit:cover;
display:block;
/* display:block; */
/* margin-top:2rem;
margin-left:2rem; */
padding:2rem;
}

#tableRoot{
width:50%;   
padding:1rem;
font-size:1.2rem;
}



}