@font-face
{
    /*font-family: 'pt-sans';
    src: url('fonts/ptc75f-webfont.eot');
    src: url('fonts/ptc75f-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/ptc75f-webfont.woff') format('woff'), url('fonts/ptc75f-webfont.ttf') format('truetype'), url('fonts/ptc75f-webfont.svg#pt_sans_captionbold') format('svg');
    font-weight: normal;
    font-style: normal;*/
    font-family:'MYRIADPRO-BOLD';
    src:url('fonts/Royalacid_o.ttf');
}

*
{
    margin: 0;
    padding: 0;
    outline: 0;
}

body, html
{
    height: 100%;
}

body
{
    font-size: 12px;
    line-height: 22px;
    font-family: arial, sans-serif;
    color: #828282;
    min-width: 100%;
    background-image: url(images/topheaderBG.jpg);
}

#mainContent
{
    height: 800px;
    width: 980px;
    padding: 0px;
    margin: 0 auto;
    display: block;
    background-image: url(images/topheaderBG.jpg);
}

#mainContent #topHeader
{
    width: 980px;
    height: 133px;
    margin-bottom: 0px;
}

#mainContent #topHeader #LeftHeader
{
    width: 193px;
    float: left;
    height: 133px;
}
#mainContent #topHeader #MiddleHeader
{
    width: 980px;
    height: 133px;
    background-image: url(images/topheaderBG2.jpg);
    float: left;
    margin-left: 0px;
}

#mainContent #topHeader #RightHeader
{
    width: 193px;
    float: left;
    height: 133px;
    margin-left: 0px;
    margin-right: -200px;
}

#MiddleHeader #tnaLogo
{
    width: 150px;
    margin-top: 30px;
    margin-left: 70px;
    float: left;
}

#penlinesImage
{
    height: 133px;
    float: right;
    opacity: 1;
    visibility:hidden;
}

#navigation
{
    width: 720px;
    height: 50px;
    border: 0px solid #ccc;
    float: left;
    margin-top: 70px;
    margin-left: -40px;
}

#navigationList
{
    list-style: none;
    float: right;
    font-size: 15px;
    margin-top: 35px;
    font-family: Arial;
}

#navigationList li
{
    display: inline;
    margin-left: 40px;
}

#navigationList li a
{
    color: #999999;
}

#navigationList li a:hover
{
    color: #000000;
    text-decoration: none;
}

#MainsliderContent
{
    width: 980px;
    height: 404px;
    float: left;
    background-image: url(images/sliderBG.jpg) repeat 0 0;
    margin-top: 0px;
}

#MainsliderContent #leftSlider
{
    width: 700px;
    height: 404px;
    background-image: url(images/sliderBG.jpg); /*background-image: url(images/LSlider.jpg);*/
    float: left;
    position: absolute;
    top: 133px;
    left: 0px;
    z-index: 0;
}

#MainsliderContent #mainSlider
{
    width: 980px;
    height: 404px;
    float: left;
    background-image: url(images/sliderBG.jpg); /*box-shadow:0px 0px 2px 2px #242121; 	-webkit-box-shadow:0px 0px 2px 2px #242121; 	-o-box-shadow:0px 0px 2px 2px #242121; 	-moz-box-shadow:0px 0px 2px 2px #242121;*/
    z-index: 1;
    position: absolute;
}

#MainsliderContent #rightSlider
{
    width: 700px;
    height: 404px;
    float: right;
    background-image: url(images/sliderBG.jpg); /*background-image: url(images/RSlider.jpg);*/
    position: absolute;
    top: 133px;
    right: 0px;
    z-index: 0;
}


a
{
    color: #666;
    text-decoration: none;
    cursor: pointer;
}
a:hover
{
    text-decoration: underline;
}
a img
{
    border: 0;
}


.slider
{
    height: 404px;
}


.slider, #carousel, #carousel > div
{
    width: 980px;
    height: 404px;
}

.slider
{
    margin: 0px 0 0 -490px;
    overflow: hidden;
    position: relative;
    top: 0%;
    left: 50%;
}

