/* ------ Section 1 - Global Body, Font and Link Settings ------ */

* {box-sizing: border-box;}


img{
    max-width: 100%;
    height: auto;
}



a:link img{
opacity:1;
transition:opacity .25s ease-in-out;
-moz-transition:opacity .25s ease-in-out;
-webkit-transition:opacity .25s ease-in-out;
}

a:hover img{
opacity:.6;
filter:grayscale(100%);
}

body {
padding: 0;
margin: 0;
font-family: "Open Sans", Arial, Helvetica, sans-serif;
font-size: 1rem;
line-height: 1.5;
color: #545454;
}



h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Arial Black", sans-serif;
line-height: 1.5;
}

h1 em,
h2 em,
h3 em,
h4 em,
h5 em,
h6 em {
font-style: normal;
}

h1 {
font-size: 2rem;
color: #2b9fe1;
margin: 0 0 16px 0;
text-align: center;
}

h2 {
font-size: 1.5rem;
color: #2b9fe1;
margin: 30px 0 10px 0;
text-align: left;
}

h3 {
font-size: 1.2rem;
color: #2b9fe1;
margin: 0 0 10px 0;
text-align: left;
}

h4 {
font-size: 1.1rem;
color: #2b9fe1;
text-align: left;
margin: 0 0 10px 0;
}

h5,
h6 {
font-size: 1rem;
color: #666666;
text-align: left;
margin: 0 0 10px 0;
}

img {
border: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

#ContentColumn img {
-webkit-box-shadow: 0px 2px 4px rgba(50, 50, 50, 0.20);
-moz-box-shadow: 0px 2px 4px rgba(50, 50, 50, 0.20);
box-shadow: 0px 2px 4px rgba(50, 50, 50, 0.20);
border: 4px solid #ffffff;
}

#ContentColumn .c2inv img,
#ContentColumn #SUBSCRIBE img,
#ContentColumn #news img,
#ContentColumn .rss-icons img {
border: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

p {
margin: 0 0 15px 0;
}

ul {
list-style-type: disc;
padding: 0;
margin: 0 0 30px 0;
}

ul li {
padding: 0;
margin: 0 0 0 45px;
line-height: 2;
}

#ContentColumn ul  {
border-top: 1px dashed #ccc;
border-bottom: 1px dashed #ccc;
padding-top: 20px;
padding-bottom: 20px;
}


#ContentColumn ul li {
    padding-left: 5px;
    color: #101010;
    font-size: 1rem;
    font-family: "open sans", sans-serif;
}


#ContentColumn ul li:nth-child(even) {
background: #eee;
}

ol {
list-style-type: decimal;
padding: 0 0 0 10px;
margin: 0;
}

ol li {
padding: 0;
margin: 0 0 0 30px;
}

input[type="text"] {
font-family: "Open Sans", Arial, Helvetica, sans-serif;
font-size: .9rem;
color: #545454;
width: 168px;
padding: 5px;
margin-bottom: 8px;
border: 1px solid #dadbd8;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

input[type="submit"] {
font-family: "Open Sans", Arial, Helvetica, sans-serif;
font-size: .9rem;
font-weight: bold;
text-transform: uppercase;
color: #ffffff;
background-color: #2b52e1;
padding: 5px 15px;
margin: 10px 0;
border: 1px solid #2b52e1;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

/* -- General Link Styling -- */

a:link {
color: #2b52e1;
font-weight: bold;
}

a:visited {
color: purple;
}

a:hover {
color: #2b9fe1;
}



/* ------ Section 2 - Global Page Structure ------- */









/* ------ Section 3 - Page Structure Details ------ */

html {
background: #ffffff url(../image-files/aj-page-bg.jpg) repeat center top;
}

body {
background: transparent url(../image-files/aj-bodybg.jpg) no-repeat center top;
}

#PageTop {
background-color: #ffffff;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 110px;
z-index: 100;
border-bottom:  3px solid #97E1DA;
}

#PageWrapper {
width: 96%;
max-width: 1060px;
margin:  0 auto;
padding-top: 113px;
padding: 0;
}

#Header {
position: relative;
width: 96%;
max-width: 1060px;
height: 200px;
}



#Header .Liner {
position: absolute;
    bottom: 0 !important;
    
    height: 30px;
    width: 380px;
    background: rgba(255, 255, 255, .55);
    border-radius: 5px 5px 0 0;
}


div .top-social-holder {
    position: relative;
    display: block;
    margin-top: 0;
    margin-left: 20px;
}
  


#ContentWrapper {
width: 1060px;
max-width: 100%;
margin: 0 auto 30px auto;
background: rgba(255, 255, 255, .55);
border-radius: 0 7px 7px 7px;
box-shadow: 0 3px 3px #ccc;
}



#ContentColumn {
width: 96%;
max-width: 1020px;
    margin: auto;
    padding: 20px;
    border-radius: 7px;
    padding: 20px 10px;
}

#ContentColumn .Liner {
position: relative;
    margin: 0;
    padding: 30px 115px;
    z-index: 10;
    background: white;
    border-radius: 7px;
}


