@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600&display=swap');
*{margin:0; padding:0; box-sizing:border-box; }
body{margin:0 2px; padding:0; border:2px solid red;}
a{text-decoration:none; font-weight:bold; transition:0.5s;} a:hover, a:active, a:focus{color:#ff0000; outline:none; text-decoration:none;}
p{font-size:105%; padding:1px 2px 2px 1px; line-height:140%; text-align:justify; margin-bottom:15px;}
.category a{display:block; padding:5px 1px 5px 4px; margin:0px 0px 6px 0px; border-radius:3px; background:#ffd500; color:#000; }
.category a:hover{display:block; padding:5px 1px 5px 4px; margin:0px 0px 6px 0px; border-radius:3px;  text-decoration:none; background:#6899e8; color:#fff;}

.ul ul li{margin-left:30px; padding:6px 0px; font-size:105%;}  .ul ol li{margin-left:30px; padding:6px 0px; font-size:105%;}
.container{background-color:#fff; padding:2px 2px 0px 3px; font-size:105%;}
h1{line-height:35px; }

.footer{background-color:#FFF0F0; border-top:5px solid #4527a0; padding:5px; font-family:'Poppins', sans-serif;} .footer .display-center a{font-size:18px; font-weight:600; text-decoration:none;} .hr{width:100%; margin:5px 0 10px 0; padding:0;} .display-center{text-align:center;} .footer .display-right{text-align:right; }
.footer-sicial-img{display:flex;  transition:all .3s ease-in-out; font-size:20px;}
.footer-sicial-img img{display:inline-block !important; width:25px; height:26px; border-radius:50%; margin:1px 0px 0px 9px;}
marquee{cursor:pointer;}

.hor-ver-img{width:100%; height:100px; display:flex; justify-content:center; align-items:center;} .hor-ver-img img{width:105px; height:105px; border-radius:50%;}

.search-form{display:flex; justify-content:center; margin-bottom:5px; color:#332f2f; opacity:0.7;}
.searct-text{width:100%; padding:6px; font-size:110%; border-radius:4px; }
.search-form button {padding:6px; background-color:#0000FF; color:#FFF; border:none; border-radius:4px; cursor:pointer; font-size:110%; margin:0px 0px 0px 5px; transition:background-color 0.3s; }
.search-form button:hover {background-color: #0056b3; }

.scroll-table-data{width:100%; height:450px; overflow: scroll; }
.half-scroll-table-data{width:100%; height:200px; overflow:scroll; }
.auto-scroll-table-data{width:100%; height:auto; overflow-y:hidden;  }
table{table-layout:fixed; width:100%; border-collapse:collapse; min-width:rem-calc(640); display:table}  
thead th{background:#6b71e8; color:#fff; font-size:115%; font-weight:650; padding:2px 0px 2px 1px; text-align:center; border:1px solid #000; position:sticky; top:-1.5px;}
tbody td{padding:4px 1px 4px 5px;  font-size:105%; border:1px solid black;} 
tr:nth-child(even) {background-color: #f2f2f2;}  tr:nth-child(odd):hover {background-color:#ddb5f5;} tr:nth-child(even):hover {background-color:#bbb5f5;}
.table-srno{width:70px; text-align:center; } .table-status{width:85px; text-align:center; overflow:hidden; vertical-align:center;}
.table-mob{width:125px;} .table-name{width:210px; overflow:hidden;} .table-date{width:210px; overflow:hidden;} .table-email{width:350px; }
.table-address{width:450px; font-weight:bold; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

.input-container{width:100%;}
.form-label{margin:0; padding:0; font-weight:600; width:100%; display:inline-block;}
.input-field{width:100%; border:1px solid #d4e4fc; border-radius:4px; padding:1.5px 8px 1.5px 8px; font-size:18px; height:40px; margin-bottom:6px;}
.input-field:focus{width:100%; border:1px solid #6ef592; border-radius:4px; outline:none;}
.input-field:active{color: green; }

.info{background-color: #e7f3fe; font-size:23px; color:green; font-weight:600; border-left:3px solid #2196F3; border-radius:3px; margin:0; padding:0;}
.success-msg{padding:4px 7px; background:rgb(1, 149, 1); color:#fff; font-weight:600; border-radius:6px; width:auto; min-height:32px; cursor:pointer;}
.error-msg{padding:4px 7px; background: rgb(255, 0, 0); color:#fff; font-weight:600; border-radius: 6px; width:auto; cursor:pointer;}
.error{color:red; font-size:110%; margin-top:0; font-weight:600;} 
.login-btn{width:100%; display:block; background:blue; border:none; border-radius:4px; color:#fff; font-size:20px; font-weight:700; padding:4px; letter-spacing:1px; text-align:center; cursor:pointer;}.display-left{float:left;} .display-center{float:center;} .display-right{float:right;}
.text-center{text-align:center; }
.post-title{width:100%; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:130%; font-weight:650;} 
.post-title:hover{-webkit-line-clamp:unset; overflow:unset; cursor:pointer;}  .post-titleimg img{width:100%; height:auto; border-radius:5px; }
.post-subtitle{font-size:120%;font-weight:600; color:#007979; }  .post-des li img{width:100%; height:auto; border-radius:5px; background:red; } 

.post-details{width:100%; height:115px; overflow:hidden; display:flex; background-color:#fff; box-shadow:0 4px 8px 0 rgba(0,0,0,0.2); border-radius:1px; margin-bottom:10px;} 
.post-left{width:35%; margin:1px 10px 1px 5px;} .post-left img{width:100%; height:114px; overflow:hidden; border-radius:5px; text-align:center; align-items:center;}  
.post-right{width:65%; align-items:flex-start;} 
.post-right .post-title{width:100%; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:100%; font-weight:550; max-height:50px;} 
.post-right .post-des{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:80%; color:#000; max-height:46px;} 
.post-right .post-date{font-size:90%; text-align:left; top:248px; color:red;}

.postauthor-details {width:100%; height:auto; display:flex; align-items:center; border:1px solid #ddd; padding:2px 0px 2px 5px;}
.postauthor-left{margin-right:5px; } .postauthor-left img{width:50px; height:50px; border:3px solid white; box-shadow:0 2px 4px rgba(0, 0, 0, 0.2); border-radius:50%; }
.postauthor-right{width:100%; display:flex; margin-top:-3px; flex-direction:column; }
.postauthor-right strong{font-size:22px; font-weight:bold; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;}
.postauthor-right span{font-size:19px; color:#B22222; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;}

.post-share{width:100%; display:flex; position:relative; color:blue; cursor:pointer; border:20px; font-size:120%; font-weight:600; overflow:scroll;}
.post-share span{width:100%; display:flex; position:absolute; background:yellow; transition:0.3s linear; padding:4px;}
.post-share:hover span{transition:0.3s linear;  transform:translateX(+100%); display:none; }
.post-share a{width:100%; margin-right:2px; background:indigo; color:#fff; border-radius:3px; padding:4px;} .post-share a:hover{transition:0.3s linear; }


/*Header Css*/
.header{position:-webkit-sticky; position:sticky; width:100%; left:0; top:0; padding:0; z-index:99; }
.header-main{ position:-webkit-sticky; position:sticky; width:100%; padding:3px 0; background-color:#6efa98; border-radius:3px;  display:flex; align-items:center; justify-content:space-between; }
.header .logo{padding:0 0px 0px 15px;border-radius:50%; overflow:hidden;}
.header .logo a{font-size:30px; font-weight:600; text-transform:capitalize; color:#e91e63; }
.logo a img{display:block; width:45px; height:45px; text-align:center; justify-content:center; margin:0; padding:0; border-radius:50%; overflow:hidden;}
.header .nav-menu{padding:0 15px; }
.header .menu > .menu-item{ margin-left:30px; display:inline-block; position:relative; }
.header .menu > .menu-item > a{display:block; padding:12px 0; font-size:16px; color:#000000; text-transform:capitalize; font-weight:600; transition:all 0.3s ease; }
.header .menu > .menu-item > a .plus{display:inline-block; width:12px; height:12px; position:relative; margin-left:5px;  pointer-events:none; }
.header .menu > .menu-item > a .plus:before,
.header .menu > .menu-item > a .plus:after{content:''; position:absolute; box-sizing:border-box; left:50%; top:50%; background-color:#000000; height:2px; width:100%; transform:translate(-50%,-50%); transition:all 0.3s ease; }
.header .menu > .menu-item:hover > a .plus:before,
.header .menu > .menu-item:hover > a .plus:after{background-color:#e91e63; }
.header .menu > .menu-item > a .plus:after{transform:translate(-50%,-50%) rotate(-90deg);	 }
.header .menu > .menu-item > .sub-menu > .menu-item > a:hover,
.header .menu > .menu-item:hover > a{color:#e91e63; }
.header .menu > .menu-item > .sub-menu{box-shadow:0 0 10px rgba(0,0,0,0.2); width:190px; position:absolute; right:0; top:100%; background-color:#ffffff; margin:auto; padding:0px; border-top:3px solid #e91e63; transform:translateY(10px); transition:all 0.3s ease; opacity:0; visibility:hidden; }
.header .menu > .menu-item > .sub-menu > .menu-item{display:block; }
.header .menu > .menu-item > .sub-menu > .menu-item > a{display:block; padding:5px 0px 8px 8px; font-size:16px; font-weight:600; color:#000000; transition:all 0.3s ease; text-transform:capitalize; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-line-clamp:1;}
.header .open-nav-menu{width:40px; height:34px; margin-right:15px; display:none; align-items:center; justify-content:center; cursor:pointer; }
.header .open-nav-menu span{display:block; height:3.5px; width:25px; background-color:#000000; position:relative;  margin-left:-25px;}
.header .open-nav-menu span:before, .header .open-nav-menu span:after{content:''; position:absolute; left:0; width:100%; height:100%; background-color:#000000; box-sizing:border-box; }
.header .open-nav-menu span:before{top:-9.5px; } .header .open-nav-menu span:after{top:9.5px; }
.header .close-nav-menu{width:100%; height:52px; background-color:#377D4C; margin-left:0; cursor:pointer; display:none; align-items:center; font-weight:bold; }
.header .close-nav-menu img{width:25px; height:25px; margin-left:80%;}
.header .menu-overlay{position:fixed; z-index:999; background-color:rgba(0,0,0,0.5); left:0; top:0; height:100%; width:100%; visibility:hidden; opacity:0; transition:all 0.3s ease; }
.navgi{width:100%; font-size:15px; padding:3px 1px 1px 0px; background-color:lightblue; display:inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .arrow{color:green; }

@media(min-width:711px){   /* Navbar Open For Hover  */
body{ max-width:1350px; margin:auto;} 
.header-main{position:relative; max-width:1350px; margin:0;}
.header .menu > .menu-item-has-children:hover > .sub-menu{transform:translateY(0); opacity:1; visibility:visible; }
.header .menu > .menu-item-has-children:hover > a .plus:after{transform:translate(-50%,-50%) rotate(0deg); }

.navgi{width:100%; font-size:15px; padding:3px 1px 1px 0px; background-color:yellow; display:inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .arrow{color:red; }
}

@media(max-width:710px){
.header .menu-overlay.active{visibility:visible; opacity:1;}
.header .nav-menu{position:fixed; right:-280px; visibility:hidden; width:280px; height:100%; top:0; padding:0; overflow-y:auto; background-color:#222222; z-index:1000; transition:all 0.5s ease; }
.header .nav-menu.open{visibility:visible; right:0px; }
.header .menu > .menu-item{display:block; margin:0; }
.header .menu > .menu-item-has-children > a{display:flex; justify-content:space-between; align-items:center; }
.header .menu > .menu-item > a{color:#ffffff; padding:12px 10px; border-bottom:1px solid #333333;}
.header .menu > .menu-item:first-child > a{border-top:1px solid #333333; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-line-clamp:1;}
.header .menu > .menu-item > a .plus:before, .header .menu > .menu-item > a .plus:after{background-color:red; }
.header .menu > .menu-item-has-children.active > a .plus:after{transform:translate(-50%,-50%) rotate(0deg); }
.header .menu > .menu-item > .sub-menu{width:100%; position:relative; opacity:1; visibility:visible; border:none; background-color:transparent; box-shadow:none; transform:translateY(0px); padding:0px; left:auto; top:auto; max-height:0; overflow:hidden; }
.header .menu > .menu-item > .sub-menu > .menu-item > a{padding:12px 30px; color:#ffffff; border-bottom:1px solid #333333; scroll-behavior:auto; }
.header .close-nav-menu, .header .open-nav-menu{display:flex;  margin:0 !important;}

}


@media only screen and (min-width: 320px) and (max-width: 750px){ /* Smartphones (portrait and landscape) ----------- */
.flex{display:block; font-size:19px; margin:0; z-index:4;}
.flex .box1{margin:0 auto 10px auto; width:99.5%; height:auto; padding:3px 2px 0px 2px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); background-color:#ebeef2; border-radius:5px; transition: 0.6s; }
.flex .box2{margin:0 auto; width:99.5%; height:100%; padding:3px 4px; box-shadow:0 4px 8px 0 rgba(0,0,0,0.2); border-radius:5px; background-color:#ebeef2; transition: 0.6s; }

.main-section{display:flex; flex-wrap:wrap; justify-content:space-between; background:#bbb; padding:3px; }
.main-section > a{width:49.5%; height:auto; display: block; background:#fff; padding:4px; margin-bottom:0.3em; border-radius:0.3em; box-shadow: rgba(0, 0, 0, 0.2) 3px 6px 10px; }
.main-section .title{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-line-clamp:1; font-size:100%; font-weight:650; text-align:center;} 
    
}

@media only screen and (min-width: 751px) and (max-width: 981px){ /* iPads (portrait and landscape) ----------- */
.flex{display:flex; font-size:20px; margin:0; z-index:4;}
.flex .box1{margin:0; width:70%; height:auto; padding:4px 2px 0px 2px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); background-color:#f7f6f2; border-radius:5px; transition: 0.6s; }
.flex .box2{margin-left:4px; width:30%; height:100%; padding:3px 4px 0px 4px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); background-color:#f7f6f2; border-radius:5px; transition: 0.6s; }

.main-section{display:flex; flex-wrap:wrap; justify-content:flex-start; background:#bbb; padding:3px; }
.main-section > a{width:32.7%; height:auto; display:block; background:#fff; padding:4px; margin:0.07em; border-radius:0.3em; box-shadow: rgba(0, 0, 0, 0.2) 3px 6px 10px; }
.main-section .title{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-line-clamp:1; font-size:100%; font-weight:650; text-align:center;} 
}
@media print{@page{width:210mm; height:297mm; margin:0.18in; padding:2mm; background-color:#ffffff; box-shadow:0 0 10px rgba(0, 0, 0, 0.1); box-sizing:border-box;}
    body{-webkit-print-color-adjust:exact; border:none; width:100%; margin:0; padding:0;} .header{display:none;} .navgi{display:none;} .login-btn{display:none;} .box2{display:none;} .footer{display:none;} video,audio,object,embed{display:none; }
}
@media (min-width: 981px) and (max-width: 1420px){ /* Portrait tablet to landscape and desktop */ 
.flex{display:flex; font-size:20px; margin:0; z-index:4;}
.flex .box1{margin:0; width:75%; height:auto; padding:3px 0px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); background-color:#ebeef2; border-radius:5px; transition: 0.6s; }
.flex .box2{margin-left:4px; width:25%; height:100%; padding:3px 4px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); background-color:#ebeef2; border-radius:5px; transition: 0.6s; }

.main-section{display:flex; flex-wrap:wrap; justify-content:flex-start; background:#bbb; padding:3px; }
.main-section > a{width:32.5%; height:auto; display:block; background:#fff; padding:4px; margin:3px; border-radius: .3em; box-shadow: rgba(0, 0, 0, 0.2) 3px 6px 10px; }
.main-section .title{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-line-clamp:1; font-size:100%; font-weight:650; text-align:center;} 
}


@media (min-width:1420px){ /* Very Big Screen */
.flex{display:flex; font-size:18px; width:1350px; margin:0; z-index:2;}
.flex .box1{margin:0 auto; width:75%; height:auto; padding:4px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); background-color:#ebeef2; border-radius:5px; transition: 0.6s; }
.flex .box2{margin-left:5px; width:25%; height:100%; padding:3px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); background-color:#ebeef2; border-radius:5px; transition: 0.6s; }

.main-section{display:flex; flex-wrap:wrap; justify-content:flex-start; background:#bbb; padding:3px; }
.main-section > a{width:33%; height:auto; display: block; background:#fff; padding:4px; margin:.07em; border-radius: .3em; box-shadow: rgba(0, 0, 0, 0.2) 3px 6px 10px; }
.main-section .title{text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-line-clamp:1; font-size:100%; font-weight:650; text-align:center;} 
}