#carousel
{
    position: relative;
    z-index: 2;
}
#carousel div
{
    overflow: hidden;
    position: relative;
    float: left;
}
#carousel div > *
{
    position: absolute;
}
#carousel img.img-front
{
    left: 649px;
    top: 0;
    z-index: 4;
    margin-top: 10px;
    margin-left: 50px;
    -moz-box-shadow: -2px 2px 2px 2px #000;
    -webkit-box-shadow: -2px 2px 2px 2px #000;
    box-shadow: -2px 2px 2px 2px #000;
    border: 1px solid #ccc;
}

#carousel img.img-front:hover
{
    /*z-index:99999;
    height:450px;
    width:330px;
    transition: width 0.5s, height 0.5s, transform 0.5s;
    -moz-transition: width 0.5s, height 0.5s, transform 0.5s;
    -o-transition: width 0.5s, height 0.5s, transform 0.5s;
    -webkit-transition: width 0.5s, height 0.5s, -webkit-transform 0.5s;
    margin-top:auto;
    margin-bottom:auto;*/
    }

#carousel img.img-mid
{
    left: 572px;
    top: 46px;
    z-index: 3;
    margin-top: 10px;
    margin-left: 30px;
    -moz-box-shadow: -2px 2px 2px 2px #000;
    -webkit-box-shadow: -2px 2px 2px 2px #000;
    box-shadow: -2px 2px 2px 2px #000;
    border: 1px solid #ccc;
}

#carousel img.img-mid:hover
{
    z-index:999999;
    height:354px;
    width:280px;
    transition: width 0.5s, height 0.5s, transform 0.5s;
    -moz-transition: width 0.5s, height 0.5s, transform 0.5s;
    -o-transition: width 0.5s, height 0.5s, transform 0.5s;
    -webkit-transition: width 0.5s, height 0.5s, -webkit-transform 0.5s;
    margin-top:auto;
    margin-bottom:auto;
}

#carousel img.img-back
{
    left: 498px;
    top: 80px;
    z-index: 2;
    margin-top: 10px;
    margin-left: 0px;
    -moz-box-shadow: -2px 2px 2px 2px #000;
    -webkit-box-shadow: -2px 2px 2px 2px #000;
    box-shadow: -2px 2px 2px 2px #000;
    border: 1px solid #ccc;
}

#carousel img.img-back:hover
{
    z-index:999999;
    height:320px;
    width:250px;
    transition: width 0.5s, height 0.5s, transform 0.5s;
    -moz-transition: width 0.5s, height 0.5s, transform 0.5s;
    -o-transition: width 0.5s, height 0.5s, transform 0.5s;
    -webkit-transition: width 0.5s, height 0.5s, -webkit-transform 0.5s;
    margin-top:auto;
    margin-bottom:auto;
    }

#carousel h3
{
    font-size: 65px;
    letter-spacing: -5px;
    font-weight:bold;
    font-family: Arial, 'Traditional Arabic';
    font-weight: bold; /*font-family: 'pt-sans' , arial, helvetica, serif;*/
    color: #f5f5f5;
    line-height: 70px;
    text-shadow: 0 0 2px rgba(0,0,0,0.5);
    width: 420px;
    left: 32px;
    background: url(images/slider-h3-border.png) repeat-x 0 bottom;
    top: 91px;
    padding-bottom: 13px;
    margin: 0 0 18px;
}

#carousel h5
{
    font-size: 15px;
    color: #d3d2d3;
    font-family: tahoma, arial, helvetica, serif; /*text-transform: uppercase;*/
    text-shadow: rgba(0,0,0,0.5) 0px 1px 1px;
    font-weight: normal;
    position: absolute;
    top: 63px;
    left: 32px;
    white-space: nowrap;
}

#carousel p
{
    /*color: #959697;*/  
    width: 420px;
    left: 32px;
    top: 181px;
    margin: 0;
    line-height: 24px;
    font-size:16px;
    font-family:Arial;
    color:#fff;
}
#carousel a.green-btn
{
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    text-decoration: none;
    text-align: center;
    line-height: 52px;
    outline: none;
    display: block;
    background-color: #888;
    width: 90px;
    height: 25px;
    margin-left: 300px;
    top: 290px;
    background: url(images/green-btn.png) no-repeat 0 0;
    opacity: 1;
}
#carousel a:hover
{
    background-position: -1px -54px;
}