#NavColumn {display: none;}

#ExtraColumn {
display: none;
}

#Footer {
clear: both;
width: 96%;
max-width: 1060px;
margin: 0 auto;
background: transparent;
}

.Liner {
padding: 10px;
*zoom: 1;
}



#Footer .Liner {
padding: 1px 0;
background: transparent;
}

/* -- Top Bar -- */

#TopBar {
position: relative;
width: 1060px;
max-width: 100%;
height: 59px;
margin: 0 auto;
}

#logo {
width: 331px;
height: 55px;
padding-top: 15px;
}

#SocialBar {
position: absolute;
width: 340px;
height: 37px;
top: 15px;
left: 355px;
}



#SocialBar img {
    margin-right: 12px;
}

#SocialBar ul {
list-style-type: none;
padding: 0;
margin: 0;
}

#SocialBar ul li {
display: inline;
margin: 0;
padding: 0 1px;
}

#calm {
position: absolute;
width: 59px;
height: 59px;
top: 3px;
left: 705px;
}

#search {
text-align: center;
position: absolute;
padding: 5px;
width: 200px;
height: 30px;
top: 12px;
right: 0px;
border: 1px solid #e5e5e5;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

#search input[type="text"] {
font-family: "Open Sans", Arial, Helvetica, sans-serif;
font-size: .85rem;
width: 150px;
height: 32px;
border: 0 !important;
padding: 0 0 0 8px !important;
background-position: 5px 50% !important;
}

#search input[type="submit"] {
position: absolute;
width: 17px;
height: 17px;
top: 7px;
right: 7px;
background: #ffffff url(../image-files/search-icon.png) no-repeat center top;
padding: 0;
margin: 0;
border: 0;
}





.widerList {
list-style-type: none;
padding: 0;
margin: 0;
}

.widerList li {
padding: 0;
margin: 0;
}

/* -- Navigation Link styles -- */





/* ------ Section 5 - Additional Navigation ------ */

/* -- Thumbnail-with-Caption Navigation -- */

.imageCaptionLinkGroup {}

.imageCaptionLinkGroup img {}

.imageCaptionLinkGroup href {}

.imageCaptionLinkGroup a {}

.imageCaptionLinkGroup .caption {}

/* -- Horizontal Text NavBar -- */

.text-NavBar ul {
list-style-type: none;
padding: 0;
margin: 0;
}

.text-NavBar ul li {
display: inline;
padding: 0;
margin: 0;
}

#PageTop .text-NavBar {
position: absolute;
top: 69px;
width: 100%;
background-color: #ffffff;
border-bottom: 3px solid #97e1da;
padding: 7px 0;
text-align: center;
}

#PageTop .text-NavBar a,
#PageTop .text-NavBar a:visited {
font-family: "arial black", san-serif;
font-size: 1rem;
font-weight: normal;
color: #7f7f7f;
text-decoration: none;
text-transform: uppercase;
text-align: center;
padding: 7px 14px;
}

#PageTop .text-NavBar a:hover,
#PageTop .text-NavBar a.anguilla-card:hover {
color: #97e1da;
}

#PageTop .text-NavBar a.anguilla-card {
color: #2B9FE1;
padding-top: 4px;
padding-bottom: 4px;
}

.anguilla-card-right-nav {
    position: relative;
    display: block;
}

.anguilla-card-right-nav span {
    position: absolute;
    top: 41px;
    width: 100%;
    text-align: center;
    color: #F00;
    text-transform: uppercase;
    font-size: .75rem;
}

.anguilla-card-right-nav:hover span {
    text-decoration: underline;
}

.anguilla-card-right-nav img {
    display: block;
    max-width: 100%;
}

#ContentColumn .text-NavBar {
border-bottom: 4px solid #f2f2f2;
margin: 0 auto 30px auto;
}

#ContentColumn .text-NavBar ul li {
padding: 0 10px 0 6px;
border-right: 2px solid #e6e6e6;
}

#ContentColumn .text-NavBar ul li:last-child {
border: none;
}

#ContentColumn .text-NavBar a {
text-decoration: none;
}

#ContentColumn .IntroBox .text-NavBar {
border-bottom: 2px solid #5776e7;
text-align: center;
}

#ContentColumn .IntroBox .text-NavBar a {
padding: 6px 12px;
}

#ContentColumn .IntroBox .text-NavBar a:hover {
color: #ffffff;
background-color: #5776e7;
}

#ContentColumn .IntroBox .text-NavBar ul li {
border-right: 2px solid #5776e7;
line-height: 2.5;
}

#ContentColumn .IntroBox .text-NavBar ul li:last-child {
border: none;
}

#Footer .text-NavBar p {
font-size: .75rem;
float: left;
width: 320px;
text-align: left;
padding: 7px 0 0 10px;
}

#Footer .text-NavBar {
background: transparent;
text-align: center;
padding: 15px 0;
}

#Footer .text-NavBar li a,
#Footer .text-NavBar li a:visited {
font-family: "Arial Black", san-serif;
font-size: 1rem;
text-decoration: none;
text-align: center;
padding: 5px 10px;
}




