﻿.frame0Box
{
    position: relative;
    margin: 0px;
    padding: 0px;
    width: 420px;
    height: 250px;
    top: 24px;
    left: 500px;
}

/*

An inner box must be 7 px less wide than normal box,
and 8 pixels larger in height than normal box to compensate
for padding and margins of the rounded border
framework.

*/

.frame0InnerBox
{
    position: absolute;
    margin: 0px;
    padding: 0px;
    padding-top: 20px;
    top: 24px;
    left: 500px;
    width: 413px;
    height: 257px; 
}

.frame0Text
{
    position: relative;
    width: 383px;
    margin: 0px;
    padding: 0px;
    padding-left: 18px;
    font-family: Trebuchet MS, Verdana, Arial;
    font-size: 17px;
}

.frame0td
{
    vertical-align: top;
}

.frame0Text a
{
    color: #035e84;
}

.frame0Button
{
    position: absolute;
    top: 197px;
    left: 141px;
}

/*

framestyles.css contains special CSS only for
content in individual photo rotator frames.
Frame content can vary dramatically based on type of
photo, placement, etc...so it is likely that many
classes will be created/dumped as the rotator
is updated.  Hence this sandbox file.

*/

.frame1Box
{
    position: relative;
    margin: 0px;
    padding: 0px;
    width: 400px;
    height: 230px;
    top: 32px;
    left: 52px;
}

/*

An inner box must be 7 px less than normal box,
and 8 pixels large than normal box to compensate
for padding and margins of the rounded border
framework.

*/

.frame1InnerBox
{
    position: absolute;
    margin: 0px;
    padding: 0px;
    padding-top: 20px;
    top: 32px;
    left: 52px;
    width: 393px;
    height: 218px;
}

.frame1Text
{
    position: relative;
    width: 100%;
    margin: 0px;
    padding: 0px;
    padding-left: 4px;
    font-family: Trebuchet MS, Verdana, Arial;
    font-size: 17px;
    text-align: center;
}

.frame1Text a
{
    color: #035e84;
}

.frame1Button
{
    position: absolute;
    top: 170px;
    left: 136px;
}


.frame2Box
{
    position: relative;
    margin: 0px;
    padding: 0px;
    width: 420px;
    height: 250px;
    top: 24px;
    left: 52px;
}

/*

An inner box must be 7 px less wide than normal box,
and 8 pixels larger in height than normal box to compensate
for padding and margins of the rounded border
framework.

*/

.frame2InnerBox
{
    position: absolute;
    margin: 0px;
    padding: 0px;
    padding-top: 20px;
    top: 24px;
    left: 52px;
    width: 413px;
    height: 257px; 
}

.frame2Text
{
    position: relative;
    width: 383px;
    margin: 0px;
    padding: 0px;
    padding-left: 18px;
    font-family: Trebuchet MS, Verdana, Arial;
    font-size: 17px;
    text-align: center;
}

.frame2Text a
{
    color: #035e84;
}

.frame2Button
{
    position: absolute;
    top: 195px;
    left: 141px;
}

.frame3Box
{
    position: relative;
    margin: 0px;
    padding: 0px;
    width: 390px;
    height: 220px;
    top: 32px;
    left: 52px;
}

/*

An inner box must be 7 px less wide than normal box,
and 8 pixels larger in height than normal box to compensate
for padding and margins of the rounded border
framework.

*/

.frame3InnerBox
{
    position: absolute;
    margin: 0px;
    padding: 0px;
    padding-top: 20px;
    top: 32px;
    left: 52px;
    width: 383px;
    height: 207px; 
}

.frame3Text
{
    position: relative;
    width: 353px;
    margin: 0px;
    padding: 0px;
    padding-left: 18px;
    font-family: Trebuchet MS, Verdana, Arial;
    font-size: 17px;
    text-align: center;
}

.frame3Button
{
    position: absolute;
    top: 166px;
    left: 126px;
}

/*

An inner box must be 7 px less wide than normal box,
and 8 pixels larger in height than normal box to compensate
for padding and margins of the rounded border
framework.

*/

.frame4Box
{
    position: relative;
    margin: 0px;
    padding: 0px;
    width: 390px;
    height: 250px;
    top: 24px;
    left: 500px;
}

.frame4InnerBox
{
    position: absolute;
    margin: 0px;
    padding: 0px;
    padding-top: 20px;
    top: 24px;
    left: 500px;
    width: 383px;
    height: 257px; 
}

.frame4Text
{
    position: relative;
    width: 353px;
    margin: 0px;
    padding: 0px;
    padding-left: 18px;
    font-family: Trebuchet MS, Verdana, Arial;
    font-size: 17px;
    text-align: center;
}

.frame4Button
{
    position: absolute;
    top: 203px;
    left: 126px;
}

.whiteBox100 .rotatorBoxTopLeft,
.whiteBox100 .rotatorBoxTopRight
{
   background-image: url(/global/rotator/rotatorimages/100whiteboxtop.png);
}

.whiteBox100 .rotatorBoxMiddleLeft,
.whiteBox100 .rotatorBoxMiddleRight
{
    background-image: url(/global/rotator/rotatorimages/100whiteboxmiddle.png);
}

