Difference between revisions of "Diane.Beauregard/sandbox"

From wiki
Jump to navigation Jump to search
Line 1: Line 1:
{{Innofair-head}}  {{CFRstyles}}
+
{{Template:CFR-CSS}}
 +
 
 
<html>
 
<html>
 +
 +
<head>
 +
    <meta charset="utf-8">
 +
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 +
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
 +
    <title>Community of Federal Regulators GCpedia</title>
 +
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
 +
    <link rel="stylesheet" href="styles.css">
 +
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
 +
    <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet">
 +
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
 +
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
 +
    <style>
 +
 +
        /*==========INCLUDE CUSTOM CSS right here==============*/
 +
 +
.parallax {
 +
    /* The image used */
 +
    background-image: url("https://www.gcpedia.gc.ca/gcwiki/images/b/b1/CFR_Top_photo_site_V3.png");
 +
 +
    /* Set a specific height */
 +
    min-height: 425px;
 +
 +
    /* Create the parallax scrolling effect */
 +
    background-attachment: fixed;
 +
    background-position-y: top;
 +
    background-position-x: center;
 +
    background-repeat: no-repeat;
 +
}
 +
 +
.container{
 +
    display: flex;
 +
    justify-content: center;
 +
    align-items: center;
 +
}
 +
 +
p{margin-bottom:20px !important}
 +