/* ------ Section 6 - Specific Font Styles ------ */

.sponsor {}

#NavColumn {}

#ExtraColumn {}

#Footer {}

#NavColumn h4 {}

#NavColumn h3 {}

#ExtraColumn h3 {
text-align: center;
}

#ExtraColumn h4 {}

.Caption {
font-size: .8rem;
font-weight: bold;
display: block;
margin: 30px 0 0 0;
text-align: center;
}

.ItemRight.Caption,
.ItemLeft.Caption {
text-align: center;
}

blockquote {
font-family: 'Courier New', monospace;
}

.QuotedText {
margin:12px 3%;
color:#006;
font-size:1rem;
line-height:20px;
font-family:'Courier New', Courier, monospace;
}

.small {}

.update {
color: #e12b62;
background-color: #ffffff;
border: 1px dashed #e12b62;
padding: 20px;
}



/* ------ Section 7 - Boxes ------ */

#postcard {}

#postcard img {}

#postcard h4 {}

.footerboxes {
text-align: center;
border-radius: 7px;
background: transparent;
}

.footerboxes h2 {
margin-bottom: 20px;
text-align: center;
}




.footerbox-inner {
vertical-align: top;
width: 170px;
padding:5px;
border: 1px solid lightblue;
display: inline-block;
float: none;
margin: 5px;
position: relative;
background:  #f3f3f3;
}

.footerbox-inner a .caption {
font-family:"Arial", sans-serif;
font-size: .75rem;
}

.footerbox-inner img {
margin-bottom: 10px;
padding: 5px;
background: white;
}

.boxtop {}

.boxcenter {}

.boxbottom {}

.non-nav-top {}

.non-nav-center {}

.non-nav-bottom {}

.nonnav-liner {}

.nonnav-liner p {}

.non-nav-top-rc {}

.non-nav-center-rc {}

.non-nav-bottom-rc {}

.nonnav-liner-rc {}

.nonnav-liner-rc p {}

.rightbox {}

.fblike-box {}

.fbcomment-box {}

.socialize-it {}

#PageWrapper .fb-comments-intro h2 {}

.site-sponsors {}

.site-sponsors img {}

.site-sponsors img:hover {}

.our-ads {}

.related-pages {}

.related-pages img {}

.related-pages img:hover {}

.CalloutBox {
background-color: #f2f2f2;
margin: 30px 0;
padding: 25px;
}


.CalloutBox .non-nav-top {
width: 680px;
height: 10px;
margin-bottom: 10px;
background-image: url(../image-files/calloutbox-top.png);
}

.CalloutBox .non-nav-liner {
margin: 0 25px;
}

.CalloutBox .non-nav-bottom {
width: 680px;
height: 10px;
margin-top: 15px;
background-image: url(../image-files/calloutbox-bottom.png);
}

.CalloutBox h3 {}

.CalloutBox h4 {
font-family: "Open Sans", Arial, Helvetica, sans-serif;
font-size: 1.2rem;
text-align: center;
}

.CalloutBox p {
margin: 10px 0 0 0;
}

#ContentColumn .linkbox .text-NavBar {
margin: 0 auto;
text-align: center;
border: none;
}

#ContentColumn .linkbox .text-NavBar ul li {
border-color: #bebebe;
}

#ContentColumn .linkbox .non-nav-top {
margin-bottom: 0;
}

#ContentColumn .linkbox .non-nav-bottom {
margin-top: 0;
}

.intro-title {
padding: 20px 25px 0 25px;
margin: 0;
background-color: #f2f2f2;
}

.IntroBox {
background-color: #f2f2f2;
padding: 25px 25px 5px 25px;
margin-bottom: 30px;
}

.IntroBox .rating {
font-size: .75rem;
}

.IntroBox h4 {}

.IntroBox p {}

.C2LeftBox {
width: 285px;
float: left;
padding: 20px;
margin: 5px 20px 0 0;
background-color: #f2f2f2;
text-align: center;
}

.C2LeftBox .non-nav-top {
width: 325px;
height: 10px;
margin-bottom: 10px;
background-image: url(../image-files/c2leftbox-top.png);
}

.C2LeftBox .non-nav-liner {
margin: 0 25px;
text-align: center;
}

.C2LeftBox .non-nav-bottom {
width: 325px;
height: 10px;
margin-top: 15px;
background-image: url(../image-files/c2leftbox-bottom.png);
}

.C2LeftBox h5 {
font-family: "Open Sans", Arial, Helvetica, sans-serif;
font-size: 1.25rem;
margin-top: 0;
color: #2b9fe1;
text-align: center;
}

.C2LeftBox p {}

.ReminderBox {}

.ReminderBox h5 {}

.ReminderBox p {}

.AdSenseBoxLeft, .AdSenseBoxRight, .AdSenseBoxCenter {}

.AdSenseBoxLeft {}

.AdSenseBoxRight {}

.AdSenseBoxCenter {}

.ReturnToNavBox {
width: 960px;
padding: 3px 0;
margin: 0 10px;
border-top: 1px dashed #cccccc;
font-size: .9rem;
}

