ਫਰਮਾ:Main Page/styles.css

/* general rules */
.card {
    border:1px solid #5090c0;
    border-radius: 10px;
    margin-bottom:1rem;
    padding:0 1rem;
}

.cardTitle {
    background-color:#5090c0;
    color:white;
    text-align: center;
}

.cardTitle h3 {
    padding:0.1rem;
     color:white;
     margin-bottom: 1rem;
}

.cardContent .mw-halign-right {
    margin:auto;
}

.more {
    text-align: center;
    margin: 1rem;
}

.more a {
    padding: .3rem;
    border-radius:7px;
    background-color: #5090c0;
    color: white;
    text-decoration: none;
}

.more a:hover {
    background-color: #20435d;
    color: white;
}

.toc {
	display:none;
}

#toc {
	display:none;
}
/* explore */
#exploreDesktop {
	display:none;
}

#exploreLists {
    display: flex;
    flex-direction: row;
    flex-wrap:nowrap;
    justify-content: space-evenly;
    
}

#exploreLists div {
    text-align: center;
}

.list {
    text-align:initial;
}

/* sister projects */

#projectsWrapper {
            border:1px solid #5090c0;
            border-radius: 10px;
        }

 #projectContainer {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }

        .project {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

/*desktop*/

@media only screen and (min-width:700px) {
    
    /* general rules */
    #cards-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0rem;
        margin-top: 1rem;
    }

    #col1 {
        border: 1px solid #5090c0;
        border-radius: 10px;
        margin-right: 0.5rem;
    }

    #col2 {
        border: 1px solid #5090c0;
        border-radius: 10px;
        margin-left:0.5rem;
    }

    .card {
        border: none;
        margin-bottom: 0;
    }

    li {
        margin-bottom:.5rem;
    }

    /* featured */
    #featured {
        border: 1px solid #5090c0;
        border-radius: 10px;
        margin-top: 1rem;
    }

	/* explore */
	#exploreDesktop {
	display:initial;
	}
	
	#exploreMobile {
		display:none;
	}

    /* sister project */
    #projectsWrapper {
            margin-top: 1rem;
        }
    #projectContainer {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
            gap:1rem;
        }
    
}