css css3mediaqueries

Posted 2021-05-13

/* ---------------------------------------------------------------------------------------------------------------------

  88888888e.     d8b       88888888e.       d8b       8bc:..  88888    .8888888.    88888  888888888.        d8b
  888888888b    d888b      888888888b      d888b      888888bb88888   d888888888b   88888  8888888888b      d888b
  888888888D   d88888b     888888888D     d88888b     8888888888888  C88888888888D  88888  88888888888D    d88888b
  88888888P   d8888888b    88888888P     d8888888b    8888888888888  C88888888888D  88888  88888888888D   d8888888b
  888888P    d888888888b   88888888b    d888888888b   8888888888888   d888888888P   88888  8888888888b   d888888888b
  88888     d88888888888b  888888888b  d88888888888b  8888888888888    '8888888'    88888  888888888'   d88888888888b

------------------------------------------------------------------------------------------------------------------------

    Author: Rafal Bromirski
    www: http://paranoida.com/
    blog: http://lab.paranoida.com/

    twitter: http://twitter.com/paranoida
    dribbble: http://dribbble.com/paranoida

    Licensed under a MIT License

--------------------------------------------------------------------------------------------------------------------- */


/* --- main content ------------------------------------------------------------------------------------------------- */



/* --- media queries ------------------------------------------------------------------------------------------------ */

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

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

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

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

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

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

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

@media screen and (max-width: 640px)
{
    /* to avoid the adjustment of fonts on iOS devices you should keep this line */
    * { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; }
}

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

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

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

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


/* --- iPad --------------------------------------------------------------------------------------------------------- */

@media screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait)
{
}

@media screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:landscape)
{
}


/* --- iPhone 4(S) retina ------------------------------------------------------------------------------------------- */

@media screen and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-device-pixel-ratio: 1.5)
{
}


/* --- iPhone ------------------------------------------------------------------------------------------------------- */

@media screen and (max-device-width: 640px) and (-webkit-device-pixel-ratio: 1),
screen and (max-device-width: 640px) and (device-pixel-ratio: 1)
{
}


/* --- print (optional) --------------------------------------------------------------------------------------------- */

@media print
{
}