.ReturnToNavBox p {
padding: 10px 25px;
margin: 0;
background-color: #f4f6fd;
}

/* -- RSS Box -- */

#RSSbox {}

.rss-icons {
width: 100px;
margin: 5px 10px 5px 0;
float: left;
}

.rss-icons ul {
list-style-type: none;
}

.rss-icons ul li {
padding: 0;
margin: 0;
line-height: 1.5;
}

/* -- News Box -- */

#news, #SUBSCRIBE {
    text-align:  center;
    padding: 15px;
    border:  1px solid #eee;
    background:  url(../image-files/aj-nonnav-center.png);
    margin-bottom: 20px;
}

#news .non-nav-top {}

#news .non-nav-center {}

#news .non-nav-bottom {}


#news .nonnav-liner {
}

#news .nonnav-liner h2 {
text-align: center;
margin: 0;
padding: 10px 20px;
}

#news .nonnav-liner p {
margin: 0 auto;
}

.news-item {
vertical-align: top;
position: relative;
display: inline-block;
font-size: 1rem;
color:#333;
background: #fff;
overflow: auto;
box-sizing: border-box;
border: 1px solid #ccc;
padding: 10px; 
border-radius:5px;
box-shadow: 3px 3px 3px #999;
margin:50px 20px;
max-width: 100%;
width: 320px;
overflow: hidden;
}

.news-item img {
max-width: 100%; 
height: auto;
margin:  0 auto;
}


.news-text {
position: absolute;
bottom: 0;
left: 0;
background:  rgba(255, 255, 255, .75);
padding: 5px;
text-align: left;
width: 100%;
padding: 10px;
}





.news-text p {
font-size: .85rem;
}

#news a {
font-family:"Arial", sans-serif;
font-weight: bold;
font-size: 1.1rem;
text-decoration: none;
text-align: center;
}

/* -- Subscribe Box -- */

#SUBSCRIBE form table {
    margin-bottom: 50px;
}

#SUBSCRIBE  {
}

#SUBSCRIBE {

}

#SUBSCRIBE h2,
#SUBSCRIBE p {
margin: 0;
}

#SUBSCRIBE h2 {
padding: 10px 25px 20px 25px;
}

#SUBSCRIBE p {
padding: 0 25px 20px 25px;
}

#email-box {
position: relative;
width: 628px;
height: 166px;
margin: 0 auto 25px auto;
color: #808080;
background: #ffffff url(../image-files/email-box-bg.png) no-repeat center center;
}

#email-box p {
font-size: .75rem;
padding-top: 10px;
text-align: center;
}

#email-box .button {
position: absolute;
top: 70px;
right: 25px;
}

#email-box .row {
padding: 20px 0 0 25px;
width: 390px;
text-align: right;
}

#email-box input[type="text"] {
width: 190px;
padding: 4px;
margin: 0 10px;
}

#email-box input[type="submit"] {
margin: 0 0 0 20px;
}

/* -- Right Column Boxes -- */

#about input[type="submit"] {
font-size: .75rem;
padding: 3px 10px;
margin: 5px 0 10px 0;
}

#about input[type="text"] {
font-size: .75rem;
padding: 4px;
margin-bottom: 5px;
}

#about,
#subscribe-box,
#sponsors,
#favorites {
padding: 15px;
margin-bottom: 10px;
font-size: .75rem;
background-color: #f2f2f2;
}

#subscribe-box h3 {
margin-bottom: 5px;
}

#subscribe-box .button {
text-align: center;
}

#subscribe-box .button input[type="submit"] {
margin-top: 5px;
}

/*new css id added by aj */
#SPONSORS,
#TEESHIRTS,
#VISITORS {
    margin: 0 auto;
    background: white;
    padding: 20px;
}

#VISITORS {
    border-radius: 0 0 5px 5px;
    box-shadow: 0 3px 3px #ccc;
}


#sponsors,
#favorites {
text-align: center;
}

#sponsors h3,
#favorites h3 {
margin-bottom: 0;
}

#sponsors p {
margin: 10px 0 0 0;
}

#sponsors a,
#favorites a {
font-family: Oswald;
font-size: .9rem;
}

#sponsors img,
#favorites img {
padding: 15px 0 5px 0;
}

/* -- Social Boxes -- */

#facebook-button {
vertical-align: top;
display:  inline-block;
margin-right: 10px;
position: relative;
padding-bottom: 10px;
}

#instagram-button {
vertical-align: top;
display:  inline-block;
margin-right: 10px;
position: relative;
padding-top:  7px;
padding-bottom: 10px;
}

#google-button {
display:  inline-block;
position: relative;
padding-bottom: 10px;
}

#google-follow {
display:  inline-block;
padding-bottom: 10px;
}

#twitter-button {
vertical-align: top;
display:  inline-block;
margin-right: 10px;
padding-bottom: 10px;
}

#facebook-bubble, #google-bubble {
font-size: .8rem;
position: absolute;
top: 25px;
left: 0;
width: 300px;
background-color: #e9f0ef;
padding: 15px;
z-index: 20;
-webkit-box-shadow: 0px 3px 6px rgba(50, 50, 50, 0.33);
-moz-box-shadow: 0px 3px 6px rgba(50, 50, 50, 0.33);
box-shadow: 0px 3px 6px rgba(50, 50, 50, 0.33);
}

