body {
    margin: 0;
    padding: 0;
    font-family:karla, sans-serif;
    font-size: 13pt;
    background-color: hsl(0,81%,66%);
}
 
.btn-addr {
    font-size: 24pt;
    color: hsl(60,100%,40%);
    padding-right: 8px;
}

    .btn-addr:after {
        content: 'location_on';
    }

.btn-email {
    font-size: 22pt;
    color: hsl(60,100%,40%);
    padding-right: 8px;
}
    
    .btn-email:after {
        content: 'mail';
    }

.btn-belief {
    font-size: 80pt;
    animation-name: blinking;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
    
    .btn-belief:after {
        content: 'wb_incandescent';
    }

.contact-us-img{
    width: 48px;
}

@keyframes blinking{
    0%{color: hsl(0,0%,90%);}
    100%{color: hsl(60,100%,50%);}
   }


/***about***/
#about0{
    padding-top: 70px;
}
.about{
    color: hsl(48,10%,18%);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
    box-sizing: border-box;
}

.about1 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin-bottom: 70px;
}

.about2 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin-bottom: 70px;
}

.about .a1{
    width: 48%;
 }

.about .a1-1{
    font-family: alegreya;
    font-size: 2.8em;
}

.about .a1-2{
    font-family:kaushanscript;
    font-size: 3.0em;
}

.about .a2{
    width: 50%;
    padding:10px 20px 20px 20px;
    box-sizing: border-box;
    line-height:25px;
}

.about .a2-1{
   margin-bottom: 20px;
}

.about .a3{
    font-family: alegreya;
    font-size: 2.8em;
    margin:0 20px 20px 20px;
    color: hsl(60,100%,90%);
}

.about .a3-1{
    border-radius: 50%;
}

.about .a4{
    width: 38%;
    text-align: center;
}

.about .a4-img {
	border-radius: 50%;
	width: 150px;
	height: 150px;
	overflow: hidden;
	position: relative;
}

    .about .a4-img img {
        position: absolute;
        left: -6px;
        top: -3px;
        height: 150px;
        width: 150px;
    }

.about .a5{
    width: 60%;
    padding:10px 20px 20px 20px;
    box-sizing: border-box;
    line-height: 25px;
}

.about .a5-1{
   margin-bottom: 20px;
}

/***services***/
#services0{
    padding-top: 70px;
}

.services{  
    color: hsl(48,10%,18%);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.services .s1{
   width: 38%;
   margin-right:2px;
 }

.services .s1-1 {
	font-family: alegreya;
    font-size: 3.8em;
    padding: 20px 20px 0 0;
	box-sizing: border-box;
	text-align: center;
}
.services .s2{
   width: 60%;
   padding:40px 10px 10px 20px;
   box-sizing: border-box;
 }

 .services .s3{
    margin-bottom: 20PX;
 }

 .services .s3-1{
      font-size: 1.4em;
}

 .services .s3-2{
    font-size: .9em;
    padding: 0 4px 10px 10px;
    box-sizing: border-box;
 }

/***contact****/
#contactus0{
    padding-top: 70px;
}
.contact-us {
    color: hsl(48,10%,18%);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.contact-us .cu1{
    width:50% ;
    padding: 10px;
    box-sizing: border-box;
}

.contact-us .cu2{
   width: 48%;
   padding: 20px 10px 10px 40px;
   box-sizing: border-box;
}

.contact-us .cu3{
    padding:40px 20px 0 10px ;
    box-sizing: border-box;
}

.contact-us .cu4{
    font-family: alegreya;
    font-size: 2.8em;
    padding-left: 20px;
    box-sizing: border-box;
}

.contact-us .cu5{
    padding: 20px 10px;
    box-sizing: border-box;
}

/****************/
/***portfolio***/
/***************/
.portfolio0{
    padding-top: 70px;
}

.portfolio {
    color: hsl(48,10%,18%);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
    box-sizing: border-box;
}


.portfolio1 {    
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
    column-gap:4px;
    row-gap:4px
}

.portfolio .pf2{
    font-family:sarina;
    color: hsl(54,90%,90%);     
}

.portfolio .pf3 > a{
    text-decoration: none;
}

.portfolio .pf4{
    padding: 4px 10px 10px 0;
    box-sizing: border-box;
    font-size: .8em;
    color: hsl(48,10%,18%);
}

.portfolio .pf4-1{
    font-size: 1.2em;
    color: #000;
}

/************/
/***folio***/
/***********/
.folio0{
    padding-top: 70px;
}

.folio {
    color: hsl(48,10%,18%);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
    box-sizing: border-box;
}

.folio .btn01{
    margin: 20px 0 10px 0;
 }

 .folio .btn02{
    color: hsl(39,90%,10%);
    margin: 8px 0 0 10px;
 }

 .folio .card-img{
    display: block;
    width: 100%;
    border-radius: 4px 4px 0 0;
 }

/***Think Dong Studio***/

.folio .tds-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .tds-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
 }
 
 .folio .tds-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
 }
 
 .folio .tds-01{
   width: 68%;
}
 
 .folio .tds-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .tds-02-1{
    margin-bottom:10px;
 }

 .folio .tds-03{
     line-height: 25px;
     margin-bottom: 20px;
}
/***Think Dong Art***/

