/* 
================================================== */
	body
	{
		background: #282c34;
		font: 15px/30px 'Roboto', Arial, sans-serif;
		color: #f0f0f0;
	}


/* #Header
================================================== */
	/*
	 * Logo, Nav
	 ----------------------------------------------*/
	#header-logo
	{
        vertical-align: middle;
        padding: 1em 0em 0.5em 0em;
        margin: auto;
	}

    #subnav                     { display: inline-flex; justify-content: flex-end; }

    #navigation                 { display: inline-flex; justify-content: flex-end; }
    #navigation-mobile          { display: none; overflow: hidden; }
    
    #footer-1
	{
        vertical-align: middle;
        text-align: left;
	}

    #footer-2
	{
        vertical-align: middle;
        text-align: center;
	}

    #footer-3
	{
        vertical-align: middle;
        text-align: right;
	}

    /* ilanlar, blog ve hizmet listelemede kutuların kaymasini engellemek için */
    @media only screen and (min-width: 992px)
    {
        .col-listeleme:nth-child(3n+2)
        {
            clear: left;
        }
        .col-listeleme-sub:nth-child(3n+4)
        {
            clear: left;
        }
    }

    @media only screen and (max-width: 992px)
    {
        .col-listeleme:nth-child(2n+2)
        {
            clear: left;
        }
        .col-listeleme-sub:nth-child(2n+3)
        {
            clear: left;
        }
    }
    /***************************************************************************/


/* 02. LAYOUT FOR SMALLER SCREEN
================================================== */
@media only screen and (max-width: 992px)
{
    body                        { -webkit-overflow-scrolling: touch; }
    
    #header-logo                { padding: 1.5em 0em 1em 0em; text-align: center; }
    
    #subnav                     { display: inline-flex; justify-content: center; }
    
    #navigation                 { display: none; overflow: hidden; }
    #navigation-mobile          { display: block; overflow: visible; }
    
    #footer-1, #footer-2, #footer-3
	{
        vertical-align: middle;
        text-align: center;
	}
}





/* 03. LAYOUT FOR MOBILE
================================================== */
@media handheld, only screen and (max-width: 600px)
{
    body                        { -webkit-overflow-scrolling: touch; }
    
    #header-logo                { padding: 1.5em 0em 1em 0em; text-align: center; }
    
    #subnav                     { display: inline-flex; justify-content: center; }
    #subnav-hidden              { display: none;  }
    
    #navigation                 { display: none; overflow: hidden; }
    #navigation-mobile          { display: block; overflow: visible; }
    
    #footer-1, #footer-2, #footer-3
	{
        vertical-align: middle;
        text-align: center;
	}
}