ਵਰਤੋਂਕਾਰ:Kuldeepburjbhalaike/ਕੱਚਾ ਖਾਕਾ/styles.css

#header {
	padding:0;
}
#headerContent {
                border: 1px solid #5090c0;
                padding: .5rem;
                text-align: center;
                border-radius: 10px;
            }

            #imgDiv {
                display: none;
            }

            #heading {
                font-size: 1.5rem;
            }

            #heading span {
                color: #5090c0;
                font-size: 2rem;
            }

            #subHeading {
                margin: .3rem 0;
            }

            #subHeading span {
                font-weight: bold;
                margin: 0 .3rem;
            }

            .line {
                border-bottom: 1px solid #5090c0;
                width: 80%;
                margin: auto;
            }

            #stats {
                margin: .5rem;
            }

            #headerLinks {
                display: flex;
                flex-direction: row;
                justify-content: center;
                gap: 1.5rem;
            }

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

            }

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

            /* desktop styles */

            @media only screen and (min-width:700px) {

                #imgDiv {
                    display: initial;
                }

                #imgDiv img {
                    object-fit: cover;
                    width: 150px;
                }

                #headerContent {
                    display: flex;
                    flex-direction: row;
                    justify-content: space-between;
                }

                #headerLinks {
                    flex-direction: column;
                    margin-right: 2rem;
                }
                
                #textDiv {
                	display: flex;
                	flex-direction:column;
                }

                
            }
            
/* 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;
        }
    
}