.folio .tda-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .tda-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
 }
 
 .folio .tda-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
 }
 
 .folio .tda-01{
   width: 68%;
}
 
 .folio .tda-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .tda-02-1{
    margin-bottom:10px;
 }

 .folio .tda-03{
     line-height: 25px;
     margin-bottom: 20px;
}
 
/***chipta***/

.folio .chipta-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .chipta-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
 }
 
 .folio .chipta-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
 }
 
 .folio .chipta-01{
   width: 68%;
}
 
 .folio .chipta-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .chipta-02-1{
    margin-bottom:10px;
 }

 .folio .chipta-03{
     line-height: 25px;
     margin-bottom: 20px;
}

/***ShhhBuuuLeee***/

.folio .sbl-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .sbl-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family:Gooper-Regular;
 }
 
 .folio .sbl-title-01{
     font-size: 1.4em;
     margin: 40px 0 30px 0;
 }
 
 .folio .sbl-01{
   width: 68%;
 }
 
 .folio .sbl-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .sbl-02-1{
    margin-bottom: 10px;
 }

 .folio .sbl-03{
     line-height: 25px;
     margin-bottom: 20px;
 }

/***KLABF***/

.folio .klabf-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .klabf-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family:Gooper-Regular;
 }
 
 .folio .klabf-title-01{
     font-size: 1.4em;
     margin: 40px 0 30px 0;
 }
 
 .folio .klabf-01{
   width: 68%;
 }
 
 .folio .klabf-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .klabf-02-1{
    margin-bottom:10px;    
 }

 .folio .klabf-03{
     line-height: 25px;
     margin-bottom: 20px;
 }


/***Search 01***/

.folio .search01-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .search01-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
 }
 
 .folio .search01-title-01{
     font-size: 1.4em;
     margin: 40px 0 30px 0;
 }
 
 .folio .search01-01{
   width: 68%;
  }
 
 .folio .search01-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .search01-02-1{
    margin-bottom:10px;
 }

 .folio .search01-03{
     line-height: 25px;
     margin-bottom: 20px;
  }


/***Lucky King Bun***/

.folio .lkb-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .lkb-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
 }
 
 .folio .lkb-title-01{
     font-size: 1.4em;
     margin: 40px 0 30px 0;
 }
 
 .folio .lkb-01{
   width: 68%;
}
 
 .folio .lkb-02{
    margin:10px 4px;
    font-size: .9em;
}
 
 .folio .lkb-02-1{
    margin-bottom:10px;
}

 .folio .lkb-03{
     line-height: 25px;
     margin-bottom: 20px;
}

/**Mene***/

.folio .mene-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .mene-title{
     font-family:Gooper-Regular;
     font-size: 2.8em;
     margin-bottom: 40px;
 }
 
 .folio .mene-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}

 .folio .mene-01{
   width: 68%;
}
 
 .folio .mene-02{
    margin:10px 4px;
    font-size: .9em;
 }

 .folio .mene-02-1{
    margin-bottom:10px;
}
 
 .folio .mene-03{
     line-height: 25px;
     margin-bottom: 20px;
}


/***cuaca***/

.folio .cuaca-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .cuaca-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
 }
 
 .folio .cuaca-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
 }
 
 .folio .cuaca-01{
   width: 68%;
}
 
 .folio .cuaca-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .cuaca-02-1{
    margin-bottom:10px;
 }

 .folio .cuaca-03{
     line-height: 25px;
     margin-bottom: 20px;
}

/**lain-lain***/

