   * {
       box-sizing: border-box;
   }


   html {
       font-size: 16px;
       height: 100%;
   }

   body {
       background-color: #342A46;
       height: 100%;
       margin: 0;

       padding: 0;
       background-image: url(images/textthree.png);
       background-attachment: fixed;
       background-repeat: repeat;
       background-size: cover;
   }


   strong {
       font-weight: 800;
       color: #d582b5
   }

   s {
       color: #837f8a;
       font-weight: 800;
   }


   i {
       color: #6cb4d1;
   }


   ::selection {
       color: #ffffff;
       background-color: #55308681;
   }


   img {
       max-width: 100%;
       height: auto;
       margin: 10px 2px;
       padding: 5px;
       opacity: 95%;
       border: dashed 0.0625rem #c0bdc7;
   }




   .posts a:link,
   .posts a:visited {
       letter-spacing: 0.5px;
       color: #d69bd0;
       text-decoration: underline;



   }


   .line {
       width: 100%;
       height: 3px;
       position: fixed;
       top: 0px;
       right: 0px;
       background-color: #10011b;
       z-index: 999;
   }


   .linetwo {
       width: 100%;
       height: 2px;
       position: fixed;
       bottom: 0px;
       right: 0px;
       background-color: #10011b;
       z-index: 999;
   }


   .linethree {
       height: 100%;
       width: 2px;
       position: fixed;
       bottom: 0px;
       left: 0px;
       background-color: #10011b;
       z-index: 999;
   }

   .header {
       position: fixed;
       width: 37%;
       top: 0px;
       right: 0px;
       border-right: solid 7px #191127;
       height: 100%;

       background-image: url(images/header.png);
       background-position: top right;
       background-repeat: no-repeat;
       background-size: cover;
       z-index: 6;
       box-shadow:
           inset 50px -9px 32px -24px rgba(254, 253, 252, 0.551);

   }



   .navi {
       position: absolute;

       top: 200px;
       width: 30%;
       max-width: 200px;
       height: 400px;
       right: 77%;
       z-index: 10;
   }

   .navi a:link,
   .navi a:hover,
   .navi a:visited {
       padding: 0px;
       width: 100%;
       max-width: 130px;
       text-transform: uppercase;
       margin: 15px 5px;
       font-size: 13px;
       display: inline-block;
       text-align: right;
       color: #b592aa;
       text-decoration: none;
       vertical-align: middle;
   }



   a.credit:link,
   a.credit:visited {

       color: #725f7a;

       letter-spacing: 2px;
       font-size: 7px;

   }


   .navi a:link:first-of-type,
   .navi a:hover:first-of-type,
   .navi a:visited:first-of-type {

       color: #fbceea;

   }

   .deco {
       background-color: #b592aa;
       height: 1.6px;
       max-width: 50px;
       width: 100%;
       margin: 0px;
       vertical-align: middle;
       display: inline-block;
   }


   .deco:first-of-type {
       background-color: #fbceea;

   }


   .navitwobg {
       -moz-transition: all 0.3s ease-in;
       -o-transition: all 0.3s ease-in;
       -webkit-transition: all 0.3s ease-in;
       transition: all 0.3s ease-in;
       text-align: center;
       position: fixed;
       bottom: 0px;
       background-color: #BD5478;
       width: 100%;
       z-index: 999;
       padding: 5px 0px;
       color: #fcd8f6;
       border-top: dashed 1px #CD6C89;
       border-bottom: solid 1px #000000;
       filter: drop-shadow(0px 4px 10px #000000);
       opacity: 0.80;
       background-image: url(images/tex.png);
       background-repeat: repeat;
       background-size: cover;
   }


   .navitwobg:hover {

       opacity: 1;
   }

   .logo {
       font-weight: 600;
   }

   .navitwo {
       display: flex;
       flex-direction: row;
       justify-content: space-between;
       margin: 0 auto;
       width: 70%;
       font-family: "Nanum Gothic", sans-serif;
       font-weight: 400;
       text-transform: uppercase;
       font-size: 10px;
       line-height: 30px;
       letter-spacing: 1px;

   }

   .navitwo a:link,
   .navitwo a:visited {
       display: inline-block;
       color: #efc5e8;
       margin: 0px 10px;
       padding: 0px 10px;
       text-decoration: none;
   }


   .navitwo a:hover {
       color: #4e2833;
       background-color: #efdbd676;

   }


   .right-border {
       width: 7px;
       margin-top: 20px;
       position: relative;
       z-index: 10;
       background-color: #B9D8FF;
       background-image: url(images/textwo.png);
       background-repeat: repeat;
       background-size: cover;
       box-shadow:
           0px 4px 18px 4px rgba(255, 255, 255, 0.21);
       -moz-transition: all 0.3s ease-in;
       -o-transition: all 0.3s ease-in;
       -webkit-transition: all 0.3s ease-in;
       transition: all 0.3s ease-in;
   }

   .right-border:hover {
       box-shadow:
           0px 4px 18px 4px #B9D8FF;
   }


   .right-border-two {
       position: relative;
       z-index: 10;
       width: 7px;
       margin-top: 30px;
       margin-bottom: 20px;
       -moz-transition: all 0.3s ease-in;
       -o-transition: all 0.3s ease-in;
       -webkit-transition: all 0.3s ease-in;
       transition: all 0.3s ease-in;
       box-shadow:
           0px 4px 18px 4px rgba(255, 255, 255, 0.21);

       background-color: #F3BEE4;
       background-image: url(images/textwo.png);
       background-repeat: repeat;
       background-size: cover;

   }



   .right-border-two:hover {
       box-shadow:
           0px 4px 18px 4px #F3BEE4;
   }



   .one {

       background-color: #ffffff;
       position: absolute;
       top: 0px;
       width: 74%;
       right: 1vw;
       box-shadow:
           6px 4px 49px 4px rgba(255, 255, 255, 1);
       min-height: 100%;
       padding: 0;
       background-image: url(images/tex.png);
       background-repeat: repeat;
       background-size: contain;
       background-position: top left;


   }


   .icon {
       float: left;
       width: 90px;
       height: 90px;
       -moz-transition: all 0.3s ease-in;
       -o-transition: all 0.3s ease-in;
       -webkit-transition: all 0.3s ease-in;
       transition: all 0.3s ease-in;
       padding: 5px;
       margin-right: 15px;
       margin-top: 10px;
       opacity: 0.80;
       border: solid 1px #c3c0c3;

   }

   .icon:hover {
       opacity: 1;


   }

   .space {
       padding-bottom: 65px;
   }

   .posts {

       font-family: "Nanum Gothic", sans-serif;
       font-weight: 400;
       font-style: normal;
       color: #534e60;
       font-size: 11.5px;
       line-height: 32px;
       width: 43%;
       padding: 0px;
       margin: 0px 3vw;
       position: relative;
       z-index: 99;


   }

   .posts ul,
   .posts ol,
   .posts li {
       padding: 0px 0px;
       list-style: inside;
       margin: 0px;
       list-style-type: upper-roman;
   }

   blockquote {
       margin: 1.25rem 0px;
       padding: 1.25rem 1rem;
       background-color: #f7f4f4;
       border-left: 0.1875rem solid #fcbf9c;
   }


   .box {
       display: flex;
       justify-content: space-between;
       width: 99%;
       min-height: 100%;
       margin: 5px 0px 0px 0px;
       font-family: "Nanum Gothic", sans-serif;
       font-weight: 400;
       font-style: normal;


   }





   h1 {
       background-repeat: repeat-x;
       background-size: 30px 1px;
       background-image: url(images/dash.png);
       background-position: top left;
       margin: 0px;
       padding: 20px 0px 0px 0px;
       font-family: "Lora", serif;
       font-optical-sizing: auto;
       font-weight: 500;
       font-style: normal;
       color: #121022;
       font-size: 16px;
       text-transform: uppercase;
   }





   h2 {

       font-family: "Nanum Gothic", sans-serif;
       font-weight: 400;
       color: #9a99a3;
       font-size: 7px;
       padding: 5px 10px;

       text-transform: uppercase;
       margin-top: 0px;
       letter-spacing: 2px;
       font-style: normal;
       line-height: 14px;
       background-color: #f4f4f4;
       border-left: solid 4px #dcdcdc;

   }


   h3 {
       margin-bottom: 0px;
       padding: 0px;
       word-spacing: 1px;
       text-transform: uppercase;
       font-family: "Nanum Gothic", sans-serif;
       font-weight: 600;
       font-style: normal;
       color: #896b8a;
       font-size: 11px;
       line-height: 20px;

   }

   p {
       margin-bottom: 10px;
       margin-top: 10px;
       padding: 0px;
       font-family: "Nanum Gothic", sans-serif;
       font-weight: 400;
       font-style: normal;
       color: #534e60;
       font-size: 11.5px;
       line-height: 32px;

   }






   .content-arrow {
       vertical-align: middle;
       font-size: 20px;
       margin-bottom: 3px;
       margin-right: -5px;

   }


   input,
   textarea {
       border-radius: 10px;
       width: 60%;
       outline: none !important;
       margin: 0px;
       padding: 0.625rem 0.3125rem;
       box-sizing: border-box;
       border: dashed 0.0625rem #99a6b0;
       background-color: #ffffff;
       resize: none;
       color: #939191;
       text-align: justify;

   }

   input:focus,
   textarea:focus {
       background-color: #eeeae5;

   }

   button {
       border-radius: 10px;

       border: dashed 0.0625rem #99a6b0;
       background-color: #FFFFFF;
       color: #939191;
       padding: 10px 20px;
       text-align: left;
   }


   .pagination {
       align-self: auto;
       text-align: center;
       background-repeat: repeat-x;
       padding-top: 10px;
       margin-top: 10px;
       text-decoration: none;
       color: #8d8075;
       border-top: dashed 1px #eceaf0;
   }

   .pagination a,
   .pagination a:link,
   .pagination a:visited {
       padding: 8px 5px;
       text-align: center;
       color: #8d8075 !important;
       background-color: rgba(210, 210, 210, 0.13);
       border-bottom: dashed 0.0625rem #efebe8;
       text-decoration: none !important;
   }