.container100 {  width: 100%; font: bold 1.3em Arial, Verdana, Helvetica, georgia, sans-serif; }

.leftcol  {width: 30%; float: left; word-wrap: break-word; }
.rightcol {width: 65%; float: right; word-wrap: break-word; }


.breakword , .break-word 	{  padding:4px; word-wrap: break-word;}
.nobreakword 	                {  padding:4px; }
.nobreakword img, .breakword img {	max-width: 100%; height: auto; margin: auto; }


.w  {padding: 3px;margin: 49px 2px 2px 2px ;border-radius: 12px;border: 2px solid #A1A1A1; background-color: #FEFEFE;}
.t  {height: 40px; padding: 8px; margin: 5px; border: 0px, overflow:hidden;}

div.l {height: 40px;padding: 8px;margin: 5px;position: relative;border-radius: 8px;border: 2px solid #F0F0F0; overflow:hidden; background-color: #F8F8F8; color: #0000FF; }

div.l a { position: absolute;width: 100%;height: 100%;top: 0;left: 0;text-decoration: none;
z-index: 10; /* Places the link above everything else in the div */
background-color: #FFF; /* Fix to make div clickable in IE */
opacity: 0; /* Fix to make div clickable in IE */
filter: alpha(opacity=1); /* Fix to make div clickable in IE */}
div.l:hover { border: 2px solid #A0A0A0;}


@media only screen and (min-width:701px) and (max-width:1000px){
.leftcol  { margin: 2px; }
.rightcol {  margin: 2px; }
.t, div.l {height: 60px;}

}

@media only screen and (min-width:481px) and (max-width:700px){

.leftcol  { width: 35%; margin: 2px; }
.rightcol { width: 63%; margin: 2px; }
.t, div.l  {height: 70px;}

}

@media only screen and (min-width:351px) and (max-width:480px){

.leftcol  { width: 35%; margin: 2px; }
.rightcol { width: 63%; margin: 2px; }
.t, div.l  {height: 90px;}

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

.leftcol  { width: 40%; margin: 2px; }
.rightcol { width: 58%; margin: 2px; }
.t, div.l  {height: 100px;}

}