ul{margin-left:40px !important; color:#000}
 +
.light-link{color:#00467F !important;}
 +
 +
.btn-styling {
 +
background-color: rgba( 255, 255, 255, 0.3);
 +
box-shadow: 0px 7px 20px;
 +
border: none;
 +
}
 +
 +
 +
.ul {
 +
    list-style-type:none;
 +
    margin: 0;
 +
    padding: 0;
 +
}
 +
 +
#nav li a {
 +
padding: 0px 40px;
 +
color: #ffffff;
 +
font-family: 'Lato', sans-serif;
 +
font-weight: 400;
 +
font-size: 20px;
 +
}
 +
 +
 +
.cta-btn {
 +
background-color: rgba(255, 255, 255, 0.2);
 +
color: #ffffff;
 +
font-family: 'Lato',sans-serif;
 +
font-weight: 700;
 +
font-size: 25px;
 +
padding: 20px 40px;
 +
transition: all .2s;
 +
}
 +
 +
.cta-btn:hover {
 +
background-color: #329144;
 +
border: 2px solid #ffffff;
 +
color: #ffffff;
 +
text-decoration: none;
 +
}
 +
 +
.register-btn {
 +
background-color: #329144;
 +
font-family: 'Lato', sans-serif;
 +
font-size: 15px;
 +
font-weight: 700;
 +
padding: 10px 20px;
 +
transition: all .2s ease;
 +
color: #fff;
 +
margin-bottom: -35px;
 +
}
 +
 +
.register-btn:hover {
 +
background-color: #fff;
 +
color: #329144;
 +
border: 1px solid #C2CD23;
 +
}
 +
 +
.fade-bg {
 +
background-image: url("http://www.gcpedia.gc.ca/gcwiki/images/9/90/Fade-Proper-NextGenWeb.png");
 +
background-position: center;
 +
background-size: cover;
 +
}
 +
 +
.section-2 {
 +
background-image: url("https://www.gcpedia.gc.ca/gcwiki/images/a/ae/CFR_Background_section_2.png");
 +
background-position: center;
 +
background-size: cover;
 +
}
 +
 +
/* vendor prefixes removed for clarity */
 +
 +
.ribbon {
 +
    width: 350px;
 +
    margin: 10px auto;
 +
    padding: 0 10px 0;
 +
    padding-top: 20px!important;
 +
    position: relative;
 +
    color: #444;
 +
    background: #fff;
 +
    border: 1px solid #d2d2d2;
 +
    border-radius: 3px;
 +
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
 +
}
 +
.ribbon h3 {
 +
    display: block;
 +
    height: 30px;
 +
    line-height: 1.3;
 +
    width: 360px;
 +
    margin: 0;
 +
    padding: 5px 10px;
 +
    position: relative;
 +
    left: -16px;
 +
    top: -12px;
 +
    color: #fff;
 +
    background: #41b655;
 +
    background: linear-gradient(top, #383838 0%, #262626 100%);
 +
    border-radius: 2px 2px 0 0;
 +
    box-shadow: 0 1px 2px rgba(0,0,0,0.3);
 +
}
 +
.ribbon h3::before,
 +
.ribbon h3::after {
 +
    content: '';
 +
    display: block;
 +
    width: 0;
 +
    height: 0;
 +
    position: absolute;
 +
    bottom: -11px;
 +
    z-index: -10;
 +
    border: 5px solid;
 +
    border-color: #242424 transparent transparent transparent;   
 +
}
 +
.ribbon h3::before {left: 0;}
 +
.ribbon h3::after {right: 0;}
 +
 +
.row {
 +
    display: flex;
 +
}
 +
 +
.column {
 +
    flex: 20%;
 +
    padding: 5px;
 +
}
 +
 +
    </style>
 +
</head>
 +
 +
 +
<body>
 +
 
<section class="super-body">
 
<section class="super-body">
          <nav class="navbar navbar-default">
 
        <div class="container-fluid">
 
            <div class="navbar-header">
 
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
 
                        <span class="sr-only">Toggle navigation</span>
 
                        <span class="icon-bar"></span>
 
                        <span class="icon-bar"></span>
 
                        <span class="icon-bar"></span>
 
                      </button>
 
        <a class="navbar-brand logo" href="http://www.gcpedia.gc.ca/gcwiki/images/7/70/CFR_CRF.png"></a>
 
  
            </div>
+
<!-- Top Section -->
            <div id="navbar" class="navbar-collapse collapse">
+
<div class="parallax"></div>
                <ul class="nav navbar-nav navbar-right">
+
        <div style="padding-bottom: 0px; margin-top: -380px;">
                  <li><a href="">CFR Calendar of Activities</a></li>  
+
            <div style="text-align:right; padding-right: 100px; margin-bottom: 75px; background-color: rgba(0, 70, 127, 0.2);">
                  <li><a href="">CFR Video Library</a></li>
+
                  <ul id="nav" style="position: relative; bottom: 15px">
                  <li><a href="https://twitter.com/cfr_crf?lang=en">Twitter</a></li>
+
                        <li><a class="navbar-brand" href="/wiki/Main_Page"><span style="font-family: Helvetica,Arial,sans-serif; padding: 10px; bottom: -30px; position: relative;"><span style="font-weight:800">GC</span>pedia</span></a></li>
                  <li><a href="https://www.instagram.com/cfr_crf/">Instagram</a></li>
+
                      <li style="display: inline;"><a href="https://twitter.com/cfr_crf?lang=en">Twitter</a></li>
                  <li><a href="https://ca.linkedin.com/in/cfr-crf">LinkedIn</a></li>
+
                      <li style="display: inline;"><a href="https://ca.linkedin.com/in/cfr-crf">LinkedIn</a></li>
                <li><a href="http://www.gcpedia.gc.ca/gcwiki/index.php?title=Community_of_Federal_Regulators_2.0&action=edit">Edit</a></li>
+
                      <li style="display: inline;"><a href="https://www.instagram.com/cfr_crf/">Instagram</a></li>                
                <li><a href="http://www.gcpedia.gc.ca/wiki/Objectif2020/Salon_innovation_2018">FR</a></li>
+
                      <li style="display: inline;"><a href="https://twitter.com/DigiAcademyCAN">Contact Us</a></li>
                </ul>
+
                      <li style="display: inline;"><a href="http://www.gcpedia.gc.ca/wiki/EFPCAN_VoletExcellence">FR</a></li>
            </div>
+
                </ul>
 +
 
 +
</div>
 +
<div class="container">
 +
</BR>
 +
</div>
 +
</BR>
 +
      <section style="width:100%; padding-top: 10px; padding-bottom: 45px">
 +
          <div style="width:49.5%; display: inline-block">
 +
              <p></p>
 +
          </div>
 +
          <div style="width:49.5%; display: inline-block; padding-right: 100px; padding-bottom: 20px">
 
         </div>
 
         </div>
    </nav>
+
       
 +
        <!----------------------------------------------------- Section 1 ------------------------------------------------------->
 +
 
 +
<section style="width:100%; padding-top: 200px; padding-bottom: 45px">
 +
          <div style="width:49.5%; display: inline-block; text-align:center; vertical-align: top">
 +
                <img style="width: 70%; margin-top: 50px" src="https://www.gcpedia.gc.ca/gcwiki/images/4/4a/TM_larger.jpg" alt="Welcome"><br><br>
 +
          </div>
 +
 
 +
              <div style="width:49.5%; display: inline-block; padding-right: 100px;">
 +
<h2 style="font-family: 'Lato', sans-serif; font-weight:700; color:#050505; font-size: 28px; padding-bottom: 15px"><span style="font-family: 'Lato', sans-serif; font-weight: 300;">Welcome to the</span><br>Community of Federal Regulators</h2>
 +
 
 +
<p style="font-family: 'Lato', sans-serif; font-weight:400; color:#050505; font-size: 16px;">The Community of Federal Regulators (CFR) is a partnership of federal departments and agencies designed to facilitate collaboration and professional development of employees involved in the regulatory process across the federal government.
 +
<br><br>
 +
 
 +
</p>
 +
 
 +
<p><a href="https://www.csps-efpc.gc.ca/About_us/Business_lines/digitalacademy-eng.aspx" class="btn btn-primary">Learn more about the CFR.</a>
 +
</p>
 +
</div>
 +
</section>
 +
 
 +
<!----------------------------------------------------- Section 2 ------------------------------------------------------->
 +
 
 +
<section id="ApplyDrop" style="padding-bottom: 35px;" class="section-2">
  
    <main>
+
<section style="width:100%; padding-top: 20px; padding-bottom: 20px">
        <!-- Jumbotron -->
+
 
        <div class="jumbotron j1" style="background-image:url('http://www.gcpedia.gc.ca/gcwiki/images/3/3b/Headerphoto.png')">
+
          <div style="width:49.5%; display: inline-block; padding-left: 100px;">
            <div class="container">
+
<h2 style="font-family: 'Lato', sans-serif; font-weight:700; color:#ffffff; font-size: 28px;"><span style="font-family: 'Lato', sans-serif; font-weight: 300;">Our Events:</h2>
                <h1 class="centered" >Spotlight</h1>
 
               
 
                        <p class="centered" style="letter-spacing:1px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu turpis sem. Etiam placerat ligula
 
    maximus viverra iaculis. Nam pharetra justo sed elit hendrerit sempert.
 
                        </p>
 
               
 
            </div>
 
        </div>
 
  
        <!-- content -->
+
<p style="font-family: 'Lato', sans-serif; font-weight:400; color:#ffffff; font-size: 16px;">
        <section class="home-tiles">
+
            </p>
            <div class="container">
+
          </div>
                <div class="row">
+
      </section>
                    <div class="col-sm-4 col-md-3">
 
                        <a href="http://www.gcpedia.gc.ca/wiki/CFR_Collaboration" target="_blank">
 
                            <div class="tile background-blue-main">
 
                                <img src="http://www.gcpedia.gc.ca/gcwiki/images/5/54/Collaboration.jpg">                            
 
                            </div>
 
                        </a>
 
                    </div>
 
  
                    <div class="col-sm-4 col-md-3">
+
<!----------------------------------------------------- Section 5 ------------------------------------------------------->
                        <a href="">
 
                            <div class="tile background-blue-main">
 
                                <img src="http://www.gcpedia.gc.ca/gcwiki/images/d/d3/Experimentation.jpg" >
 
                              </div>
 
                        </a>
 
                    </div>
 
  
                    <div class="col-sm-4 col-md-3">
+
<section style="width:100%; padding-top: 20px; padding-bottom: 20px">
                        <a href="">
+
          <div style="width:49.5%; display: inline-block; padding-right: 100px;">
                            <div class="tile background-blue-main">
+
<h2 style="font-family: 'Lato', sans-serif; font-weight:700; color:#ffffff; font-size: 28px;"><span style="font-family: 'Lato', sans-serif; font-weight: 300;">To complete your application, you will need the following:</h2>
                                <img src="http://www.gcpedia.gc.ca/gcwiki/images/a/ad/Talentmanagement.jpg">                              
+
            <p style="font-family: 'Lato', sans-serif; font-weight:400; color:#ffffff; font-size: 16px;">
                            </div>
+
            <br>
                        </a>
+
          </div>
                    </div>
+
      </section>
 +
</section>
 +
</section>
  
                    <div class="col-sm-4 col-md-3">
+
<!----------------------------------------------------- Section 1 ------------------------------------------------------->
                        <a href="http://www.gcpedia.gc.ca/wiki/CFR_Our_events" target="_blank">
+
      <section style="width:100%; padding-top: 10px; padding-bottom: 20px">
                            <div class="tile background-blue-main">
+
 
                                <img src="http://www.gcpedia.gc.ca/gcwiki/images/8/8f/Conference.jpg">
+
          <div style="width:49.5%; display: inline-block; padding-left: 100px;">
                                </div>
+
<h2 style="font-family: 'Lato', sans-serif; font-weight:700; color:#050505; font-size: 28px;"><span style="font-family: 'Lato', sans-serif; font-weight: 300;"><strong>Our Events</strong></h2>
                        </a>
+
<p style="font-family: 'Lato', sans-serif; font-weight:400; color:##050505; font-size: 16px;">
                  </div>                                  
+
The CFR hosts a variety of events to facilitate collaboration, strengthen the knowledge and competencies of regulatory professionals, and provide opportunities for innovation in the regulatory field.
                </div>
+
<br>
            </div>
+
<p style="font-family: 'Lato', sans-serif; font-weight:400; color:#00467F; font-size: 16px; LINE-HEIGHT:37px; padding-left: 75px">
        </section>
+
&#8618; <a href="https://www.gcpedia.gc.ca/gcwiki/images/1/15/Video_Pitch.pdf" class="light-link"><strong>CFR Regulatory Conference</strong></a>
 +
<br>&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong> Regulatory Speaker Series</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Regulatory Law Enforcement Symposium</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Let's Talk Events</strong></a>  
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Regulatory Excellence Awards</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Regulatory Innovation Forums</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Nymark Lecture Series</strong></a>  
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Specialty Workshops</strong></a>  
 +
            </p>
 +
          </div>
  
<h4> About the CFR </h4>
+
<div style="width:49.5%; display: inline-block; vertical-align: top; text-align: center; margin-top: 40px ">
 +
              <img style="width: 80%; padding-top: 60px;" src="https://www.gcpedia.gc.ca/gcwiki/images/a/a7/Panel_61.jpg" alt="candidate">
 +
          </div>
 +
      </section>
  
   <p> Donec finibus, nunc ut pellentesque pharetra, purus enim tincidunt felis,
+
<!----------------------------------------------------- Section 1 ------------------------------------------------------->
  ut hendrerit lorem enim in risus. Vestibulum sit amet nisi ultricies, facilisis mauris sed, dictum nunc.
+
  <section style="width:100%; padding-top: 10px; padding-bottom: 20px">
  Integer in tortor sit amet diam imperdiet mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel est erat.
+
   <div style="width:49.5%; display: inline-block; text-align:center; vertical-align: top">
  Vestibulum porttitor ultrices est, id pellentesque ipsum hendrerit ut. Nunc vel nisl pulvinar, venenatis turpis in, feugiat dui.
+
                <img style="width: 80%; margin-top: 100px" src="https://www.gcpedia.gc.ca/gcwiki/images/f/f4/CFR_CoP_image.jpg" alt="Commitment"><br>
  Praesent id metus eu nulla aliquam sagittis ut at diam. Nam et aliquam justo. Phasellus efficitur auctor ligula. Quisque non commodo nisi,
+
</div>
  sit amet ornare ligula. Sed in scelerisque neque. Sed vulputate interdum augue, eget finibus orci laoreet ac. Sed consectetur est lectus,
+
          <div style="width:49.5%; display: inline-block; padding-right: 100px;">
  at tempor lacus tempus eget. Suspendisse finibus rhoncus dictum. Nunc id tincidunt mi. Sed ut lectus ligula. Sed eu pretium elit, in fringilla
+
<h2 style="font-family: 'Lato', sans-serif; font-weight:700; color:#050505; font-size: 28px;"><span style="font-family: 'Lato', sans-serif; font-weight: 300;"><strong>Collaboration</strong></h2>
</p>
+
            <p style="font-family: 'Lato', sans-serif; font-weight:400; color:#050505; font-size: 16px;">
 +
CFR's Communities of Practice and Working Groups are forums to share knowledge, discuss challenges and develop constructive approaches to addressing common challenges among employees with similar responsibilities.
 +
<p style="font-family: 'Lato', sans-serif; font-weight:400; color:#00467F; font-size: 16px; LINE-HEIGHT:37px; padding-left: 75px">
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Risk-Based Regulatory Delivery COP</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Compliance & Enforcement COP</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Cost-Benefit Analysis COP</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Administrative Monetary Penalty System WG</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Service Fees WG</strong></a>
 +
<br>
 +
&#8618; <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"><strong>Major Case Management WG</strong></a>
 +
            </p>
 +
<br>
 +
<p><p style="padding-left: 75px">
 +
<a href="https://www.gcpedia.gc.ca/gcwiki/images/f/f4/CFR_CoP_image.jpg" class="btn btn-primary">See past engagements.</a>
 +
            </p>
 +
          </div>
 +
      </section>
  
<div class="class">
+
<!----------------------------------------------------- Section 2 ------------------------------------------------------->
 +
<section style="width:100%; padding-top: 30px; padding-bottom: 20px", class="section-2">
 +
<div style="display: flex; flex-direction: row; justify-content: center; align-items: center;">
 +
    <div style="width:80%; display: inline-block; text-align:center; vertical-align: top;">
 +
        <img style="width: 80%; margin: 0 auto !important;" src="https://www.gcpedia.gc.ca/gcwiki/images/6/6b/NEW_TIMELINE.png"><br><br>
 +
    </div>
 +
</div>
 +
</section>
  
   <h5> Newsflash </h5>
+
<!----------------------------------------------------- Section 1 ------------------------------------------------------->
 +
      <section style="width:100%; padding-top: 10px; padding-bottom: 20px">
 +
    
 +
          <div style="width:49.5%; display: inline-block; padding-left: 100px;">
 +
<h2 style="font-family: 'Lato', sans-serif; font-weight:700; color:#050505; font-size: 28px;"><span style="font-family: 'Lato', sans-serif; font-weight: 300;"><strong>Talent Management</strong></h2>
 +
<p style="font-family: 'Lato', sans-serif; font-weight:400; color:#050505; font-size: 16px;">
 +
As part of the application, you will be asked to propose a real business problem that is currently touching your team, department, or even government writ large.
 +
<br><br>
 +
This should be a problem that personally affects you in your day-to-day job and that you believe can be better solved or tackled by learning skills in one or more of the streams in Premium (data, design, DevOps, AI/ML, development).
 +
<br><br>
 +
<strong>Note:</strong>  Participants will be working on a real problem as part of their experience, but we cannot guarantee that you will be working on your specific problem during the practicum.
 +
<br><br>
 +
<p><a href="http://www.gcpedia.gc.ca/gcwiki/images/7/7d/What_is_a_good_business_problem.pdf" class="btn btn-primary">More on CFR's Talent Management Initiatives</a>
 +
            </p>
 +
          </div>
  
<img class ="newsflash" src="http://www.gcpedia.gc.ca/gcwiki/images/a/aa/Newsflash.png">
+
<div style="width:49.5%; display: inline-block; vertical-align: top; text-align: center; margin-top: 40px ">
 +
              <img style="width: 65%" src="https://www.gcpedia.gc.ca/gcwiki/images/0/07/Collaboration_CFR.jpg" alt="brainstorm">
 +
          </div>
  
 +
      </section>
  
  </div>
+
<!----------------------------------------------------- Section 1 ------------------------------------------------------->
 +
  <section style="width:100%; padding-top: 20px; padding-bottom: 80px">
 +
  <div style="width:49.5%; display: inline-block; text-align:center; vertical-align: top">
 +
                <img style="width: 80%; margin-top: 40px" src="https://www.gcpedia.gc.ca/gcwiki/images/c/c2/AI_booth_photo.jpg" alt="management"><br><br>
 +
</div>
 +
          <div style="width:49.5%; display: inline-block; padding-right: 100px;">
 +
<h2 style="font-family: 'Lato', sans-serif; font-weight:700; color:#050505; font-size: 28px;"><span style="font-family: 'Lato', sans-serif; font-weight: 300;">
 +
<br>
 +
<strong>Experimentation</strong></h2>
 +
            <p style="font-family: 'Lato', sans-serif; font-weight:400; color:#050505; font-size: 16px;">
 +
The CFR has identified experimentation as one of its key priority areas. The goal is to position the CFR as an enabler – bringing the community together to explore, pioneer and test new approaches and delivery methods with potential application for creating efficiencies across the regulatory lifecycle.
 +
<br><br>
 +
Recent initiatives include leveraging AI to tackle regulatory challenges, a CFIA-CFR blockchain experiment, regulatory sandboxes, and rules as code.
 +
<br><br>
 +
<p><a href="https://www.gcpedia.gc.ca/gcwiki/images/7/76/CSPSDA_Premium_Letter_of_Support.docx" class="btn btn-primary">Learn more about our work in this area.</a>
 +
            </p>
 +
          </div>
 +
  </section>
 +
     
 +
<!----------------------------------------------------- Section 4 ------------------------------------------------------->
  
<h4> Video Library </h4>
+
<section id="ContactDrop" style="padding: 70px 0px; background-color: #00467F; ;width: 100%">
 +
<div style="text-align: center; font-family: 'Lato',sans-serif; color: #ffffff">
 +
  <p style="font-size:19px; width: 40%; margin: auto; padding-bottom: 30px"><strong>We want to hear from you!</strong></p>
 +
Our goal at the CFR is to enhance collaboration, dialogue, networking and innovation in the regulatory field.
 +
<br>
 +
Do you have a suggestion for a CFR event?
 +
<br>
 +
Is there a topic you would like to see covered in our learning activities?
 +
<br>
 +
</p>
 +
<br>
 +
<br>
 +
</div>
 +
    <div style="text-align: center;">
 +
          <a href="mailto:csps.digitalacademy-academiedunumerique.efpc@canada.ca?subject=Question on CSPS Digital Academy Premium" class="cta-btn">
 +
              Contact Us
 +
          </a>
 +
    </div>
 +
</section>
  
<p> Donec finibus, nunc ut pellentesque pharetra, purus enim tincidunt felis,
+
<!----------------------------------------------------- Footer ------------------------------------------------------->
  ut hendrerit lorem enim in risus. Vestibulum sit amet nisi ultricies, facilisis mauris sed, dictum nunc.
+
     
  Integer in tortor sit amet diam imperdiet mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vel est erat.
+
  <section style="padding: 20px 0px">
    Vestibulum porttitor ultrices est, id pellentesque ipsum hendrerit ut. Nunc vel nisl pulvinar, venenatis turpis in, feugiat dui.
+
                  <div style="width: 95%; display: inline-block; text-align: right;">
    Praesent id metus eu nulla aliquam sagittis ut at diam. Nam et aliquam justo. Phasellus efficitur auctor ligula. Quisque non commodo nisi, sit amet ornare ligula. Sed in scelerisque neque. Sed vulputate interdum augue, eget finibus orci laoreet ac. Sed consectetur est lectus, at tempor lacus tempus eget. Suspendisse finibus rhoncus dictum. Nunc id tincidunt mi. Sed ut lectus ligula. Sed eu pretium elit, in fringilla enim. Nulla at nibh ante. Vestibulum a felis eget turpis commodo sagittis.  </p>
+
                <p style="font-family: 'lato', sans-serif; color: #3F2A56">Brought to you by the Community of Federal Regulators</p>
 +
            </div>
 +
        </section>
  
  <section class="footer">
 
        <p "para"> GCconnex </p>
 
 
     </section>
 
     </section>
  
</section>
+
</body>
  
 
</html>
 
</html>

Revision as of 13:19, 26 September 2019

<html> <style>

 html,
 body {
     height: 100%;
     -webkit-animation: fadein .5s;
     animation: fadein .5s;
 }
 
 @keyframes fadein {
     from {
         opacity: 0;
     }
     to {
         opacity: 1;
     }
 }
 
 @-webkit-keyframes fadein {
     from {
         opacity: 0;
     }
     to {
         opacity: 1;
     }
 }
 
 @import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,500,700,900');
 * {
     margin: 0;
     padding: 0;
 }
 /* THIS IS THE SECRET SAUCE for GCpedia, BODY AND SUPER-BODY classes */
 
 body {
     overflow-y: hidden;
     background-color: #f8f8f8;
 }
 
 .super-body {
     position: fixed;
     overflow-y: scroll;
     overflow-x: hidden;
     -ms-overflow-x: hidden;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     z-index: 10000;
     background-color: #fff;
     -webkit-transition: all .2s ease-in;
     transition: all .5s ease-in;
     font-family: 'Roboto', sans-serif;
     font-size: 14px;
     -webkit-overflow-scrolling: touch;
     -ms-overflow-style: -ms-autohiding-scrollbar;
 }
 
 div#mw-head {
     position: absolute;
     top: 145px;
     right: 0;
     width: 100%;
     display: none;
 }
 
 div#mw-panel {
     font-size: inherit;
     position: absolute;
     top: 160px;
     padding-top: 1em;
     width: 10em;
     left: 0;
     display: none;
 }
 
 #footer {
     display: none;
 }
 
 .mw-content-ltr ul,
 .mw-content-rtl .mw-content-ltr ul {
     margin: 0;
 }
 
 .mw-body .mw-body-content h1 {
     margin-top: 0;
 }
 
 .mw-body h1,
 .mw-body h2 {
     font-family: sans-serif;
     line-height: 1.3;
     margin-bottom: .25em;
     padding: 0;
     border-bottom: 1px solid transparent;
 }
 /*new css*/
 
 h4 {
     padding-top: 0;
 }
 
 .mw-body h3,
 .mw-body h4,
 .mw-body h5,
 .mw-body h6 {
     line-height: 1.2;
     margin-top: .1em;
     margin-bottom: .1em;
     padding-bottom: 0;
 }
 
 .navbar {
     position: relative;
     min-height: 50px;
     margin-bottom: 0px;
     border: 1px solid transparent;
 }
 
 .navbar-default {
     background-color: #fff;
     border-color: #e7e7e7;
 }
 
 .navbar-default .navbar-brand {
     color: #222;
 }
 
 .navbar-default .navbar-brand:hover,
 .navbar-default .navbar-brand:focus {
     color: #5e5e5e;
     background-color: transparent;
 }
 
 .navbar-default .navbar-text {
     color: #222;
 }
 
 .navbar-default .navbar-nav>li>a {
     color: #222;
 }
 
 .navbar-default .navbar-nav>li>a:hover,
 .navbar-default .navbar-nav>li>a:focus {
     color: #111;
     background-color: transparent;
 }
 
 .navbar-default .navbar-nav>.active>a,
 .navbar-default .navbar-nav>.active>a:hover,
 .navbar-default .navbar-nav>.active>a:focus {
     color: #555;
     background-color: #e7e7e7;
 }
 
 .navbar-default .navbar-nav>.disabled>a,
 .navbar-default .navbar-nav>.disabled>a:hover,
 .navbar-default .navbar-nav>.disabled>a:focus {
     color: #ccc;
     background-color: transparent;
 }
 
 .navbar-default .navbar-toggle {
     border-color: #ddd;
 }
 
 .navbar-default .navbar-toggle:hover,
 .navbar-default .navbar-toggle:focus {
     background-color: #ddd;
 }
 
 .navbar-default .navbar-toggle .icon-bar {
     background-color: #888;
 }
 
 .navbar-default .navbar-collapse,
 .navbar-default .navbar-form {
     border-color: #e7e7e7;
 }
 
 .navbar-default .navbar-nav>.open>a,
 .navbar-default .navbar-nav>.open>a:hover,
 .navbar-default .navbar-nav>.open>a:focus {
     color: #555;
     background-color: #e7e7e7;
 }
 
 @media (max-width: 767px) {
     .navbar-default .navbar-nav .open .dropdown-menu>li>a {
         color: #777;
     }
     .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover,
     .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus {
         color: #333;
         background-color: transparent;
     }
     .navbar-default .navbar-nav .open .dropdown-menu>.active>a,
     .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover,
     .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus {
         color: #555;
         background-color: #e7e7e7;
     }
     .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a,
     .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:hover,
     .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:focus {
         color: #ccc;
         background-color: transparent;
     }
 }
 
 .navbar-default .navbar-link {
     color: #777;
 }
 
 .navbar-default .navbar-link:hover {
     color: #333;
 }
 
 .navbar-default .btn-link {
     color: #777;
 }
 
 .navbar-default .btn-link:hover,
 .navbar-default .btn-link:focus {
     color: #333;
 }
 
 .navbar-default .btn-link[disabled]:hover,
 fieldset[disabled] .navbar-default .btn-link:hover,
 .navbar-default .btn-link[disabled]:focus,
 fieldset[disabled] .navbar-default .btn-link:focus {
     color: #ccc;
 }
 
 .navbar-brand {
     font-weight: bolder;
 }
 
 .logo {
     height: 21px;
 }
 
 .btn {
     min-height: 34px;
 }
 
 .navbar-default .navbar-nav>li>a:visited {
     color: #222;
 }
 
 ul.dropdown-menu {
     padding: 0;
 }
 
 .dropdown-menu>li>a {
     display: block;
     padding: 15px 20px;
     clear: both;
     font-weight: 400;
     line-height: 1.42857143;
     color: #333;
     white-space: nowrap;
     border-bottom: 1px solid #e8e8e8;
 }
 
 .home {
     padding: 20px;
     background-color: #fff;
 }
 
 .home p {
     font-size: 20px;
     font-weight: 400;
 }
 
 .home h2 {
     font-size: 3em;
     font-weight: bolder;
     margin-bottom: 20px;
 }
 
 .home h3 {
     font-weight: bolder;
     margin-top: 40px;
 }
 
 .home {
     padding: 0 0 30px;
 }
 
 .home .filter-button-group {
     padding: 15px 0;
 }
 
 .jumbotron--background-image {
     color: #222;
     min-height: 20vh;
          justify-content: center;
     background-position: 50% 100%;
     background-size: cover;
     background-repeat: no-repeat;
     background-color: #fff;
     text-align: center;
 }
 .jumbotron--background-image h1 {
     font-weight: bolder;
 }
 
 
 .jumbotron--background-image h3 {
     line-height: 1.4em;
     font-size: 24px;
     font-weight: bold;
 }
 
 div[class^="col-"] {
     margin-bottom: 20px;
 }
 
 div[class^="col-"] img {
     margin: 30px auto;
 }
 
 .footer {
     padding: 30px 0;
     background-color: #232323;
     color: #e8e8e8;
 }
 
 .footer a {
     color: #e8e8e8;
 }
 
 .navbar-inverse {
     background: rgba(0, 0, 0, 0.8);
 }
 
 .align-top {
     -ms-flex-item-align: start;
     align-self: flex-start;
 }