#prev, #next
{
    background: url(images/direction-nav.png) no-repeat 0 0;
    display: block;
    width: 17px;
    height: 22px;
    position: absolute;
    bottom: 15px;
    z-index: 10;
    opacity: 1;
}

#prev
{
    left: 180px;
    opacity: 1;
}

#next
{
    right: 680px;
    background-position: right 0;
    opacity: 1;
}
.pagination
{
    position: absolute;
    bottom: 15px;
    left: 25%;
    margin-left: -44px;
    width: 88px;
    opacity: 1;
}
.pagination a
{
    background: url(images/pagination2.png) no-repeat 0 0;
    width: 20px;
    height: 20px;
    display: inline-block;
    font-size: 0;
    line-height: 0;
    text-indent: -4000px;
    cursor: default;
}
.pagination a.selected
{
    background-position: 0 -20px;
}

/************************************** Slidersplitter ***************************************************************/
#mainContent #bottomPage
{
    width: 980px;
    height: 900px;
    background-image: url(images/topheaderBG2.jpg);
    margin-left: 1px;
}

#mainContent #bottomPage #Slidersplitter_left
{
    width: 185px;
    border: 0px solid #ccc;
    float: left;
    position: absolute;
    top: 537px;
    left: 0px;
    margin-right: 15px;
    z-index: 2;
}


#mainContent #bottomPage #MiddleBottomPage
{
    width: 980px;
    top: 430px;
    float: left;
}

#mainContent #bottomPage #MiddleBottomPage .lowerpenimage
{
    float: left;
    width: 190px;
}

#mainContent #bottomPage #MiddleBottomPage #iconDepartments
{
    width: 780px;
    border: 0px solid #ccc;
    float: right;
    position: relative;
    margin-top: 50px;
}

#mainContent #bottomPage #MiddleBottomPage #iconDepartments img
{
    margin-right: 0px;
    margin-left: 0px;
}

#mainContent #bottomPage #MiddleBottomPage #iconDepartments #departmentsLinks
{
    margin-top: 0px;
}

