/* coach marks layout */
.coach-marks {
    top: calc(50% - 58px + 28px);
    left: 0;
    width: 408px;
    height: 116px;
    position: absolute;
}

.coach-marks-collection,
.coach-marks-collection-item {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
}

.coach-marks-collection-item-image {
    top: calc(50% - 36px);
    left: 40px;
    width: 66px;
    height: 60px;
    position: absolute;
}

.coach-marks-collection-item2-image {
    top: calc(50% - 32px);
}

.coach-marks-collection-item-text {
    top: calc(50% - 10px);
    left: 121px;
    height: 20px;
    margin-right: 40px;
    position: absolute;
}

/* coach marks style */
.coach-marks {
    background: rgba(255,255,255,0.8);
    border-radius: 0 5px 5px 0;
    -webkit-box-shadow: 0 0 35px -10px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 0 35px -10px rgba(0,0,0,0.3);
    box-shadow: 0 0 35px -10px rgba(0,0,0,0.3);
    opacity: 0.0;
    pointer-events: none;

    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5 ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.coach-marks-open {
    opacity: 1.0;
}

.coach-marks-collection-item-image {
    background-repeat: no-repeat;
    background-position: center, center;
    opacity: 0.0;

    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5 ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.coach-marks-collection-item-image-open {
    opacity: 1.0;
}

.coach-marks-collection-item1-image {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NiIgaGVpZ2h0PSI2MCIgdmlld0JveD0iMCAwIDY2IDYwIj4NCiAgPHRpdGxlPlVudGl0bGVkLTE8L3RpdGxlPg0KICA8Zz4NCiAgICA8ZyBvcGFjaXR5PSIwLjEiPg0KICAgICAgPHJlY3QgeD0iMzYuODkiIHk9IjE0LjA1IiB3aWR0aD0iMjkiIGhlaWdodD0iNDYiIHJ4PSIxNC41IiByeT0iMTQuNSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgIDwvZz4NCiAgICA8ZyBvcGFjaXR5PSIwLjIiPg0KICAgICAgPHJlY3QgeD0iMzAuNzYiIHk9IjE0LjA1IiB3aWR0aD0iMjkiIGhlaWdodD0iNDYiIHJ4PSIxNC41IiByeT0iMTQuNSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgIDwvZz4NCiAgICA8ZyBvcGFjaXR5PSIwLjMiPg0KICAgICAgPHJlY3QgeD0iMjUuMTMiIHk9IjE0LjA1IiB3aWR0aD0iMjkiIGhlaWdodD0iNDYiIHJ4PSIxNC41IiByeT0iMTQuNSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgIDwvZz4NCiAgICA8Zz4NCiAgICAgIDxnIG9wYWNpdHk9IjAuMSI+DQogICAgICAgIDxyZWN0IHg9IjAuMTEiIHk9IjE0LjA1IiB3aWR0aD0iMjkiIGhlaWdodD0iNDYiIHJ4PSIxNC41IiByeT0iMTQuNSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjkuMjIgNzQuMDkpIHJvdGF0ZSgtMTgwKSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgICAgPC9nPg0KICAgICAgPGcgb3BhY2l0eT0iMC4yIj4NCiAgICAgICAgPHJlY3QgeD0iNi4yNCIgeT0iMTQuMDUiIHdpZHRoPSIyOSIgaGVpZ2h0PSI0NiIgcng9IjE0LjUiIHJ5PSIxNC41IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MS40OCA3NC4wOSkgcm90YXRlKDE4MCkiIGZpbGw9IiM0ZTRlNGUiLz4NCiAgICAgIDwvZz4NCiAgICAgIDxnIG9wYWNpdHk9IjAuMyI+DQogICAgICAgIDxyZWN0IHg9IjExLjg3IiB5PSIxNC4wNSIgd2lkdGg9IjI5IiBoZWlnaHQ9IjQ2IiByeD0iMTQuNSIgcnk9IjE0LjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDUyLjc1IDc0LjA5KSByb3RhdGUoLTE4MCkiIGZpbGw9IiM0ZTRlNGUiLz4NCiAgICAgIDwvZz4NCiAgICA8L2c+DQogICAgPHJlY3QgeD0iMTcuOTYiIHk9IjE0LjA1IiB3aWR0aD0iMjkiIGhlaWdodD0iNDYiIHJ4PSIxNC41IiByeT0iMTQuNSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgIDxwYXRoIGQ9Ik0zMy4yNSwzMC41di0xNGgwLjE3Yy02Ljc5LDAtMTMuMTcsNS4zMi0xMy4xNywxMi4xMVYzMC41aDEzWiIgZmlsbD0iI2ZmZiIvPg0KICAgIDxyZWN0IHg9IjI3LjYzIiB5PSIxLjk4IiB3aWR0aD0iOS41NiIgaGVpZ2h0PSI0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2NC44MyA3Ljk2KSByb3RhdGUoMTgwKSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgIDxwb2x5Z29uIHBvaW50cz0iMzYuNTkgNy45NSAzNi41OSAtMC4wNSA0MC42MyAzLjk1IDM2LjU5IDcuOTUiIGZpbGw9IiM0ZTRlNGUiLz4NCiAgICA8cG9seWdvbiBwb2ludHM9IjI4LjY3IC0wLjA1IDI4LjY3IDcuOTUgMjQuNjMgMy45NSAyOC42NyAtMC4wNSIgZmlsbD0iIzRlNGU0ZSIvPg0KICA8L2c+DQo8L3N2Zz4NCg==');
}

.coach-marks-collection-item2-image {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOSIgaGVpZ2h0PSI0NiIgdmlld0JveD0iMCAwIDI5IDQ2Ij4NCiAgPHRpdGxlPnNjcm9sbDwvdGl0bGU+DQogIDxnPg0KICAgIDxyZWN0IHdpZHRoPSIyOSIgaGVpZ2h0PSI0NiIgcng9IjE0LjUiIHJ5PSIxNC41IiBmaWxsPSIjNGU0ZTRlIi8+DQogICAgPGc+DQogICAgICA8cmVjdCB4PSIyOC4yNSIgeT0iMjI1Ljc2IiB3aWR0aD0iOS41NiIgaGVpZ2h0PSI0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNDIuMjkgLTE0LjM5KSByb3RhdGUoOTApIiBmaWxsPSIjZmZmIi8+DQogICAgICA8cG9seWdvbiBwb2ludHM9IjE4LjUgMTQuNDYgMTAuNSAxNC40NiAxNC41IDEwLjQyIDE4LjUgMTQuNDYiIGZpbGw9IiNmZmYiLz4NCiAgICAgIDxwb2x5Z29uIHBvaW50cz0iMTAuNSAyMi4zOCAxOC41IDIyLjM4IDE0LjUgMjYuNDIgMTAuNSAyMi4zOCIgZmlsbD0iI2ZmZiIvPg0KICAgIDwvZz4NCiAgPC9nPg0KPC9zdmc+DQo=');
}

.coach-marks-collection-item3-image {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NiIgaGVpZ2h0PSI2MCIgdmlld0JveD0iMCAwIDY2IDYwIj4NCiAgPHRpdGxlPlVudGl0bGVkLTE8L3RpdGxlPg0KICA8Zz4NCiAgICA8ZyBvcGFjaXR5PSIwLjEiPg0KICAgICAgPHJlY3QgeD0iMC4xMSIgeT0iMTQuMDUiIHdpZHRoPSIyOSIgaGVpZ2h0PSI0NiIgcng9IjE0LjUiIHJ5PSIxNC41IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyOS4yMiA3NC4wOSkgcm90YXRlKC0xODApIiBmaWxsPSIjNGU0ZTRlIi8+DQogICAgPC9nPg0KICAgIDxnIG9wYWNpdHk9IjAuMiI+DQogICAgICA8cmVjdCB4PSI2LjI0IiB5PSIxNC4wNSIgd2lkdGg9IjI5IiBoZWlnaHQ9IjQ2IiByeD0iMTQuNSIgcnk9IjE0LjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQxLjQ4IDc0LjA5KSByb3RhdGUoLTE4MCkiIGZpbGw9IiM0ZTRlNGUiLz4NCiAgICA8L2c+DQogICAgPGcgb3BhY2l0eT0iMC4zIj4NCiAgICAgIDxyZWN0IHg9IjExLjg3IiB5PSIxNC4wNSIgd2lkdGg9IjI5IiBoZWlnaHQ9IjQ2IiByeD0iMTQuNSIgcnk9IjE0LjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDUyLjc1IDc0LjA5KSByb3RhdGUoLTE4MCkiIGZpbGw9IiM0ZTRlNGUiLz4NCiAgICA8L2c+DQogICAgPGc+DQogICAgICA8ZyBvcGFjaXR5PSIwLjEiPg0KICAgICAgICA8cmVjdCB4PSIzNi44OSIgeT0iMTQuMDUiIHdpZHRoPSIyOSIgaGVpZ2h0PSI0NiIgcng9IjE0LjUiIHJ5PSIxNC41IiBmaWxsPSIjNGU0ZTRlIi8+DQogICAgICA8L2c+DQogICAgICA8ZyBvcGFjaXR5PSIwLjIiPg0KICAgICAgICA8cmVjdCB4PSIzMC43NiIgeT0iMTQuMDUiIHdpZHRoPSIyOSIgaGVpZ2h0PSI0NiIgcng9IjE0LjUiIHJ5PSIxNC41IiBmaWxsPSIjNGU0ZTRlIi8+DQogICAgICA8L2c+DQogICAgICA8ZyBvcGFjaXR5PSIwLjMiPg0KICAgICAgICA8cmVjdCB4PSIyNS4xMyIgeT0iMTQuMDUiIHdpZHRoPSIyOSIgaGVpZ2h0PSI0NiIgcng9IjE0LjUiIHJ5PSIxNC41IiBmaWxsPSIjNGU0ZTRlIi8+DQogICAgICA8L2c+DQogICAgPC9nPg0KICAgIDxyZWN0IHg9IjE5LjA0IiB5PSIxNC4wNSIgd2lkdGg9IjI5IiBoZWlnaHQ9IjQ2IiByeD0iMTQuNSIgcnk9IjE0LjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDY3LjA4IDc0LjA5KSByb3RhdGUoMTgwKSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgIDxwYXRoIGQ9Ik0zMS43OCwzMC41OVYxNi4zN2gwLjhhMTIuMTcsMTIuMTcsMCwwLDEsMTIuMiwxMi4yNHYxLjc2aC0xM3YwLjIyWiIgZmlsbD0iI2ZmZiIvPg0KICAgIDxyZWN0IHg9IjI4LjgxIiB5PSIxLjk4IiB3aWR0aD0iOS41NiIgaGVpZ2h0PSI0IiBmaWxsPSIjNGU0ZTRlIi8+DQogICAgPHBvbHlnb24gcG9pbnRzPSIyOS40MSA3Ljk1IDI5LjQxIC0wLjA1IDI1LjM3IDMuOTUgMjkuNDEgNy45NSIgZmlsbD0iIzRlNGU0ZSIvPg0KICAgIDxwb2x5Z29uIHBvaW50cz0iMzcuMzMgLTAuMDUgMzcuMzMgNy45NSA0MS4zNyAzLjk1IDM3LjMzIC0wLjA1IiBmaWxsPSIjNGU0ZTRlIi8+DQogIDwvZz4NCjwvc3ZnPg0K');
}

.coach-marks-collection-item-text {
    font-family: "Open Sans", Arial, sans-serif;
    font-weight: bold;
    font-size: 20px;
    line-height: 20px;
    color: #4e4e4e;
    opacity: 0.0;
    transform: translate(10px, 0);

    -webkit-transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    -ms-transition: opacity 0.5 ease-in-out, transform 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}

.coach-marks-collection-item-text-open {
    opacity: 1.0;
    transform: translate(0, 0);
}