  
<style>
		* {
    		font-family: 'Open-Sans', sans-serif!important;
		}
		.container {
			display:grid;
			grid-template-columns: repeat(1, 1fr);
			grid-auto-rows: minmax(100px, auto);
			background: rgba(255, 255, 255, 1);
			overflow: auto;
			padding-bottom: 15px;
		}
		mainContainer{
			display: flex;
    		justify-content: space-between;
			flex-wrap: wrap;
		}

		.container1 {
			display: inline-block;
			vertical-align: top;
    		padding: 0;
			width: 38%;
			height: 380px;
    		margin: 0;
			float:right;
		}

		.container2 {
		    position: absolute;
			top: 0;
			left: 2%;
			padding: 0;
			margin: 0;
			background: #663399!important;
			width: 60%;
			height: 357px;
			display: flex;
            justify-content: center;
            align-items: center;
			align-content:center;
			}

		.container1 img {
        	width: 100%;
			height: 357px;
			margin: auto;
			float:right;
    	}
			
    	.titles {
         /*position: absolute;
			top: 0;
  			left: 50%;
  			transform: translateX(-50%);
			width: 100%;
			justify-content: center;*/
			text-align: center;
    	}

    	.titles h3 {
		font-weight: 600!important;
		font-size: 40px!important;
		color: #ffcc00!important;
        padding:10px;
		}
    	
