@font-face {
  font-family: 'Playfair Display';
  src: url('/fonts/playfair-display-bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: url('/fonts/roboto-light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@media (max-width: 575.98px) { 
	#container{
                
                width:100%!important;
                padding:10px;
            } 
}


@media (max-width: 767.98px) { 
	#container{
                
                width:100%!important;
                padding:10px;
            } 
}
@media (max-width: 991.98px) {
	#container{
                
                width:100%!important;
                padding:10px;
            } 
}


 body{
                background-color:#f4f4f4;
            }
            
            #container{
                background-color:white;
                width:80%;
                margin-left: auto;
                margin-right: auto;
                padding:40px;
            }
            
            #content{
                //border:5px solid black;
                padding:10px;
            }
            
            #left{
                width:50%;
                float:left;
                /*height:100%;*/
                margin-right: 20px;
                padding-left: 20px;
            }
            
            h1{
                font-family: 'Playfair Display',serif;
                font-weight: 700;
                line-height: 1;
                margin-top: 0;
                margin-bottom: .8rem;
                font-size: 3rem;
            }
            h3{
                font-family: 'Playfair Display',serif;
                font-weight: 700;
                line-height: 1;
                margin-top: 0;
                margin-bottom: .8rem;
                }
                
                a:hover{
                text-decoration: underline;
                }
                 a{
                text-decoration: none;
                color:inherit;
                }
            p{
                font-size: 1rem;
                font-family: Roboto,sans-serif;
                font-style: normal;
                font-weight: 300;
            }  

            .side_pic{
                width:100%;
            }           
            

#left:after {
  content: '';
  width: 4px;
    height: 300px;
    background: black;
    position: absolute;
    /* bottom: -4px; */
    margin-left: 5px;
}

#left:before {
  content: '';
  width: 4px;
    height: 300px;
    background: black;
    position: absolute;
    /* bottom: -4px; */
    margin-right: 5px;
}

.marg-top30{
	margin-top:30px;
}