Email link in edge animation

Hi!
I have very little experience with the coding in edge animate outside the basic API provided by adobe.
I would like to add an email link to a button in edge animate.
window.open("http://www.adobe.com", "_self");
I can add a basic mailto: script that opens your email application and inputs the email defined.
But, I need to know how add a subject and body content. Specifially a link to a web site in the body copy of the email.
Can someone advise me on the code for this to be done?
Cheers

Instead of window.open("xxxxx"); method, try the window.location = "xxxxx"; on your click event handler.
window.open will force a blank browser window to open, which you do not want to occur.
/// Start Copy Here; paste into click event handler //
window.location = "mailto:[email protected]?  \
subject=Subject Line Here&         \
body=Add body context here with a link http://www.adobe.com to a website&  \
cc=[email protected]&  \
bcc=[email protected]";
// End Copy Here //
Also pay attention to the above notation.
In sum its a mailto URI querystring (?) with specific parmeters equating (=) to a string;
Initiate a new parameter using the &;
Use the backward slash \ to designate when to wrap the string to a new line (for visual effect only and easy wrapping of long text strings within the Code Editor);
I included the cc and bcc (carbon copy/ blind carbon copy) parameters, if not needed see below sample;
Replace the above string results with your own criteria;
/// Start Copy Here //
window.location = "mailto:[email protected]?  \
subject=Subject Line Here&         \
body=Add body context here with a link http://www.adobe.com to a website";
// End Copy Here //
hth
Darrell

