/* ...............common in About page , Contact page , locations....... */

 #x1d1 {width: 70%; margin: 0 auto; text-align: center; position: absolute; top: 50%; left: 50%; transform: translateX(-50%);}
 #x1h1 , #x1h2 {color: #ffffff; font-size: 75px; letter-spacing: 1.5px; text-transform: capitalize; font-family: var(--font-4); padding-bottom: 12px;}
 #x1h2{font-size: 45px;}
 #x1p1 ,#x1p2 {color: #ffffff; font-family: var(--font-1); font-weight: 500; font-size: 25px; line-height: 1.3; letter-spacing: 1.1px;}
 #x1d2{text-align: center; padding: 20px 0; margin: 60px auto;}
 #x1h2 ,#x1p2 {color: var(--color-4)}
 #x1p2{padding: 10px 0; font-size: 20px;}
 

 @media screen and (max-width: 992px){
    #x1p2{padding: 10px;}
}

@media screen and (max-width: 768px){
    #x1h1{font-size: 60px;}
    #x1p1{font-size: 22px;}
    #x1h2{font-size: 35px;}
    #x1p2{font-size: 18px;}
}

@media screen and (max-width: 600px){
    #x1d1{width: 80%;}
    #x1p2{padding: 10px 20px;}
}

@media screen and (max-width: 480px){
    #x1d1{width: 90%;top: 40%;}
    #x1h1{font-size: 50px;}
    #x1p1{font-size: 20px;}
    #x1h2{font-size: 30px;}
    #x1p2{font-size: 16px;}
    #x1p1 ,#x1p2 {line-height: 1.2;}
}

@media screen and (max-width: 405px){
    #x1d2{margin: 40px auto;}
    #x1h1{font-size: 40px;}
    #x1p1{font-size: 18px; letter-spacing: 1.05px;}
    #x1h2{font-size: 23px;}
    #x1p2{font-size: 15px;}
}