/** 
	* Wedding Planning Checklist
	* Exclusively on Envato Market. 
	* 
	* @encoding UTF-8 
	* @version 1.0.0 
	* @copyright Copyright (C) 2018 - 2020 NYCreatis ( https://nycreatis.com/ ). All rights reserved. 
	* @license Envato License https://1.envato.market/KYbje 
	* @support https://codecanyon.net/user/nycreatis#contact 
	**/
	
 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
}
 body {
     font: "Open Sans", sans-serif;
     text-rendering: optimizeLegibility;
     font-weight: normal;
     font-style: normal;
}
 h1, h2, h3, h4, h5, h6 {
     font-weight: normal;
}
 .wrapper {
     position: relative;
}
 .nosel {
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     -o-user-select: none;
     user-select: none;
}


 .filter {
     text-align: center;
}
 .filter--wrapper {
     display: -webkit-box;
     display: flex;
     -webkit-box-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     align-items: center;
     padding: 6rem 1rem;
     min-height: 100vh;
     margin: 0 auto;
     position: relative;
}
 .filter__pack-button {
     display: none;
}
 .filter__steps ul {
     list-style: none;
     text-align: center;
     margin-top: 80px;
}
 .filter__step {
     width: 16px;
     height: 16px;
     background: #fff;
     display: inline-block;
     border-radius: 50%;
     margin: 10px;
     -webkit-transition: all 100ms;
     transition: all 100ms;
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
}
 .filter__step--active {
     border: 2px solid #ffe4d6;
     box-shadow: 0 0 0 2px #000;
}
 .filter__pretitle {
     font-size: 20px;
     font-family: 'Cinzel', serif;
     color: #000;
     padding-bottom: 25px;
}
 .filter h1 {
     font-size: 64px;
     font-family: 'Cinzel', serif;
     color: #000;
     padding-bottom: 23px;
}
 .filter__desc {
     color: #000;
     padding-bottom: 47px;
     font-weight: 600;
     font-size: 16px;
	line-height: 1.5;
}
 .filter__desc--transparent {
     color: transparent;
}
 .filter__icons {
     margin-bottom: 100px;
}
 .filter__icon-group {
     display: none;
     margin: 0 auto;
}
 .filter__icon-group--active {
     display: block;
}
 .filter__icon-group--2x .filter__icon {
     margin: 0 60px;
}
 .filter__icon-group--3x .filter__icon {
     margin: 0 1rem 4rem
}
 .filter__icon-group--4x .filter__icon {
     margin: 0 19px;
}
 .filter__icon-group .filter__icon {
     display: inline-block;
     cursor: pointer;
     width: 85px;
     height: 85px;
     border: 4px solid #000;
     border-radius: 50%;
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     position: relative;
     box-shadow: 0 0 0 4px transparent;
	background: rgba(255,255,255,0.3);
}
 .filter__icon-group .filter__icon:before {
     position: absolute;
     left: -5px;
     top: -5px;
     right: -5px;
     bottom: -5px;
     display: block;
     content: '';
     border-radius: 50%;
     box-shadow: 0 0 0 4px #7ed321;
     opacity: 0;
     -webkit-transition: opacity 300ms;
     transition: opacity 300ms;
}
 .filter__icon-group .filter__icon span {
     font-weight: 600;
     color: #000;
     text-align: center;
     line-height: 78px;
     font-size: 2rem;
     display: block;
}
 @media (min-width: 1025px) {
     .filter__icon-group .filter__icon:hover:before {
         opacity: 1;
    }
}
 .filter__icon-group .filter__icon:after {
     content: '';
     width: 30px;
     height: 30px;
     display: block;
     background: url("../images/green_check.svg") center no-repeat;
     background-size: 100%;
     border-radius: 50%;
     position: absolute;
     top: -5px;
     right: -5px;
     -webkit-transition: all 300ms;
     transition: all 300ms;
     -webkit-transform: scale(0.1);
     transform: scale(0.1);
     opacity: 0;
}
 .filter__icon-group .filter__icon img {
     width: 100%;
}
 .filter__icon-group .filter__icon--selected:before {
     opacity: 1;
}
 .filter__icon-group .filter__icon--selected:after {
     -webkit-transform: scale(1);
     transform: scale(1);
     opacity: 1;
}
 .filter__icon-group .filter__icon > p {
     font-size: 16px;
     font-weight: 600;
     color: #000;
     text-align: center;
     width: 150px;
     position: absolute;
     left: 50%;
     padding-top: 20px;
     -webkit-transform: translate(-50%, 0);
     transform: translate(-50%, 0);
}
 .filter__hint {
     color: #000;
     border-color: #000;
     padding: 16px 5px;
     text-align: center;
     max-width: 603px;
     max-height: 56px;
     line-height: 1;
     margin: 60px auto 0;
     border: 3px solid;
     border-radius: 60px;
     font-weight: 700;
}
 .filter__hint--back {
     font-family: 'Cinzel', serif;
     font-size: 30px;
     width: 125px;
     padding: 14px 30px;
     cursor: pointer;
     -webkit-transition: all 300ms;
     transition: all 300ms;
}
 @media (min-width: 1025px) {
     .filter__hint--back:hover {
         background: #fff;
         color: #ffe4d6;
    }
}
 .filter__hint--final {
     width: 250px;
}
 .sidebar {
     width: 385px;
     position: fixed;
     top: 0;
     left: 0;
     bottom: 0;
     z-index: 99;
     background: url(../images/sidebar.svg) left center no-repeat;
     background-size: 100%;
     -webkit-transition: all 500ms;
     transition: all 500ms;
     display: -webkit-box;
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     overflow: hidden;
     padding-bottom: 40px;
}
 .sidebar--open {
     -webkit-transform: translate(0, 0);
     transform: translate(0, 0);
}
 .sidebar--close {
     -webkit-transform: translate(-345px, 0);
     transform: translate(-345px, 0);
}
 .sidebar__label {
     position: absolute;
     -webkit-transform: rotate(90deg);
     transform: rotate(90deg);
     text-transform: uppercase;
     color: #fff;
     font-size: 1.3rem;
     right: -115px;
     top: 50%;
     margin-top: -26px;
     height: 40px;
     line-height: 40px;
     width: 275px;
     text-align: center;
     cursor: pointer;
}
 .sidebar__icons {
     max-width: 270px;
     padding: 0 10px;
     margin: 0 auto;
     -webkit-transform: translate(-22px, 0);
     transform: translate(-22px, 0);
     text-align: center;
}
 .sidebar__icon-group {
     text-align: center;
     margin: 0 auto;
}
 .sidebar__icon-group--2x .sidebar__icon {
     margin: 25px 20px;
}
 .sidebar__icon-group--3x .sidebar__icon {
     margin: 25px 10px;
}
 .sidebar__icon-group--4x .sidebar__icon {
     margin: 25px 10px;
}
 .sidebar__icon-group .sidebar__icon {
     margin-top: 25px;
     margin-bottom: 25px;
     display: inline-block;
     cursor: pointer;
     width: 60px;
     height: 60px;
     border: 2px solid #fff;
     border-radius: 50%;
     position: relative;
     box-shadow: 0 0 0 3px transparent;
}
 .sidebar__icon-group .sidebar__icon:before {
     position: absolute;
     left: -3px;
     top: -3px;
     right: -3px;
     bottom: -3px;
     display: block;
     content: '';
     border-radius: 50%;
     box-shadow: 0 0 0 2px #7ed321;
     opacity: 0;
     -webkit-transition: opacity 300ms;
     transition: opacity 300ms;
}
 @media (min-width: 1025px) {
     .sidebar__icon-group .sidebar__icon:hover:before {
         opacity: 1;
    }
}
 .sidebar__icon-group .sidebar__icon:after {
     content: '';
     width: 20px;
     height: 20px;
     display: block;
     background: url("../images/green_check.svg") center no-repeat;
     background-size: 100%;
     border-radius: 50%;
     position: absolute;
     top: -5px;
     right: -5px;
     -webkit-transition: all 300ms;
     transition: all 300ms;
     -webkit-transform: scale(0.1);
     transform: scale(0.1);
     opacity: 0;
}
 .sidebar__icon-group .sidebar__icon span {
     font-size: 2rem;
     width: 100%;
     display: inline-block;
     text-align: center;
     line-height: 56px;
     padding: 0 0 .8rem;
     color: #fff;
}
 .sidebar__icon-group .sidebar__icon--selected:before {
     opacity: 1;
}
 .sidebar__icon-group .sidebar__icon--selected:after {
     -webkit-transform: scale(1);
     transform: scale(1);
     opacity: 1;
}
 .sidebar__icon-group .sidebar__icon > p {
     font-size: 14px;
     color: #fff;
     text-align: center;
     width: 150px;
     position: absolute;
     left: 50%;
     -webkit-transform: translate(-50%, 0);
     transform: translate(-50%, 0);
}
 .checklist--wrapper {
     display: block;
     max-width: 880px;
     margin: 0 auto;
     overflow-x: hidden;
     padding: 120px 0 120px 
}
 .checklist__cols {
     color: #000;
     display: -webkit-box;
     display: flex;
     flex-wrap: wrap;
     max-width: 40rem;
     margin: 0 auto;
}
 .checklist__col {
     margin: 0 25px 5px;
     width: 100% 
}
 .checklist__title {
     font-size: 64px;
     color: #000;
     text-align: center;
     padding-bottom: 20px;
     font-family: 'Cinzel', serif;
}
 .checklist .col__title {
     font-size: 24px;
     color: #000;
     padding-bottom: 36px;
     padding-top: 26px;
     text-align: center;
}
 .checklist .col__check {
     min-width: 32px;
     max-height: 32px;
     border: 3px solid #000;
     border-radius: 40px;
}
 .checklist .col__data {
     font-family: 'Cinzel', serif;
     font-weight: 400;
     padding-left: 20px;
     line-height: 1;
}
 .checklist .col__data p{
     font-family: "Playfair Display", serif;
     font-weight: 400;
     color: #000;
     font-size: 1rem;
     line-height: 1.3;
     margin: .3rem 0 0;
}
 .checklist .col__item {
     cursor: pointer;
     margin-bottom: 1rem;
     display: -webkit-box;
     display: flex;
     background: rgba(255, 255, 255, 0.2);
     padding: 1.2rem;
     border-radius: .5rem;
}
 .checklist .col__item .col__check {
     background: rgba(255,255,255,.2) url("../images/checkbox_check.svg") center no-repeat;
     background-size: 0;
}
 .checklist .col__item--checked .col__check {
     background-size: 12px;
}
 .checklist__print {
     display: block;
     width: 280px;
     color: #000;
     border: 2px solid #000;
     font-family: "Playfair Display", serif;
     font-size: 1.5rem;
     text-align: center;
     border-radius: 2rem;
     margin: 2rem auto;
     cursor: pointer;
     -webkit-transition: all 300ms;
     transition: all 300ms;
}
 @media (min-width: 1025px) {
     .checklist__print:hover {
         background: #fff;
         color: #000;
    }
}
 .checklist__print > p {
     line-height: 1;
    font-family: "Playfair Display", serif;
     width: 100%;
     padding: 1rem 0 
}
 .col__item_headline {
	font-size: 1.5rem;	 
     transition: all .3s;
}
 .checklist .col__item--checked .col__item_headline {
     text-decoration: line-through;
     color: #000;
}
 .transparent {
     color: transparent !important;
     border-color: transparent !important;
     background: transparent !important;
}
 .mobile-share {
     display: none;
}
 @media (max-width: 1035px) {
     .checklist__print {
         display: none;
    }
     .filter__icon-group--purpose .filter__icon:not(:last-child) {
         margin-bottom: 60px;
    }
}
 @media (max-width: 880px) {
     .checklist--wrapper {
         max-width: 600px;
    }
     .filter__icon-group--purpose {
         max-width: 600px;
    }
     .filter__icon-group--purpose .filter__icon:nth-of-type(1), .filter__icon-group--purpose .filter__icon:nth-of-type(2) {
         margin-bottom: 90px;
    }
}
 @media (min-width: 1500px) {
     .checklist--wrapper {
         max-width: 1450px;
    }
}
 @media (max-width: 767px) {
     body {
         background-size: cover;
         background-attachment: scroll;
    }
     .overflow-hidden {
         height: 100%;
         overflow: hidden;
    }
     .wrapper {
         padding: 0;
    }
     .header {
         display: none !important;
    }
     .footer {
         height: 30px;
         display: none !important;
    }
     .filter--wrapper {
         margin: 0;
    }
     .filter__pretitle {
         display: none;
    }
     .filter__icons {
         display: none;
    }
     .filter__icon-group .filter__icon > p {
         padding-top: 10px;
    }
     .filter__steps {
         display: none;
         position: absolute;
         bottom: 10px;
         left: 0;
         right: 0;
    }
     .filter__steps ul {
         margin: 0;
    }
     .filter h1 {
         font-size: 48px;
         padding-top: 0;
         padding-bottom: 0;
    }
     .filter__desc {
         padding: 0 10px 30px;
    }
     .filter__desc > span {
         display: none;
    }
     .filter__pack-button {
         display: block;
         position: relative;
         text-align: center;
         width: 160px;
         height: 160px;
         padding-top: 55px;
         border: 4px solid #000;
         margin: 0 auto;
         font-family: "Open Sans", sans-serif;
         font-size: 48px;
         color: #000;
         border-radius: 50%;
         cursor: pointer;
         -webkit-transition: all 600ms;
         transition: all 600ms;
    }

     .filter__pack-button--hidden {
         color: transparent;
         border-color: transparent;
    }
     .filter__pack-button > span {
         position: absolute;
         display: block;
         -webkit-transform: scale(0.1) translate3d(0, 0, 0);
         transform: scale(0.1) translate3d(0, 0, 0);
         -webkit-backface-visibility: hidden;
         backface-visibility: hidden;
         opacity: 0;
         -webkit-transition: all 500ms;
         transition: all 500ms;
         left: 0;
         top: -5px;
         right: 0;
         bottom: -5px;
         background: url("../images/green_check.svg") center no-repeat;
         background-size: 100%;
    }
     .filter__pack-button > span.big {
         -webkit-transform: scale(1) translate3d(0, 0, 0);
         transform: scale(1) translate3d(0, 0, 0);
         opacity: 1;
    }
    @media (max-width: 768px) {
        .filter__pack-button {
            font-size: 26px;
        }
    }
     .sidebar {
         left: 0;
         top: 0;
         width: 100%;
         height: 100%;
         background: transparent url(../images/menu_part.svg) center bottom no-repeat;
         background-size: auto 59px;
    }
     .sidebar:before {
         position: absolute;
         content: '';
         display: block;
         left: 0;
         right: 0;
         top: 0;
         bottom: 59px;
         background: #000;
    }
     .sidebar--open {
         -webkit-transform: translate(0, 0);
         transform: translate(0, 0);
    }
     .sidebar--close {
         -webkit-transform: translate(0, calc(59px - 100%));
         transform: translate(0, calc(59px - 100%));
    }
     .sidebar__icons {
         -webkit-transform: translate(0, 0);
         transform: translate(0, 0);
         max-width: 100%;
    }
     .sidebar__label {
         -webkit-transform: rotate(0);
         transform: rotate(0);
         bottom: 8px;
         left: 0;
         top: auto;
         right: auto;
         width: 100%;
         text-align: center;
         z-index: 50;
         font-size: 1.1rem
    }
     .sidebar__label span {
         display: none;
    }
     .mobile-share {
         display: block;
         background: #000;
         min-height: 150px;
         width: 100%;
         text-align: center;
         padding-top: 28px;
    }
     .mobile-share__title {
         color: white;
         font-family: "Playfair Display", serif;
         text-decoration: underline;
    }
    .mobile-share__title a {
        color: #fff;
    }
     .mobile-share__copy {
         margin-top: 20px;
         color: white;
         font-size: 14px;
    }
     .mobile-share__copy a {
         color: white;
         text-decoration: none;
    }
     .mobile-share a:nth-of-type(1) img{
         width: 50px;
    }
     .mobile-share a:nth-of-type(2) img{
         width: 23px;
         margin: 0 27px;
    }
     .mobile-share a:nth-of-type(3) img{
         width: 45px;
    }
     .checklist {
         padding: 0 2rem;
    }
     .checklist--wrapper {
         padding: 0;
    }
     .checklist__title {
         font-size: 38px;
         padding-top: 90px;
    }
     .checklist__print {
         display: none;
    }
     .checklist .col__title {
         padding-bottom: 25px;
         padding-top: 0;
    }
     .checklist .col__item {
         margin-bottom: 10px;
    }
}
 [id^="hpmd"] {
     position: absolute !important;
     left: -9999px !important;
}
 @media (max-height: 655px) and (min-width: 768px) {
     .sidebar {
         padding-bottom: 0;
    }
}
 @media (max-width: 480px) {
     .checklist__col {
         margin-left: 0;
         margin-right: 0;
    }
     .filter--wrapper {
         padding-bottom: 30px;
    }
}
/*iphone 4s*/
 @media (max-height: 530px) {
     .filter--wrapper {
         min-height: 100vh;
         height: auto;
         position: relative;
         padding: 50px 0;
    }
     .filter h1 {
         font-size: 40px;
    }
     .filter__pack-button {
         font-size: 40px;
    }
     .filter__icon-group--purpose .filter__icon:nth-of-type(1), .filter__icon-group--purpose .filter__icon:nth-of-type(2) {
         margin-bottom: 40px;
    }
     .filter__steps {
         position: absolute;
    }
}
 @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     .filter--wrapper {
         height: 100vh;
    }
}
 @media print {
     html, body {
         height: 99%;
    }
     @page {
         margin: 10mm 0 3mm 0;
         size: portrait;
    }
     .sidebar, .header, .footer, .mobile-share, .filter--wrapper {
         display: none;
    }
     .wrapper {
         padding: 0;
    }
     .checklist--wrapper {
         max-width: 100%;
         margin: 0 auto;
         padding: 0;
         height: auto;
         position: relative;
    }
     .checklist__title {
         font-size: 24px;
         padding-bottom: 15px;
    }
     .checklist__cols {
         display: block;
         text-align: center;
         position: relative;
    }
     .checklist__col {
         margin: 10px 20px;
         page-break-inside: avoid;
    }
     .checklist__col[data-show="true"] {
         position: relative;
         display: inline-block !important;
         vertical-align: top;
    }
     .checklist__print {
         display: none;
    }
     .checklist .col__item {
         margin-bottom: 5px;
    }
     .checklist .col__item--checked .col__check {
         position: relative;
    }
     .checklist .col__item--checked .col__check:before {
         position: absolute;
         width: 12px;
         height: 12px;
         left: 2px;
         bottom: 8px;
         content: url(../images/checkbox_check.svg);
         display: block;
    }
     .checklist .col__check {
         width: 20px;
         height: 20px;
         border-radius: 5px;
    }
     .checklist .col__data {
         font-size: 11px;
         font-weight: normal;
         text-align: left;
    }
}