.whiteBox100 .rotatorBoxBottomLeft,
.whiteBox100 .rotatorBoxBottomRight
{
    background-image: url(/global/rotator/rotatorimages/100whiteboxbottom.png);
}

.whiteBox85 .rotatorBoxTopLeft,
.whiteBox85 .rotatorBoxTopRight
{
   background-image: url(/global/rotator/rotatorimages/85whiteboxtop.png);
}

.whiteBox85 .rotatorBoxMiddleLeft,
.whiteBox85 .rotatorBoxMiddleRight
{
    background-image: url(/global/rotator/rotatorimages/85whiteboxmiddle.png);
}

.whiteBox85 .rotatorBoxBottomLeft,
.whiteBox85 .rotatorBoxBottomRight
{
    background-image: url(/global/rotator/rotatorimages/85whiteboxbottom.png);
}

.whiteBox78 .rotatorBoxTopLeft,
.whiteBox78 .rotatorBoxTopRight
{
   background-image: url(/global/rotator/rotatorimages/78whiteboxtop.png);
}

.whiteBox78 .rotatorBoxMiddleLeft,
.whiteBox78 .rotatorBoxMiddleRight
{
    background-image: url(/global/rotator/rotatorimages/78whiteboxmiddle.png);
}

.whiteBox78 .rotatorBoxBottomLeft,
.whiteBox78 .rotatorBoxBottomRight
{
    background-image: url(/global/rotator/rotatorimages/78whiteboxbottom.png);
}

.rotatorBoxTop
{
   position: relative;
   margin: 0px;
   padding: 0px;
   height: 8px;
}

.rotatorBoxTopLeft
{
   position: relative;
   margin: 0px;
   margin-right: 7px;
   padding: 0px;
   height: 100%;
}

.rotatorBoxTopRight
{
   position: absolute;
   top: 0px;
   right: 0px;
   margin: 0px;
   padding: 0px;
   width: 7px;
   height: 100%;
   background-position: 7px 0px;
}

.rotatorBoxMiddle
{
    position: relative;
    margin: 0px;
    padding: 0px;
    height: 100%;
    width: 100%;
}

.rotatorBoxMiddleLeft
{
    position: relative;
    margin: 0px;
    margin-right: 7px;
    padding: 0px;
    padding-left: 7px;
    padding-right: 7px;
    background-repeat: repeat-y;  
    height: 100%;  
}

.rotatorBoxMiddleRight
{
   position: absolute;
   top: 0px;
   right: 0px;
   margin: 0px;
   padding: 0px;
   width: 7px;
   height: 100%;
   background-position: 7px 0px;
}

.rotatorBoxBottom
{
   position: relative;
   margin: 0px;
   padding: 0px;
   height: 8px;
}

.rotatorBoxBottomLeft
{
   position: relative;
   margin: 0px;
   margin-right: 7px;
   padding: 0px;
   height: 100%;
}

.rotatorBoxBottomRight
{
   position: absolute;
   margin: 0px;
   padding: 0px;
   height: 100%;
   width: 7px;
   top: 0px;
   right: 0px;
   background-position: 7px 0px;
}

.frameHeader
{
    position: relative;
    margin: 0px;
    margin-top: 8px;
    margin-bottom: 18px;
    padding: 0px;
    width: 100%;
    font-family: Verdana, Arial;
    font-size: 26px;
}

.frameText
{
    position: relative;
    margin: 0px;
    padding: 0px;
    margin-top: 8px;
    margin-bottom: 8px;
    font-family: Trebuchet MS, Verdana, Arial;
    font-size: 18px;    
}

.contactUsButton
{
    width: 127px;
    height: 34px;    
}

.learnMoreButton
{
    width: 133px;
    height: 36px;
}

.contactUsBlue
{
    background-image: url("/global/rotator/rotatorimages/contactusbluenormal.png");    
}

.contactUsBlue:hover
{
    background-image: url("/global/rotator/rotatorimages/contactusbluehighlight.png");    
}

.contactUsRed
{
    background-image: url("/global/rotator/rotatorimages/contactusrednormal.png");    
}

.contactUsRed:hover
{
    background-image: url("/global/rotator/rotatorimages/contactusredhighlight.png");    
}

.contactUsGreen
{
    background-image: url("/global/rotator/rotatorimages/contactusgreennormal.png");    
}

.contactUsGreen:hover
{
    background-image: url("/global/rotator/rotatorimages/contactusgreenhighlight.png");    
}

.learnMoreBlue
{
    background-image: url("/global/rotator/rotatorimages/learnmorebluenormal.png");
}

.learnMoreBlue:hover
{
    background-image: url("/global/rotator/rotatorimages/learnmorebluehighlight.png");
}

.learnMoreGreen
{
    background-image: url("/global/rotator/rotatorimages/learnmoregreennormal.png");
}

.learnMoreGreen:hover
{
    background-image: url("/global/rotator/rotatorimages/learnmoregreenhighlight.png");
}

.learnMoreRed
{
    background-image: url("/global/rotator/rotatorimages/learnmorerednormal.png");
}

.learnMoreRed:hover
{
    background-image: url("/global/rotator/rotatorimages/learnmoreredhighlight.png");
}

.learnMoreButton a, .contactUsButton a
{
   position: relative;
   width: 100%;
   height: 100%;
   display: block;
}