#mainContent #bottomPage #MiddleBottomPage #iconDepartments #departmentsLinks p
{
    font-family: Arial;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

#mainContent #bottomPage #MiddleBottomPage #iconDepartments #departmentsLinks p a:link,
#mainContent #bottomPage #MiddleBottomPage #iconDepartments #departmentsLinks p a:visited
{
    color: #999999;
    text-decoration: none;
    font-family: Arial;
    font-weight: normal;
    font-size: 20px;
}
#mainContent #bottomPage #MiddleBottomPage #iconDepartments #departmentsLinks p a:hover
{
    color: #000000;
    -webkit-transition-duration: 1s, 1s;
    -webkit-transition-timing-function: linear, ease-in;
    -moz-transition-duration:1s;
    -moz-transition-timing-function: linear, ease-in;
}

#mainContent #bottomPage #MiddleBottomPage #iconDepartments #departmentsLinks a img:hover
{
    /*transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    transition: width 2s, height 2s, transform 2s;
    -moz-transition: width 2s, height 2s, transform 2s;
    -o-transition: width 2s, height 2s, transform 2s;
    -webkit-transition: width 2s, height 2s, -webkit-transform 2s;*/
    }

#mainContent #bottomPage #MiddleBottomPage #iconDepartments #departmentsLinks a img
{
    transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    transition: width 2s, height 2s, transform 2s;
    -moz-transition: width 2s, height 2s, transform 2s;
    -o-transition: width 2s, height 2s, transform 2s;
    -webkit-transition: width 2s, height 2s, -webkit-transform 2s;
    }
/*
#mainContent #bottomPage #Slidersplitter_right{
	width:185px;
	height:404px;
	border:0px solid #ccc;
	float:right;
	position:absolute;
	top:537px;
	left:1163px;
	z-index:2;
}

*/

#mainContent #footerline
{
    width: 980px;
    border-top: 1px solid #e5e5e5;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    float: left;
    font-family: Arial;
    font-size: 13px;
    padding-top: 15px;
    padding-bottom: 15px;
    background-image: url(images/topheaderBG2.jpg);
    color: #000;
}

#mainContent #footerline span
{
    float:left;
    margin-left:50px;
    font-weight:normal;
    }

#ParentwideSlider #wideSlider
{
    width: 980px;
    height: 522px;
    background-image: url(images/topheaderBG2.jpg);
    position: relative;
}

#ParentwideSlider
{
    width: 100%;
    height: 900px;
    background-image: url(images/topheaderBG2.jpg);
}

#SendMassage
{
    display:none;
    margin-top: 6px;
    border: 1px solid #000;
    margin-left: -147px;
    
    position: absolute;
    /*background: -webkit-linear-gradient(gray, #000);
    background: -o-linear-gradient(gray, #000);
    background: -moz-linear-gradient(gray, #000);
    background: linear-gradient(gray, #000);*/
    padding: 15px;
    /*box-shadow:-2px 2px 0px 0px #000;
    -moz-box-shadow:-2px 2px 0px 0px #000;
    -o-box-shadow:-2px 2px 0px 0px #000;
    -webkit-box-shadow:-2px 2px 0px 0px #000;*/
    overflow-x: none;
    overflow-y: none;
    font-family: Arial, Verdana, Sans-Serif;
    font-size: 12px; background: #333;
    color: #fff;
    box-shadow: inset 0 0 2px 2px #222;
    -webkit-box-shadow: inset 0 0 2px 2px #222;
    -moz-box-shadow: inset 0 0 2px 2px #222;
    -o-box-shadow: inset 0 0 2px 2px #222;
}
/*
#navigationList li .SendMassageBlock a
{
    display:block;
    }
*/
@keyframes myOpacityDiv
{
0%   {opacity:0;}
25%  {opacity:0.25;}
50%  {opacity:0.5;}
100% {opacity:1;}
}

@-o-keyframes myOpacityDiv
{
0%   {opacity:0;}
25%  {opacity:0.25;}
50%  {opacity:0.5;}
100% {opacity:1;}
}

@-moz-keyframes myOpacityDiv
{
0%   {opacity:0;}
25%  {opacity:0.25;}
50%  {opacity:0.5;}
100% {opacity:1;}
}

@-webkit-keyframes myOpacityDiv
{
0%   {opacity:0;}
25%  {opacity:0.25;}
50%  {opacity:0.5;}
100% {opacity:1;}
}

/*************************************************************************************
#navigation #navigationList li:hover #SendMassage
{
    opacity:1;
    animation:myOpacityDiv 0.5s;
    -webkit-animation:myOpacityDiv 0.5s;
    -moz-animation:myOpacityDiv 0.5s;
    -o-animation:myOpacityDiv 0.5s;
    
    display: block;
    margin-top: 6px;
    border: 1px solid #ccc;
    margin-left: -147px;
    width: 450px;
    height: 285px;
    z-index: 30;
    position: absolute;
    background: -webkit-linear-gradient(gray, #000);
    background: -o-linear-gradient(gray, #000);
    background: -moz-linear-gradient(gray, #000);
    background: linear-gradient(gray, #000);
    padding: 15px;
    box-shadow:-2px 2px 0px 0px #000;
    -moz-box-shadow:-2px 2px 0px 0px #000;
    -o-box-shadow:-2px 2px 0px 0px #000;
    -webkit-box-shadow:-2px 2px 0px 0px #000;
    
    overflow-x: none;
    overflow-y: none;
    font-family: "lucida grande" ,tahoma,verdana,arial,sans-serif;
    font-size: 12px;
    background: #333;
    color: #fff;
    -webkit-box-shadow: inset 0 0 2px 2px #222;
    -moz-box-shadow: inset 0 0 2px 2px #222;
    box-shadow: inset 0 0 2px 2px #222;
}
*************************************************************************************/

#SendMassage .textbox
{
    border: 1px solid #ccc;
    width: 200px;
    height: 25px;
    margin-left: 5px;
    color: #000;
    font-family: Arial;
    font-size: 15px;
    padding-left: 10px;
}

#SendMassage .textbox:focus
{
    border: 2px solid orange;
    }

#SendMassage .SubjectTextbox
{
    width:419px;
    height:25px;
    margin-top:5px;
    border: 1px solid #ccc;
    margin-left: 5px;
    color: #000;
    font-family: Arial;
    font-size: 15px;
    padding-left: 10px;
}

#SendMassage .SubjectTextbox:focus
{
    border: 2px solid orange;
    }

/*********************************************tooltip*************************************************/
li.tooltip {outline:none; } 
li.tooltip strong {line-height:30px;} 
li.tooltip:hover {text-decoration:none;} 
li.tooltip span { z-index:99999;display:none; padding:14px 20px; margin-top:60px; margin-left:-160px; width:240px; line-height:16px; } 
li.tooltip:hover span#SendMassage
{
    display:block;
    border:2px solid #FFF;
    color:#EEE;
    background:#000;
    margin-left: -60px;
    width: 450px;
    height: 330px;
    z-index:99999;
    position: absolute;
    /*
    transition: width 2s, height 2s, transform 2s;
    -moz-transition: width 2s, height 2s, transform 2s;
    -o-transition: width 2s, height 2s, transform 2s;
    -webkit-transition: width 2s, height 2s, -webkit-transform 2s;
    */
    opacity:1;
    animation:myOpacityDiv 0.5s;
    -webkit-animation:myOpacityDiv 0.5s;
    -moz-animation:myOpacityDiv 0.5s;
    -o-animation:myOpacityDiv 0.5s;
    } 
.callout 
{
    z-index:20;
    position:absolute;
    border:0;top:-14px;
    left:355px;
    } /*CSS3 extras*/ 
li.tooltip span#SendMassage 
{
    border-radius:2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-box-shadow: 0px 0px 8px 4px #666;
    -webkit-box-shadow: 0px 0px 8px 4px #666;
    box-shadow: 0px 0px 8px 4px #666;
    opacity: 1;
    }
/*********************************************************************************************/

#SendMassage .MessageTextbox{
    width:419px;
    height:180px;
    margin-top:5px;
    border: 1px solid #ccc;
    margin-left: 5px;
    color: #000;
    font-family: Arial;
    font-size: 15px;
    padding-left: 10px;
    vertical-align:top;
}