#facebook-box {
    background: transparent;
    margin: 0;
    padding: 10px;
}

#ContentColumn #facebook-box {
margin-top: 50px;
}

/* -- C2 Boxes -- */

.c2inv .non-nav-top {
width: 680px;
height: 10px;
background-image: url(../image-files/nonnav-top2.png);
}

.c2inv .non-nav-bottom {
width: 680px;
height: 11px;
background-image: url(../image-files/nonnav-bottom2.png);
}

.c2_invitation {
padding: 25px;
background-color: #f2f2f2;
}

#INV {
font-size: 2rem;
padding: 0;
margin: 10px 0 30px 0;
line-height: 0.85;
text-align: center;
}

.c2Form {
margin: 0 auto 25px auto;
padding: 25px;
color: #808080;
border: 1px solid #e8e8e8;
background-color: #ffffff;
text-align: center;
}



/* ------ Section 8 - Frequently Used Styles ------ */

.getheretable {}

.getheretable th {}

.getheretable td {}

.getheretable tbody tr:hover td {}

.Clear,
.clear {
clear: both;
}

img {}

/* -- lists -- */

#ContentColumn ul {}

#ContentColumn li {}

#ContentColumn ol {}

#ContentColumn li {}

/* -- floats -- */

.ItemRight {
float: right;
margin: 5px 0 10px 10px;
text-align: left;
}

.ItemCenter {
background: #eee;
padding: 15px;
margin: 15px auto;
text-align: center;
clear: both;
max-width: 100%;
}

/************************
 This is for the youtube videos in an iframe, that are in the ItemCenter box
 ***********************/
 iframe {
    max-width: 100%;
    width: 560px;
    height: 315px;
    margin: 10px auto;
    text-align: center;
}

iframe img {
    bottom: 10px;
}


/***************************
 * This is new css to allow to videos wrapped in these classes to be 
 * responsive while still maintaining aspect ratio.
 * *************************/

.video-wrapper {
text-align:center;
width: 640px;
max-width: 100%;
margin:20px auto;
padding:10px;
}
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; 
height: 0; 
overflow: hidden;
background: white;
box-shadow: 3px 3px 3px #aaa;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}



.ItemLeft {
float: left;
margin: 5px 10px 10px 0;
text-align: left;
}

.MagImageWrapper {}

.mag {}

.center {
text-align: center;
}

.footerboxes h3 {}

#PageWrapper {}

div#sthoverbuttons.sthoverbuttons-pos-left {}

/* -- BlogIt -- */

.blogItItem {
padding: 20px 25px;
margin: 10px 0;
background-color: #f2f2f2;
}

.blogItItem h3 {
font-family: "Open Sans", Arial, Helvetica, sans-serif;
}

.blogItItem h6 {
font-family: "Open Sans", Arial, Helvetica, sans-serif;
font-size: .85rem;
margin-bottom: 5px;
}

.blogItThumbnail {
width: 160px;
margin: 3px 30px 10px 0;
float: left;
}

.blogItReadMore {
clear: both;
margin-top: 20px;
}

.gmap {}

/* -- Tabs for subnav in Center Column -- */

#ContentColumn .text-NavBar ul {}

.text-NavBar ul li {}

#ContentColumn .text-NavBar a {}

/* -- ONLY for text-nav in Callout or introBox -- */

#ContentColumn .CalloutBox .text-NavBar ul {}

.text-NavBar ul li {}

#ContentColumn .CalloutBox .text-NavBar a {}

#ContentColumn .IntroBox .text-NavBar ul {}

#ContentColumn .IntroBox .text-NavBar a {}

/* -- Various Elements -- */

.mini-gallery ul {
margin: 25px;
text-align: center;
}

.mini-gallery ul li {
display: inline;
padding: 0;
margin: 0;
}

.imagePreview {
background-color: #f2f2f2;
padding: 25px;
}

.imagePreview p {
font-size: .85rem;
}

table#thumbs {
background-color: #f2f2f2;
width: 660px;
padding: 25px;
margin-bottom: 30px !important;
}

table#thumbs img {
border: 4px solid #ffffff !important;
}

.bottom-line {
margin: 0 10px;
border-top: 1px dashed #cccccc;
}

#TopOfThePage {
    display: none;
    /*
width: 960px;
background: transparent url(../image-files/bottom-bg.png) no-repeat center bottom;
font-family: "Arial Black", sans-serif;
font-size: 16px;
text-transform: uppercase;
padding: 20px 0;
*/
}

#TopOfThePage a {
text-decoration: none;
}

#copyright {
font-size: .85rem;
color: #a8a8a8;
text-align: center;
padding: 20px;
background: #ffffff url(../image-files/aj-page-bg.jpg) repeat center top;
}


.anchor {
position: relative;
}

.anchor span {
position: absolute;
top: -120px;
}

