welsonjs/app/assets/css/cascade/development/responsive.css
2020-11-04 16:30:52 +09:00

230 lines
5.9 KiB
CSS

/*!
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*
* CASCADE FRAMEWORK 1.0
*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*
*
* Copyright 2013, John Slegers
* Released under the MIT license
* http://jslegers.github.com/cascadeframework/license.html
*
*
* This means you can use Cascade Framework for any project,
* whether commercial or not.
*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*
*
* Cascade Framework also contains the following goodies,
* which all have the same or similar 'permissive licenses :
*
*
* Includes polyfills by Joshua Bell
* http://www.calormen.com/polyfill/
* Released in public domain
*
*
* Includes Google ExplorerCanvas
* https://code.google.com/p/explorercanvas/
* Released under the Apache 2.0 license
*
*
* Includes Google Prettify
* https://code.google.com/p/google-code-prettify/
* Released under the Apache 2.0 license
*
*
* Includes Yepnope
* http://yepnopejs.com/
* Released under the WTFPL license
*
*
* Includes Modernizr
* http://modernizr.com/
* Released under the MIT license
*
*
* Includes lodash
* http://lodash.com/
* Released under the MIT license
*
*
* Includes jQuery
* http://jquery.com/
* Released under the MIT license
*
*
* Includes jQuery Easing plugin
* http://gsgd.co.uk/sandbox/jquery/easing/
* Released under the BSD license
*
*
* Includes jQuery Flot plugin
* http://www.flotcharts.org/
* Released under the MIT license
*
*
* Includes the Font Awesome webfont
* http://fortawesome.github.com/Font-Awesome/
* Released under the SIL Open Font License
*
*
*
*
*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*
* Cascade Framework was inspired by many articles and projects
*
* Especially these authors are worth mentioning :
*
* Nicolle Sullivan
* Jonathan Snook
* Chris Coyier
* Eric Meyer
* Nicolas Gallagher
* Paul Irish
* Mark Otto
* Jacob Thornton
*
*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Date: 2013-03-15
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
*/
@media (min-width:1200px) {
.site-center {
width:1160px;
}
.cell{
margin:15px;
}
}
@media (min-width:768px) and (max-width:979px) {
.site-center {
width:704px;
}
}
@media (max-width:767px) {
.parsley-error-list {
position: static;
display: block !important;
margin-left:3px;
}
main,section,article,header,footer,aside,nav,.col,
main.width-fit,main.width-fill,
section.width-fit,section.width-fill,
article.width-fit,article.width-fill,
header.width-fit,header.width-fill,
footer.width-fit,footer.width-fill,
aside.width-fit,aside.width-fill,
nav.width-fit,nav.width-fill,
.col.width-fit,.col.width-fill {
padding:0 !important;
display:block !important;
float:left !important;
width:100% !important;
}
.site-center,.site-body,.site-header,.site-footer,.site-center > .body {
margin:0 !important;
width:100% !important;
border:none !important;
-webkit-box-shadow:none !important;
-moz-box-shadow:none !important;
box-shadow:none !important;
-webkit-border-radius: 0 !important;
-moz-border-radius: 0 !important;
border-radius: 0 !important;
}
.center {
float:none !important;
}
}
/* =============================================================================
width-fit and width-fill support for mobile
========================================================================== */
@media (max-width: 767px) {
main.mobile-width-fill,
section.mobile-width-fill,
article.mobile-width-fill,
header.mobile-width-fill,
footer.mobile-width-fill,
aside.mobile-width-fill,
nav.mobile-width-fill,
.col.mobile-width-fill {display:table-cell !important;float:none!important;min-width:50px!important;width:10000px!important;}
main.mobile-width-fit,
section.mobile-width-fit,
article.mobile-width-fit,
header.mobile-width-fit,
footer.mobile-width-fit,
aside.mobile-width-fit,
nav.mobile-width-fit,
.col.mobile-width-fit {width:auto!important;}
.mobile-center {
float:none !important;
margin-left:auto !important;
margin-right:auto !important;
}
}
@media (min-width: 481px) and (max-width: 767px) {
main.mobile-width-fill,
section.tablet-width-fill,
article.tablet-width-fill,
header.tablet-width-fill,
footer.tablet-width-fill,
aside.tablet-width-fill,
nav.tablet-width-fill,
.col.tablet-width-fill {display:table-cell !important;float:none!important;min-width:50px!important;width:10000px!important;}
main.mobile-width-fill,
section.tablet-width-fit,
article.tablet-width-fit,
header.tablet-width-fit,
footer.tablet-width-fit,
aside.tablet-width-fit,
nav.tablet-width-fit,
.col.tablet-width-fit {width:auto!important;}
.tablet-center {
float:none !important;
margin-left:auto !important;
margin-right:auto !important;
}
}
@media (max-width: 480px) {
main.phone-width-fill,
section.phone-width-fill,
article.phone-width-fill,
header.phone-width-fill,
footer.phone-width-fill,
aside.phone-width-fill,
nav.phone-width-fill,
.col.phone-width-fill {display:table-cell !important;float:none!important;min-width:50px!important;width:10000px!important;}
main.phone-width-fit,
section.phone-width-fit,
article.phone-width-fit,
header.phone-width-fit,
footer.phone-width-fit,
aside.phone-width-fit,
nav.phone-width-fit,
.col.phone-width-fit {width:auto!important;}
.phone-center {
float:none !important;
margin-left:auto !important;
margin-right:auto !important;
}
}