/* Reset */

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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; } 
ol, ul { list-style:none; }
a { outline:0; }


/* Pocket Grid  */

.block-group, .block, .block-group:after, .block:after, .block-group:before, .block:before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box; }
.block-group { *zoom:1; }
.block-group:before, .block-group:after { display:table; content:""; line-height:0; }
.block-group:after { clear:both; } 
.block-group { list-style-type:none; padding:0; margin:0; }
.block-group > .block-group { clear:none; float:left; margin:0 !important; }
.block { float:left; width:100%; }


 /* Dropdown Button */
.dropbtn { background-color: transparent; color: #111; padding-right: 10px; font-size: 36px; border: none; cursor: pointer; }
.dropbtn:hover, .dropbtn:focus { background-color: transparent; }
.dropdown { position: relative; display: inline-block; }
.dropdown-content { display: none; position: absolute; right:0; font-size: 20px; background-color: #fff; min-width: 220px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; }
.dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; }
.dropdown-content a:hover {background-color: #ddd;}
.show {display:block;} 



/* css  */

@font-face { font-family: opensans-regular; src: url(../fonts/opensans-regular.woff2); src: url(../fonts/opensans-regular.woff); }

@font-face { font-family: opensans-condensed; src: url(../fonts/opensans-condensed-300.woff2); src: url(../fonts/opensans-condensed-300.woff); }

body { font-family: opensans-regular, sans-serif; background:#fff; color:#333; }



/* Mobile First  - screen <400px */

body { margin:0 auto; max-width:400px; }

#wrapper { margin:0 10px 50px 10px; }

#navbar-vend { position:fixed; top:0; z-index:160; background:#fff; border-bottom:1px solid #ddd; height:45px; max-width:480px; width:96%; }
.navbar-vend-left { float:left; width:76%; padding:16px 0 0 8px; font-size:20px; font-weight:600; }
.navbar-vend-right { float:right; width:19%; padding-right:4px; text-align:right; font-size:36px; cursor:pointer }

.ar47 ul { font-size:14px; line-height:19px; list-style-type: disc; margin-left:30px; }

strong { font-weight:bold; }

b { font-weight:600; color:#111; }

.clear { clear: both; }
.orange { color:#df7402; }
.canvas { margin-top:60px; }


a, a:link, a:visited, a:active { text-decoration:none; color:#404040; }
a:hover { color:#404040; }

a.withunderline { text-decoration:underline; }
a.withunderline:hover { background:#eee; }

img.scale-b0-center { max-width:100%; height:auto; border:0; display:block; margin-left:auto; margin-right:auto; margin-top:20px; }

.centre-align { text-align:center; }

h1 { font-size:24px; line-height:28px; margin:40px 0 2px 0; padding:4px 0 8px 0; font-weight:bold; }
h2 { font-size:16px; line-height:20px; margin-top:32px; font-weight:bold; }




p { font-size:14px; line-height:19px; }
.para1 { font-size:24px; line-height:28px; margin:40px 0 2px 0; padding:4px 0 8px 0; font-weight:bold; }
.para2 { font-size:15px; margin-top:20px; }
.para3 { color:red; text-decoration:line-through; font-size:80%; }
.para4 { font-weight:bold; line-height:24px; }
.para5 { font-size:14px; line-height:19px; margin-bottom:12px; }
.para6 { font-size:24px; line-height:28px; margin:60px 0 2px 0; padding:4px 0 8px 0; font-weight:bold; }
.para7 { font-size:18px; line-height:24px; margin:12px 10px; font-weight:bold; }
.para8 { font-size:18px; line-height:24px; margin:12px 24px; }
.para9 { font-size:18px; line-height:24px; margin:12px 24px 24px 24px; }

p.autor { font-size:14px; margin-top:20px; }

.ul { font-size:18px; line-height:24px; list-style-type: disc; margin:0 0 18px 30px; }

.perfect1 { font-family:'Allura',cursive; font-size:24px; line-height:32px; color:#555;  }
.perfect2 { font-family:'Allura',cursive; font-size:18px; color:#aaa; }
.perfect3 { font-family:'Allura',cursive; font-size:64px; line-height:66px; color:#555; margin:60px 0 20px 0; }
.perfect4 { font-family:'Allura',cursive; font-size:36px; line-height:32px; color:#111;  }

.sub-line { display: block; }



.subtitle01 { font-size:16px; line-height:20px; margin-top:32px; font-weight:bold; }





@media only screen and (min-width:400px) {

body { max-width:760px; padding:0 20px; }

#navbar-vend { max-width:740px; width:100%; height:54px; }

.canvas { margin-top:66px; }

.ar47 h1 { font-size:30px; line-height:36px; margin:40px 0 12px 0; padding:4px 0 8px 0; font-weight:bold; }
.ar47 h2 { font-size:24px; line-height:28px; margin:48px 0 22px 0; font-weight:bold; }
.ar47 h3 { font-size:20px; line-height:26px; margin:28px 0 12px 0; font-weight:italic; }

.ar47 p { font-size:18px; line-height:24px; margin-bottom:20px; }

.ar47 ul { font-size:18px; line-height:24px; list-style-type: disc; margin:0 0 18px 30px; }

h2 { font-size:20px; line-height:24px; margin:72px 0 20px 0; font-weight:bold; }

p { font-size:18px; line-height:24px; }
.para1 { font-size:24px; line-height:28px; margin:2px 0 2px 0; padding:4px 0 8px 0; font-weight:bold; }
.para2 { font-size:16px; margin-top:20px; }
.para3 { color:red; text-decoration:line-through; font-size:16px; }
.para4 { font-weight:bold; line-height:30px; padding-top:10px; }
.para5 { font-size:18px; line-height:24px; margin-bottom:12px; }

.perfect1 { font-family:'Allura',cursive; font-size:32px; line-height:32px; color:#555;  }
.perfect2 { font-family:'Allura',cursive; font-size:28px; color:#aaa; }
.perfect3 { font-family:'Allura',cursive; font-size:72px; color:#555; margin:60px 0 40px 0; }
.perfect4 { font-family:'Allura',cursive; font-size:36px; line-height:32px; color:#111;  }

p.subtitle { font-size:20px; line-height:24px; }

ul { font-size:18px; line-height:29px; list-style-type: circle; margin:0 0 18px 30px; }

.subtitle01 { font-size:24px; line-height:24px; margin-top:44px; }

}