媒体查询在 IE8 中使用 css3-mediaqueries.js 工作得很好,但是当页面加载时它会闪烁相同的秒数。
当我删除此脚本时,良好的布局和闪烁消失了。
有谁知道如何阻止这种闪烁?
这是 mij HTML 代码:
<!DOCTYPE html>
<!--[if IE 6]>
<html id="ie6" dir="ltr" lang="en-US">
<![endif]-->
<!--[if IE 7]>
<html id="ie7" dir="ltr" lang="en-US">
<![endif]-->
<!--[if IE 8]>
<html id="ie8" dir="ltr" lang="en-US">
<![endif]-->
<!--[if !(IE 6) | !(IE 7) | !(IE 8) ]><!-->
<html dir="ltr" lang="en-US">
<!--<![endif]-->
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>Algemeen | testWebsite</title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="http://localhost/wordpress/wp-content/themes/sub_marm_theme/style.css" />
<link rel="pingback" href="http://localhost/wordpress/xmlrpc.php" />
<!--[if lte IE 8]>
<script src="http://localhost/wordpress/wp-content/themes/marm_site/js/html5.js" type="text/javascript"></script>
<script src="http://localhost/wordpress/wp-content/themes/marm_site/js/css3-mediaqueries.js"></script>
<link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/themes/marm_site/style_ie8.css" />
<![endif]-->
<!--[if !(lte IE 8)]><!-->
<link rel="stylesheet" type="text/css" media="all and (max-width:800px)" href="http://localhost/wordpress/wp-content/themes/marm_site/style800.css" />
<link rel="stylesheet" type="text/css" media="all and (min-width:801px)" href="http://localhost/wordpress/wp-content/themes/marm_site/style_gt_800.css" />
<![endif]-->
<link rel="alternate" type="application/rss+xml" title="testWebsite » Feed" href="http://localhost/wordpress/feed/" />
<link rel="alternate" type="application/rss+xml" title="testWebsite » Comments Feed" href="http://localhost/wordpress/comments/feed/" />
<link rel="alternate" type="application/rss+xml" title="testWebsite » Algemeen Comments Feed" href="http://localhost/wordpress/fullservice-softwarebedrijf/feed/" />
<script type='text/javascript' src='http://localhost/wordpress/wp-includes/js/jquery/jquery.js?ver=1.7.1'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/font-resizer/js/jquery.cookie.js?ver=3.3.1'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/font-resizer/js/jquery.fontsize.js?ver=3.3.1'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/font-resizer/js/main.js?ver=3.3.1'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-includes/js/jquery/jShowOff/jquery.jshowoff.min.js?ver=3.3.1'></script>
<script type='text/javascript' src='http://localhost/wordpress/wp-includes/js/comment-reply.js?ver=20090102'></script>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://localhost/wordpress/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://localhost/wordpress/wp-includes/wlwmanifest.xml" />
<link rel='prev' title='Mailformulier' href='http://localhost/wordpress/internetbureau_mailformulier/' />
<link rel='next' title='Rightcolumn goede service' href='http://localhost/wordpress/rightcolumn-goede-service/' />
<meta name="generator" content="WordPress 3.3.1" />
<link rel='canonical' href='http://localhost/wordpress/fullservice-softwarebedrijf/' />
</head>
<body class="page page-id-1069 page-child parent-pageid-2 page-template page-template-overMarm-php single-author singular one-column sidebar-content-sidebar">
<div id="page" class="hfeed">
<header id="branding" role="banner">
<a href="http://localhost/wordpress/">
<img src="http://localhost/wordpress/wp-content/uploads/2012/06/internetbureau-logo.png" width="230" height="73" alt="" />
</a>
<div class="marm-Header2"> </div>
<h2 id="site-description">Le ghhj jhj hljh kjet marketing</h2>
<nav id="access" role="navigation">
<h3 class="assistive-text">Main menu</h3>
<div class="skip-link"><a class="assistive-text" href="#content" title="Skip to primary content">Skip to primary content</a></div>
<div class="skip-link"><a class="assistive-text" href="#secondary" title="Skip to secondary content">Skip to secondary content</a></div>
<div class="menu-marm_menu-container"><ul id="menu-marm_menu" class="menu"><li id="menu-item-334" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-334"><a href="http://localhost/wordpress/">Home</a></li>
<li id="menu-item-257" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-257"><a href="#">Diensten</a>
<ul class="sub-menu">
<li id="menu-item-261" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-261"><a href="#">Software ontwikkeling</a>
<ul class="sub-menu">
<li id="menu-item-264" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-264"><a href="http://localhost/wordpress/webdiensten/web-applicaties/">Webdiensten</a></li>
<li id="menu-item-263" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-263"><a href="http://localhost/wordpress/producten-en-diensten/software/mobiele-applicatie-website/">Mobiel</a></li>
<li id="menu-item-510" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-510"><a href="http://localhost/wordpress/producten-en-diensten/software/desktopapplicaties/">Cloud</a></li>
</ul>
</li>
<li id="menu-item-487" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-487"><a href="http://localhost/wordpress/producten-en-diensten/beheer/">Onderhoud en beheer</a></li>
<li id="menu-item-265" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-265"><a href="http://localhost/wordpress/producten-en-diensten/design/">Design | ontwerp</a></li>
<li id="menu-item-259" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-259"><a href="http://javascript:void(0);">IT advies</a></li>
<li id="menu-item-514" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-514"><a href="http://localhost/wordpress/producten-en-diensten/webmarketing/">Internet marketing</a></li>
</ul>
</li>
<li id="menu-item-269" class="menu-item menu-item-type-post_type menu-item-object-page current-page-ancestor current-menu-ancestor current-menu-parent current-page-parent current_page_parent current_page_ancestor menu-item-269"><a href="#">Over testWebsite</a>
<ul class="sub-menu">
<li id="menu-item-1078" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-1069 current_page_item menu-item-1078"><a href="http://localhost/wordpress/fullservice-softwarebedrijf/">Algemeen</a></li>
<li id="menu-item-267" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-267"><a href="http://localhost/wordpress/missie_internetbureau/">Missie en visie</a></li>
<li id="menu-item-827" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-827"><a href="http://localhost/wordpress/contactgegevens_softwarebedrijf/">Contactgegevens</a></li>
</ul>
</li>
<li id="menu-item-266" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-266"><a href="http://localhost/wordpress/portfolio/">Portfolio</a></li>
</ul></div> </nav><!-- #access -->
</header><!-- #branding -->
<ul class="breadcrumb_trail"><p id="breadcrumbs"> <a href="http://localhost/wordpress/"></a><a href="#">Over testWebsite</a><font> »</font> Algemeen</p></ul>
<div id="main"> <div id="maincontent">
<article id="post-1069" class="post-1069 page type-page status-publish hentry">
<header class="entry-header">
<h1 class="entry-title">Algemeen</h1>
</header><!-- .entry-header -->
<div class="entry-content">
<p>testWebsite is een full rnetburu dat ont en bow hj iel. hkjhjkh h h hh hjhjh jhlhlhjk hhh jhh k hkhjhkjh h jhljhjh jhjkhjkh jhjkhjh jhjh maken.</p>
</div><!-- .entry-content -->
</article><!-- #post-1069 -->
<div id="comments">
</div><!-- #comments -->
</div>
<div class="separator"></div>
<div id="marm_right_column">
<div class="marm_strkPn">
<h2>On ten </h2>
<h3><a class="strkpnt_arrow" href="javascript:void(0);"><span>Siel</span></a> </h3>
<div> <blockquote>Keep le!</blockquote>
<ul class="simpelElements">
<li><span>Duide praken</span></li>
<li><span>Overzic jke we </span></li>
<li><span>Hele men</span></li>
<li><span>Spr ign</span></li>
<li><span>Gebruik ndelijke sware</span></li>
</ul></div>
<h3><a class="strkpnt_arrow" href="javascript:void(0);"><span>Voic omer</span></a> </h3>
<div> <blockquote>Mjkhjhjkhs wen!</blockquote>
Wij vertalen de st sdfdfte product/dienst en meten wij:
<ul>
<li><span>Klajhenheid</span></li>
<li><span>Klanving</span></li>
<li><span>Aanbeheid</span></li>
</ul>
Om on jh hkj kjhkj h jkhhj erberen.</div>
<h3><a class="strkpnt_arrow" href="javascript:void(0);"><span>Product op maat</span></a> </h3>
<div> <blockquote>Wj denke hghgjhgjhn wat u zt.</blockquote>
Sam met u m jhjhj jkh , wensen en verwacfgfg htingen voldoet.
Uiterds d aard gven wij u advffgfgiezen, ondegfdfd rsteungen op maat.</div>
</div>
<div class="home_hulp">
<h2>Waar ghghjgn j u pen</h2>
<p><img class="contactfoto" title="marmfoto1" src="http://localhost/wordpress/wp-content/uploads/2012/03/marmfoto1.jpg" alt="" /><br />
oor speciale wense hghg gjhghj ghghjgct infoatie a.</p>
<div><a class="hulpinfo"href="http://localhost/wordpress/internetbureau_mailformulier"></a></div>
</div>
</div>
<footer id="doormat" role="contentinfo">
<div class="doormat-item" style="border-right: 1px solid #FFFFFF;">
<h2>In deze website</h2>
<ul>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="http://localhost/wordpress/over-ons/informatie_adres/">Algemeen</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="http://localhost/wordpress/contactgegevens_softwarebedrijf/">Contact</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="http://localhost/wordpress/over-ons/sitemap/">Sitemap</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="http://localhost/wordpress/softwarebedrijf-info">Privacybeleid</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="http://localhost/wordpress/softwarebedrijf/disclaimer/">Disclaimer</a></li>
</ul>
</div>
<div class="doormat-item">
<h2>Nieuws</h2>
<ul>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="http://localhost/wordpress/nieuws/nieuws1/">HTML5 en CSS3</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="http://localhost/wordpress/nieuws/nieuws2/">Web 3.0</a></li>
</ul>
</div>
<div class="doormat-item" style="border-right: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF;">
<h2>Een greep uit onze projecten</h2>
<ul>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="#http://localhost/wordpress/projecten/websites-bouwe/">qqqqq</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="#http://localhost/wordpress/projecten/website-ontwer/">hhhhhh</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="#http://localhost/wordpress/projecten/website-desig/">jjjjj</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="#http://localhost/wordpress/projecten/cloud-ap/">jhjhjhj</a></li>
<li><img src="/wordpress/wp-content/images/arrow-right-icon.png"/><a href="#http://localhost/wordpress/projecten/logo-ontwer/">Logo’s</a></li>
</ul>
</div>
<div class="doormat-item">
<h2>Vosl op</h2>
</div>
</footer><!-- #marm_footer -->
</div><!-- #main -->
</div><!-- #page -->
</body>
</html>
这是css代码
/*
Theme Name: hhghjtgh
Theme URI: http://example.com/
Description: jk j j k jk jkj sad kjds jsldk jskld skdjkls d
Author: MARC T.
Author URI: http://example.com/about/
Version: 0.2
Template: masite
*/
@import url("./css/style.css"); /* wordpress.org css*/
@media screen and (min-width: 801px){
div.marm-Header2{
position: absolute;
z-index:-1;
top: 0;
right:0;
width: 200px;
height: 115px;
background: no-repeat url('../marm_site/images/headers/header2.png') right center;
float: right;
}
img.size-full, img.size-large {
opacity: 1.0;
image-rendering:-webkit-optimize-contrast;
}
img.technologo {
float:left;
height: auto;
width: 130px;
margin:0 10px 5px 0;
clear:left;
}
.singular .hentry {
border-bottom: medium none;
padding: 0;
position: relative;
}
.design-ontwerp{
float:left;
margin-right:15px;
}
.ontwerp_block {
border-style:solid;
border-bottom:dotted #E5E5E5 ;
border-bottom-width: thin;
padding:25px 0;
}
.category-nieuws {
border-bottom: medium none;
padding: 0;
position: relative;
margin-top:0;
}
ol#mediaList li {
list-style: none outside none;
margin: 0 0 0em 0em;
}
/* Path mavigation */
.breadcrumb_trail {
font: 11px Arial, Helvetica, sans-serif;
height:25px;
line-height:30px;
color:#9b9b9b;
width:94%;
overflow:hidden;
margin-left:30px;
padding:0px;
}
.breadcrumb_trail a {
height:10px;
padding-right: 1px;
text-decoration: none;
color:#454545;
}
.breadcrumb_trail font{
color:#006600;
}
.breadcrumb_trail a:hover { color:#006600; }
.current-menu-item a, .current-menu-item:hover > a, .current-menu-item:focus > a, .current-menu-item:active >a{
color:#0066A1;
}
#sociale_media{
behavior: url(http://localhost/wordpress/wp-includes/css/pie/pie.htc);
position: relative;
z-index: 1;
float: left;
border-radius: 15px;
border:1px solid #000;
width:300px;
height: auto;
border-radius: 15px;
border:1px solid #D0D0D0 ;
margin-bottom: 10px;
padding: 0px;
}
#site_beveiliging{
behavior: url(http://localhost/wordpress/wp-includes/css/pie/pie.htc);
position: relative;
z-index: 1;
float: left;
border-radius: 15px;
border:1px solid #000;
width:280px;
height: auto;
border-radius: 15px;
border:1px solid #D0D0D0 ;
margin: 0 10px 0 10px;
padding: 0px;
}
#site_verkeer{
behavior: url(http://localhost/wordpress/wp-includes/css/pie/pie.htc);
position: relative;
z-index: 1;
float: left;
border-radius: 15px;
border:1px solid #000;
width:210px;
height: auto;
border-radius: 15px;
border:1px solid #D0D0D0 ;
margin: 0 10px 0 10px;
padding: 0px;
}
/* ****** Footer */
#doormat {
behavior: url(http://localhost/wordpress/wp-includes/css/pie/pie.htc);
position: relative;
z-index: 1;
clear: both;
width: 99%;
text-align:center;
height:160px;
border-radius: 15px 15px 0 0;
border:1px solid #D8D8D8 ;
background-color:#E8E8E8 ;
margin-right:10px;
}
.doormat-item {
float: left;
width: 24%;
padding-bottom: 10px;
bottom: 0px;
}
.doormat-item ul {
bottom: 0px;
}
address{
border: 0 none;
font-family: inherit;
font-size: 82%;
font-style: normal;
font-weight: normal;
margin: 0;
padding: 0;
text-align: left;
color: #707070 ;
}
ul, ol {
margin: 10px 0 0em 0em;
}
ul li{
padding-left: 1em;
border-bottom: 1px solid #F0F0F0 ;
font-weight: bold;
}
#access ul ul li{
padding-left: 0em;
border-bottom: 2px solid #FFFFFF ;
font-weight: bold;
background:#006600 ;
}
ol li{
border-bottom: 1px solid #F0F0F0 ;
font-weight: bold;
padding-left: 30px;
}
.groep_diensten ol li, .groep_diensten ul li{
margin-left:0px;
padding-left:0px;
}
.doormat-item ul li{
margin-left:0px;
padding-left:0px;
}
.doormat-item ul li img, .groep_diensten ol li img, .groep_diensten ul li img{
float:left;
height:18px;
width:25px;
}
#doormat ul {
list-style: none;
}
.groep_diensten h2{
behavior: url(http://localhost/wordpress/wp-includes/css/pie/pie.htc);
position: relative;
z-index: 1;
font-size: 12px;
padding: 5px 20px 0px;
margin: 0;
margin-left: 0px;
background:#F8F8F8 ;
background: -moz-linear-gradient(#F8F8F8 , #E5E5E5) repeat scroll 0 0 transparent;
border-radius: 15px 15px 0 0;
color: #006600;
font-weight: bold;
}
ul.ulzonderbold li{
border-bottom: none;
font-weight: normal;
padding-left: 6px;
margin-left:15px;
list-style-type:disc;
}
.groep_diensten ul a {
color:#383838 ;
font-weight: normal;
font-size: 13px;
margin-bottom:2px;
text-decoration:none;
}
.entry-header .comments-link a:hover,
.entry-header .comments-link a:focus,
.entry-header .comments-link a:active {
background-color: #1982d1;
color: #fff;
color: rgba(255,255,255,0.8);
}
.contactfoto {
border-radius: 15px 0 0 0;
float: left;
height: 140px;
margin: 0 10px 0 0;
padding: 9px 0 0 1px;
width: 110px;
z-index: 1;
}
.marm_copyright{
width: 40%;
bottom: 10px;
font-style:italic;
font-size:12px;
padding: -20px;
}
ol#mediaList{
list-style-type:none;
}
#doormat ul li {
list-style: outside none;
margin:0 0.3em;
color:#006600;
}
#doormat ul li a{
color:#000000;
font-size:13px;
}
#doormat h2 {
display:inline;
font-size: 11px;
font-weight: bold;
color: #0072BC;
padding: 5px;
margin:10px;
border-bottom: 1px dotted #0072BC;
}
.marm_strkPn {
height: auto;
/* border-radius voor IE*/
behavior: url(http://localhost/wordpress/wp-includes/css/pie/pie.htc);
position: relative;
z-index: 1;
border-radius: 10px;
padding:9px 0 0;
background-color: #FFFFFF ;
-webkit-box-shadow: 5px 5px 5px #D8D8D8 ;
box-shadow: 2px 3px 5px #D8D8D8 ;
border: 1px solid #D8D8D8 ;
margin-right: 0px;
}
.mobieleApp {
color: #0072BC;
font-weight: bold;
font-size:12px;
margin-left: 8px;
padding-top:10px;
}
.mobieleApp h2{
color: #0072BC;
font-weight: bold;
font-size:12px;
margin-left: 8px;
padding-top:10px;
}
.ophetmenu h2, .marm_strkPn h2{
/* border-radius voor IE*/
position: relative;
z-index: 1;
font-size: 13px;
padding:5px 0 0 0;
text-align: center ;
margin: -10px -2px 2px -1px;
background: #A0A0A0;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorStr="#A0A0A0", endColorStr="#E5E5E5"); /* gradient voor IE8 en lager */
height: 1%;
background: -moz-linear-gradient(#A0A0A0 , #E5E5E5) repeat scroll 0 0 transparent;
background: -ms-linear-gradient(#A0A0A0 , #E5E5E5) repeat scroll 0 0 transparent; /* gradient voor IE10 en hoger*/
background: linear-gradient(#A0A0A0 , #E5E5E5) repeat scroll 0 0 transparent;
width: 100%;
border-radius: 10px 10px 0 0;
border: 1px solid #B0B0B0 ;
color: #0072BC;
font-weight: bold;
}
.marm_strkPn h3 {
clear:left;
margin: 1px;
border:1px solid #E5E4E9 ;
color: #383838;
font-size: 13px;
color: #383838;
font-weight: bold;
background-color: #F5F5F5;
background-image: -moz-linear-gradient(center top , #FFFFFF 0pt, #E8E7EC 100%);
background-image: linear-gradient(center top , #FFFFFF 0pt, #E8E7EC 100%);
background-image: -ms-linear-gradient(center top , #FFFFFF 0pt, #E8E7EC 100%);
background-image: -webkit-linear-gradient(center top , #FFFFFF 0pt, #E8E7EC 100%);
background-image: -o-linear-gradient(center top , #FFFFFF 0pt, #E8E7EC 100%);
padding-left: 2px;
}
.marm_strkPn a{
text-decoration: none;
font-size: 11px;
color: #606060 ;
padding: 12px 5px;
font-weight: bold;
line-height:20px;
}
.marm_strkPn h3 img{
float: left;
margin-top:5px;
padding:0px;
height:5px;
}
.marm_strkPn a:hover{
text-decoration: none;
font-size: 12px;
color: #303030 ;
font-weight: bold;
}
.marm_strkPn a:active{
font-size: 12px;
font-weight: bold;
color: #300000;
text-decoration: none;
}
.marm_strkPn a:focus{
font-size: 12px;
font-weight: bold;
color: #202020;
text-decoration: none;
}
.marm_strkPn h3 font{
font-size: 80%;
color: #006600;
}
.marm_strkPn div {
padding: 0em .25em;
border: 1px solid #E8E8E8 ;
background: #FFFFFF ;
height: 200px;
font-size: 12px;
border-radius: 5px;
}
.marm_strkPn ul {
margin-left: 7px;
font-style: inherit;
font-family:inherit;
}
.marm_strkPn ul li{
font-size: 8px;
font-weight: normal;
color: #68B629;
font-style: inherit;
font-family:inherit;
list-style: disc inside;
}
a:hover.strkpnt_arrow, a:focus.strkpnt_arrow{
background: url("/wordpress/wp-content/images/down-arrow.png") no-repeat scroll 1px 14px transparent;
background-size:6px 8px;
}
a.strkpnt_arrow{
background: url("/wordpress/wp-content/images/right-arrow.png") no-repeat scroll 1px 14px transparent;
background-size:6px 8px;
}
a.strkpnt_arrow span{
margin-left:10px;
font-weight:13px;
font-size:11px;
font-weight: bold;
}
ul li span{
color: #000000;
font-size: 12px;
}
.separator{
background: url("/wordpress/wp-content/images/separator.gif") repeat-y scroll right top transparent;
background-size:100% 86px;
width:0.3%;
padding-right:1%;
height: 90%;
z-index:9999;
position:absolute;
right:30%;
z-index:-1111;
}
.ophetmenu {
width: 230px;
height: 200px;
/* border-radius voor IE*/
behavior: url(http://localhost/wordpress/wp-includes/css/pie/pie.htc);
z-index: 1;
border-radius: 10px;
padding:9px 0 0;
border: 1px solid #D8D8D8 ;
margin-top: 60px;
}
.ophetmenu ul li{
background-image: url(/wordpress/wp-content/images/isgoed.png);
background-size:10px 12px;
background-repeat:no-repeat;
background-position: 0 .4em;
padding-left: 1.4em;
border-bottom: 1px solid #F0F0F0 ;
font-weight: lighter;
margin-left: 20px;
list-style: none;
color:#006600;
}
a {
color: #FE6700;
text-decoration: none;
}
#maincontent{
float: left;
margin:0 0px 30px auto ;
width:60%;
padding-right: 50px;
}
}
@media screen and (min-width: 681px) and (max-width: 800px){
/* code */
}