/* Page */
#extensions h2 a img { display:block; }
#productheader { border-bottom:1px solid #e6e6e6; }
#productheader h1, 
#productheader h2 { margin-left:0; margin-top:-2px; height:34px; }
#productheader ul { margin-top:13px; }
#productheader ul li a { margin:0; color:#08c; float:none !important; }
#productheader ul li a:hover { text-decoration:underline; }
#main { overflow-x:hidden; }
.separator { clear:both; height:20px; }

/* more links */
a.more,
em.more,
span.more { background-image:url(/home/images/carat_small.png); background-position:100% 59%; background-size:6px 10px; }

a.small,
em.small,
span.small { background-size:5px 8px; }

a.backlink { padding-left:10px; background:url(/home/images/back_arrow.png) no-repeat 0% 59%; background-size:6px 10px;  }

@media only screen {
	a.more,
	em.more,
	span.more { background-image:url(/home/images/more.svg); }

	a.backlink { background-image:url(/home/images/back_arrow.svg); }
}

/* Hero Gallery */
.hero.gallery { position:absolute; overflow:hidden; margin-left:-518px; left:50%; padding-bottom:25px; z-index:30; width:1035px; height:500px; clear:both; float:none; }
.gallery-bg { position:absolute; top:-12px; left:50%; margin-left:-538px; width:1107px; height:500px; background:url(/home/images/hero-lockup_bg.jpg) 329px bottom no-repeat transparent; } 
.gallery-view { position:relative; margin:0 auto; z-index:10; width:980px; height:480px !important; }
.gallery-content { position:absolute; top:0; left:0; }
.gallery-content:first-child { margin-left: 0; }
.gallery-content.hide { display:none; }
.gallery-content.show { display:block; }
.gallery-content > div { float:left; }
.slide-description { 
	-webkit-transform:translateZ(0); 
	-webkit-transition:opacity 0.25s ease-out; 
	-moz-transition:   opacity 0.25s ease-out; 
	transition:        opacity 0.25s ease-out; }