.folio .lain-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .lain-title{
     font-family: Gooper-Regular;
     font-size: 2.8em;
     margin-bottom: 40px;
 }

 .folio .lain-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}
 
 .folio .lain-01{
   width: 68%;
}
 
 .folio .lain-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .lain-02-1{
    margin-bottom:10px;
 }

 .folio .lain-03{
     line-height: 25px;
     margin-bottom: 20px;
}

/***masseuse***/

.folio .mass-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .mass-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family:Gooper-Light;
}
 
 .folio .mass-01{
   width: 68%;
}
 
 .folio .mass-02{
    margin:10px 4px;
    font-size: .9em;
}
 
 .folio .mass-02-1{
    margin-bottom: 10px;
}

 .folio .mass-03{
     line-height: 25px;
     margin-bottom: 20px;
}


/***search***/

.folio .search-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .search-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family:Gooper-Light;
 }
 
 .folio .search-01{
   width: 68%;
 }
 
 .folio .search-02{
    margin:10px 4px;
    font-size: .9em;
 }
 
 .folio .search-02-1{
    margin-bottom: 10px;
  }

 .folio .search-03{
     line-height: 25px;
     margin-bottom: 20px;
 }

 /***s-day***/

.folio .sday-00{
   width: 28%;
   margin: 0 20px 10px 0;
}

.folio .sday-title{
    font-size: 2.4em;
    margin-bottom: 40px;
    font-family: Gooper-Regular;
}

.folio .sday-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}

.folio .sday-01{
  width: 68%;
 }

.folio .sday-02{
   margin:10px 4px;
   font-size: .9em;
}

.folio .sday-02-1{
    margin-bottom:10px;
 }

.folio .sday-03{
    line-height: 25px;
    margin-bottom: 20px;
 }

 .folio .sday-04{
    line-height: 28px;
    margin-bottom:20px;
 }

/***omo***/

.folio .omo-00{
   width: 28%;
   margin: 0 20px 10px 0;
}

.folio .omo-title{
    font-size: 2.4em;
    margin-bottom: 40px;
    font-family: Gooper-Regular;
}

.folio .omo-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}

.folio .omo-01{
  width: 68%;
}

.folio .omo-02{
   margin:10px 4px;
   font-size: .9em;
}

.folio .omo-02-1{
   margin-bottom:10px;
}

.folio .omo-03{
    line-height: 25px;
    margin-bottom: 20px;
}

 /***team tech***/

 .folio .team-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .team-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}
 
 .folio .team-title-01{
     font-size: 1.4em;
     margin: 40px 0 30px 0;
}
 
 .folio .team-01{
   width: 68%;
}
 
 .folio .team-02{
    margin:10px 4px;
    font-size: .9em;
}

 .folio .team-02-1{
    margin-bottom:10px;
}
  
 .folio .team-03{
     line-height: 25px;
     margin-bottom: 20px;
}


  /*** folior fest***/

  .folio .fest-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .fest-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

 .folio .fest-title-01{
    font-size: 1.4em;
     margin: 40px 0 30px 0;
}

.folio .fest-title-02{
    font-size: 1.2em;
    margin: 30px 0 10px 0;
}

 .folio .fest-01{
   width: 68%;
}
 
 .folio .fest-02{
    margin:10px 4px;
    font-size: .9em;
}
 
 .folio .fest-02-1{
    margin-bottom:10px;
}

 .folio .fest-03{
     line-height: 25px;
     margin-bottom: 20px;
}

/***homework***/
.folio .homework-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .homework-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

 .folio .homework-01{
   width: 68%;
}

.folio .homework-02{
    margin:10px 4px;
    font-size: .9em;
    
}

.folio .homework-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}
  
 .folio .homework-03{
     line-height: 25px;
     margin-bottom: 20px;
}

  /***container***/
.folio .cont-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .cont-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

 .folio .cont-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}

 .folio .cont-01{
   width: 68%;
}
 
 .folio .cont-02{
    margin:10px 4px;
    font-size: .9em;
}

 .folio .cont-02-1{
    margin-bottom:10px;
}

 .folio .cont-03{
     line-height: 25px;
     margin-bottom: 20px;
}

  
 /***martell bottle***/
 .folio .martell-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .martell-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

 .folio .martell-01{
   width: 68%;
}
 
 .folio .martell-02{
    margin:10px 4px;
    font-size: .9em;
 }

 .folio .martell-02-1{
    margin-bottom:10px;
}

 .folio .martell-03{
     line-height: 25px;
     margin-bottom: 40px;
}

  .folio .martell-04{
   margin-bottom: 10px;
   font-size: 1.4em;
 }