.button {
   border-top: 1px solid #93caed;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#70acd4), to(#65a9d7));
   background: -webkit-linear-gradient(top, #70acd4, #65a9d7);
   background: -moz-linear-gradient(top, #70acd4, #65a9d7);
   background: -ms-linear-gradient(top, #70acd4, #65a9d7);
   background: -o-linear-gradient(top, #70acd4, #65a9d7);
   padding: 6px 12px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: .9rem;
   font-family: Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button:hover {
   border-top-color: #56788f;
   background: #56788f;
   color: #ccc;
   }
.button:active {
   border-top-color: #265575;
   background: #265575;
   }
   
.fb_iframe_widget_fluid {
	display: inline-block;
}

.mobileOnly, .mobile-only {
    display: none;
}

.desktopOnly, .desktop-only {
    display: block;
}

div #menu-sponsors {display: none;}

/********************************
NEW css for mobile, breakpoint set to 800px, instead of the tradional iPad size of 
768px. This is because many Sumsung tablets use 800px as their screensize so makes 
sense to include those in the tablet styles. Otherwise they see a desktop view 
and navigation
*********************************/

@media only screen and (max-width: 800px) {

.desktopOnly, .desktop-only {
    display:none;
}
.mobileOnly, .mobile-only {
    display:block;
}

html {
background: #ffffff url(../image-files/aj-page-bg.jpg) repeat center top;
padding: 0;
margin: 0;
}

body {
padding: 0;
margin: 0;
background-attachment: fixed;
background: transparent url(../image-files/aj-body-tablet.jpg) top center no-repeat;

}


#menu-sponsors{
    display: block !important;
    width: 100%;
    border-bottom: 3px solid lightblue;
    padding: 10px;
}
#menu-sponsors img {
    padding: 15px;
}


#PageWrapper {
    width: 100%;
    max-width: 100%;
    margin: 0 0;
    padding: 0;
    padding-top: 0;
}


#PageTop {
background-color: white;
position: relative;
top: 0;
left: 0;
width: 100%;
height: 120px;
z-index: 100;
border-bottom:  3px solid #97E1DA;
}

#TopBar {
position: relative;
width: 100%;
height: 120px;
margin: 0 auto;
}



#logo {
display: block;
width: 331px;
height: 55px;
padding-top: 15px;
margin: 10px auto;
text-align: center;
}

#SocialBar {
position: relative;
display: block;
margin-top: 10px;
width: 100%;
height: auto;
top: initial;
left: initial;
text-align: center;
}


div .top-social-holder {
position: absolute;
    display: block;
    z-index: 10000;
    top: -35px;
    left: 20px;   
}
 


#Header, #Header .Liner {
padding: 0;
position: relative;
width: 100%;
height: 100px;
background: transparent;
}


#ContentWrapper {
width: 90%;
margin:  0 auto;
background: #fff;
border-radius: 7px;
}


#ContentColumn {
width:100%;
margin:  0 auto;
padding:0;
}

#ContentColumn .Liner {
background: white;
position: relative;
margin: 0;
padding: 30px 20px;
z-index: 10;
}


#NavColumn {display: none;}

#ExtraColumn {
display: none;
}

#Footer {
clear: both;
width: 90%;
max-width: 100%;
margin: 0 auto;
background:  transparent;
border-radius:  7px;
margin-top: 20px;
}

.Liner {
padding: 10px;
*zoom: 1;
}



#Footer .Liner {
padding: 1px 0;
background: transparent;
}

.footerbox-inner {
width: 170px;
padding:5px;
margin: 5px;
}


.news-item {
margin:50px 10px;
max-width: 100%;
width: 270px;
overflow: hidden;
}



img {
    max-width: 100%;
    height: auto;
}

} /* end of 800px breakpoint */


@media only screen and (max-width: 767px) {

body {
padding: 0;
margin: 0;
background-attachment: fixed;
background: transparent url(../image-files/aj-body-tablet.jpg) top center no-repeat;
}


#PageWrapper {
    width: 100%;
    max-width: 100%;
    margin: 0 0;
    padding: 0;
    padding-top: 0;
}


#PageTop {
background-color: #ffffff;
position: relative;
top: 0;
left: 0;
width: 100%;
height: 120px;
z-index: 100;
border-bottom:  3px solid #97E1DA;
}

#TopBar {
display: block;
position: relative;
width: 100%;
height: 59px;
margin: 0 auto;
}



#logo {
position: relative;
display: block;
width: 100%;
height: 55px;
padding-top: 15px;
margin: 15px auto;
}

#SocialBar {

display: block;
width: auto;
height: auto;
text-align: center;
}


div .top-social-holder {
display: none !important;
}
 


#Header, #Header .Liner {
padding: 0;
position: relative;
width: 100%;
height: 100px;
background: transparent;
}


#ContentWrapper {
width: 98%;
margin:  0 auto;
background: #fff;
border-radius: 7px;
}


#ContentColumn {
width:100%;
margin:  0 auto;
padding:0;
border-radius: 7px;
}

#ContentColumn .Liner {
background: white;
position: relative;
margin: 0;
padding: 10px;
z-index: 10;
}



