-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex bright.html
230 lines (206 loc) · 12.6 KB
/
index bright.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
<!DOCTYPE HTML>
<html>
<head>
<title>ISACC CARING CONTACTS</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="shortcut icon" type="./image/x-icon" href="./images/Take_On_Transplant_03.png"/>
<link rel="stylesheet" href="assets/css/main.css" />
<script src="https://kit.fontawesome.com/0fbfe3d2f7.js" crossorigin="anonymous"></script>
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
<style>
.resource {
color: #b292c8;
}
.faq {
color: #efc542;
}
.story {
color: #96cfcf;
}
.clip-spacer {
clip-path: polygon(100% 0%, 0% 0%, 0% 65%, 1% 64.95%, 2% 64.8%, 3% 64.59999999999999%, 4% 64.3%, 5% 63.9%, 6% 63.45%, 7% 62.9%, 8% 62.25%, 9% 61.55%, 10% 60.8%, 11% 59.95%, 12% 59.05%, 13% 58.1%, 14% 57.1%, 15% 56.05%, 16% 55%, 17% 53.9%, 18% 52.8%, 19% 51.65%, 20% 50.5%, 21% 49.35%, 22% 48.2%, 23% 47.05%, 24% 45.9%, 25% 44.8%, 26% 43.75%, 27% 42.75%, 28% 41.75%, 29% 40.8%, 30% 39.9%, 31% 39.1%, 32% 38.35%, 33% 37.65%, 34% 37.05%, 35% 36.5%, 36% 36.05%, 37% 35.65%, 38% 35.35%, 39% 35.15%, 40% 35.05%, 41% 35%, 42% 35.05%, 43% 35.2%, 44% 35.45%, 45% 35.75%, 46% 36.15%, 47% 36.65%, 48% 37.2%, 49% 37.85%, 50% 38.55%, 51% 39.35%, 52% 40.2%, 53% 41.1%, 54% 42.05%, 55% 43.05%, 56% 44.1%, 57% 45.15%, 58% 46.3%, 59% 47.4%, 60% 48.55%, 61% 49.7%, 62% 50.85%, 63% 52%, 64% 53.15%, 65% 54.25%, 66% 55.35%, 67% 56.4%, 68% 57.45%, 69% 58.4%, 70% 59.35%, 71% 60.2%, 72% 61.05%, 73% 61.8%, 74% 62.45%, 75% 63.05%, 76% 63.6%, 77% 64.05%, 78% 64.40000000000001%, 79% 64.7%, 80% 64.84999999999999%, 81% 65%, 82% 65%, 83% 64.90000000000001%, 84% 64.75%, 85% 64.5%, 86% 64.2%, 87% 63.75%, 88% 63.25%, 89% 62.7%, 90% 62.05%, 91% 61.3%, 92% 60.5%, 93% 59.65%, 94% 58.75%, 95% 57.8%, 96% 56.8%, 97% 55.75%, 98% 54.65%, 99% 53.55%, 100% 52.4%);
background: #f3eefa;
min-height: 48px;
margin-top: -48px;
transform: rotate(180deg);
position: relative;
top: 120px;
}
h1 {
font-weight: 900;
}
h2 {
font-weight: 500;
}
h3 {
font-weight: 500;
}
#mybutton {
position: fixed;
top: 4px;
right: 10px;
z-index: 1;
}
</style>
<script type="text/javascript">
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
</script>
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper" class="divided">
<!-- One -->
<section class="banner style2 orient-left content-align-left image-position-center fullscreen onload-image-fade-in onload-content-fade-right" style="background: #F7F7F7;">
<div class="content">
<h1>
<!--<img src="images/Take_on_Transplant_01_cropped.png" style="height: 2em; width; 1em;" alt="Take on Transplant"/>-->
<b style="color: #38818D;">ISACC Caring Contacts</b>
</h1>
<p class="major">...</p>
<!--Explore stories from people living with cystic fibrosis (CF) as they share their experiences with lung transplant.-->
<!--Empowering and preparing individuals with cystic fibrosis for conversations and decisions surrounding lung transplant.-->
<ul class="actions stacked">
<!--<li><a href="https://demo.takeontransplant.org/users/login" target="_blank" class="button big wide smooth-scroll-middle">Try the Demo Site <i class="fa fa-caret-right"></i> </a></li>
-->
<li><a href="#first" class="button big wide smooth-scroll-middle">Learn More About the Project <i class="fa fa-caret-down"></i> </a></li>
</ul>
</div>
<div class="image">
<img src="images/Frame 64.png" alt="" />
</div>
</section>
<!-- Six -->
<section class="wrapper style1 align-left" style="background: #F7F7F7;">
<div class="inner">
<h2 id="first">Features</h2>
<div class="items style3 medium onscroll-fade-in">
<section class="feature">
<i class="fa fa-user icon story align-center" aria-hidden="true"></i>
<h3>CF Stories</h3>
<p>Explore stories from people living with cystic fibrosis (CF) as they share their experiences with lung transplant.</p>
</section>
<section class="feature">
<i class="fa fa-list-alt icon resource align-center" aria-hidden="true"></i>
<h3>Resource Library</h3>
<p>Find medical information, facts, and helpful resources as you consider lung transplant for yourself or as a caregiver.</p>
</section>
<section class="feature">
<i class="fa fa-comments icon faq align-center" aria-hidden="true"></i>
<h3>Frequently Asked Questions</h3>
<p>Read questions about lung transplant and answers provided by people with CF who have undergone lung transplant.</p>
</section>
</div>
</div>
</section>
<section class="spotlight style5 orient-left content-align-left image-position-center invert onscroll-image-fade-in" style="background: #38818D;">
<div class="content">
<h2 id="demo">Explore Our Demo</h2>
<!--<p>Navigate through our demo site at your own pace to see how to register, take the initial My CF Stage survey, and view recommended content.</p>
<a href="https://demo.takeontransplant.org/users/login" target="_blank" class="button big wide smooth-scroll-middle">Try the Demo Site <i class="fa fa-caret-right"></i> </a>
-->
<p><br><br>View a short video that demonstrates the <b>Take on Transplant™ </b> tool. See how to register, take the initial My CF Stage survey, and view recommended content. Learn about the features of <b>Take On Transplant</b>.</p>
<a onclick="toggle_visibility('video');" href="#video" class="button smooth-scroll-middle">See the Demo Video</a>
<p></p>
</div>
<div class="image">
<img src="images/Frame 17.png" alt="" />
</div>
</section>
<section class="wrapper style1 align-center" style="background: #F7F7F7; display: none;" id="video">
<div class="inner">
<iframe class='sproutvideo-player' src='https://videos.sproutvideo.com/embed/ea9ddbb9151fe4c163/4fb76d5c32d9cf9f?playerTheme=light' width='100%' height='400' frameboarder='0' allowfullscreen></iframe>
</div>
</section>
<section class="spotlight style1 orient-right content-align-left image-position-center onscroll-image-fade-in" style="background: #F7F7F7;">
<div class="content">
<h2>Why Take on Transplant was developed</h2>
<p>Lung transplant is a treatment option for advanced cystic fibrosis (CF) and has the potential to improve quality of life and extend a person's life by a decade or more. In the US, after reaching an FEV1 < 30% an equal number of people with CF die each year as undergo lung transplant. More than half of CF patients who die without transplant were never referred for lung transplant.</p>
<p>Our research shows that there are opportunities to help people with CF feel more prepared to discuss transplant as a treatment option. A survey demonstrated a gap between how prepared patients feel and how prepared they want to feel about lung transplant decisions. Knowledge gaps were identified related to survival benefit, improvements in health-related quality of life, and contraindications to lung transplant.</p>
</div>
<div class="image">
<img src="images/no-revisions-83-J2B_6ENQ-unsplash.jpg" alt="" />
</div>
</section>
<section class="spotlight style1 orient-left content-align-left image-position-center onscroll-image-fade-in" style="background: #F7F7F7;">
<div class="content">
<h2>How Take on Transplant was developed</h2>
<p>We developed this website with you in mind. We worked closely with people living with CF, including individuals who have undergone lung transplant and people who decided not to have a lung transplant. We interviewed more than 50 people with CF to better understand their journeys and what could have made their experiences better and transitions easier. This website was developed with the help of their insights and suggestions. We also interviewed caregivers for people with CF and incorporated information about support during the transition to transplant.</p>
<p>Content found in the site activities has been vetted by CF and lung transplant physicians as well as patients. The medical information includes recommendations supported by Cystic Fibrosis Foundation guidelines. The details you will find include the most up-to-date information available, which will provide you with tools to help in having informed discussions about lung transplant with your CF team.</p>
<p>Please note: Vertex Pharmaceuticals (the makers of “Trikafta”) did not provide funding for the creation of Take on Transplant and did not participate in any way in the development of this website.</p>
</div>
<div class="image">
<img src="images/bangun-stock-production-mFEOEa4N4c8-unsplash.jpg" alt="" />
</div>
</section>
<section class="spotlight style1 orient-right content-align-left image-position-center onscroll-image-fade-in" style="background: #F7F7F7;">
<div class="content">
<h2>About Us</h2>
<p><b>Take on Transplant™</b> is sponsored by grants from the Cystic Fibrosis Foundation and the National Institutes of Health. Our research team is located at the University of Washington (in Seattle, WA) and includes CF and lung transplant physicians, researchers with experience in CF and lung transplant, and clinical informatics experts. Drs. Ramos and Kapnadak wrote and edited the medical information included in the tool. They also ensured the medical accuracy of patients’ and caregivers’ stories. Dr. Hobler is a PhD researcher who conducted interviews with patients and caregivers and worked with interview participants to create the CF Stories. Our research team has authored multiple scientific papers describing outcomes for people with advanced CF and those who undergo lung transplant.</p>
<!--Dr. Kathleen Ramos<br>
Dr. Siddhartha Kapnadak<br>-->
<h3>Project Team</h3>
<h4>Dr. Kathleen Ramos<br>
Dr. Siddhartha Kapnadak<br>
Dr. Andrea L Hartzler<br>
Lauren Bartlett<br>
Dr. Mara R Hobler<br>
Nick Reid<br>
Dr. Chris Goss<br>
Dr. William Lober<br>
Dr. Donna Berry<br>
Justin McReynolds<br>
Amy Chen<br>
Sierramatice Karras</h4>
</div>
<div class="image">
<img src="images/no-revisions-E4Q1g5Uf_7A-unsplash.jpg" alt="" />
</div>
</section>
<span class="clip-spacer"></span>
<!-- Seven -->
<section class="wrapper style1 align-center" style="background: #E3F1F1;">
<div class="inner medium">
<div class="items style3 medium onscroll-fade-in">
<section>
<a href="https://www.washington.edu/" target="_blank"><img src="images/uwLogo-transparentbg.png" class="image fit" alt="UW logo" /></a>
</section>
<section>
<a href="https://www.cirg.washington.edu/" target="_blank"><img src="images/CIRG_logo.png" class="image fit" style="padding: 3em;" alt="CIRG logo" /></a>
</section>
<!--<section>
<a href="https://www.cff.org/" target="_blank"><img src="images/cf_foundation.svg" class="image fit" alt="CF foundation logo" /></a>
</section>-->
</div>
</div>
</section>
<!-- Footer -->
<footer class="wrapper style1 align-center" style="background-color: #38818D !important; color: #ffffff !important;">
<div class="inner">
<p class="major">Contact Us!</p>
<hr/>
<ul class="icons">
<li>email: ---</li>
<li>phone: ---</li>
</ul>
<p>address: ---</p>
<p>© 2024 University of Washington All rights reserved</p>
</div>
</footer>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrollex.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>