/***mbbt***/
.folio .mbbt-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .mbbt-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

.folio .mbbt-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}

 .folio .mbbt-01{
   width: 68%;
}
 
 .folio .mbbt-02{
    margin:10px 4px;
    font-size: .9em;
}

 .folio .mbbt-02-1{
    margin-bottom:10px;
}

 .folio .mbbt-03{
     line-height: 25px;
     margin-bottom: 30px;
}

  /***dasein observer***/
.folio .d-ob-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .d-ob-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

 .folio .d-ob-01{
   width: 68%;
}
 
 .folio .d-ob-02{
    margin:10px 4px;
    font-size: .9em;
 }

 .folio .d-ob-02-1{
    margin-bottom:10px;
}

 .folio .d-ob-03{
     line-height: 25px;
     margin-bottom: 30px;
}

 /***start magazine***/
 .folio .start-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .start-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

 .folio .start-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}

 .folio .start-01{
   width: 68%;
}
 
 .folio .start-02{
    margin:10px 4px;
    font-size: .9em;
}

 .folio .start-02-1{
    margin-bottom:10px;
}

 .folio .start-03{
     line-height: 25px;
     margin-bottom: 20px;
}

 /***dasein preneurs***/
 .folio .d-pre-00{
    width: 28%;
    margin: 0 20px 10px 0;
}
 
 .folio .d-pre-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
}

 .folio .d-pre-01{
   width: 68%;
}
 
 .folio .d-pre-02{
    margin:10px 4px;
    font-size: .9em;
}

 .folio .d-pre-02-1{
    margin-bottom:10px;
}

 .folio .d-pre-03{
     line-height: 25px;
     margin-bottom: 30px;
}


  /***dasein brochure***/
 .folio .d-broc-00{
    width: 28%;
    margin: 0 20px 10px 0;
 }
 
 .folio .d-broc-title{
     font-size: 2.4em;
     margin-bottom: 40px;
     font-family: Gooper-Regular;
 }

 .folio .d-broc-title-01{
    font-size: 1.4em;
    margin: 40px 0 30px 0;
}

 .folio .d-broc-01{
   width: 68%;
}
 
 .folio .d-broc-02{
    margin:10px 4px;
    font-size: .9em;
}

 .folio .d-broc-02-1{
    margin-bottom:10px;
}

 .folio .d-broc-03{
     line-height: 25px;
     margin-bottom: 20px;
}






@-ms-viewport {
    width: extend-to-zoom;
    zoom: 1.0;
}