#NavColumn,
#ExtraColumn {
display: none;
}

 

#Footer {
clear: both;
width: 100%;
max-width: 100%;
margin: 0 auto;
background:  transparent;
border-radius: 0;
margin-top: 0;
}

.Liner {
padding: 10px;
*zoom: 1;
}



#Footer .Liner {
padding: 1px 0;
background: transparent;
}

.footerbox-inner {
width: 190px;
padding:5px;
margin: 5px;
}


.news-item {
    display: block;
    margin: 50px auto;
    max-width: 100%;
    width: 320px;
    overflow: hidden;
}


img {
    max-width: 100%;
    height: auto;
}

#facebook-box {
    background: transparent;
    margin: 0;
    padding: 10px;
}

#ContentColumn #facebook-box {
margin-top: 50px;
}


#SUBSCRIBE form table {
    width: 100%;
    margin: 20px 0;
}

#SUBSCRIBE form input[type="text"],
#SUBSCRIBE form input[type="submit"] {
    width: 80%;
}

#SUBSCRIBE form > table > tr > td{
font-size:  85% !important;
}

}


@media only screen and (max-width: 480px) {

body {
padding: 0;
margin: 0;
background-attachment: fixed;
background: transparent url(../image-files/aj-body-tablet.jpg) top center no-repeat;
}

#PageTop {
position: relative;
height: 120px;
background: white;
}

#SocialBar img {
    width: 15px;
    margin: 5px;
}

div .top-social-holder {
display: none !important;
}

#Header, #Header .Liner {
padding: 0;
position: relative;
width: 100%;
height: 70px;
background: transparent;
}
 
#ContentColumn .Liner {
background: white;
}
}

@media only screen and (max-width:360px) {

body {
padding: 0;
margin: 0;
background-attachment: fixed;
background: transparent url(../image-files/aj-body-mobile-big.jpg) top center no-repeat;
}

#PageTop {
position: relative;
height: 110px;
}

#SocialBar img {
    width: 15px !important;
    margin: 0 5px;
}

div .top-social-holder {
display: none !important;
}

#Header, #Header .Liner {
padding: 0;
position: relative;
width: 100%;
height: 100px;
background: transparent;
}

#ContentColumn .Liner {
background: white;
}
}


/***********
mcmenu
***********/


.menu-sponsors {
    width: 100%;
    display: block;
    padding: 10px;
    border-bottom: 2px solid lightblue;
    margin-bottom: 10px;
}

.menu-sponsors img {
    display:  inline-block;
    margin: 5px;
    border: 1px solid #aaa;
    padding: 3px;
    background: white;
}
#mcmenu
{
    width:auto;
    display:block;
    text-align:center;
    font-family: Arial, sans-serif;
    line-height:1.2;
    border-top: 1px solid #eee;
    border-bottom: 3px solid lightblue;
}
#mcmenu ul
{
    width:auto;
    display:block;
    font-size:0;
    text-align:center;
    color:#000000;
    background-color: #FFFFFF;
    border: transparent;
    margin:0; 
    padding:0;
    list-style:none;
    position:relative;
    z-index:999999990;
    border-radius: 3px;
} 

#mcmenu li
{
    display:inline-block;
    position:relative;   
    font-size:0; 
    margin:0;
    padding:0;
}

/*Top level items
---------------------------------------*/
#mcmenu .top-item 
{
    font-size:16px;
    color:#333;
    text-decoration:none;
    padding:10px 10px; 
    font-weight:400;
    text-transform:uppercase;
    letter-spacing:2px; 
    display:block;   
    position:relative;
    transition:all 0.3s;
}

#mcmenu li.over .top-item
{  
    color:#FFFFFF;
    background-color:#77A6F7;
}


/*Sub level items
---------------------------------------*/
#mcmenu .dropdown
{
    text-align:left;
    left:0;
    font-family:inherit;
    color: #222222;
    background-color:#FFFFFF;
    border:none;
    position:absolute;
    box-shadow: 0 4px 8px rgba(0,0,0,0.3);
    display:none;
    opacity:0;
    cursor:default;
}

#mcmenu .dropdown li {
    display: block;  
}

#mcmenu .sub-item, #mcmenu .clm a, #mcmenu .clm h3 
{
    font-size:15px;
    font-weight:400;
    font-family:inherit;
    margin:0;
    padding:8px 20px; 
    display:block;
    color:inherit;
    text-decoration:none;    
}
#mcmenu .clm h3 {
    font-size:20px;
    font-weight:700;
}
#mcmenu .sub-item {
    background-color:#FFFFFF;
    position:relative;       
    transition:all 0.3s;
}

#mcmenu li.over > .sub-item, #mcmenu li:hover > .sub-item
{
    color:#000000;
    background-color:#EEEEEE;
}

#mcmenu .clm a:hover
{
    color:#000000;
    transition:color 0.2s;
}

#mcmenu .dropdown.right0 {left:auto;right:0;} 
#mcmenu .dropdown li > .dropdown.right0 {left:auto;right:100%;} 
       
#mcmenu li.full-width{
    position:static;
}
#mcmenu li.full-width .dropdown{
    width:100%;
    left:0;
    box-sizing:border-box;
}  

