/* = Reset styles */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0;}body{line-height:1;}ol,ul{list-style:none;}abbr,acronym{font-variant:normal;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:none;}:focus{outline:0;}ins{text-decoration:none;}del{text-decoration:line-through;}table{border-collapse:collapse;border-spacing:0;}textarea{resize:none;}
html,body { width: 100%; }

/* = global/general styles */
.clear-both { display: inline-block; }
.clear-both:after {content: " "; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; }
.clear-both {display: block; }


/* = basic layout */
#wrapper { margin: 0 auto;  width: 700px; }
#share { padding: 10px 0; text-align: center; }
#info1,
#info2 { width: 700px; }

/* = Large screens */
#info1 { height: 332px; background: url(../images/700/01.png) no-repeat 0 0; /* Shown by IE8 and other old browsers */ background: url(../images/1400/01.png)  no-repeat 0 0 / 100%;  /* shown by new browsers with background-size support*/ }
#info2 { height: 132px; background: url(../images/700/02.png) no-repeat 0 0; background: url(../images/1400/02.png) no-repeat 0 0 / 100%; }
	#cta-1 { display: block; height: 66px; left: 97px; position: relative; text-indent: -99999px; top: 14px; width: 65px;  }
	#cta-2 { display: block; height: 15px; left: 176px; position: relative; text-indent: -99999px; top: -27px; width: 155px;  }
	#cta-3 { display: block; height: 66px; left: 377px; position: relative; text-indent: -99999px; top: -67px; width: 65px;  }
	#cta-4 { display: block; height: 15px; left: 455px; position: relative; text-indent: -99999px; top: -109px; width: 134px;  }
/* Small screens (less that 700px wide) */
@media screen and (max-width: 700px) {

#wrapper,
#info1,
#info2 { width: 300px; }

#info1 { height: 844px; background: url(../images/300/01.png) no-repeat 0 0; /* Shown by old browsers */ background: url(../images/600/01.png) no-repeat 0 0 / 100%;  /* shown by new browsers with background-size support*/}
#info2 { height: 196px; background: url(../images/300/02.png) no-repeat 0 0; background: url(../images/600/02.png) no-repeat 0 0 / 100%; }
	#cta-1 { display: block; height: 63px; left: 39px; position: relative; text-indent: -99999px; top: 13px; width: 63px;  }
	#cta-2 { display: block; height: 15px; left: 114px; position: relative; text-indent: -99999px; top: -28px; width: 148px;  }
	#cta-3 { display: block; height: 63px; left: 39px; position: relative; text-indent: -99999px; top: 26px; width: 63px; }
	#cta-4 { display: block; height: 15px; left: 114px; position: relative; text-indent: -99999px; top: -14px; width: 127px;  }
}
