/* CSS for global content Version:1.0 Author: InfoTheme Author uri: http://www.infotheme.com Licence: GPLv2 */ .clr{ clear:both; } .plugin-header, .plugin-footer{ width: 98%; padding: 10px; background: #F7D158; box-shadow: 1px 2px 2px #888888; -webkit-box-shadow: 2px 3px 5px #888888; -o-box-shadow: 2px 3px 5px #888888; -moz-box-shadow: 2px 3px 5px #888888; margin-bottom:2%; } .plugin-header a, .plugin-footer a{ text-decoration:none; } .plugin-header-logo{ width: 25%; display: inline-block; float:left; } .plugin-header-logo img{ width: 90%; padding:2px; } .plugin-header-right{ width: 72%; display: inline-block; text-align: right; color:#FFF; } .plugin-header-right h2{ color:#FFF; } .plugin-footer{ color:#FFF; } .plugin-footer-left{ width:45%; float:left; display:inline-block; } .plugin-footer-right{ width:50%; display:inline-block; text-align:right; } @media screen and (max-width:768px) { .plugin-header, .plugin-footer{ width: 92%; } .plugin-header-logo{ width: 100%; } .plugin-header-logo img{ width: 20%; } .plugin-header-right{ width: 100%; text-align: left; } .plugin-header-right h2{ font-size:18px; } .plugin-footer-left{ width:100%; } .plugin-footer-right{ width:100%; } } @media screen and (max-width:500px) { .plugin-header-logo img{ width: 40%; } } @media screen and (max-width:320px) { .plugin-header-logo img{ width: 50%; } }