#SendMassage .MessageTextbox:focus
{
    border: 2px solid orange;
    }
    
#SendMassage .SendMessageButton
{
    width:115px;
    height:30px;
    border:1px solid #ccc;
    margin-left:97px;
    margin-top:5px;
    }

.errorMessage
{
    float:right;
    display:block;
    z-index:999999;
    color:#ccc;
    position:absolute;
    }

#SendMassage .resultlabel
{
    color:#fff;
    display:block;
    margin-left:5px;
    width:180px;
    border:0px solid #ccc;
    height:25px;
    background:#000;
    }


#socialIconsDiv
{
    background:transparent;
    position:absolute;
    right:200px;
    margin-top:-5px;
    width:100%;
    text-align:right;
    }

#socialIconsDiv #socialIcons
{
    display:inline-block;
    background:transparent;
    width:100%;
    text-align:right;
    }

#socialIconsDiv #socialIcons li
{
    display:inline;
    margin-right:10px;
    }

#socialIconsDiv #socialIcons li img:hover
{
    opacity:1;
    animation:myOpacityDiv 0.6s;
    -webkit-animation:myOpacityDiv 0.6s;
    -moz-animation:myOpacityDiv 0.6s;
    -o-animation:myOpacityDiv 0.6s;
    /*box-shadow: inset 0 0 2px 2px transparent;
    -webkit-box-shadow: inset 0 0 2px 2px transparent;
    -moz-box-shadow: inset 0 0 2px 2px transparent;
    -o-box-shadow: inset 0 0 2px 2px transparent;*/
    }

#navigationList li #ScuccessParteners
{
    display:none;
    list-style:none;
    }