#mcmenu li.over > .dropdown
{
    display:block;
    opacity:1;
    z-index:1;
}

#mcmenu .dropdown li > .dropdown
{
    left:100%; right:auto;
    top:0;
}

#mcmenu ul.dropdown
{
    min-width:250px; /* Sub level menu min width */
}

#mcmenu div.dropdown  {
    text-align:center;
}

/* each column */
#mcmenu .clm
{
    text-align:left;
    margin:20px;
    vertical-align:top;/*or middle*/
    width:auto;
    min-width:240px;
    display:inline-block;
    *display:inline;*zoom:1;
}

#mcmenu .clm a:hover
{
    color:#000000;
    text-decoration:underline;
}

/*-----------Arrows----------------*/
#mcmenu .arrow {
    color:inherit;
    border-style:solid; border-width:2px 2px 0 0; padding:5px; transform:rotate(135deg);margin-top:-10px;margin-left:5px;
    position:relative;
    display: inline-block;
    width: 0;
    height: 0;
    vertical-align:middle;
    overflow:hidden;/*for IE6*/
}
        
#mcmenu .dropdown .arrow,
#mcmenu.mobile .arrow {
    transform:rotate(45deg);
    top:50%;margin-top:-7px;
    position:absolute;left:auto;right:20px;
} 
#mcmenu.mobile .back-icon {
    margin:2px 10px 2px 4px;
    padding:5px;/*back arrow size*/
    border-width:0 0 2px 2px;/*back arrow thickness*/
    position:static;margin-top:0;
}
#mcmenu .back {
    display:none;
}
#mcmenu.mobile .back.show {
    display:block;
    text-align:center;
    margin:0;
    cursor:pointer;
    padding:20px 20px;
    color:#000000;
    background-color:#FFFFFF;
    font-size:22px;
    font-weight:400;
    text-transform:uppercase;
    letter-spacing:2px;   
}

/*######## styles for mobile mode ########*/

#mcmenu.mobile  {
    width:100%;
    max-width:500px;
    display:block;
    background-color:#FFFFFF;
    border:1px solid rgba(0,0,0,0.2);
    box-sizing:border-box;
}

/*--begin mark1--*/

#mcmenu.mobile  {
    position:relative;
    left:-130%;
    right:auto; box-shadow:4px 0 18px rgba(0,0,0,0.3);
    transition:all 411ms cubic-bezier(.7, 0,1,.4);
}

#mcmenu.mobile.active {
    left:0;
    transition:all 411ms cubic-bezier(.16,.76,.45,1);
}

#mcmenu.mobile {z-index:99999999;}

.menu-icon.active {z-index:999999994;position:relative;}

/*--end mark1--*/

#mcmenu.mobile ul  {
    background-color:transparent;
    transition:all 411ms ease;
    box-sizing:border-box;
    border:none;
    border-radius: 0;
}

#mcmenu.mobile .mobileHide {
    display:none;
}

#mcmenu.mobile li {
    text-align:center;
}

#mcmenu.mobile .top-item
{       
    font-size:17px;
}

/* #mcmenu.mobile li.over > .top-item
{
    color:#000000;
    background-color:#FFFFFF;
} */

#mcmenu.mobile .dropdown {
    border:none;
    border-radius:0;
    box-shadow:none;
} 
  
#mcmenu.mobile .clm {
    text-align:center;
    width:100%;
    border:none;
    margin:0;
    padding:0;
    display:block;
}

/*----------- menu-icon ----------------*/
.menu-icon-wrapper {
    padding:4px;
    text-align:left;
}
.menu-icon {
    padding:6px;
    display:none;
    cursor: pointer;
    outline: none;
    background-color:transparent;
    border:1px solid transparent;
    border-radius:3px;
    transition: all 0.25s ease-out;
    user-select:none;
    box-sizing:content-box;
    font-size:0;
    position:relative;
}

.menu-icon.mobile {display:inline-block;}

.menu-icon.active{
    background-color:transparent;
}

.three-line{
  width: 28px;
  height: 18px;
  position: relative;
  display: inline-block;
  font-size: 0;
}
.three-line span{
  background-color:#333333;
  position: absolute;
  border-radius: 2px;
  transition: transform .5s ease-in-out;
  width:100%;
  height: 2px;
  left: 0;
  transform: rotate(0);
}
.three-line span:nth-child(1){
  top:0;
}
.three-line span:nth-child(2){
  top:8px;
  visibility:visible;
}
.three-line span:nth-child(3){
  bottom:0;
}

.menu-icon.active .three-line span:nth-child(1){
  transform: rotate(225deg);
  top: 8px;

}
.menu-icon.active .three-line span:nth-child(2){
  transform: rotate(180deg);
  visibility:hidden;
}
.menu-icon.active .three-line span:nth-child(3){
  transform: rotate(315deg);
  top: 8px;
}

@keyframes topItemAnimation{
  from {opacity: 0;  transform:translate3d(-16%, 0, 0);}
  to {opacity: 1; transform:translate3d(0, 0, 0);}
}