Similar Messages

  • Link Edge animation to HTML page?

    Is there a way to link my Edge animation to an Index HTML page in the same folder as the Edge.HTML? I linked a webpage with the OpenURL trigger and it worked. But I would like to link it to the index page within the same folder so that I can test it before uploading it to the internet.
    The trigger link that worked is:
    window.open("http://www.mywebsite.com", "_self");
    But can I use something like:
    window.open("index.com", "_self");
    Thanks,
    Susan

    Susan-
    You don't need the sitename - just use this (assuming you are calling it from the same directory as you said):
    window.open("index.html", "_self");
    Else, you should be able to use this if it one folder deep:
    window.open("../index.html", "_self");
    James

  • How to create a link with an anchor outside of the edge animation ?

    Hello
    I want to know if it's possible to create a link with an anchor that is placed outside of the edge animation , on the same page ?
    Tanks

    Is it... very likely..., javascript is javascript...Has anyone yet? Maybe i haven't looked.
    You only need 3 files... not including "Edge Includes" and "External Art Assets"
    NAME_edge.js
    NAME_edgeActions.js
    NAME_edgePreload.js
    The advantage of Edge being that u have the "power" to do whatever you like, but as with new things it takes awhile to figure it all out.

  • Mutiple edge animations on an index page

    Hey there community
    It feels like I have searched google dry, and I can't find the answers to my problems there, so I'm hoping this will help.
    I'm creating a site in Dreamweaver with a lot of interactivity, mostly by edge animate. I have many animations on the index page of the site, and some fewer on other pages.
    The problem is, every single edge animation is generating an edge_include folder for the files to work, when i insert the oam file.
    The first loading time for a user is immense, around 10 sec.... Is there any solutions to remove those similar server request and make them all request from 1 folder with the edge.min and jquery.min file?
    Mikkel Madsen

    Many thx!!! I Will try the folder option. Do I have to open the edgepreload in a text edit program to change some urls? Or Can i just put every script in an edge folder with an image and include folder in that ?:):)
    Mikkel Madsen.
    Sendt fra min iPhone
    Den 28/10/2013 kl. 10.20 skrev gcgCui <[email protected]>:
    Re: Mutiple edge animations on an index page
    created by gcgCui in Edge Animate CC - View the full discussion
    Hi, hope I can help you. I´m finishing an interactive book with games and I use 3 project with different scenes on them. So you can try something like my trick. You can use "symbols" to make all your different animations on a single "Edge project" or if you wanna use your actual projects put all your images on a single "image folder" and use one  "edge includes folder".
    I have 3 projects on the root folder but just one image folder and one edge includes, each project have their own preload and the time loading is fast on web an mobile device.
    Gabriel Cerra.
    Please note that the Adobe Forums do not accept email attachments. If you want to embed a screen image in your message please visit the thread in the forum to embed the image at http://forums.adobe.com/message/5793206#5793206
    Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: http://forums.adobe.com/message/5793206#5793206
    To unsubscribe from this thread, please visit the message page at http://forums.adobe.com/message/5793206#5793206. In the Actions box on the right, click the Stop Email Notifications link.
    Start a new discussion in Edge Animate CC at Adobe Community
    For more information about maintaining your forum email notifications please go to http://forums.adobe.com/message/2936746#2936746.

  • Edge Animation not woking on remote server?

    Hi I'm new to Edge, and am having problems getting my animated file to work on a remote server its a simle animation (moving background image).
    It works ok on my local computer in Dreamweaver and Preview in Browser(s) ok? I thought it may be something to do with the .js files linking from the html file? but ime not clever enough to work that out??
    Any help / pointers would be much appreciated..
    Lee.
    This is where the files are located..
    http://bondagetips.co.uk/stew/

    Thanks for your response - much appreciated. I've done that and it's done something! although its still not finding the 3 images?
    Lee.
    Re: Edge Animation not woking on remote server?
    created by heathrowe in Edge Animate CC - View the full discussion
    You did not upload the sub folder(s).
    There should be a required subfolder called /edge_includes with a few files in it.
    If your project uses images then there should also be another sub folder called /images.
    As it stands now, it loos like you copied the images and the edge.1.5.0.min.js files out of their respective folders and placed them into the root.
    Darrell
    Please note that the Adobe Forums do not accept email attachments. If you want to embed a screen image in your message please visit the thread in the forum to embed the image at http://forums.adobe.com/message/5709041#5709041
    Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: http://forums.adobe.com/message/5709041#5709041
    To unsubscribe from this thread, please visit the message page at http://forums.adobe.com/message/5709041#5709041. In the Actions box on the right, click the Stop Email Notifications link.
    Start a new discussion in Edge Animate CC by email or at Adobe Community
    For more information about maintaining your forum email notifications please go to http://forums.adobe.com/message/2936746#2936746.

  • Convert/save/export Adobe Edge animation as an animated gif?

    Does anyone know a way to convert/save/export an Adobe Edge animation file into an animated gif. I've created a simple logo animation and the client now wants it as a animated gif to add to there email signature. Is this possible or an I going to have to recreate it in another programme

    Hi resdesign.
    Thanks for your comment, this helped. Would be nice if there was a more direct way though, but this has done exactly what I need. Thanks again

  • A link from my animation is locked inside the dimensions of the original animation.  the link should

    Thank you sincerly for any help in advance.
    A link from my animation is locked inside the dimensions of the original animation.  the link should go to new url but opens in i frame instead, scroll-able, within the dimensions of the beginning edge animation from which it linked.
    Here is the landing page edge asset and the link is the center pulsing sand grain:
    http://kkz321.businesscatalyst.com/index.html
    Here is the actions javascript file from the animation.  I'm not sure if it's the source. 
    "landing_hourglass_3_edgeActions.js"
    (function($,Edge,compId){var Composition=Edge.Composition,Symbol=Edge.Symbol;
    //Edge symbol: 'stage'
    (function(symbolName){Symbol.bindElementAction(compId,symbolName,"${_landing_sand_grain}", "click",function(sym,e){window.open("http://kkz321.businesscatalyst.com/welcome.html","_self");});
    //Edge binding end
    Symbol.bindElementAction(compId,symbolName,"document","compositionReady",function(sym,e){$ ("#Stage").css("margin","auto")});
    //Edge binding end
    })("stage");
    //Edge symbol end:'stage'
    })(jQuery,AdobeEdge,"EDGE-landing_hourglass_3");
    Here is snippet of CSS from main css page:
    #EdgeIDlanding_hourglass_3 {
              margin-right: auto;
              margin-bottom: auto;
              margin-top: 5%;
    Here is snippet of HTML from main START INDEX page:
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Kinetik Artz  Work By Michael Schmidt</title>
    <link href="/Stylesheets/main.css" rel="stylesheet" type="text/css">
    </head>
    <body>
    <object id="EdgeIDlanding_hourglass_3" type="text/html" width="222" height="454" data-dw-widget="Edge" data="edgeanimate_assets/landing_hourglass_3/Assets/landing_hourglass_3.html">
    </object>
    </body>
    </html>
    Thank you very much for any help

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Kinetik Artz  Work By Michael Schmidt</title>
    <link href="/Stylesheets/main.css" rel="stylesheet" type="text/css">
    </head>
    <body>
    <object id="EdgeIDlanding_hourglass_3" type="text/html" width="222" height="454" data-dw-widget="Edge" data="edgeanimate_assets/landing_hourglass_3/Assets/landing_hourglass _3.html">
    </object>
    </body>
    </html>
    remove the width and height out of the html object ( width="222" height="454" )
    that would probably solve it
    or change it to the pages width and height

  • My edge animation is not working on Google chrome

    Hii..
    My edge animation composition is working absolutely fine on Mozila on google chrome it starts well but all of sudden my background image disappear and animation looks ugly without background image..
    My animation link is
    Untitled

    Hi Newton ,
    Can you try out one thing. We suspect this issue is caused because of the anti-scaling which we apply.
    Just try to disable anti scaling.Follow the steps below : 
    This scale factor can be changed from:
    1. Close Animate
    2. Open the preference folder:
    a. Windows: C:\Users\{username}\AppData\Roaming\Adobe\Edge Animate\4.0.0\
    b. Mac: /Users/{username}/Library/Prefrences/Adobe/EdgeAnimate/4.0.0/
    3. Open the AppPrefs.xml file in a text editor.
    4. Search for the Current line in AppPrefs.xml:
    <key>SvgAntiScaleFactor</key>
    <float>10</float>
    Update this to:
    <key>SvgAntiScaleFactor</key>
    <float>1</float>
    5. Launch Animate.
    However note: This setting will work only for new animate content that you create after this setting is applied - i.e it will work only for newly pasted SVG’s in a new composition.
    Exiting Animate compositions opened after applying the setting(Step 5 above) will still show the same problem. You will need to delete the SVG and copy-paste again.
    Do let us know if this solution helps in your case too.
    Thanks and Regards,
    Sudeshna Sarkar

  • Email link in Dreamweaver CS5

    I need an email link ( I'm using Dreamweaver CS5) when I use the
    Email Link on the right insert panel in Dreamweaver, it changes to the
    same as my navigational links. I need the email link to look different
    than my navigational links. I have a jpeg image, which includes a
    background and text, the text being my email address. At this point I
    will just type my email address. I will need coding and/or java script
    codes to convert the information to an email address link.
    What is Property Inspector does this have anything to do with
    email links, if so where is it and how do I use it?
    Need answers as soon as possible.
    Thanks

    SnakEyezO2
    The email info was perfect.
    One more question regarding Dreamweaver CS5?
    I have created a table and in the table is text and PayPal buttons. The table is
    in an AP Div.
    Under the table, I have another AP Div and in it is animation.
    Another AP Div, in it credit card logos.
    The problem:     Under the table is too much space and then the AP Div.
    How do I narrow the space between the table and the div tag under the table?
    It looks good in  "Design View" in Dreamweaver, but on the internet it looks
    terrible - the large space under the table and then the AP Div.
    Also, when I close Dreamweaver and reopen, the AP Div tags are overlapping in
    the table, each time I open the page
    I have to move the Divs out of the table.
    The animation is not the problem, because I deleted the animation and there's
    still a large gap.
    WHAT the heck is wrong?
    I've worked on this problem for hours and it's still looks awful.
    Can you S-T-O-P the Table/Div Nightmares!
    Thanks, Judy Long  

  • Web links, email links, button links

    I have several different links through out my site. I want them to look differently but it keeps inheriting the styles of my button link. How can I make them appear different. For instance, I don't want my email link to have a background behind it when you hoover. I just want it to change colors. What am I doing wrong. Can anyone help?
    HTML
    <p>According to the American Society of Civil Engineers (ASCE) the nations bridges are getting a little better – last graded as a “C” (2009) in 2013 they are graded as a “C+”. The ASCE not only has the National Report Card on infrastructure available <a href="http://www.infrastructurereportcard.org/" title="ASCE National Report Card" target="new" class="weblink">(see the 2013 report Card here),</a> they have State and Local reports available as well.  <a href="http://www.asce.org/Infrastructure/Report-Card/State-and-Local-Report-Cards/" title="ASCE’s State and Local Report Cards." target="new" class="weblink">ASCE’s State and Local Report Cards.</a></p>
    <p>Read the entire Case Study by clicking on the RESOURCES tab and selecting Pavemend Case Studies. Send us a photo and a brief report of your Pavemend repair and get a Pavemend Cap by “Mossy Oak.”  <strong><a href="mailto:[email protected]" class="emaillink">[email protected]</a></strong>
    </p>
    CSS
    a.weblink:link, a.weblink:visited, a.weblink:active {
        /* This will handle all the states of the link other than when it is hovered over */
         /* put your style rules in this area */
        color: #0033CC; /* or any other color */
        text-decoration: underline;
    a.weblink:hover {
         /* This makes the link Text Hover Color controlable */
         color:#999; /* or whatever color you want that is different from the color that you set for the other statuses */
    a.emaillink:link, a.emaillink:visited, a.emaillink:active {
        /* This will handle all the states of the link other than when it is hovered over */
         /* put your style rules in this area */
        color: #0033CC; /* or any other color */
        text-decoration: underline;
        background-color: none;
    a.emaillink:hover {
        /* This makes the link Text Hover Color controlable */
        color: #999; /* or whatever color you want that is different from the color that you set for the other statuses */
        background-color: none;
    a:link {
        color: #FFFFFF;
        text-decoration: none;
        font-size: 100%;
        padding: 5px;
    a:visited {
        color: #FFFFFF;
        text-decoration: underline;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
        text-decoration: none;
        background-color: #03C;
        color: #FFF;
        height: 120%;
        alignment-baseline: text-after-edge;
        /* [disabled]font-size: smaller; */
        text-align: left;
        background-size: 0%;

    Not sure what I'm doing wrong. Still not getting it right. Now my footer is wrong also:
    CSS
    @charset "UTF-8";
    /* BEGIN HORIZONTAL DROP-MENU */
    .clear-fix:before,
    .clear-fix:after {
        content: " ";
        display: table;
    .clear-fix:after {
        clear: both;
    .clear-fix {
        *zoom: 1;
    .sidebarleft img.MgTp {
        margin-top: 185px;
    #menu {
        clear: none;
        position: static;
        width: 100%;
        padding-top: px;
        padding-right: px;
        padding-left: px;
        padding-bottom: px;
        background-image: url(_images/topnavpanel.png);
        color: #FFFFFF;
        margin-bottom: 0;
        margin-left: 0;
        margin-right: 0;
        margin-top: px;
        background-repeat: no-repeat;
        float: none;
        text-align: center;
    #menu ul {
        margin: 0;
        padding: 0;
        text-align: left;
    #menu li {
        list-style: none;
        float: left;
        text-align: center;
        font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
        color: #000000;
    /**top level menu**/
    #menu li a {
        display: inline-block;
        text-decoration: none;
        /* adjust width as needed or use auto */
        width: 13em;
        padding: 8px;
        font-weight: bold;
        line-height: 12px;
        color: #000;
        border-top-style: none;
        font-size: 90%;
        margin-bottom: 0;
        margin-left: 2%;
        margin-right: 2%;
        margin-top: 0;
        border-bottom-style: none;
        text-align: center;
    /**top menu style on mouse over**/
    #menu li:hover > a {
        color: #FFF;
        width: 13em;
        text-align: center;
    /**sub-menu**/
    #menu li ul {
        display: none;
        text-align: center;
        padding: 0;
        margin-bottom: 0;
        margin-left: 40px;
        margin-right: 0;
        margin-top: 0;
        border-bottom-style: none;
    /**sub-menu, help for older IE**/
    #menu li:hover ul, #menu li.hover ul {
        display: block;
        position: absolute;
        z-index: 1000;
        padding: 0;
        text-align: left;
    #menu li:hover li, #menu li.hover li {
        float: none;
        background-color: #E1D5BB;
        text-align: left;
    /**drop-menu style**/
    #menu li:hover li a, nav li.hover li a {
        width: 14em; /* adjust width as needed or use auto */
        margin-top: 0;
    /**drop-menu style on mouse over**/
    #menu li li a:hover {
        color: #FFF;
        background-color: #03C;
        position: relative;
        text-align: left;
    /* Clear floated elements at the end*/
    #menu:after {
        visibility: hidden;
        display: block;
        font-size: 0;
        content: " ";
        clear: both;
        height: 0;
    /**END HORIZONTAL DROP-MENUS STYLES**/
    #pavemendlogo {
        background-image: url(_images/PAVEMEND_LOGO_WHITE.png);
        background-repeat: no-repeat;
        height: 78px;
        width: 196px;
        margin-left: 23px;
        margin-top: -130px;
    /**END HORIZONTAL DROP-MENUS STYLES**/
    #pavemendlogoresourcepage {
        background-image: url(_images/PAVEMEND_LOGO_WHITE.png);
        background-repeat: no-repeat;
        height: 78px;
        width: 196px;
        margin-left: 23px;
        margin-top: -160px;
    /**END HORIZONTAL DROP-MENUS STYLES**/
    #slqlogo {
        background-image: url(_images/PMND_SLQ_logo_White.png);
        background-repeat: no-repeat;
        height: 92px;
        width: 225px;
        margin-left: 23px;
        margin-top: -170px;
        margin-bottom: 35px;
    #fifteenlogo {
        background-image: url(_images/PMND15Whitesingle.png);
        background-repeat: no-repeat;
        height: 98px;
        width: 225px;
        margin-left: 23px;
        margin-top: -170px;
        margin-bottom: 29px;
        z-index: 1000;
    #trlogo {
        background-image: url(_images/PMND_TRlogoWhite.png);
        background-repeat: no-repeat;
        height: 115px;
        width: 225px;
        margin-left: 23px;
        margin-top: -185px;
        margin-bottom: 26px;
        z-index: 1000;
    #vrlogo {
        background-image: url(_images/PMND_VRlogoWhite.png);
        background-repeat: no-repeat;
        height: 134px;
        width: 225px;
        margin-left: 23px;
        margin-top: -195px;
        margin-bottom: 18px;
        z-index: 1000;
    #dotlinelogo {
        background-image: url(_images/Dotline_White-Red.png);
        background-repeat: no-repeat;
        height: 91px;
        width: 225px;
        margin-left: 23px;
        margin-top: -170px;
        margin-bottom: 35px;
    #sllogo {
        background-image: url(_images/SLwhitelogo.png);
        background-repeat: no-repeat;
        height: 92px;
        width: 225px;
        margin-left: 23px;
        margin-top: -170px;
        margin-bottom: 35px;
    #ialogo {
        background-image: url(_images/InstantAsphalttopLogo.png);
        background-repeat: no-repeat;
        height: 102px;
        width: 225px;
        margin-left: 23px;
        margin-top: -170px;
        margin-bottom: 25px;
    #kemroklogo {
        background-image: url(_images/KEMROK_LOGOWhiteType.png);
        background-repeat: no-repeat;
        height: 52px;
        width: 225px;
        margin-left: 23px;
        margin-top: -150px;
        margin-bottom: 53px;
    #kemrokvrlogo {
        background-image: url(_images/KEMROK_LOGO_VR.png);
        background-repeat: no-repeat;
        height: 46px;
        width: 230px;
        margin-left: 23px;
        margin-top: -150px;
        margin-bottom: 59px;
    #fireroklogo {
        background-image: url(_images/Firerok_logo_White.png);
        background-repeat: no-repeat;
        height: 81px;
        width: 225px;
        margin-left: 23px;
        margin-top: -155px;
        margin-bottom: 30px;
    #awlogo {
        background-image: url(_images/PMNDAWlogowhite1.png);
        background-repeat: no-repeat;
        height: 70px;
        width: 225px;
        margin-left: 23px;
        margin-top: -155px;
        margin-bottom: 40px;
    #aslogo {
        background-image: url(_images/PMNDASlogowhite1.png);
        background-repeat: no-repeat;
        height: 64px;
        width: 225px;
        margin-left: 23px;
        margin-top: -155px;
        margin-bottom: 47px;
    #prochoicetype {
        background-image: url(_images/pro_choice_concrete_type.png);
        background-repeat: no-repeat;
        height: 27px;
        width: 550px;
        margin-left: 220px;
        margin-top: -40px;
        bottom: px;
        margin-bottom: 66px;
    #resourcestype {
        background-image: url(_images/ResourcesType.png);
        background-repeat: no-repeat;
        height: 25px;
        width: 148px;
        margin-left: 220px;
        margin-top: -60px;
        bottom: px;
        margin-bottom: 73px;
    #Contacttype {
        background-image: url(_images/PurchaseType.png);
        background-repeat: no-repeat;
        height: 25px;
        width: 151px;
        margin-left: 220px;
        margin-top: -60px;
        bottom: px;
        margin-bottom: 73px;
    #Contesttype {
        background-image: url(_images/ContestType.png);
        background-repeat: no-repeat;
        height: 54px;
        width: 478px;
        margin-left: 220px;
        margin-top: -75px;
        bottom: px;
        margin-bottom: 59px;
    #sustainabilitytype {
        background-image: url(_images/SustainabilityType.png);
        background-repeat: no-repeat;
        height: 25px;
        width: 179px;
        margin-left: 220px;
        margin-top: -60px;
        bottom: px;
        margin-bottom: 73px;
    #techsupporttype {
        background-image: url(_images/TechSupportType.png);
        background-repeat: no-repeat;
        height: 25px;
        width: 761px;
        margin-left: 220px;
        margin-top: -60px;
        bottom: px;
        margin-bottom: 73px;
    body {
        background-color: #666;
        color: #000;
        text-align: center;
        background-image: url(_images/roadblurred.png);
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: center;
        padding-top: 60px;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 100%;
        line-height: 1.4;
    .formtext {
        font-size: 100%;
        text-align: left;
    .bodyfootnote {
        font-size: 70%;
        margin-left: 20px;
        font-family: Verdana, Arial, Helvetica, sans-serif;
    .red {
        font-size: 70%;
        color: #F00;
    /* ~~ Element/tag selectors ~~ */
    ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
        padding: 0;
        margin: 0;
        text-transform: capitalize;
        text-decoration: none;
        list-style: none;
        text-align: left;
    h1, h2, h3, h4, h5, h6, p {
        /* [disabled]margin-top: 0; */     /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
        padding-right: 15px;
        padding-left: 23px;
        line-height: 25px;
    h4 {
        padding-left: 0px;
        color: #F40633;
        line-height: 0px;
        font-size: 100%;
    h5 {
        padding-left: 23px;
        color: #F40633;
        line-height: 0px;
        font-size: 120%;
    a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
        border: none;
        margin-left: 0px;
        position: ;
        top: 155px;
        -webkit-box-shadow: 0px 0px 0px 0px;
        box-shadow: 0px 0px 0px 0px;
        left: 9px;
    /* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
    a:link {
        color: #FFFFFF;
        text-decoration: none;
        font-size: 100%;
        padding: 5px;
    a:visited {
        color: #FFFFFF;
        text-decoration: underline;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
        text-decoration: none;
        background-color: #03C;
        color: #FFF;
        height: 120%;
        alignment-baseline: text-after-edge;
        /* [disabled]font-size: smaller; */
        text-align: left;
        background-size: 0%;
    a.weblink:link, a.weblink:visited, a.weblink:active {
        /* This will handle all the states of the link other than when it is hovered over */
         /* put your style rules in this area */
            background-color: none;
            color: #0033CC; /* or any other color */
        text-decoration: underline;
    a.weblink:hover {
         /* This makes the link Text Hover Color controlable */
            background-color: none;
         color:#999; /* or whatever color you want that is different from the color that you set for the other statuses */
    a.emaillink:link, a.emaillink:visited, a.emaillink:active {
        /* This will handle all the states of the link other than when it is hovered over */
         /* put your style rules in this area */
        background-color: none;
        color: #0033CC; /* or any other color */
        text-decoration: underline;
    a.emaillink:hover {
        /* This makes the link Text Hover Color controlable */
        background-color: none;
        color: #999; /* or whatever color you want that is different from the color that you set for the other statuses */
    /* ~~this fixed width container surrounds the other divs~~ */
    .container {
        width: 960px;
        background-color: #FFF; /* the auto value on the sides, coupled with the width, centers the layout */
        background-image: url(_images/Bridge4WebScreened.png);
        background-repeat: no-repeat;
        margin-bottom: 0;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0;
        text-align: left;
        position: static;
    .containerTS {
        width: 960px;
        background-color: #FFF;
        margin: 0 0px; /* the auto value on the sides, coupled with the width, centers the layout */
        background-image: url(_images/US_Map.png);
        background-repeat: no-repeat;
        text-align: left;
    /* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */
    .header {
        background-color: #000;
        background-image: url(_images/BannerBlured960.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
        background-size: contain;
    .headerSL {
        background-color: #000;
        background-image: url(_images/PMND_SL_Header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerPurchase {
        background-color: #000;
        background-image: url(_images/contact_us_pavemend_header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerSLQ {
        background-color: #000;
        background-image: url(_images/PMND_SLQ_Header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerDOTline {
        background-color: #000;
        background-image: url(_images/DOTLINEHeader.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .header15 {
        background-color: #000;
        background-image: url(_images/PMND15Header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerTR {
        background-color: #000;
        background-image: url(_images/PMND_TRHeader.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerAW {
        background-color: #000;
        background-image: url(_images/anti_wear_pavemend_header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerAS {
        background-color: #000;
        background-image: url(_images/anti_scale_pavemend_header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerVR {
        background-color: #000;
        background-image: url(_images/PMND_VRHeader.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerIA {
        background-color: #000;
        background-image: url(_images/Instant_asphalt_packaged_Header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerKemrok {
        background-color: #000;
        background-image: url(_images/KEMROKpackagedHeader.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerKemrokVR {
        background-color: #000;
        background-image: url(_images/KEMROK_VRpackagedHeader.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerFirerok {
        background-color: #000;
        background-image: url(_images/FIREROKpackagedHeader.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerAntiWear {
        background-color: #000;
        background-image: url(_images/anti_wear_pavemend_header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerTechSupport {
        background-color: #000;
        background-image: url(_images/FEBlurred.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerResources {
        background-color: #000;
        background-image: url(_images/ResourceBanner.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerContact {
        background-color: #000;
        background-image: url(_images/contact_us_pavemend_header.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .headerSustainability {
        background-color: #000;
        background-image: url(_images/Sustainability_topheader.png);
        height: 229px;
        background-repeat: no-repeat;
        width: 960px;
    .header h1 {
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 20pt;
        font-style: normal;
        font-weight: bolder;
        color: #FFF;
        padding-top: 150px;
        padding-left: 30px;
    /* ~~ These are the columns for the layout. ~~
    1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
    2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.
    3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.
    4) If you prefer your nav on the left instead of the right, simply float these columns the opposite direction (all left instead of all right) and they'll render in reverse order. There's no need to move the divs around in the HTML source.
    .sidebar1 {
        float: right;
        width: 180px;
        margin-left: 0px;
        margin-right: 30px;
        clear: none;
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 100%;
        font-style: italic;
        background-image: url(_images/Testimonialb.gif);
        background-repeat: no-repeat;
        height: 456px;
        text-decoration: none;
        z-index: 1000;
    .sidebarPurchase {
        float: right;
        width: 210px;
        margin-left: 0px;
        margin-right: 0px;
        clear: none;
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 100%;
        font-style: italic;
        background-image: url(_images/purchaseSB.png);
        background-repeat: no-repeat;
        height: 460px;
        margin-top: 0px;
        text-decoration: none;
        background-color: #217CC0;
        background-position: 10px 10px;
    .sidebarPurchasePhoto {
        width: 190px;
        margin-left: 10px;
        margin-right: 20px;
        clear: none;
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 100%;
        font-style: italic;
        background-image: url(_images/purchaseSB.png);
        background-repeat: no-repeat;
        height: 127px;
        margin-top: 320px;
        text-decoration: none;
        /* [disabled]background-color: #217CC0; */
        background-position: 10px 10px;
        text-align: center;
    .ipadsidebar {
        float: right;
        width: 200px;
        margin-left: 0px;
        margin-right: -20px;
        clear: none;
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 100%;
        font-style: italic;
        background-image: url(_images/iPadSidebar.png);
        background-repeat: no-repeat;
        height: 460px;
        margin-top: 0px;
        text-decoration: none;
        background-position: 0px 0px;
        text-align: right;
    .sidebarleft {
        float: left;
        width: 200px;
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 85%;
        font-style: oblique;
        height: 180px;
        text-decoration: none;
        padding-top: 8px;
        padding-left: 10px;
        margin-right: 5px;
        margin-bottom: px;
        background-color: #217CC0;
        vertical-align: bottom;
        line-height: 120%;
        font-weight: bold;
        border-bottom-style: groove;
        border-bottom-width: 10px;
        margin-top: 0px;
        text-align: left;
    .sidebarleftnonav {
        float: left;
        width: 200px;
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 85%;
        font-style: oblique;
        height: 180px;
        text-decoration: none;
        padding-top: 8px;
        padding-left: 10px;
        margin-right: 5px;
        margin-bottom: px;
        /* [disabled]background-color: #217CC0; */
        vertical-align: bottom;
        line-height: 120%;
        font-weight: bold;
        border-bottom-style: none;
        border-bottom-width: 10px;
        margin-top: 0px;
        text-align: left;
    .sidebarleftresources {
        float: left;
        width: 200px;
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 83%;
        font-style: oblique;
        height: 490px;
        text-decoration: none;
        padding-top: 8px;
        padding-left: px;
        margin-right: 5px;
        margin-bottom: px;
        background-color: #217CC0;
        vertical-align: bottom;
        line-height: 120%;
        font-weight: bold;
        border-bottom-style: groove;
        border-bottom-width: 10px;
        margin-top: 0px;
        text-align: left;
    .sidebargreen {
        float: left;
        width: 195px;
        height: 410px;
        text-decoration: none;
        padding-top: 20px;
        margin-right: 5px;
        background-color: #8CC63F;
        border-bottom-style: groove;
        border-bottom-width: 10px;
        margin-top: -4px;
        padding-left: 10px;
    .nav2 {
        font-family: bebas-neue;
        font-style: normal;
        font-weight: 400;
        color: #FFF;
        text-align: left;
    .content {
        width: 730px;
        float: left;
        background-image: none;
        background-repeat: no-repeat;
        background-position: left;
        font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
        padding: 10px 0;
        text-align: left;
        font-size: 100%;
        margin-left: px;
    .contactform {
        width: 680px;
        background-image: none;
        background-repeat: no-repeat;
        background-position: left;
        font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
        padding: 10px 0;
        text-align: left;
        font-size: 90%;
        margin-left: 23px;
        z-index: 1000;
    .contestcontactform {
        width: 680px;
        background-image: none;
        background-repeat: no-repeat;
        background-position: left;
        font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
        padding-top: 0px;
        padding-right: 0;
        padding-left: 0;
        padding-bottom: 10px;
        text-align: left;
        font-size: 90%;
        margin-left: 23px;
        z-index: 1000;
        margin-top: 100px;
    /* ~~ This grouped selector gives the lists in the .content area space ~~ */
    .content ul, .content ol {
        padding: 0 15px 15px 40px;
        text-decoration: none;
    /* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
    ul.nav {
        list-style: none; /* this removes the list marker */
        border-top: 1px solid #666; /* this creates the top border for the links - all others are placed using a bottom border on the LI */
        margin-bottom: 15px; /* this creates the space between the navigation on the content below */
        text-decoration: none;
    ul.nav li {
        border-bottom: 1px solid #666;
        text-align: left;
    ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
        padding: 5px 5px 5px 15px;
        display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
        width: 160px;  /*this width makes the entire button clickable for IE6. If you don't need to support IE6, it can be removed. Calculate the proper width by subtracting the padding on this link from the width of your sidebar container. */
        text-decoration: none;
        background-color: #C6D580;
        text-align: left;
    ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
        background-color: #DFEBF3;
        color: #FFF;
        text-decoration: none;
        text-align: left;
    /* ~~ The footer ~~ */
    .footer {
        padding: 10px 0;
        position: relative;/* this gives IE6 hasLayout to properly clear */
        clear: both;
        background-color: #000000;
        height: 150px;
    /* ~~ miscellaneous float/clear classes ~~ */
    .fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
        float: left;
        margin-left: 760px;
    .fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
        float: left;
        margin-right: 8px;
        margin-left: 23px;
    .clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    .productlogos {
        margin-left: 23px;
        margin-top: 20px;
        float: none;
    .Bold {
        font-weight: bold;
    .left {
        text-align: left;
    .inherent {
        font-style: inherit;
    sup {
        position: relative;
        top: -1ex;
        vertical-align:baseline;
        font-size: 75%;
    .footer p {
        font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 80%;
        color: #FFF;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-right: 30px;
    #wrapper {
         width:970px; /**adjust as needed**/
         margin:0 auto; /**centers page on screen**/              
    .fltrtpostcard {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
        float: left;
        margin-left: 720px;
        top: 0px;
        margin-top: -200px;
        margin-bottom: 20px;
        margin-right: 0px;
        height: auto;
    .flt_rgt {
        float: right;
        margin-top: 15px;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
    .flt_pftrgt {
        float: right;
        margin-top: -50px;
        margin-right: 0px;
        background-image: ;
        background-repeat: no-repeat;
    .flt_rgtbtmlogo {
        float: right;
        margin-top: 20px;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
    .flt_rgt2 {
        float: right;
        margin-top: px;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        top: -50px;
        right: -20px;
        padding-top: 0px;
        padding-right: 50px;
    .title {
        /* [disabled]margin-right: 30px; */
        margin-top: 0px;
        margin-left: 23px;
        background-image: ;
        background-repeat: no-repeat;
        /* [disabled]margin-left: 20px; */
        top: 30px;
        /* [disabled]margin-top: 30px; */
        left: 30px;
    .flt_products {
        float: right;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 500px;
        margin-top: -70px;
    .flt_productsb {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 500px;
        margin-top: -80px;
        visibility: inherit;
    .flt_productslq {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 350px;
        margin-top: -125px;
    .flt_producttr {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 375px;
        margin-top: -125px;
    .flt_productvr {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 475px;
        margin-top: -105px;
    .flt_productia {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 420px;
        margin-top: -125px;
    .flt_productkemrok {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 485px;
        margin-top: -180px;
    .flt_productkemrokvr {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 590px;
        margin-top: -170px;
    .flt_productfirerok {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 485px;
        margin-top: -170px;
    .flt_productaw {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 430px;
        margin-top: -170px;
    .flt_product15 {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 280px;
        margin-top: -125px;
    .flt_productdotline {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 280px;
        margin-top: -155px;
    .flt_productsl {
        float: left;
        margin-right: 30px;
        background-image: ;
        background-repeat: no-repeat;
        margin-left: 370px;
        margin-top: -170px;
    .container section nav {
        background-image: url(_images/topnavpanel.png);
        background-repeat: no-repeat;
        height: 30px;
        width: 960px;
        padding-top: 3px;
    nav ul {
        list-style: none; /* this creates the space between the navigation on the content below */
        font-size: 90%;
        border-top-width: 0px;
        border-top-style: solid;
        /* [disabled]border-top-color: #666; */
        position: absolute;
        line-height: 120%;
        text-align: left;
    nav ul li {
        text-decoration: none;
        color: #FFF;
    nav ul a:link , nav ul a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
        padding: 5px 5px 5px 15px;
        display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
        width: 160px;  /*this width makes the entire button clickable for IE6. If you don't need to support IE6, it can be removed. Calculate the proper width by subtracting the padding on this link from the width of your sidebar container. */
        text-decoration: none;
        text-align: left;
        color: #FFF;
    nav ul a:hover, nav ul a:active, nav ul a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
        color: #FFF;
        text-decoration: none;
    nav ul a:hover, nav ul a:active, nav ul a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
        color: #FFF;
        text-decoration: none;
        height: 120%;
        width: auto;
        margin-left:;
    .orange {
        color: #FAA634;
    .white {
        color: #FFFFFF;
    .red {
        color: #F00;
    .red1 {
        color: #F00;
    .toppanel {
        background-image: url(_images/topnavpanel.png);
        background-repeat: no-repeat;
        height: 30px;
        width: 960px;
    .white {
    .CeraTechLogo {
        background-image: url(_images/CTI_logo_white.png);
        background-repeat: no-repeat;
        width: 200px;
        height: 60px;
    #resources {
        background-image: url(_images/ResourcesType.png);
        background-repeat: no-repeat;
        height: 25px;
        width: 521px;
        margin-left: 200px;
        margin-top: -40px;
    .pavemendlogo {
        margin-left: 23px;
        margin-top: -130px;
        /* [disabled]margin-top: -40px; */
    .footer_img {
        margin-top: -20px;
        margin-left: -10px;
    .footer_img2 {
        margin-top: -40px;
        text-align: right;
        float: left;
        margin-right: 35px;
        margin-left: 200px;
    footer aside {
        width: 25%;
        float: left;
        text-align: left;
        min-height: 50px;
        margin-left: 23px;
        line-height: 120%;
        font-size: 80%;
        margin-top: 20px;
    .aside2 {
        float: none;
        margin-left: 100px;
        width: 29%;
        margin-top: 35px;
    .aside3 {
        float: none;
        margin-left: 400px;
        width: 29%;
        line-height: 120%;
        margin-top: -43px;
    .sidebarleft img {
        margin-left: -10px;
    .sidebarleft icon {
        margin-top: 0px;
        margin-left: -10px;
    .sidebarleft nav ul li a img {
        margin-top: 0px;
    .content section p a {
        color: #000000;
        font-size: 100%;
    /**sub-menu, help for older IE**/
    .content section p a:hover ul {
        display: block;
        position: ;
        z-index:1000;
        padding: 0;
    .content section p a:hover li, .content section p a li.hover li {
        float: none;
        background-color: #E1D5BB;
    /**drop-menu style**/
    .content section p a:hover li a, nav li.hover li a {
        width: 14em; /* adjust width as needed or use auto */
        margin-top: 0;
    /**drop-menu style on mouse over**/
    .content section p a:hover {
        position: relative;
        background-color: none;
        background-image: ;
        background-image: ;
        height: 120%;
        width: 120%;
        overflow-y: hidden;
        overflow-x: hidden;
        visibility: visible;
        font-weight: bold;
        color: rgba(255,255,255,1.00);
    /* Clear floated elements at the end*/
    .content section p a:after {
        visibility: hidden;
        display: block;
        font-size: 0;
        content: " ";
        clear: both;
        height: 0;
    #firstname {
        width: 330px;
        margin-top: 0px;
    #lastname {
         width:330px;
    #streetaddress {
         width:684px;
    #city {
         width:330px;
    #zip {
         width:260px;
    #company {
         width:684px;
    #phone {
         width:330px;
    #email {
         width:330px;
    #outsidetheus {
         width:330px;
    HTML
    <!doctype html>
    <html>
    <head>
    <meta charset="UTF-8">
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Permanent Concrete and Asphalt Repair Home Page</title>
    <meta name="description" content="CeraTech's Pavemend family of high performance concrete repair products have become the choice of professionals across the country for their rapid return to service, versatility, ease of use, and superior durability.">
    <!-- TemplateEndEditable -->
    <link href="../pavmend_styles.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    a:link {color:blue}
    a:visited {color:black}
    a:hover,
    a:active,
    a:focus {background:blue; color:white}
    .weblink a:link {color:blue}
    .weblink a:visited {color:yellow}
    .weblink a:hover,
    .weblink a:active,
    .weblink a:focus {background:none; color:red}
    .email a:link {color:green}
    .email a:visited {color:silver}
    .email a:hover,
    .email a:active,
    .email a:focus {background:none; color:navy}
    </style>
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    </head>
    <body>
    <div id="wrapper">
    <div class="container">
      <!-- TemplateBeginEditable name="Header" -->
      <div class="header"></div>
    <div id="pavemendlogo"></div>
          <div id="prochoicetype"></div>
      <!-- TemplateEndEditable --><!-- TemplateBeginEditable name="TopPanel" -->
      <nav>
        <ul id="menu">
          <li><a href="../pavemend_home_page.html">OUR PRODUCTS &#9660;</a>
            <ul>
              <li><a href="../slq_product_page.html">SLQ<sup>®</sup> - Very Rapid Repair Mortar</a></li>
              <li><a href="../sl_product_page.html">SL<sup>®</sup> - Semi-Leveling Rapid Repair Concrete</a></li>
              <li><a href="../dotline_product_page.html">DOTLine™ - Pre-Extended Rapid Repair Concrete</a></li>
              <li><a href="../15.0_product_page.html">Pavemend 15.0<sup>®</sup> - Self Leveling Rapid Repair Mortar</a></li>
              <li><a href="../TR_product_page.html">Pavemend TR<sup>®</sup> - Semi-Leveling Rapid Repair Mortar</a></li>
              <li><a href="../VR_product_page.html">Pavemend VR<sup>®</sup> - Vertical & Overhead Rapid Repair Mortar</a></li>
              <li><a href="../IA_product_page.html">Instant Asphalt™ - Permanent Asphalt Repair Material</a></li>
              <li><a href="../kemrok_product_page.html">KEMROK™ - Chemical Resistant Repair Concrete</a></li>
              <li><a href="../kemrokVR_product_page.html">KEMROK VR™ - Vertical & Overhead Chemical Resistant Repair Mortar</a></li>
              <li><a href="../firerok_product_page.html">FIREROK™ - High Temperature Repair Concrete</a></li>
              <li><a href="../antiwear_product_page.html">Anti-Wear™ - Reactive, Concrete Surface Hardener</a></li>
              <li><a href="../antiscale_product_page.html">Anti-Scale™ - Reactive, Concrete Surface Hardener</a></li>
            </ul>
          </li>
          <li><a href="../resources_page.html">RESOURCES</a></li>
          <li><a href="../technical_support.html">TECHNICAL SUPPORT</a></li>
          <li><a href="../contact_page.html">CONTACT US</a></li>
        </ul>
      </nav>
      <!-- TemplateEndEditable -->
      </section>
      <!-- TemplateBeginEditable name="Sidebar" -->
      <div class="sidebar1">
        <!-- end .sidebar1 -->
      </div>
      <!-- TemplateEndEditable -->
      <!-- TemplateBeginEditable name="Content" -->
      <div class="content">
        <p>
        <section>
            <p> </p>
    <img src="../_images/homeheader.png"  alt="" width="650" height="31" class="fltlft"/>
        </section>
        </p>
        <p> </p>
    </section>
        <p> </p>
          <section><p><strong>Pavemend</strong><sup>®</sup> concrete and asphalt repair products are quickly becoming the preferred repair materials for Turnpike, State DOT bridge crews and discriminating engineers who recognize the value of durable, permanent concrete and asphalt repairs. Contractors and maintenance personnel save time, reduce repair costs, and minimize exposure to traffic and traffic disruptions.</p>
            <h3>Concrete & Asphalt repair applications include:</h3>
            <table width="700" align="left" >
              <tr>
                <td valign="top" nowrap style="padding-left: 15px;">Full & Partial Depth Bridge Deck Repairs </td>
                <td valign="top" nowrap style="padding-left: 15px;">Dowel Bar Retrofits</td>
                <td valign="top" nowrap style="padding-left: 15px;">Industrial Concrete Repair</td>
              </tr>
              <tr>
                <td valign="top" nowrap style="padding-left: 15px;">Bridge Header Joints</td>
                <td valign="top" nowrap style="padding-left: 15px;">Cold Weather Repairs</td>
                <td valign="top" nowrap style="padding-left: 15px;">Concrete Exposed to High Heat </td>
              </tr>
              <tr>
                <td valign="top" nowrap style="padding-left: 15px;">Bridge Approach Slabs</td>
                <td valign="top" nowrap style="padding-left: 15px;">Runway Repairs</td>
                <td valign="top" nowrap style="padding-left: 15px;">Concrete Exposed to Chemicals</td>
              </tr>
              <tr>
                <td valign="top" nowrap style="padding-left: 15px;">Form & Pour Repairs</td>
                <td valign="top" nowrap style="padding-left: 15px;">Utility Trenches</td>
                <td valign="top" nowrap style="padding-left: 15px;">Concrete Exposed to Wastewater</td>
              </tr>
              <tr>
                <td valign="top" nowrap style="padding-left: 15px;">Joint Nosings</td>
                <td valign="top" nowrap style="padding-left: 15px;">Post Grooving Treatments</td>
                <td valign="top" nowrap style="padding-left: 15px; padding-bottom: 30px;">Manhole Rehabilitation</td>
              </tr>
            </table>
    <h3>Sustainable Concrete and Asphalt Repair Technology</h3>
    <p>Featuring technology developed in the USA, Pavemend products require only the addition of water, no bonding agents or curing compounds. Pavemend concrete and asphalt products are easier to use, offer greater durability provide, superior return on investment, and are by the far the most sustainable repair products available today.</p>
          </section>
                <p> </p>
    <!-- end .content --></div>
      <!-- TemplateEndEditable -->
    <!-- TemplateBeginEditable name="Footer Logo" -->
    <footer>
             <img src="../_images/productfamily.png"  alt="" width="250" height="80" class="flt_products"/>
    <div class="footer"><img src="../_images/Done_Smart_White_Logo.png" alt="done_smart_white" width="150" height="17" class="flt_rgt" />
    <aside><strong><em style="color: #FFF; font-size: 90%;">Manufactured by</em></strong><br><br>
    <img src="../_images/CTI_logo_white.png"  alt="" width="200" height="47" class="footer_img"/></aside>
    <aside class="aside2"><a href="#../twitter.com/Pavemend"><strong><em>Twitter</em></strong> <img src="../_images/twitter-bird-dark-bgs.png" width="20" height="17"  alt=""/></a></aside>
    <aside class="aside3"><strong><em style="color: #FFF"><a href="../sustainability_page.html">Planet Friendly Technology</a></em></strong><br>
      <a href="../sustainability_page.html"><img src="../_images/PFTLogo.png"  alt="Planet Friendly Technology" width="75" height="73" class="footer_img2" title="Planet Friendly Technology"/></a></aside>
    </footer>
        <!-- end .footer --></div>
    <!-- end .container --></div>
    <!-- TemplateEndEditable -->
    </body>
    </html>
    I feel like I'm making a mess of it.

  • I need linkability on an placed edge animation

    I brought in an edge animation that needs to link (on click) to a page within the site.  the animation has some interactive features that I established in Edge (and they are working fine) so I can't put a 0 opacity linking object over the top of it because I lose this interactivity. It seems strange to me that the OAM file is not a linkable object. 

    Well, you basically answered your own question: Just like you cannot determine what to click when adding an overlay, so couldn't the code you add on top of it. There is simply no way to distinguish whether your click was meant to hit the invisible layer or the red ball in your Edge animation. You need to think of something else like including the links in the Edge animation or using a separate link.
    Mylenium

  • How to get rid of scroll bars on an edge animation in a fluid grid page

    I'm playing with a page that will contain an edge animation (basically just a panorama view sliding across the stage from right to left).  My thought was that when the page was displayed on a tablet or phone the user would just see less and less of the animation--i.e., as if the panorama was sliding across a smaller stage.  In my css I've specified overflow: hidden for the div that contains the animation, and in the animation itself I've specified overflow: hidden for the stage.   This works fine in Live view, but when I preview the page in a browser (chrome, safari, IE) I get scroll bars.  The animation also behaves as I want it to when I preview it in a browser by itself--i.e., not as a part of a fluid grid page.  I could live with a horizontal scroll bar, and there might even be an argument in its favor, but the vertical bar is a definite problem.  I've tried refining my css to overflow-y : hidden, but that doesn't have any effect either
    Any help would be great.
    Thanks,
    Peter

    I found an work around, albeit an inelegant one, so the link I posted to Nancy's reply now works.  What I found is that the edge animation produces an html document with a body style.  If I plug my overflow style there, voila, alls good.  Of course it will be overwritten if I regenerate the animation, but at least it's progress.
    p

  • Can't get rid of a scollbar with my edge animation on Firefox

    hi, am using edge 2.01 with my mac. i am working on a site for   http://www.twosons.com/gallery.html   i have a piece of edge animation on the gallery page which reads  DIRECTORS REEL 310.200.1400 right underneath the video buttons. on safari it works perfectly. on firefox however i have a scrollbar appearing. i've checked the animation and it is 360wide X130 height and scripted it to be responsive.
    any idea on how i can lose this scrollbar on Firefox. i am already using
    .throwOn {
              position: absolute;
       background-color: rgba(0,0,0,.0);
              display:block;
              margin-top: 400px;
              height: 65px;
              /*border-top: 15px solid rgba(255,255,255,.3);
              border-bottom: 15px solid rgba(255,255,255,.3);*/
              margin-left: 170px;
              overflow: hidden;
    in my css. any other ideas?
    [email protected]

    Reboot the device.
    Shut down the device by holding the sleep/wake button  and the home button at the same time.
    Hold them both until you see the screen go black. In some cases, you may need to keep holding them even after the red power off slider appears. If it does, just keep holding it.
    Wait until the white Apple logo appears.
    When this happens, you can let go - the iPhone is rebooting.

  • Clickable hypertext links in Edge

    Hi,
    Is it possible to have clickable hypertext links within a text element in Adobe Edge ?  I have a layout where a sidebar with text comes in as an overlay as animation completes.  When I try to code in a text link in a text element, the HTML shows up, and I cannot seem to find any info on how to incorporate actual hypertext links within a text element, or if this is even possible.
    If this *is* possible, a second question is:
    is it possible to have dynamically-generated clickable text (ie a PHP query to pull a list of links to recent Wordpress posts) into an Edge animation?  I have a feeling this is more complicated than it would be worth at this point, but hey, it's worth a shot.
    Thanks,
    Colin

    Hi there,
    In answer to your first question, it is possible to do this in Animate using jQuery. Let's say you had a text element named "Text" (sans-quotes) in your main timeline. Add this code to your Stage compositionReady event:
    sym.$("Text").html('<a href="http://html.adobe.com" target="_blank">Adobe & HTML</a>');
    And that will render in the browser as a hypertext link.
    hth,
    Joe

  • Edge animation not working with DPS - anyone know?

    Hey y'all I am Having a hard time making simple animation work on the DPS platform from EDGE (1.5) and show it on IPAD
    anyone knows issues about it?

    Here is the link to create the animation for DPS through Edge.
    http://www.adobe.com/devnet/digitalpublishingsuite/articles/enhancing-your-dps-folios-with -edge-animations.html
    Thanks
    Harshit yadav

Maybe you are looking for