.flx-nw {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.flx-w {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.logo {
    font-family: kaushanscript;
    font-size: 1.4em;
    color:hsl(30,100%,25%);
    padding: 10px;
    box-sizing: border-box;
    margin-right:10px;
    width: 30%;
}

.content0 {
    
}

.tab-bar {
    width: 22%;
    text-align: center;
    margin-right:10px;
}

.hyperlink {
    font-size: 0.9em;
   color: hsl(202,40%,33%);
    text-decoration: none;
}

.hyperlink-menu {
   color: hsl(0,0%,40%);
   font-size: 1.1em;
   text-decoration: none;
}


.menu-option {
    width: 68%;
    padding-top: 20px;
    box-sizing:border-box;
    display: flex;
    flex-direction: row-reverse;
}

.menu-option2 {
    display: none;
}

    .menu-option2:after {
        content: '☰';
    }

    .header {
        width: 100%;
        position: fixed;
        top: 0;
        background-color: #ffffff9e;
        border-bottom: 1px solid hsl(0,0%,80%);
        z-index:10;
    }
    
    .footer {
        width: 100%;
        border-spacing: 0px;
        border-collapse: collapse;
        margin-left: auto;
        margin-right: auto;
        font-size: .9em;
        color: hsl(48,10%,18%);
        text-decoration: none;
        height: 40px;
        padding:10px;
        box-sizing: border-box; 
        
    }



.content-width {
    width: 750px;
}



@media screen and (max-width:500px) {
    .logo {
        width: 240px;
    }

    .menu-option {
        display: flex;
        flex-direction: column;
        position: absolute;
        background-color: hsl(290,24%,48%);
        top: 100px;
        left: 0;
        height: 200px;
        width: 200px;
        z-index: 1000;
        padding-top: 20px;
        box-shadow: 2px 2px 30px hsl(300,6%,61%); 
       
    }

        .menu-option > div > a {
            color: white;
        }


        .menu-option2 {
            display: block;
            cursor: pointer;
            font-size: 20pt;
            color: hsl(60, 2%, 36%);
            padding-left: 10px;
        }
    
         

    .flx-row {
        display: block;
    }

    .content-width {
        width: 90%;
    }
 
    .hyperlink-menu {
        padding-left: 10px;
        line-height: 30px;
    }

    .services {
        width: 90%;
    }
    .services .s2 {
        padding-left: 10px;
    }

    .about {
        width: 90%;
    }

    .about1 {
        flex-direction: column;
        flex-wrap: unset;
        margin-bottom: 20px;
    }

    .about2 {
        flex-direction: column-reverse;
        flex-wrap: unset;
        margin-bottom: 20px;
    }

    .about .a1-2 {
        font-size: 3em;
    }

    .about .a1 {
        width: 100%;
    }
    .about .a2 {
        width: 100%;
        padding: 10px 0 20px 0;
    }

    .about .a3 {
        font-size: 2.0em;
    }

    .about .a4 {
        width: 100%;
    }
    .about .a5 {
        width: 100%;
        padding: 10px 0 20px 0;
    }

    .btn-belief{
        font-size: 50pt;
    }

    #contactus0 {
        padding-top: 0;
    }

    .contact-us {
        width: 90%;
        flex-direction: column;
    }
    .contact-us .cu1 {
        width: 100%;
    }
    .contact-us .cu2 {
        width: 100%;
        padding: unset;
    }
    .contact-us .cu3 {
        width: 100%;
        padding-left: 0;
    }
    .contact-us .cu4 {
        width: 100%;
        padding-left: 0;
    }

    .folio {
        width: 95%;
    }

    .folio .tds-00{
        width: 98%;
    }
     .folio .tds-01{
        width: 98%;
     }

    .folio .tda-00{
        width: 98%;
    }
     .folio .tda-01{
        width: 98%;
     }

    .folio .chipta-00{
        width: 98%;
    }
     .folio .chipta-01{
        width: 98%;
     }

    .folio .sbl-00{
        width: 98%;
    }
    .folio .sbl-01{
        width: 98%;
    }

    .folio .klabf-00{
        width: 98%;
    }
     .folio .klabf-01{
        width: 98%;
     }

    .folio .search01-00{
        width: 98%;
    }
     .folio .search01-01{
        width: 98%;
     }

    .folio .lkb-00{
        width: 98%;
    }
     .folio .lkb-01{
        width: 98%;
     }

    .folio .mene-00{
        width: 98%;
    }
     .folio .mene-01{
        width: 98%;
     }

    .folio .cuaca-00{
        width: 98%;
    }
     .folio .cuaca-01{
        width: 98%;
     }

    .folio .search-00{
        width: 98%;
    }
     .folio .search-01{
        width: 98%;
     }

    .folio .lain-00{
        width: 98%;
    }
     .folio .lain-01{
        width: 98%;
     }

    .folio .sday-00{
        width: 98%;
    }
     .folio .sday-01{
        width: 98%;
     }

     .folio .omo-00{
        width: 98%;
    }
     .folio .omo-01{
        width: 98%;
     }

     .folio .team-00{
        width: 98%;
    }
     .folio .team-01{
        width: 98%;
     }

     .folio .fest-00{
        width: 98%;
    }
     .folio .fest-01{
        width: 98%;
     }

     .folio .homework-00{
        width: 98%;
    }
     .folio .homework-01{
        width: 98%;
     }

     .folio .cont-00{
        width: 98%;
    }
     .folio .cont-01{
        width: 98%;
     }

     .folio .martell-00{
        width: 98%;
    }
     .folio .martell-01{
        width: 98%;
     }

     .folio .mbbt-00{
        width: 98%;
    }
     .folio .mbbt-01{
        width: 98%;
     }

     .folio .d-ob-00{
        width: 98%;
    }
     .folio .d-ob-01{
        width: 98%;
     }

     .folio .start-00{
        width: 98%;
    }
     .folio .start-01{
        width: 98%;
     }

     .folio .d-pre-00{
        width: 98%;
    }
     .folio .d-pre-01{
        width: 98%;
    }

     .folio .d-broc-00{
        width: 98%;
    }
     .folio .d-broc-01{
        width: 98%;
     }






.my-style{
    font-size: 1.4em;
    color: #fff;
    background-color: #80002a;
}

}