@charset "utf-8";

/*
Customized theme for All About Vision
programmer: Ryan Herndon
designer: Steve Bagi
layouts: all pages included
Redesigned Aug 2013 and Feb 2015: Steve and Liz
*/

@media screen {

/* Global */
*	{ margin: 0; padding: 0; }
html	{ min-height: 100%; margin: 0 0; }
body	{ background-color: #fff; font: 13px/13px Open Sans, sans-serif; color: #000; text-align: center; background-image: url('http://cdna.allaboutvision.com/i/layout/top-band.png'), url('http://cdna.allaboutvision.com/i/layout/hed-shadow.png'), url('http://cdna.allaboutvision.com/i/layout/bg-216ca7.png'); background-size: 100% 22px, 200% 6px, 200% 338px; /*The 200% width is for retina displays, such as iPad*/ background-repeat: repeat-x, repeat-x, repeat-x; background-position: center top, 0 117px, bottom; }
.small_font	{ font-size: 11px; line-height: 11px; }
.normal_font	{ font-size: 12px; line-height: 12px; }
.large_font	{ font-size: 15px; line-height: 15px; }
body *	{ position: relative; }

/* Links */
a:link, a:visited	{ color: #2272b5; text-decoration: none; font-weight: bold; }
a:hover	{ text-decoration: underline; }

/* Site-wide classes */
.clear	{ clear: both; }
.clearL	{ clear: left; }
.floatR	{ float: right; }
.floatL	{ float: left; }
.alignC	{ text-align: center; }
.alignR	{ text-align: right; }
.hd	{ position: absolute; z-index: -100; visibility: hidden; } /* hides descriptive text of boxes in case CSS is disabled or not supported */
#skipNav	{ display: none; }
.other	{ color: #0a4379; }
a.def:link, a.def:visited, .glossary, a.def:hover	{ color: #000; text-decoration: none; border-bottom: 1px dashed #000; }
blockquote { margin-left: 20px; margin-right: 20px; }
.displayaftershortdelay { display: none; }

#container	{ top: 0; width: 1344px; height: auto; margin: 0 auto 32px; text-align: left; z-index: 3; }
#subpage #container .bottom, #homepage #container .bottom	{ position: absolute; bottom: 0; z-index: 1; width: 100%; }
#left	{ float: left; width: 216px; margin-left: 22px; }

/* Main header */
#header	{ float: left; width: 1300px; margin-top: 22px; margin-left: 22px; height: 95px; background: none; }
#logo { float: left; width: 215px; height: 58px; top: 17px; left: 1px; z-index: 1; }

#topNav	{ top: 56px; left: 43px; clear: right; margin: 0 0 17px; width: 900px; height: 17px; font-size: .1em; }
#topNav li	{ float: left; height: 17px; list-style: none; }
#topNav li a	{ display: block; overflow: hidden; height: 17px; background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png'); cursor: pointer; }
#topNav li span	{ position: absolute; left: 0; top: 0; height: 17px; display: block; background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png'); }
li#rs, li#fd { margin-left: 25px; }
li#pp a, li#pp span	{ width: 130px; background-position: 0px 0px; z-index: 150; }
li#pp a:hover span, li#pp.on span	{ background-position: 0px -17px; }
li#rs a, li#rs span	{ width: 144px; background-position: -130px 0px; z-index: 150; }
li#rs a:hover span, li#rs.on span	{ background-position: -130px -17px; }
li#fd a, li#fd span	{ width: 129px; background-position: -274px 0px; z-index: 150; }
li#fd a:hover span, li#fd.on span	{ background-position: -274px -17px; }
li#fls a, li#fls span	{ width: 106px; background-position: -403px 0px; z-index: 150; }
li#fls a:hover span, li#fls.on span	{ background-position: -403px -17px; }
li#fcs a, li#fcs span	{ width: 103px; background-position: -509px 0px; z-index: 150; }
li#fcs a:hover span, li#fcs.on span	{ background-position: -509px -17px; }

#findIt { float: right; top: 1px; width: 32px; height: 32px; border: 2px solid #e3e3e3; outline: none; border-radius: 36px; background: url('http://cdna.allaboutvision.com/i/layout/magnifier.svg') 9px 9px no-repeat; background-size: 15px 15px !important; transition: 2s; }
#findIt div { display: none; }
#findIt:hover, #findIt:hover div { display: inline; width: 296px; overflow: hidden; background-position: 273px 9px;
-webkit-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
-moz-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
-o-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
-webkit-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
-moz-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
-o-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */ }
#findIt:hover .submit { width: 24px; height: 30px; top: 0px; }
#findIt:hover .txtField { width: 240px; height: 22px; top: -10px; padding: 0px 13px 0px 13px; border: none; background-image: url('http://cdna.allaboutvision.com/i/sp.gif'); background: transparent; }
#findIt:hover input[type=text]:focus { background: transparent; border: none; outline: none; }
#findIt:hover input[type=image]:focus { background: transparent; border: none; outline: none; }

/* Menu, left side */
#menu { width: 216px; margin-top: 30px; z-index: 999; border-top: 1px solid #e3e3e3; }
#menu li { width: 216px; height: 26px; list-style: none; font-size: 15px; border-bottom: 1px solid #e3e3e3; border-collapse: collapse; }
#menu li a { display: block; width: 216px; height: 26px; background-color: #fff; font-weight: normal; color: #000; vertical-align: middle; }
#menu li a:hover { background-color: #2584d9; color: #fff; text-decoration: none; }
#menu li a span { left: 10px; top: 6px; }

/* Superfish styles for submenus */
#menu li ul.megamenu { position: absolute; left: 216px; top: -999em; width: auto; }
#menu li:hover ul.megamenu, #menu li.sfHover ul.megamenu { left: 216px; top: 0; z-index: 99; }
#menu ul.megamenu li { height: auto; border: none; }
#menu ul.megamenu a { background: none; }
#menu ul.megamenu a:hover { text-decoration: underline; }
#menu .wrapper { position: relative; float: left; width: auto; height: 100%; font-family: Open Sans, sans-serif; }
#menu .onecol, #menu .twocol { width: 360px; border: 4px solid #2584d9; }
#menu .twocol { width: 690px; }
#menu .wrapper .menuTop { position: absolute; left: 0; top: 0; float: left; width:100%; height: 50%; background-color: #fff; z-index: 2; }
#menu .wrapper .menuTop span { float: left; display:block; position:relative; width: 50%; height: 100%; background-color: #fff; z-index: 2; }
#menu .wrapper .menuBottom { position: absolute; left: 0; bottom: 0; float: left; width: 100%; height: 60%; background-color: #fff; clear: left; z-index: 1; }
#menu .wrapper .menuBottom span { float: left; display:block; position:relative; width: 50%; height:100%; background-color: #fff; z-index: 1; }
#menu .wrapper .column { float: left; top: 15px; margin: 0 15px 30px 0; width: 296px; height: 100%; z-index:3; }

/* Menu 2nd level */
#menu .column ul { float: left; left: 15px; width: 296px; height: auto; }
#menu .onecol .column ul { width: 380px; }
#menu .twocol .column ul { width: 300px; }
#menu .column ul li { float: left; left: 0; width: 100%; margin: 0 0 0 5px; font-size: 13px; line-height: 20px; }
#menu .column ul li a:link, #menu .column ul li a:visited, #menu .column ul li span { height: 1%; position: relative; color: #000; width: auto; }
.labelonly { color: #000; font-weight: bold; width: auto; }
#menu .twocol .column ul ul { }

/* Temporary */

#littleGirl #titleGirl { left: 217px; }

/* Bottom stuff */
#footer	{ float: left; width: 100%; height: 293px; margin: 100px 0 0 0; font-size: 1em; line-height: 1.3em; background-color: #216ca7; color: #fff; }
#footer a { color: #fff; font-weight: normal; }
#footer table { width: 700px; left: 280px; }
#footA { width: 162px; padding: 0; vertical-align: top; border-right: 1px solid #7aa7ca; }
#footB { width: 294px; padding: 0 20px 30px 20px; vertical-align: top; border-right: 1px solid #7aa7ca; }
#footC { width: 240px; padding: 0 0 0 20px; vertical-align: top; }
#footC #copyPro { width: 183px; float: right; }
#footB #footSM { position: relative; top: 5px; }
#footB #footSM li { margin: 0; padding: 0; list-style: none; position: absolute; top: 0; }
#footB #footSM li, #footB #footSM a { height: 21px; display: block; }
#footFB { left: 0px; width: 21px; background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -288px -38px; }
#footGP { left: 34px; width: 21px; background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -309px -38px; }
#footTW { left: 68px; width: 21px; background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -330px -38px; }
#footPN { left: 102px; width: 21px; background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -351px -38px; }
#footFB a:hover { background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -288px -59px; }
#footGP a:hover { background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -309px -59px; }
#footTW a:hover{ background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -330px -59px; }
#footPN a:hover { background: url('http://cdna.allaboutvision.com/i/layout/sprite-common-612x116.png') -351px -59px; }

#sLd { position: fixed; width: 700px; height: 150px; bottom: 0; z-index: 7; margin: 0 0 0 280px; padding: 0; display: none; }
#sLd img { width: 700px; height: 150px; border: none; }

#left .monKey	{ top: 30px; margin: 0 0 30px 0; text-align: left; }

#lowRightText #daunted, #lowLeftText #daunted, #lowUnderText #daunted { width: 82px; height: 9px; left: 217px; }
#lowRightText #objectDeSign { width: 300px; height: 250px; }
#lowLeftText #objectDeSign { width: 300px; height: 300px; }
#lowUnderText #objectDeSign { width: 300px; height: 600px; }

#goldenAMOforCLD { width: 300px; float: right; margin: 0 20px 10px 20px; }
#goldenAMO { width: 300px; height: 250px; }

#sheetCake { position: absolute; top: 0; left: 0; display: inline-block; width: 300px; height: 250px; z-index:5; }


/* responsive iframe test - june 2016 */
.intrinsic-container { position: relative; height: 0; overflow: hidden; }
/* 16x9 Aspect Ratio */
.intrinsic-container-16x9 { padding-bottom: 56.25%; }
/* 4x3 Aspect Ratio */
.intrinsic-container-4x3 { padding-bottom: 75%; }
/* 7x6 Aspect Ratio */
.intrinsic-container-7x6 { padding-bottom: 86%; }
.intrinsic-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

}


/* iPads (portrait and landscape) ------------------------------------------------------------------------------------------------------------------------------------------ */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {

body	{ background-color: #fff; font: 15px/15px Open Sans, sans-serif; color: #000; text-align: center; background-image: url('http://cdna.allaboutvision.com/i/layout/top-band.png'), url('http://cdna.allaboutvision.com/i/layout/hed-shadow.png'), url('http://cdna.allaboutvision.com/i/layout/bg-216ca7.png'); background-size: 100% 22px, 200% 6px, 200% 338px; background-repeat: repeat-x, repeat-x, repeat-x; background-position: center top, 0 117px, bottom; }
.small_font	{ font-size: 13px; line-height: 13px; }
.normal_font	{ font-size: 14px; line-height: 14px; }
.large_font	{ font-size: 15px; line-height: 15px; }

#container { top: 0; width: 1100px; height: auto; margin: 0 auto 32px; text-align: left; z-index: 3; }

#left { float: left; width: 176px; margin-left: 11px; }

#header { width: 1070px; margin-left: 11px; }

#topNav { top: 56px; left: 23px; width: 850px; }

#findIt:hover, #findIt:hover div { width: 176px; background-position: 153px 9px; }
#findIt:hover .txtField { width: 120px; height: 22px; }

li#rs, li#fd { margin-left: 10px; }

#menu { width: 176px; margin-top: 30px; z-index: 999; border-top: 1px solid #e3e3e3; }
#menu li { width: 176px; height: 26px; list-style: none; font-size: 15px; border-bottom: 1px solid #e3e3e3; border-collapse: collapse; }
#menu li a { display: block; width: 176px; height: 26px; background-color: #fff; font-weight: normal; color: #000; vertical-align: middle; }

#menu li ul.megamenu { position: absolute; left: 176px; top: -999em; width: auto; }
#menu li:hover ul.megamenu, #menu li.sfHover ul.megamenu { left: 176px; top: 0; z-index: 99; }

#footer { float: left; width: 100%; height: 350px; margin: 100px 0 0 0; font-size: .88em; line-height: 1.2em; background-color: #216ca7; color: #fff; }
#footer table { width: 543px; left: 216px; }
#footC #copyPro { width: 126px; float: right; }

#sLd { width: 543px; height: 116px; margin: 0 0 0 216px; }
#sLd img { width: 543px; height: 116px; }

}

/* Desktops with 1280-wide resolution  --------------------------------------------------------------------------------------------------------------- */
@media screen 
and (min-device-width : 1025px) 
and (max-device-width : 1280px) {

#container { top: 0; width: 1250px; height: auto; margin: 0 auto 32px; text-align: left; z-index: 3; }

#left { float: left; width: 206px; margin-left: 11px; }

#header { width: 1220px; margin-left:  11px; }

#topNav { top: 56px; left: 43px; width: 900px; }

#findIt:hover, #findIt:hover div { width: 246px; background-position: 223px 9px; }
#findIt:hover .txtField { width: 190px; height: 22px; }

li#rs, li#fd { margin-left: 25px; }

#menu { width: 206px; margin-top: 30px; z-index: 999; border-top: 1px solid #e3e3e3; }
#menu li { width: 206px; height: 26px; list-style: none; font-size: 15px; border-bottom: 1px solid #e3e3e3; border-collapse: collapse; }
#menu li a { display: block; width: 206px; height: 26px; background-color: #fff; font-weight: normal; color: #000; vertical-align: middle; }

#menu li ul.megamenu { position: absolute; left: 206px; top: -999em; width: auto; }
#menu li:hover ul.megamenu, #menu li.sfHover ul.megamenu { left: 206px; top: 0; z-index: 99; }

#footer { float: left; width: 100%; height: 293px; margin: 100px 0 0 0; font-size: 1em; line-height: 1.3em; background-color: #216ca7; color: #fff; }
#footer table { width: 663px; left: 245px; }
#footC #copyPro { width: 176px; float: right; }

#sLd { width: 663px; height: 142px; margin: 0 0 0 246px; }
#sLd img { width: 663px; height: 142px; }


}