#navigationList li a:hover #ScuccessParteners
{
    display:block;
    z-index:99999;
    position:absolute;
    text-align:left;
    width:160px;
    background-color:#000;
    opacity:0.9;
    color:#fff;
    margin-top:-5px;
    margin-left:380px;
    border:1px solid #fff;
    animation:myOpacityDiv 0.3s;
    -webkit-animation:myOpacityDiv 0.3s;
    -moz-animation:myOpacityDiv 0.3s;
    -o-animation:myOpacityDiv 0.3s;
    border-radius:3px;
    -webkit-border-radius:3px;
    -o-border-radius:3px;
    -moz-border-radius:3px;
    text-indent:5px;
    box-shadow:1px 1px 0px 0px;
    -webkit-box-shadow:1px 1px 0px 0px;
    -o-box-shadow:1px 1px 0px 0px;
    -moz-box-shadow:1px 1px 0px 0px;
    }

#ScuccessParteners tr td
{
    width:160px;
    border-bottom:1px solid #ccc;
    }

#ScuccessParteners tr:hover td
{
    color:#000;
    background-color:#ccc;
}

#ScuccessParteners tr td:hover
{
    color:#000;
    background-color:#ccc;
}

bannerDivision
{
    top:0px;
    margin-left:300px;
    z-index:100;   
    width:600px;
    height:90px;
    margin-bottom:-90px;
    background-color:transparent;
    float:left;
    position:absolute;
    }

#yourgift h1
{
    color:Maroon;
    }

#yourgift
{
    color:#000;
    font-family:Arial;
    font-size:16px;
    text-align:center;
    width:980px;
    height:600px;
    background-image:url(images/giftsbg.JPG);
    background-repeat:no-repeat;
    /*background-color:#eee;*/
    padding-top:60px;
    }

#giftsTable
{
    width:750px;
    margin-left:auto;
    margin-right:auto;
    height:400px;
    margin-top:40px;
    padding:20px;
    text-align:left;
    }

#giftsTable table
{
    padding:15px;
    }

#giftsTable .FullName
{
    width:350px;
    height:28px;
    border:1px solid #ccc;
    margin-left:50px;
    font-family:Arial;
    font-size:18px;
    color:Maroon;
    margin-bottom:10px;
    }

#giftsTable .RadComboBoxGifts
{
    margin-left:50px;
    font-size:15px;
    height:28px;
    width:350px;
    }

#CompliantDivision
{
    position:fixed;
    top:160px;
    right:10px;
    z-index:200;
}
    

#CompliantDivision #CompliantTop
{
    margin-left:auto;
    margin-right:auto;
    right:5px;
    position:relative;
}



#CompliantDivision #CompliantMiddle
{
    width:156px;
    height:0px;
    z-index:200;
    background-color:#fff;
    margin-left:auto;
    margin-right:auto;
    position:relative;
    right:6px;
    margin-top:-13px;
    transition-duration: .5s;
    -o-transition-duration: .5s;
    -webkit-transition-duration: .5s;
    -moz-transition-duration: .5s;
    text-indent:10px;
}

#CompliantDivision #CompliantMiddle span
{
    opacity:0;
    -webkit-opacity:0;
    -moz-opacity:0;
    -o-opacity:0;
    line-height:30px;
    color:#000;
    font-family:'Traditional Arabic';
    font-size:16px;
    z-index:-100;
}

#CompliantDivision:hover #CompliantMiddle
{
    width:156px;
    height:100px;
    z-index:200;
    margin-left:auto;
    margin-right:auto;
    position:relative;
    right:6px;
    margin-top:-13px;
    background-image:url(images/TNAcompliantMiddle.png);
    background-repeat:no-repeat;
    transition-duration: .8s;
    -o-transition-duration: .8s;
    -webkit-transition-duration: .8s;
    -moz-transition-duration: .8s;
    }

#CompliantDivision:hover #CompliantMiddle span
{
    opacity:1;
    -o-opacity:1;
    -webkit-opacity:1;
    -moz-opacity:1;
    line-height:30px;
    font-weight:bold;
    font-family:'Traditional Arabic';
    font-size:16px;
    transition-duration: .5s;
    -o-transition-duration: .5s;
    -webkit-transition-duration: .5s;
    -moz-transition-duration: .5s;
    }
    
#CompliantDivision #CompliantBottom
{
    
    margin-left:auto;
    margin-right:auto;
    right:6px;
    position:relative;
    margin-top:-2px;
}