
body {
    font-family: sans-serif;
    /*height: 100vh;*/
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    /*background-image: url(https://images.pexels.com/photos/242236/pexels-photo-242236.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260);*/
    /*backdrop-filter: blur(30px);*/
}
* {
    box-sizing: border-box;
}
.descrription.home-desc {
    max-width: 80%;
    margin: 20px auto;
}
header {
    color: white;
    background: #13134d;
}
.logo-container {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;

}
.logo-container img {
    width: 4vw;
    min-width: 20px;
    margin: 10px;
    padding: 4px;
    background: white;
    border-radius: 10px;
    filter: invert(1);
    mix-blend-mode: color-dodge;

}
.head-title {
    font-size: max(3vw, 30px);
    font-weight: bold;
}
nav {
    background: yellow;
    border-top: 3px solid #d7d700;
    display: flex;
    flex-direction: column;
    position: relative;
}
 nav ul {
    list-style: none;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
    height: 40px;
    background: #ffff00;
    border-top: 3px solid #d7d700;
}
nav ul li {
    display: flex;
}

nav ul li a {
    display: flex;
    align-items: center;
    color: #0d0d49;
    font-weight: bold;
    font-variant: all-small-caps;
    font-size: 18px;
    text-decoration: none;
    padding: 0 30px;
}

main {
    padding: 15px;
    max-width: 1024px;
    margin: 0 auto;
    width: 100%;
}

/* burger menu start */
#nav-icon3 {
  -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
    display: flex;
    background: yellow;
    border: none;
    width: 35px;
    height: 40px;
    align-self: flex-end;
    right: 10px;
    position: relative;
}

#nav-icon3 span {
  display: block;
  position: absolute;
  height: 5px;
  width: 100%;
  background: #13134d;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}




/* Icon 3 */

#nav-icon3 span:nth-child(1) {
  top: 4px;
}

#nav-icon3 span:nth-child(2), #nav-icon3 span:nth-child(3) {
  top: 16px;
}

#nav-icon3 span:nth-child(4) {
  top: 28px;
}

#nav-icon3.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}
.burger-menu, #nav-icon3 {
    display:none;
}

.burger-menu span {
    
}

/* burger menu end */

li.active-menu {
    border-bottom: 3px solid #13134d;
    background: #f7f70e;
}

footer {
    margin-top: auto;
    padding: 15px;
    background: #bebebe9e;
    color: #13134d;
    font-size: 12px;
    text-align: center;
    flex-wrap: wrap;

}

footer a {
    margin-left: 5px;
    color: #13134d;
    text-decoration: none;
}

footer a::after {
    content: '⤤';
}
footer a span {
    background: #ffff002e;
    padding: 0 5px;
    border-radius: 5px;
    font-weight: normal;
    display:none;
}

ul.list-content {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
}

ul.list-content a.list-link-item {
    display: flex;
    width: 100%;
    margin: 0px 0;
    padding: 10px 10px;
    background: #13134d;
    font-size: 18px;
    color: white;
    text-decoration: none;
    box-sizing: border-box;
    border-bottom: 1px solid #d7d700;
    align-items: center;
    justify-content: space-between;
}

ul.list-content a.list-link-item:hover {
    background: #16166e;
    
}

ul.list-content a.list-link-item::after {
    content: '❯';
    font-size: 18px;
    margin-right: 5px;
}

.icon-share-twitter {
	background-image: url(./forum/mods/social_share/images/icon-twitter.png);					
}
.icon-share-facebook{
	background-image: url(./forum/mods/social_share/images/icon-facebook.png);					
}
.icon{
	background-repeat: no-repeat;
	padding-left: 18px;
	margin-bottom: 2px;
	display: inline-block;
	height: 17px;
	color: blue;
	font-size: 14px;
	margin-left: 15px;					
}

.social-share-new{
	float: right;
}

.category-content {
    display: flex;
    flex-direction: column;
}
.category-content .social-share-new{
    display: flex;
    justify-content: flex-end;
}

.category-content .social-share-new .icon{
	background-repeat: no-repeat;
	padding-left: 20px;
	margin-bottom: 2px;
	display: inline-block;
	height: 17px;
	color: #13134d;
	font-size: 14px;
	margin-left: 15px;					
}

article section span[style='font-size:14px;'],
article section p font,
article section div font {
    font-size: 22px !important;
}

article section span[style='font-size:20px;'] {
    font-size: 22px !important;
    color: #13134d;
    border-bottom: 2px solid;
    padding-bottom: 5px;
}				
@media screen and (max-width: 600px) {
     .head-title {
        font-size: 5vw;
     }
     
     .logo-container img {
        width: 8vw;
     }
     nav ul {
      flex-direction: column;
      height: auto;
      padding-left: 15px;
       box-sizing: border-box;
    }
    nav ul li a {
    width: 100%;
    padding: 5px;
    }
}

@media screen and (max-width: 764px) {
 
 nav ul {
  flex-direction: column;
  height: auto;
  padding: 0 15px;
  border-top: none;
  display: none;
  position: absolute;
  width: 100%;
  top: 40px;
   
}
.description.home-desc {
    max-width: 95%;
    margin: 20px auto;
}
nav ul.active-nav {
    display:flex;
    padding-bottom: 4px;
}
 nav ul li a {
    width: 100%;
    padding: 10px 5px !important;
    border-bottom: 1px solid #abab01;
    font-size: 20px;
 }
  #nav-icon3 {
      display: block;
  }
 .burger-menu {
    display: flex;
    height: 40px;
    background: yellow;
    border: none;
    border-top: 3px solid #d7d700;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
 }
 .burger-menu span {
    display: block;
    width: 25px;
    border-bottom: 3px solid #13134d;
    margin: 2px;
    margin-right: 15px;
 }
}
#phorum {
    margin: 20px auto !important;
}


@media screen and (max-width: 980px) {
    nav ul li a {
    padding: 0 10px;
    }
}

.gurbani-text-main {
    margin-top: 20px;
    display: block;
    font-size: 1.5em;
}

@font-face {
  font-family: Raavi;
  src: url('assets/Gurblipi.ttf');
}