.slide-description { margin:78px 0 0 34px; width:250px; height:460px; background:#fff; }
.slide-description img { margin-top:2px; margin-bottom:-1px; }
.slide-description h3 { margin-bottom:5px; }
.slide-description p { margin-top:10px; line-height:1.5; }
.slide-description .slide-subtitle { margin-bottom:2px; font-weight:bold; }
.slide-description > p:first-child, 
.slide-description .slide-subtitle { margin-top:0; }
.slide-ui { margin:90px 0 0 90px; width:540px; height:338px; }

/* Extension Specific */
.gallery-ddg .slide-description {margin-top:39px; }
.gallery-ddg .slide-description img { visibility:hidden; }
.gallery-ddg.active .slide-description img { visibility:visible; }

.gallery-pocket .slide-description {margin-top:82px; }

/* Hero Gallery Navs */
.paddle-nav { position:relative; width:100%; height:570px; *z-index:1; }
.paddle-nav li { _display:none; zoom:1; position:absolute; width:80px; height:570px; z-index:100; }
.paddle-nav .arrow-left { left:0; }
.paddle-nav .arrow-right { right:0; }
.paddle-nav li a { display:block; width:100%; height:100%; }
.paddle-nav li .arrow { display:block; opacity:0; filter:alpha(opacity=0); z-index:1002; outline:none; cursor:pointer; zoom:1; -webkit-transform:translateZ(0); 
	-webkit-transition:opacity 0.25s ease-out; 
	-moz-transition:   opacity 0.25s ease-out; 
	transition:        opacity 0.25s ease-out; }
.paddle-nav:hover li .arrow, 
.hero.gallery:hover + div + .paddle-nav li .arrow { opacity:1; filter:alpha(opacity=100); }
.paddle-nav li .arrow.disabled { cursor:default; opacity:0; filter:alpha(opacity=0); display:none; }
.paddle-nav li .arrow { padding:0 20px; position:absolute; z-index:1002; display:block; top:0; margin:0; width:60px; height:100%; text-indent:-9999px; overflow:hidden; background-repeat:no-repeat; background-position:50% 50%; background-size:36px 71px; zoom:1; -webkit-transform:translateZ(0); }
.paddle-nav li .arrow.prev { left:0; background-image:url(/home/images/paddle_prev_999.png); }
.paddle-nav li .arrow.next { right:0; background-image:url(/home/images/paddle_next_999.png); }
@media only screen and (max-width:1112px) {
	.paddle-nav li .arrow { width:36px; } 
}
@media only screen and (max-width:1079px) {
	.paddle-nav li .arrow { width:20px; } 
}
@media only screen and (max-width:1049px) {
	.paddle-nav { visibility:hidden; } 
}
@media all and (device-width: 320px) and (device-height: 480px), 
	(device-width: 320px) and (device-height: 568px), 
	(device-width: 768px) and (device-height: 1024px) {
	.paddle-nav { visibility:visible; } 
	.paddle-nav li .arrow { opacity:1; } 
}
.dot-nav { position:relative; top:524px; z-index:20; }
.dot-nav:nth-child(1n) li { width:18px; height:12px; }
.dot-nav:nth-child(1n) li a { width:10px; height:10px; border-radius:8px; background:none transparent; box-shadow:none; }
.dot-nav:nth-child(1n) li a:hover { background:none; }
.dot-nav:nth-child(1n) li a.active:hover { top:0; background:#08c; background:-webkit-gradient(linear,lefttop,leftbottom,color-stop(0%,rgb(126,198,234)),color-stop(24%,rgb(70,179,234)),color-stop(100%,rgb(3,135,201))); 
	background:-webkit-linear-gradient(top,rgb(126,198,234)0%,rgb(70,179,234)45%,rgb(3,135,201)100%); 
	background:   -moz-linear-gradient(top,rgb(126,198,234)0%,rgb(70,179,234)45%,rgb(3,135,201)100%); 
	background:        linear-gradient(top,rgb(126,198,234)0%,rgb(70,179,234)45%,rgb(3,135,201)100%); 
	-webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, .25); 
	   -moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, .25); 
	        box-shadow:inset 0 1px 0 rgba(0, 0, 0, .25); }
