/*=====================================================
        NOIDATUT CODE STYLE
======================================================*/

/* Main Code Block */

.code-box
{
    background:#f8f9fa;
    border:1px solid #dcdcdc;
    border-left:6px solid #2196F3;

    padding:18px;

    margin:15px 0;

    overflow-x:auto;

    white-space:pre;

    font-family:Consolas,
                "Courier New",
                monospace;

    font-size:15px;

    line-height:1.7;

    color:#222;

    tab-size:4;

    border-radius:4px;
}

/* Code inside */

.code-box code
{
    font-family:inherit;

    font-size:inherit;

    color:#222;

    background:none;

    padding:0;
}

/*=====================================================
        OUTPUT BOX
======================================================*/

.output-box
{
    background:#fcfcfc;

    border:1px solid #d8d8d8;

    border-left:6px solid #4CAF50;

    padding:18px;

    margin:15px 0;

    overflow-x:auto;

    white-space:pre;

    font-family:Consolas,
                "Courier New",
                monospace;

    font-size:15px;

    line-height:1.7;

    color:#111;

    border-radius:4px;
}

/*=====================================================
        NOTE BOX
======================================================*/

.note-box
{
    background:#fffde7;

    border-left:6px solid #ff9800;

    border:1px solid #e0e0e0;

    padding:18px;

    margin:20px 0;

    border-radius:4px;
}

/*=====================================================
        TABLE STYLE
======================================================*/

.code-table
{
    width:100%;

    border-collapse:collapse;

    margin:20px 0;
}

.code-table th
{
    background:#1565C0;

    color:#fff;

    padding:10px;

    text-align:center;
}

.code-table td
{
    border:1px solid #ddd;

    padding:10px;
}

/*=====================================================
        FORMULA BOX
======================================================*/

.formula-box
{
    background:#E3F2FD;

    border-left:6px solid #1976D2;

    padding:15px;

    text-align:center;

    font-size:20px;

    font-weight:bold;

    margin:20px 0;

    border-radius:4px;
}

/*=====================================================
        ALGORITHM BOX
======================================================*/

.algorithm-box
{
    background:#F3F8FF;

    border-left:6px solid #3F51B5;

    padding:15px;

    margin:20px 0;

    border-radius:4px;
}

/*=====================================================
        SUCCESS BOX
======================================================*/

.success-box
{
    background:#F1F8E9;

    border-left:6px solid #43A047;

    padding:15px;

    margin:20px 0;
}

/*=====================================================
        WARNING BOX
======================================================*/

.warning-box
{
    background:#FFF3E0;

    border-left:6px solid #FB8C00;

    padding:15px;

    margin:20px 0;
}

/*=====================================================
        QUESTION BOX
======================================================*/

.question-box
{
    background:#F5F5F5;

    border-left:6px solid #616161;

    padding:15px;

    margin:20px 0;
}

/*=====================================================
        MOBILE
======================================================*/

@media screen and (max-width:768px)
{

.code-box,
.output-box
{
    font-size:13px;

    padding:12px;
}

}