* {box-sizing: border-box;}

html {scroll-behavior: smooth;image-rendering: pixelated; 
  -webkit-font-smoothing: none ;
}


h1 {font-style: italic;
font-size: 40px;
font-family: 'Times New Roman'}

h2 {font-size: 25px;color: #59432a;}
  
p, li{
font-weight: 900;
letter-spacing:-0.05em;
font-size: 16px;
}

/* HOME*/
.v3-body {max-width: 680px; margin: 5% auto 20%;background-image: url('images/heart.gif'); display: grid; 
grid-template-columns: 200px 350px 127px;
grid-template-rows: 140px 35px 390px 0px;
grid-template-areas: 
'v3hc v3h v3h'
'v3m  v3m v3m'
'v3n  v3ma v3ma'
'v3n  v3ma v3ma'
'v3f v3f   v3f'
}

.v3-hcorner {grid-area: v3hc;border: 15px solid #ffe2fe /*#f77fbe*/; }

.iv3hc {border: 2px dotted hotpink; height: 110px; background-color: rgba(250, 250, 240, .7); }

.v3-header {grid-area: v3h;border: 5px ridge palegreen; background-image: url('images/sffr.png');background-size: 100% 100%;position: relative;}

#chlosunny {max-width: 40%;height: 115%;position:absolute; bottom: 0;}

.v3-marquee {grid-area: v3m;}

.v3-main {grid-area: v3ma;border-left: 2px dashed hotpink; border-radius: 0px 3px 3px 0px; background-image: url('images/0187.gif');}


.imv3 {display: grid; grid-template-columns: 230px 80px 165px; grid-template-rows: 280px 10px 1fr;
grid-template-areas:
'v3w v3w v3a'
'v3w v3w v3a'
'v3b v3b v3b';}

.v3-welcome {grid-area: v3w;background-color: #DAEDFE; position: relative;}

.pwelcome {text-align: center;  padding: 11px; color: #664D30;margin-top: 4px; overflow-y: auto;}

.welcomeyaya {max-height: 190px; background-color: lemonchiffon;}

#blufi {position: absolute; top: 218px; right: 35px;  max-width: 16%;}

.v3-aside {grid-area: v3a;background-color:lavenderblush;}


.counter {margin: 0 20px;}

.time {background-color: thistle;border: 2px inset; color: rebeccapurple;}

.updatebox {background-image: url('images/jpflow.gif'); height: 130px; margin: 5px;}

.calender {margin-left: 7px; margin-top: 5px; }

.v3-bottom {grid-area: v3b; background-color: transparent;}

.banner {background-image: url('images/yellishplaid.gif'); margin: 10px 5px; height: 76px; border: 2px ridge lightcyan;position: relative;}


.btitle {position: absolute; font-style: italic;bottom: -33px; left: 130px; font-size: 33px; background-image: linear-gradient(to left,blue,royalblue,cornflowerblue,aliceblue);   -webkit-background-clip: text;
  color: transparent; }

.dct {color: darkgreen;  font-weight: 800; font-style: italic; position: absolute; top: -6px; left: 10px; font-size: 18px;}

.v3-nav {grid-area: v3n; background-color: ivory;border-radius: 3px 0px 0px 3px;}

.nav-buttons p, .nav-buttons h2{text-align: center;}

.nav-buttons p {margin: 2px 17px;padding: 2px; text-decoration: underline; color: mediumvioletred;}

#v3hb {background-color:#ffe2fe; color: orangered; margin-top: 15px;}

#v3cb {background-color: palegreen; color: green;}

#v3bb {background-color: #ffff80; }

#v3ab {background-color: #95abee; color: darkblue;}

#v3pb {color: blue;}

#v3gb {color: blue;}

#v3mb {background-color: #abeded; color: cornflowerblue;}
 
 
 

#v3lb {background-color: lightpink;  }

.nav-buttons a:hover {margin-left: 10px;}

.v3-footer {grid-area: v3f;}

.v3-footer p {color: #664D30;}
/*END OF HOME*/

/*ENTER*/
.enter-body {background-color: lavenderblush;margin: 13% auto; max-width: 420px;}


#enterimg {max-width: 100%; margin-bottom: -2.9px;}

.pls {color: hotpink;}

.pls a:hover {color: deeppink; margin-left: 3px;}



.webring {text-align: center; margin: auto; max-width: 420px; background-color: rgba(250,250,250,.9); border: 1px dotted cornflowerblue; margin-top: 0px;padding-bottom: 2px;}
/*END OF ENTER*/

/* CHLOE */
 
 .chloe-body {background-image: url('images/butterfli.gif');}
 
 .chloemain {background-color: rgba(230, 254, 230, .4); max-width: 350px; margin: 60px auto -30px; border: 2px dotted goldenrod; }
 
 #chloeme {max-width: 170px; display: block; margin: 20px auto;  }
 
 .chloetable {margin: 0 auto;
  border:3px ridge deeppink;width: 350px;background-color: #ffe2fe; padding: 2px; margin-top: 43px  }
  
  td{border: 2px solid cornflowerblue; background-color: azure;text-align: center; padding: 4px; color: cornflowerblue; }


/* END OF CHLOE */

/* ABOUT */
.body-about {background-image: url('images/heart2.gif');}

.main-about {background-color:lemonchiffon; max-width: 350px; margin:  50px auto; border: solid 3px lightgreen;}

.list-about {text-align: center; color: #664D30; padding: 10px;}

hr {border: inset 2px hotpink;}
/* END OF ABOUT */

/*DIARY*/
.diary-body {background-image: url('images/blustar.gif');}


.diary-main {background-image: url('images/note2.gif'); max-width: 453px; margin: auto; position: relative;}

.diaryh2 {font-style: italic; padding-left: 15px; margin-bottom: -2px;}

.diaryp {padding-left: 18px; padding-right: 12px;}
/*END OF DIARY*/

/*BLOG*/

.blog-body{ background-image: url('images/bgflow2.gif'); }


.blog-div {
 display: grid; max-width: 600px; margin: 3% auto;
grid-template-columns: 180px 350px 97px; grid-template-rows: 150px 35px 1fr ;
grid-template-areas:
'ba bh bh'
'ba bma bma'
'ba bm bm'
'bf bf bf'}

.blog-header {grid-area: bh; background-image: url('images/purplecross.gif') ; border: 2px dotted hotpink}

.blog-marquee {grid-area: bma; position: relative; background-color: lavenderblush; border-right: 2px dotted hotpink;}
 
 .pendoodle {position: absolute; max-width: 35%; height: 90%; top: 0px;}
 
.blog-main {grid-area: bm;border: ridge 5px hotpink; background-color: lemonchiffon;}

.blogh {background-image: url('images/ccheck1.jpg'); border-top: dotted rebeccapurple 2px; border-bottom: dotted rebeccapurple 2px;  padding: 0px; margin-top: 5px; position: relative;}

.blogh h2 {font-size: 20px;}

.blogp {text-decoration: underline; color: #664D30; padding: 10px; line-height: 1.7; }

.blog-aside {grid-area: ba; background-color: #e6fee6; border: 2px dotted lightblue;}



.calenderblog {margin-left: 15px; margin-top: 6px;}

.bloglink {color: cornflowerblue; text-decoration: none;}

.blog-profile {background-color: mistyrose; margin-top:-16px; height: 200px;}

.blog-footer {grid-area: bf;}

/*END OF BLOG*/