.inner-dot { position:absolute; width:6px; height:6px; top:2px; right:2px; background:#949494; border-radius:5px; *visibility:hidden; }
.dot-nav:nth-child(1n) li a.active .inner-dot { background:#fff; }

/* Search Categories */
.categories-row { margin:0 auto; width:980px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; }
ul.categories { position:relative; float:left; margin-left:0px; padding:8px 0; width:320px; *z-index:100; text-align:left; }
ul.categories .primary { *position:relative; margin:0; width:770px; height:36px; }
ul.categories li.main-cat { float:left; width:auto; padding:0 26px 0 13px; cursor:pointer; text-align:center; line-height:2.5; }
.more-menu { float:left; width:auto; padding:0 12px; cursor:pointer; text-align:center; line-height:2.5; *position:absolute; *top:0; }
ul.categories li:hover { color:#08c; }
ul.categories li.active { color:#999; }
.more-menu .menu-btn { color:#333; }
.notouch .more-menu .menu-btn:hover, 
.notouch .more-menu:hover .menu-btn, 
.notouch .more-menu.active .menu-btn:hover, 
.notouch .more-menu.active:hover .menu-btn,
.show-mobile-drop .menu-btn { text-decoration:none; color:#08c; }
.more-menu .menu-icon { position:relative; display:inline-block; width:15px; height:15px; top:3px; *top:0; background:url(/home/images/menu_icon.gif) 0 0 no-repeat #333; }
.notouch .more-menu:hover .menu-btn .menu-icon, 
.notouch .more-menu.active:hover .menu-btn .menu-icon,
.show-mobile-drop .menu-btn .menu-icon { background-color:#08c; }
.more-menu.active .menu-btn .menu-icon { background-color:#999; }
.more-menu.active .menu-btn { color:#999; }
.more-categories { display:none; padding:25px 10px 0; position:absolute; top:30px; left:0; *left:-175px; z-index:15; }
.notouch .more-menu:hover .more-categories,
.show-mobile-drop .more-categories { display:block; }
.more-categories ul { position:relative; top:-10px; padding:10px 0 10px 4px; width:300px; height:auto; background-color:rgba(242, 242, 242, 0.95); border:1px solid #c3c3c3; *background-color:rgb(242, 242, 242); *padding-left:30px; }
.more-menu:hover .more-categories ul li { color:#333; }
.more-menu:hover .more-categories ul li.active { color:#999; }
.more-menu:hover .more-categories ul li:hover { color:#08c; }
@media all and (device-width: 768px) and (device-height: 1024px) {
 	.more-categories { right:50px; } 
}
ul.categories .more-categories li { width:42%; text-align:left; float:none; display:inline-block; *float:left; line-height:2.2; }
@media only screen and (min-device-width:320px) and (max-device-width:480px) {
	ul.categories .more-categories li { font-size:0.80em; }
}
.more-categories > img { position:absolute; top:4px; left:262px; z-index:10; }
@media all and (device-width: 768px) and (device-height: 1024px) {
 	ul.categories .more-categories li { width:42%; } 
}

#extensionSearchForm { min-height:52px; }
.searchBar { float:right; position:relative; padding-top:14px; }
.searchBar input[type="search"] { padding:2px 2px 2px 7%; width:170px; font-size:1em; background:url(/home/images/icon-search.svg) 5px 50% no-repeat; background-size:12px 12px; outline:none; border:1px solid #666; border-radius:10px; color:#666;
	-webkit-appearance:none; 
	   -moz-appearance:none;
			appearance:none;
		-webkit-transition:all 0.2s ease-in-out;
		   -moz-transition:all 0.2s ease-in-out;
				transition:all 0.2s ease-in-out;
}
.firefox .searchBar input[type="search"] { padding:2px 2px 2px 11%; }
@media all and (device-width: 768px) and (device-height: 1024px) {
 	.searchBar input[type="search"] { padding-left:12%; }
}
@media only screen and (min-device-width:320px) and (max-device-width:480px) {
	.searchBar input[type="search"] { padding-left:12%; }
}
.searchBar input[type="search"]:focus { border: 1px solid #51cbee;
		-webkit-box-shadow: 0 0 5px #51cbee;
		   -moz-box-shadow: 0 0 5px #51cbee;
				box-shadow: 0 0 5px #51cbee;
}
.searchHeader { margin:8px 0 18px; padding-left:14px; }

/* Extension Content */
#main .extension-content { margin:40px auto; clear:both; float:none; width:980px; }
#main .extension-content ul { margin-top:70px; height:auto; background:url(/home/images/row-bg.png) 0 0 repeat-y transparent; }
#main .extension-content ul.threeItems { width:740px; }
#main .extension-content ul.twoItems { width:490px; }
#main .extension-content ul.oneItem { width:240px; }
#main .extension-content ul:first-child { margin-top:0; }
#main .extension-content ul:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; }
#main .extension-content .column { display:block; position:relative; float:left; margin:0 0 0 25px; padding-left:25px; width:200px; }
#main .extension-content ul .column.first-item { margin-left:0; padding-left:15px; border-left:none; clear:left; }
#main .extension-content .column h3 { padding:15px 0 2px; font-size:1.30em; line-height:1.20em; }
#main .extension-content .column a:hover h3 { color:#08c; }
#main .extension-content .column p { display:block; margin-bottom:12px; padding-top:6px; line-height:1.60em; }
#main .extension-content .column > a:hover { text-decoration:none; }
#main .extension-content .column span.category { font-size:0.85em; color:#666; }
#main .extension-content .column a.developerName { font-size:0.85em; white-space:normal; }
#main .extension-content .column a.developerName:hover { text-decoration:underline; }
.install-icon { position:relative; top:4px; display:inline-block; width:19px; height:19px; background:url(/home/images/icon-install.png) 0 0 no-repeat transparent; background-size:19px 19px; }
.installstarted { color:#08c; }
.installstarted .install-icon { -webkit-animation-name:rotateicon; -webkit-animation-duration:1s; -webkit-animation-iteration-count:infinite; -webkit-animation-timing-function:linear; background:url(/home/images/icon-installing.png) -1px 0 no-repeat transparent; }
@-webkit-keyframes rotateicon { from {-webkit-transform:rotate(0deg); } to {-webkit-transform:rotate(360deg); } }
.installcompleted { position:relative; top:4px; color:#999; }
.installfailed, 
.downloadfailure, 
.identifiermismatch, 
.extractionfailure { position:relative; display:block; padding-left:25px; top:4px; color:#c02; background:url(/home/images/icon-error.png) 0 0 no-repeat transparent; }
.installfailed .install-icon, 
.downloadfailure .install-icon, 
.identifiermismatch .install-icon, 
.extractionfailure .install-icon { display:none; }
.slide-description .install .installfailed, 
.slide-description .install .downloadfailure, 
.slide-description .install .identifiermismatch, 
.slide-description .install .extractionfailure { width:200px; }
.installcompleted .install-icon { display:none; }

/* Promo */
.promo { display:block; margin:10px auto 0; width:980px; float:none; clear:both; border-top:1px solid #c2c2c2; border-bottom:1px solid #c2c2c2; }
.promo .inner-content { padding:38px 0 20px; float:none; clear:both; display:inline-block; }
.promo .inner-content a.column { margin:0 20%; width:60%; }
.promo .inner-content a.column p { line-height:1.5; color:#333; }
.more.small { padding-right:12px; background:url(/home/images/carat_small.png) no-repeat center right; }

/* Details Page */
.details #main { width:980px; overflow-x:visible; }
.details #main .column.first { padding:25px 0 0 15px; width:45%; }
.details #main .column.first .extensionDetails { padding-top:50px; }
.details #main h3.title { padding:10px 0 8px; font-size:1.70em; line-height:1.20em; }
.details #main span.category { font-size:1.15em; line-height:1.7em; color:#666; }
.details #main p.description { padding-top:7px; line-height:1.60em; margin-bottom:5px; }
.details #main .install { padding-bottom:50px; }
.details h2.notFound { margin:25px 15px 0; font-weight:normal; font-size:1.35em !important; }

/* Promo */
.promo { display:block; margin:10px auto 0; width:980px; float:none; clear:both; border-top:1px solid #c2c2c2; border-bottom:1px solid #c2c2c2; }
.promo .inner-content { padding:38px 0 20px; float:none; clear:both; display:inline-block; }
.promo .inner-content a.column { margin:0 20%; float:left; width:60%; }
.promo .inner-content a.column p { line-height:1.5; color:#333; }
.more.small { padding-right:12px; background:url(/home/images/carat_small.png) no-repeat center right; }

/* Legal */
.sosumi { margin:10px auto; width:940px; clear:both; text-align:left; padding:0 20px; }
.sosumi li { padding-bottom:5px; }

.loading { position:relative; top:50px; text-align:center; height:0; z-index:100; }

@media only screen and (-webkit-min-device-pixel-ratio:1.5) and (min-device-width:321px), only screen and (min-device-pixel-ratio:1.5) and (min-device-width:321px) {
	.install-icon { background:url(/home/images/icon-install_2x.png); background-size:19px 19px; }
	.installstarted .install-icon { background:url(/home/images/icon-installing_2x.png); background-size:19px 19px; }
	.installfailed, 
	.downloadfailure, 
	.identifiermismatch, 
	.extractionfailure { background:url(/home/images/icon-error_2x.png)0 0 no-repeat transparent; background-size:19px 19px; }

	a.more,
	em.more,
	span.more { background-image:url(/home/images/carat_small_2x.png); background-position:100% 59%; background-size:5px 8px; }
}