</style> </html>

<html>

<head>

   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
   <title>Community of Federal Regulators GCpedia</title>
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
   <link rel="stylesheet" href="styles.css">
   <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
   <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
   <style>
       /*==========INCLUDE CUSTOM CSS right here==============*/

.parallax {

   /* The image used */
   background-image: url("https://www.gcpedia.gc.ca/gcwiki/images/b/b1/CFR_Top_photo_site_V3.png");
   /* Set a specific height */
   min-height: 425px; 
   /* Create the parallax scrolling effect */
   background-attachment: fixed;
   background-position-y: top;
   background-position-x: center;
   background-repeat: no-repeat;

}

.container{

   display: flex;
   justify-content: center;
   align-items: center;

}

p{margin-bottom:20px !important} ul{margin-left:40px !important; color:#000} .light-link{color:#00467F !important;}

.btn-styling { background-color: rgba( 255, 255, 255, 0.3); box-shadow: 0px 7px 20px; border: none; }


.ul {

    list-style-type:none;
    margin: 0;
    padding: 0;

}

  1. nav li a {

padding: 0px 40px; color: #ffffff; font-family: 'Lato', sans-serif; font-weight: 400; font-size: 20px; }


.cta-btn { background-color: rgba(255, 255, 255, 0.2); color: #ffffff; font-family: 'Lato',sans-serif; font-weight: 700; font-size: 25px; padding: 20px 40px; transition: all .2s; }

.cta-btn:hover { background-color: #329144; border: 2px solid #ffffff; color: #ffffff; text-decoration: none; }

.register-btn { background-color: #329144; font-family: 'Lato', sans-serif; font-size: 15px; font-weight: 700; padding: 10px 20px; transition: all .2s ease; color: #fff; margin-bottom: -35px; }

.register-btn:hover { background-color: #fff; color: #329144; border: 1px solid #C2CD23; }

.fade-bg { background-image: url("http://www.gcpedia.gc.ca/gcwiki/images/9/90/Fade-Proper-NextGenWeb.png"); background-position: center; background-size: cover; }

.section-2 { background-image: url("https://www.gcpedia.gc.ca/gcwiki/images/a/ae/CFR_Background_section_2.png"); background-position: center; background-size: cover; }

/* vendor prefixes removed for clarity */

.ribbon {

   width: 350px;
   margin: 10px auto;
   padding: 0 10px 0;
   padding-top: 20px!important;
   position: relative;
   color: #444;
   background: #fff;
   border: 1px solid #d2d2d2;
   border-radius: 3px;
   box-shadow: 0 1px 3px rgba(0,0,0,0.1);

} .ribbon h3 {

   display: block;
   height: 30px;
   line-height: 1.3;
   width: 360px;
   margin: 0;
   padding: 5px 10px;
   position: relative;
   left: -16px;
   top: -12px;
   color: #fff;
   background: #41b655;
   background: linear-gradient(top, #383838 0%, #262626 100%);
   border-radius: 2px 2px 0 0;
   box-shadow: 0 1px 2px rgba(0,0,0,0.3);

} .ribbon h3::before, .ribbon h3::after {

   content: ;
   display: block;
   width: 0;
   height: 0;
   position: absolute;
   bottom: -11px;
   z-index: -10;
   border: 5px solid;
   border-color: #242424 transparent transparent transparent;    

} .ribbon h3::before {left: 0;} .ribbon h3::after {right: 0;}

.row {

   display: flex;

}

.column {

   flex: 20%;
   padding: 5px;

}

   </style>

</head>


<body>

<section class="super-body">



      <section style="width:100%; padding-top: 10px; padding-bottom: 45px">


<section style="width:100%; padding-top: 200px; padding-bottom: 45px">

               <img style="width: 70%; margin-top: 50px" src="https://www.gcpedia.gc.ca/gcwiki/images/4/4a/TM_larger.jpg" alt="Welcome">

Welcome to the
Community of Federal Regulators

The Community of Federal Regulators (CFR) is a partnership of federal departments and agencies designed to facilitate collaboration and professional development of employees involved in the regulatory process across the federal government.

<a href="https://www.csps-efpc.gc.ca/About_us/Business_lines/digitalacademy-eng.aspx" class="btn btn-primary">Learn more about the CFR.</a>

</section>


<section id="ApplyDrop" style="padding-bottom: 35px;" class="section-2">

<section style="width:100%; padding-top: 20px; padding-bottom: 20px">
 

Our Events:

     </section>


<section style="width:100%; padding-top: 20px; padding-bottom: 20px">

To complete your application, you will need the following:


     </section>

</section> </section>

     <section style="width:100%; padding-top: 10px; padding-bottom: 20px">
 

Our Events

The CFR hosts a variety of events to facilitate collaboration, strengthen the knowledge and competencies of regulatory professionals, and provide opportunities for innovation in the regulatory field.

↪ <a href="https://www.gcpedia.gc.ca/gcwiki/images/1/15/Video_Pitch.pdf" class="light-link">CFR Regulatory Conference</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link"> Regulatory Speaker Series</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Regulatory Law Enforcement Symposium</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Let's Talk Events</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Regulatory Excellence Awards</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Regulatory Innovation Forums</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Nymark Lecture Series</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Specialty Workshops</a>

             <img style="width: 80%; padding-top: 60px;" src="https://www.gcpedia.gc.ca/gcwiki/images/a/a7/Panel_61.jpg" alt="candidate">
     </section>
  <section style="width:100%; padding-top: 10px; padding-bottom: 20px">
               <img style="width: 80%; margin-top: 100px" src="https://www.gcpedia.gc.ca/gcwiki/images/f/f4/CFR_CoP_image.jpg" alt="Commitment">

Collaboration

CFR's Communities of Practice and Working Groups are forums to share knowledge, discuss challenges and develop constructive approaches to addressing common challenges among employees with similar responsibilities.

↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Risk-Based Regulatory Delivery COP</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Compliance & Enforcement COP</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Cost-Benefit Analysis COP</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Administrative Monetary Penalty System WG</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Service Fees WG</a>
↪ <a href="http://www.gcpedia.gc.ca/gcwiki/images/1/1b/DA_Premium_Technical_Requirements.pdf" class="light-link">Major Case Management WG</a>


<a href="https://www.gcpedia.gc.ca/gcwiki/images/f/f4/CFR_CoP_image.jpg" class="btn btn-primary">See past engagements.</a>

     </section>
<section style="width:100%; padding-top: 30px; padding-bottom: 20px", class="section-2">
       <img style="width: 80%; margin: 0 auto !important;" src="https://www.gcpedia.gc.ca/gcwiki/images/6/6b/NEW_TIMELINE.png">

</section>

     <section style="width:100%; padding-top: 10px; padding-bottom: 20px">
 

Talent Management

As part of the application, you will be asked to propose a real business problem that is currently touching your team, department, or even government writ large.

This should be a problem that personally affects you in your day-to-day job and that you believe can be better solved or tackled by learning skills in one or more of the streams in Premium (data, design, DevOps, AI/ML, development).

Note: Participants will be working on a real problem as part of their experience, but we cannot guarantee that you will be working on your specific problem during the practicum.

<a href="http://www.gcpedia.gc.ca/gcwiki/images/7/7d/What_is_a_good_business_problem.pdf" class="btn btn-primary">More on CFR's Talent Management Initiatives</a>

             <img style="width: 65%" src="https://www.gcpedia.gc.ca/gcwiki/images/0/07/Collaboration_CFR.jpg" alt="brainstorm">
     </section>
  <section style="width:100%; padding-top: 20px; padding-bottom: 80px">
               <img style="width: 80%; margin-top: 40px" src="https://www.gcpedia.gc.ca/gcwiki/images/c/c2/AI_booth_photo.jpg" alt="management">


Experimentation

The CFR has identified experimentation as one of its key priority areas. The goal is to position the CFR as an enabler – bringing the community together to explore, pioneer and test new approaches and delivery methods with potential application for creating efficiencies across the regulatory lifecycle.

Recent initiatives include leveraging AI to tackle regulatory challenges, a CFIA-CFR blockchain experiment, regulatory sandboxes, and rules as code.

<a href="https://www.gcpedia.gc.ca/gcwiki/images/7/76/CSPSDA_Premium_Letter_of_Support.docx" class="btn btn-primary">Learn more about our work in this area.</a>

 </section>
     

<section id="ContactDrop" style="padding: 70px 0px; background-color: #00467F; ;width: 100%">

We want to hear from you!

Our goal at the CFR is to enhance collaboration, dialogue, networking and innovation in the regulatory field.
Do you have a suggestion for a CFR event?
Is there a topic you would like to see covered in our learning activities?



         <a href="mailto:csps.digitalacademy-academiedunumerique.efpc@canada.ca?subject=Question on CSPS Digital Academy Premium" class="cta-btn">
             Contact Us
         </a>

</section>


 <section style="padding: 20px 0px">

Brought to you by the Community of Federal Regulators

       </section>
   </section>

</body>

</html>