/*.titles p {
       	text-transform: none;
       	color: #fff!important;
		font-size: 18px!important;
		width: 80%;
			margin-left:80px;
		font-weight: 100!important;
		letter-spacing: 0;
			text-align:left;
    }*/
		.buttonsPosition {
			margin-top:15px;
            display: flex;
            flex-wrap: nowrap;
            width: 100%;
			font-size: 18px!important;
        }
       .buttonsPosition a {
           margin:auto;
			min-height:60px;
           display: flex;
			align-items:center;
			align-content:center;
			justify-content:center;
           width: 20%; /* Adjusted width to accommodate all options */
           text-align: center;
           padding: 10px;
           text-decoration: none;
           background-color: #663399 !important;
           color: #eee !important;
           border-bottom: 3px solid #639 !important;
           border-top: 3px solid #639 !important;
           border-left: 3px solid #639 !important;
           border-right: 3px solid #639 !important;
           transition: background-color 0.3s, color 0.3s, width 0.3s;
			font-weight:normal;
       }
      .buttonsPosition a:hover {
            background-color: #FFFFFF !important;
            color: #663399 !important;
			font-weight:500;
            width: 20%; /* Adjusted width on hover */
       }

     .buttonsPosition a.active {
           background-color: #FFFFFF !important;
		   font-weight:500;
           color: #663399 !important;
           width: 20%;
      }
	  .collapsible {
			background-color: #663399; /* Updated background color */
            color: #eee; /* Updated text color */
            cursor: pointer;
            padding: 18px;
            width: 100%;
            border: none;
            text-align: left;
            outline: none;
            font-size: 15px;
            margin-bottom: 10px;
            border-top: 3px solid #639; /* Updated border color */
            border-bottom: 3px solid #639; /* Updated border color */
            transition: background-color 0.3s, color 0.3s; /* Added transition for smooth color change */
            position: relative; /* Added position relative for pseudo-element positioning */
			font-size: 18px!important;
		}
		.active, .collapsible:hover {
			background-color: rgba(120, 81, 169, 0.8)!important; /* Adjusted hover color */
            font-weight:bold;
            border-top: none; /* Updated border color */
            border-bottom: none; /* Updated border color */
            color: #FFCC00; /* Updated hover text color to yellow */
		}
		.collapsible:before {
			/*content: '+\00a0'; /* Added a non-breaking space */
            color: #eee; /* Updated icon color */
            font-weight: bold;
            position: absolute;
            left: 10px; /* Adjusted positioning to the left */
            top: 50%;
            transform: translateY(-50%);
		}
		.active:before {
            /*content: '-\00a0'; /* Changed content to '-' when active */
            color: #FFCC00; /* Updated active icon color */
			font-size: 1.5em;
         }
		.content {
           padding: 0 18px;
           max-height: 0;
           overflow: hidden;
           transition: max-height 0.2s ease-out;
           background-color: #F2F2F2;
           margin-bottom: 10px;
		   font-size: 18px!important;

         }
			   
		.content-overview {
           padding: 0 18px;
           max-height: 0;
           overflow: hidden;
           transition: max-height 0.2s ease-out;
           background-color: #F2F2F2!important;
           margin-bottom: 10px;
		   font-size: 18px!important;

         }
          .container_content {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            background-color: #F2F2F2!important;
            gap: 20px; /* Space between each box */
			margin-top: 10px;
        }
       /* .news-box {
            position: relative;
            width: 300px;
            height: 400px;
            background-color: #fff;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
            overflow: hidden;
            transition: transform 0.5s, border-radius 0.3s, background-color 0.3s; /* Added transform transition */
            cursor: pointer;
			border: 1px solid #549;
			
        }
        .news-box:hover {
            transform: rotateY(180deg); /* Flipping effect */
			 border-radius: 20px;
			border:none;
        }
        .news-box:hover .newsTitle {
            color: #3B0D6A; /* Hex #3B0D6A for text color on hover */
			
        }
        .news-box .description {
            display: none;
            transform: rotateY(-180deg); /* Initially flipped */
        }
        .news-box:hover .description {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            padding: 20px;
            background-color: #F2F2F2;
            transform: rotateY(180deg); /* Flip back */
			border:none;
        }
        .news-box .name {
            display: flex;
            justify-content: center;
            align-items: center;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
			
        }
        .description .visit-button {
            margin-top: 20px;
            padding: 10px 20px;
            background-color: #663399; /* Hex #663399 */
            color: #fff;
            border: none;
            cursor: pointer;
            transition: background-color 0.3s;
            border-radius: 20px; /* Round edges */
        }
        .description .visit-button:hover {
            background-color: #3B0D6A; /* Hex #3B0D6A */
        }
        .newsTitle {
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 10px;
            color: #000; /* Default text color */
        }
        .logoContainer img {
            width: auto;
            height: 80px;
        }*/
		 .rows:after {
    		content: ""; 
    		position: absolute;
    		bottom: 0; 
    		left: 0;
    		width: 100%;
    		border-bottom: 1.5px solid #ccc; 
		}
		.rows{
			/*display: grid;
			grid-template-columns: 1.5fr 0.5fr;
			align-items: center;
			gap: 0px;*/
			margin-bottom: 0;
            padding: 15px;
           /* background: rgba(255, 255, 255, 1);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);*/
			position: relative; 
		}

		
        
       /*
  		.border-div {
            border: 3px solid #639 !important;
            padding: 0px;
            margin-left: -18px;
            margin-right: -18px;
            margin-bottom: 10py;
            margin-top: 10py;
                        background-color: #cbc3e3!important;
        }
			.news-list {
            list-style: none; 
            padding-left: 20px;
        }*/
        .news-item {
            margin-bottom: 15px;
            position: relative; 
        }
       /* .news-item::before {
          content: "â€¢";  Custom bullet character 
            color:#663399; 
            font-size: 20px; 
            position: absolute;
            left:  0px; 
            top: 0;
        }*/
        .news-item a {
            font-weight: bold;
            font-size: 18px !important;
            padding: 10px;
            display: block;
            text-decoration: none; 
            color:#663399; 
        }
        .news-item a:hover {
            text-decoration: underline!important; 
            color:#3B0D6A!important;  
        }
		/*.news-item  {
           color:black!important;  
        }*/
        .news-list p {
            margin: 5px 0 0 0;
            padding: 0 50px!important;
			color:black!important; 
			font-weight: 400!important;
        }
		li::marker {
        color: #663399;
			
        } /* Change the color to your desired color */
			li:hover::marker {
       color: #3B0D6A!important;
			
        }
			#openrepositorycontainer {
  margin-left: 0em;
  overflow: hidden;
  width: 100%!important;
}

.openrepository {
  border: 1px solid #639!important;
  width: calc(100% - 2px - 1em);
  overflow: hidden;
  margin-bottom: 1em;
  padding: 1em 0.5em!important ;
  display: none;

}

.openrepository.active {
  display: block;
  background-color: #F2F2F2!important;
}

#allreptab.active, #archivestab.active, #digitallibrariestab.active, #repositoriestab.active {
  background: #639!important;
  color: white!important;
}

#allreptab, #archivestab, #digitallibrariestab, #repositoriestab {
  float: left!important;
  background: #fff!important;
  border-top: 1px solid #639;
  border-left: 1px solid #639;
  color: black!important;
  margin: 0;
  padding: 0.5em 1em;
  margin-left: 0em;
  cursor: pointer;
}
#repositoriestab{
 border-right: 1px solid #639;}
    
	    /*.rows h3
			{
			color: #3B0D6A!important ;
			}
			.over-class
			{
			display:none;
			}
			/*.news-list p
			{
			width:90%;
			margin:auto;
			}*/
		</style>