@font-face {
    font-family: 'FoxScript-Normal';
    src: url('/FoxScript-Normal.eot');
    src: url('/FoxScript-Normal.woff') format('woff'), 
    url('/FoxScript-Normal.ttf') format('truetype'), 
    url('/FoxScript-Normal.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NotethisRegular';
    src: url('Note_this-webfont.eot');
    src: url('Note_this-webfont.eot?#iefix') format('embedded-opentype'),
         url('Note_this-webfont.woff') format('woff'),
         url('Note_this-webfont.ttf') format('truetype'),
         url('Note_this-webfont.svg#NotethisRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}



.has-pullquote:before {
    /* Reset metrics. */
    padding: 0;
    border: none;
    
    /* Content */
    content: attr(data-pullquote);
    
    /* Pull out to the right, modular scale based margins. */
    float: left;
    width: 320px;
    margin: 12px 0px 24px 36px;
    
    /* Baseline correction */
    position: relative;
    top: 5px;
    
    /* Typography (30px line-height equals 25% incremental leading) */
    font-size: 23px;
    line-height: 30px;
}


.pullquote-foxscript:before {
    font-family: "FoxScript-Normal";
    font-weight: 100;
    top: 10px !important;
}

q.foxscript {
    font-family: "NotethisRegular";
    font-size: 190%;
    line-height: 1.1 ex;
    top: 10px;
}

q.foxscripty {
    font-family: "NotethisRegular";
    font-size: 170%;
    line-height: 1.1 ex;
    color: #e8ae0f;
    top: 10px;
}

q.foxscriptp {
    font-family: "NotethisRegular";
    font-size: 170%;
    line-height: 1.1 ex;
    color: #552682;
    top: 10px;
}

img.centered {
    display: block;   
    margin-left: auto;   
    margin-right: auto; 
}

img.portrait {
    display: block;   
     float: right; 
    margin-right: 10px; 
        margin-left: 10px; 
    width: 100px; 
    -webkit-border-radius: 7px 0px 7px 0px;
    -moz-border-radius: 7px 0px 7px 0px;
    border-radius: 7px 0px 7px 0px; 
    -webkit-box-shadow: #B3B3B3 10px 10px 10px; 
    -moz-box-shadow: #B3B3B3 10px 10px 10px; 
    box-shadow: #B3B3B3 10px 10px 10px;
    

}

p.citee {
    display: block;   
    font-weight: bold;   
    color: #552682; 
}

div.wh {
    display: block;   
     float: right; 
    margin-right: 10px; 
    width: 100%; 
    padding: 15px;    
}



div.alt {
    display: block;   
     float: right; 
    margin-right: 10px; 
    width: 100%; 
    -webkit-border-radius: 7px 0px 7px 0px;
    -moz-border-radius: 7px 0px 7px 0px;
    border-radius: 7px 0px 7px 0px; 
    -webkit-box-shadow: #B3B3B3 10px 10px 10px; 
    -moz-box-shadow: #B3B3B3 10px 10px 10px; 
    box-shadow: #B3B3B3 10px 10px 10px;
    color: white;
        background-color: #e8ae0f;
    padding: 15px;    
}

div.alt > img.portrait {
    -webkit-box-shadow: #a37f1d 10px 10px 10px; 
    -moz-box-shadow: #a37f1d 10px 10px 10px; 
    box-shadow: #a37f1d 10px 10px 10px;
        margin-left: 10px; 
    float: left; 
}

div.bottombarquote > img.portrait {
    -webkit-box-shadow: #a37f1d 10px 10px 10px; 
    -moz-box-shadow: #a37f1d 10px 10px 10px; 
    box-shadow: #a37f1d 10px 10px 10px;
        margin-left: 10px; 
    float: left; 
}

ul.features > li {
    display: block;   
     float: left; 
    margin: 10px; 
    padding: 10px;
    width: 140px; 
    -webkit-border-radius: 7px 0px 7px 0px;
    -moz-border-radius: 7px 0px 7px 0px;
    border-radius: 7px 0px 7px 0px; 
    -webkit-box-shadow: #B3B3B3 10px 10px 10px; 
    -moz-box-shadow: #B3B3B3 10px 10px 10px; 
    box-shadow: #B3B3B3 10px 10px 10px;
    color: white;
        background-color: #e8ae0f;
}

ul.features > li > strong {
    color: #552682; 
}

ul.applications > li {
    display: block;   
     float: left; 
    margin: 10px; 
    padding: 10px;
    width: 490px; 
    -webkit-border-radius: 7px 0px 7px 0px;
    -moz-border-radius: 7px 0px 7px 0px;
    border-radius: 7px 0px 7px 0px; 
    -webkit-box-shadow: #B3B3B3 10px 10px 10px; 
    -moz-box-shadow: #B3B3B3 10px 10px 10px; 
    box-shadow: #B3B3B3 10px 10px 10px;
    color: white;
        background-color: #e8ae0f;
}


ul.applications > li > p > a {
    color: #552682; 
        background-color: white;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px; 
    margin: 20px; 
    padding: 5px;

}


ul.applications > li > p > strong {
    color: #552682; 
}


div.purplerain > h1 {
    display: block;   
     float: left; 
    width: 550px;
    color: white; 
        background-color: #552682;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px; 
    margin: 20px; 
    padding: 5px;

}


div.bottombar {
    width:100%; 
    -webkit-border-radius: 23px 0px 20px 0px;
    -moz-border-radius: 23px 0px 20px 0px;
    border-radius: 23px 0px 20px 0px;
    border:2px solid #000000;
    background-color:#552682;
    -webkit-box-shadow: #B3B3B3 10px 10px 10px;
    -moz-box-shadow: #B3B3B3 10px 10px 10px; 
    box-shadow: #B3B3B3 10px 10px 10px; 
    padding: 10px; 
    color: white;
}

div.bottombarquote {
    width:70%; 
    min-height: 150px;
    -webkit-border-radius: 23px 0px 20px 0px;
    -moz-border-radius: 23px 0px 20px 0px;
    border-radius: 23px 0px 20px 0px;
    border:2px solid #000000;
    background-color:#e8ae0f;
    -webkit-box-shadow: #B3B3B3 10px 10px 10px;
    -moz-box-shadow: #B3B3B3 10px 10px 10px; 
    box-shadow: #B3B3B3 10px 10px 10px; 
    padding: 10px; 
    margin-left: 100px;
    color: white;
}


h1,h2 {color: #552682;}
.yellow {color: #e8ae0f;}