competitive-programming.html

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="Official coding club of Sikkim Manipal Institute of Technology">
    <meta name="author" content="">
    <meta name="theme-color" content="#000000">
    <link rel="icon" href="img/favicon.ico">
    <title>Competitive Coding | D'CoderS</title>
    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <style>
        .onlineJudges{
            margin: 10px;
        }
        @media only screen and (max-width: 650px){
            .onlineJudges{
                margin: 10px 0;
            }
        }
        img[src="img/leetcode.png"]{
            margin-top: 24px; 
            padding-left: 8px;
            padding-right: 8px;
            background-clip: border-box;            
            background-color: black;
        }
    </style>
</head>

<body>
    <!-- Begin page content -->
    <main role="main" class="container">
    	<a href="/"><img src="https://dcoders-moz.github.io/img/logo.png" height="100" style="margin-top: 20px; margin-bottom: 20px;"></a>
        <h1>Competitve Programming Session</h1>
        <p>27<sup>th</sup> September Onwards</p>
        <h4>Online Judges:</h4>
        <hr>
        <br>
        <div class="row">
                <!-- CodeChef Card -->
                <div class="card col-md-3 col-sm-12 col-12 onlineJudges" style="width: 18rem;">
                    <div style="padding: 15px">
                        <img src="img/codechef.png" class="card-img-top" alt="CodeChef">
                    </div>
                    <div class="card-body" style="text-align: center">
                        <h4 class="card-title">CodeChef</h4>
                        <hr>
                        <a href="https://www.codechef.com/" class="btn btn-primary">Open Link</a>
                    </div>
                </div>
                <!-- HackerRank Card -->
                <div class="card col-md-3 col-sm-12 col-12 onlineJudges" style="width: 18rem;">
                    <div style="padding: 15px">
                        <img src="img/hackerrank.svg" class="card-img-top" alt="HackerRank" style="margin:24px 0 16px">
                    </div>
                    <div class="card-body" style="text-align: center;">
                        <h4 class="card-title">HackerRank</h4>
                        <hr>
                        <a href="https://www.hackerrank.com/" class="btn btn-primary">Open Link</a>
                    </div>
                </div>
                <!-- Leet Code Card -->
                <div class="card col-md-3 col-sm-12 col-12 onlineJudges" style="width: 18rem;">
                    <div style="padding: 15px">
                        <img src="img/leetcode.png" class="card-img-top" alt="Leet Code">
                    </div>
                    <div class="card-body" style="text-align: center">
                        <h4 class="card-title">Leet Code</h4>
                        <hr>
                        <a href="https://leetcode.com/" class="btn btn-primary">Open Link</a>
                    </div>
                </div>
                <!-- SPOJ Card -->
                <div class="card col-md-3 col-sm-12 col-12 onlineJudges" style="width: 18rem;">
                    <div style="padding: 15px">
                        <img src="img/spoj.png" class="card-img-top" alt="SPOJ">
                    </div>
                    <div class="card-body" style="text-align: center">
                        <h4 class="card-title" style="font-size: 1.4rem;">Sphere Online Judge</h4>
                        <hr>
                        <a href="https://www.spoj.com/" class="btn btn-primary">Open Link</a>
                    </div>
                </div>
                <!-- Hacker Earth Card -->
                <div class="card col-md-3 col-sm-12 col-12 onlineJudges" style="width: 18rem;">
                    <div style="padding: 15px">
                        <img src="img/hackerearth.png" class="card-img-top" alt="HackerEarth" style="margin: 24px 0;">
                    </div>
                    <div class="card-body" style="text-align: center">
                        <h4 class="card-title">HackerEarth</h4>
                        <hr>
                        <a href="https://www.hackerearth.com/practice/" class="btn btn-primary">Open Link</a>
                    </div>
                </div>
                <!-- Hacker Blocks Card -->
                <div class="card col-md-3 col-sm-12 col-12 onlineJudges" style="width: 18rem;">
                    <div style="padding: 15px">
                        <img src="img/hackerblock.png" class="card-img-top" alt="Hacker Blocks" style="margin: 5px 0;">
                    </div>
                    <div class="card-body" style="text-align: center">
                        <h4 class="card-title">Hacker Blocks</h4>
                        <hr>
                        <a href="https://hack.codingblocks.com/" class="btn btn-primary">Open Link</a>
                    </div>
                </div>
        </div>
        <br>
        <hr>
        <h4>Big O Speed Chart: &nbsp;&nbsp;&nbsp;<a href="./img/./big0speed.png">View</a></h4>
        <hr>
        <h4>Blog: &nbsp&nbsp&nbsp
            <a href="https://www.embibe.com/exams/story-of-how-anudeep-nekkanti-from-small-pvt-engg-college-in-ap-got-1-5-crore-offer-from-google/">Read-One</a>
            &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
            <a href="http://zakilive.com/2017/03/13/life-story-of-anudeep-nekkanti-competitive-programmer/">Read-Two</a>
        </h4>
        <hr>
        <br>
        <blockquote class="blockquote text-center">
            <p class="mb-0">Patience Is Above Perfection</p>
            <footer class="blockquote-footer">Anudeep Nekkanti <cite title="CodeChef">CodeChef</cite></footer>
        </blockquote>
        <br>
    </main>
</body>

</html>