User:Tierrie/Common.css

/****************/ /* portal metro */ /****************/ .portal_container { position: relative; display: inline-block; margin-bottom: 15px; width: 100%; } .portal_metro { border: 1px solid black; } .portal_metro .portal_metro { border: none; } .portal_metro table { border: none; } .portal_metro .portal_section { border: none; } .portal_metro .portal_body { padding: 0 10px 0 10px; overflow: hidden; } .portal_metro.ui-tabs .ui-tabs-panel { padding: 0; } .portal_metro#portal_main, .portal_vtab.ui-tabs-vertical, .portal_vtab.ui-tabs-vertical .ui-tabs-nav, .portal_vtab.ui-tabs-vertical .ui-tabs-panel { height: 450px; }

.portal_metro .portal_header { position: relative; } .portal_metro .portal_header_text { width: 100%; font-family: "Segoe UI", arial, verdana; font-size: 2em; text-align:left; text-transform: uppercase; border-bottom: none; margin-bottom: 6px; } .portal_metro .portal_headerlinks { font-size: 0.8em; position: absolute; right: 1em; top: 1em; padding-bottom: 2px; z-index: 1; } .portal_metro .portal_header, .portal_header a:link, .portal_header a:visited, .portal_header a:hover, .portal_header a:active { color: rgb(139,0,0); } .portal_metro .portal_subheader { padding: 0 1em; position: relative; font-size: 0.9em; } .portal_metro .portal_subheader, .portal_subheader a:link, .portal_subheader a:visited, .portal_subheader a:hover, .portal_subheader a:active { color: rgb(139,0,0); } .portal_metro .portal_subheader_text { display: table; width: 100%; padding: 0.4em 0 0 0; text-align: left; font-family: "Segoe UI", arial, verdana; font-size: 1.8em; color: rgb(139,0,0); }

.portal_metro#portal_slider .portal_body { padding: 0; }

/*******************/ /* portal sections */ /*******************/ /* portal section background */ .portal_metro#portal_forums:after, .portal_metro#portal_news:after, .portal_metro#portal_twitter:after, .portal_metro#portal_quotes:after, .portal_metro#portal_statistics:after, .portal_metro#portal_chat:after, .portal_metro#portal_images:after, .portal_metro#portal_help:after, .portal_metro#portal_affiliates:after { z-index: -1; background-repeat: no-repeat; content : ""; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; }

/* portal forums */ .portal_metro#portal_forums:after { background-image: url('http://img2.wikia.nocookie.net/__cb20141018230511/dragonage/images/3/30/Portal2_section_forums.jpg?1'); -webkit-filter: brightness(20%); -moz-filter: brightness(20%); filter: brightness(20%); } .portal_metro#portal_forums:hover:after { -webkit-filter: brightness(30%); -moz-filter: brightness(30%); filter: brightness(30%); }

/* portal news */ .portal_metro#portal_news:after { background-image: url('http://img2.wikia.nocookie.net/__cb20141018230512/dragonage/images/6/6e/Portal2_section_news.jpg?1'); -webkit-filter: brightness(30%); -moz-filter: brightness(30%); filter: brightness(30%); } .portal_metro#portal_news:hover:after { -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); } .portal_metro#portal_news .WikiaBlogListingPost { border-bottom: 1px solid black !important; }

/* portal twitter */ .portal_metro#portal_twitter:after { background-image: url('http://img1.wikia.nocookie.net/__cb20141018231003/dragonage/images/c/cb/Portal2_section_twitter.jpg?1'); -webkit-filter: brightness(30%); -moz-filter: brightness(30%); filter: brightness(30%); } .portal_metro#portal_twitter:hover:after { -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); }

/* portal quotes */ .portal_metro#portal_quotes:after { background-image: url('http://img4.wikia.nocookie.net/__cb20141018231933/dragonage/images/6/63/Portal2_section_quotes.jpg?1'); -webkit-filter: brightness(30%); -moz-filter: brightness(30%); filter: brightness(30%); } .portal_metro#portal_quotes:hover:after { -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); }

/* portal statistics */ .portal_metro#portal_statistics:after { background-image: url('http://img1.wikia.nocookie.net/__cb20141018230513/dragonage/images/b/b5/Portal2_section_statistics.jpg?1'); -webkit-filter: brightness(30%); -moz-filter: brightness(30%); filter: brightness(30%); } .portal_metro#portal_statistics:hover:after { -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); }

/* portal chat */ .portal_metro#portal_chat:after { background-image: url('http://img1.wikia.nocookie.net/__cb20141018230511/dragonage/images/4/42/Portal2_section_chat.jpg?1'); -webkit-filter: brightness(60%); -moz-filter: brightness(60%); filter: brightness(60%); } .portal_metro#portal_chat:hover:after { -webkit-filter: brightness(75%); -moz-filter: brightness(75%); filter: brightness(75%); }

/* portal images */ .portal_metro#portal_images:after { background-image: url('http://img2.wikia.nocookie.net/__cb20141018231551/dragonage/images/9/95/Portal2_section_images.jpg?1'); -webkit-filter: brightness(30%); -moz-filter: brightness(30%); filter: brightness(30%); } .portal_metro#portal_images:hover:after { -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); } .portal_metro#portal_images:after { background-image: url('http://img2.wikia.nocookie.net/__cb20141018231551/dragonage/images/9/95/Portal2_section_images.jpg?1'); -webkit-filter: brightness(30%); -moz-filter: brightness(30%); filter: brightness(30%); } .portal_metro#portal_images:hover:after { -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); } /* modify the default gallery to be component wide */ .portal_metro#portal_images .wikia-slideshow-images-wrapper.accent { border: none; padding: 0; background-color: transparent; } .portal_metro#portal_images .portal_body { padding: 0px; } .portal_metro#portal_images .wikia-slideshow { position: absolute; top: 0; width: 100%; } .portal_metro#portal_images .portal_header { z-index: 2; } .portal_metro#portal_images, .portal_metro#portal_images img.thumbimage, .portal_metro#portal_images .wikia-slideshow-wrapper, .portal_metro#portal_images .wikia-slideshow-wrapper, .portal_metro#portal_images .wikia-slideshow-images { height: 360px !important; } .portal_metro#portal_images img.thumbimage, .portal_metro#portal_images .wikia-slideshow-wrapper, .portal_metro#portal_images .wikia-slideshow-wrapper, .portal_metro#portal_images .wikia-slideshow-images { width: 100% !important; left: 0; } /* remove the bar that shows "1 of 6" */ .portal_metro#portal_images .wikia-slideshow-toolbar.clearfix { display: none !important; } /* move the image description and make it semi transparent */ .portal_metro#portal_images .wikia-slideshow-image-caption { bottom: 20px; background: rgba(0,0,0,0.5); } /* make the prev-next button component wide and tall */ .portal_metro#portal_images .wikia-slideshow-prev-next, .portal_metro#portal_images .wikia-slideshow-prev-next a { width: 100%; height: 100%; position: absolute; top: 0 !important; } /* remove the default image used for prev and next */ .portal_metro#portal_images .wikia-slideshow-prev-next a span { background-color: transparent; background-image: none; background-size: 100%; } .portal_metro#portal_images img.chevron { display: none; } /* place prev and next element halfway down the component */ .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-prev, .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-next { width: 64px; height: 64px; position: absolute; top: 40% !important; } /* create prev element and place it */ .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-prev { position: absolute; left: 10px; } .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-prev span { width: 64px; height: 64px; background-image: url('http://img3.wikia.nocookie.net/__cb20140914231609/dragonage/images/9/94/Metro_back.png?1'); background-repeat: no-repeat; margin: 0; opacity: 0.2; } .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-prev:hover span { opacity: 0.5; } /* create next button and place it */ .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-next { position: absolute; right: 10px; } .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-next span { width: 64px; height: 64px; background-image: url('http://img1.wikia.nocookie.net/__cb20141019004442/dragonage/images/2/26/Metro_forward.png?1'); background-repeat: no-repeat; margin: 0; opacity: 0.2; } .portal_metro#portal_images .wikia-slideshow-prev-next .wikia-slideshow-next:hover span { opacity: 0.5; }

/* portal help */ .portal_metro#portal_help:after { background-image: url('http://img4.wikia.nocookie.net/__cb20141018230649/dragonage/images/f/ff/Portal2_section_help.jpg?1'); -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); } .portal_metro#portal_help:hover:after { -webkit-filter: brightness(50%); -moz-filter: brightness(50%); filter: brightness(50%); }

/* portal affiliate */ .portal_metro#portal_affiliates:after { background-image: url('http://img4.wikia.nocookie.net/__cb20141018230509/dragonage/images/4/48/Portal2_section_affiliates.jpg?1'); -webkit-filter: brightness(40%); -moz-filter: brightness(40%); filter: brightness(40%); } .portal_metro#portal_affiliates:hover:after { -webkit-filter: brightness(50%); -moz-filter: brightness(50%); filter: brightness(50%); }

.portal_navlink { display: none; } .portal_vtab #toc { display: none; } .portal_vtab.ui-tabs-vertical { padding: 0; }
 * 1) portal_slider { }
 * 2) portal_slider .portal_navlink { display: block; position: absolute; bottom: 8px; left: 8px; z-index: 2; }
 * 3) portal_slider .portal_navlink img { opacity: 0.1; }
 * 4) portal_slider .portal_navlink img:hover { opacity: 0.8; }

.portal_vtab.ui-tabs-vertical .ui-tabs-nav { border: none; } .portal_vtab.ui-tabs-vertical .ui-tabs-panel { padding: 0; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav { padding: 0; width: 230px; float: left; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav li { cursor: pointer; margin: 0; top: 0; clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected { padding: 0; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav li a { background: none; text-transform: uppercase; color: rgb(192,0,0); font-family: "Segoe UI", arial, verdana; font-size: 1.4em; display:block; width: 100%; padding: .25em 0 .5em 1em; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected a { background: none; cursor: pointer; font-weight: normal; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav:after { height: 420px; content: ""; width: 100%; overflow-y: hidden; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav:before { } .portal_vtab.ui-tabs-vertical .ui-tabs-nav:before, .portal_vtab.ui-tabs-vertical .ui-tabs-nav:after, .portal_vtab.ui-tabs-vertical .ui-tabs-nav li.ui-state-default { background-color: rgba(0,0,0,0.6); } .portal_vtab.ui-tabs-vertical .ui-tabs-nav li.ui-state-active { background-color: transparent; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav li.ui-state-hover { background-color: transparent; /* background-image: -webkit-gradient(linear,0% 0%,0% 100%,color-stop(0,rgba(139,0,0,0)),color-stop(70%,rgba(139,0,0,0.2)),color-stop(100%,rgba(139,0,0,0.1))); */ }

.portal_vtab.ui-tabs-vertical { width: 100%; } .portal_vtab.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; border-right-width: 1px; border-right-width: 1px; } .portal_vtab.ui-tabs-vertical .ui-tabs-panel { float: left; } .portal_vtab.ui-tabs-vertical .ui-tabs-panel ul { padding-top: .3em; margin-bottom: 0; /* columns: 2; -webkit-columns: 2; -moz-columns: 2; */ } .portal_vtab.ui-tabs-vertical .ui-tabs-panel li { list-style: none; padding: .25em 0 .5em 1em; } .portal_vtab.ui-tabs-vertical .ui-tabs-panel li a { font-family: "Segoe UI", arial, verdana; font-size: 1.4em; display:block; color: rgb(255,255,255); } .portal_vtab.ui-tabs-vertical .ui-tabs-panel h2 { padding: 1em 0 0 1em; margin-top: 0; border-bottom: none; text-transform: uppercase; color: rgb(192,0,0); font-size: 1.4em; }

.cols_2 ul { columns: 2; -webkit-columns: 2; -moz-columns: 2; }

/* main background */ div[class^=portal_sliderlink] { position: relative; } div[class^=portal_sliderlink] .portal_slidertext { position: absolute; bottom: 10px; left: 10px; font-family: "Segoe UI", arial, verdana; width: 100%; font-size: 1.6em; color: rgb(255,255,255); text-transform: uppercase; cursor: pointer; } div.portal_sliderlink-2 .portal_slidertext { font-size: 2em; bottom: 20px; left: 20px; }
 * 1) portal_main .portal_sliderlink-2:hover img, #portal_main .portal_sliderlink-3:hover img, #portal_main .portal_sliderlink-4:hover img, #portal_main .portal_sliderlink-5:hover img, #portal_main .portal_sliderlink-6:hover img { -webkit-filter: none; -moz-filter: none; filter: none; }
 * 2) portal_main .portal_sliderlink-2 img { -webkit-filter: brightness(80%); -moz-filter: brightness(80%); filter: brightness(80%); }
 * 3) portal_main .portal_sliderlink-3 img, #portal_main .portal_sliderlink-4 img, #portal_main .portal_sliderlink-5 img, #portal_main .portal_sliderlink-6 img { -webkit-filter: brightness(70%); -moz-filter: brightness(70%); filter: brightness(70%); }
 * 4) portal_main .portal_sliderlink-2 { top: 0px; left: 0px; height: 450px; }
 * 5) portal_main .portal_sliderlink-3 { position: absolute; top: 0px; right: 0px; height: 112px; overflow: hidden; }
 * 6) portal_main .portal_sliderlink-4 { position: absolute; top: 112px; right: 0px; height: 113px; overflow: hidden; }
 * 7) portal_main .portal_sliderlink-5 { position: absolute; top: 225px; right: 0px; height: 112px; overflow: hidden; }
 * 8) portal_main .portal_sliderlink-6 { position: absolute; top: 337px; right: 0px; height: 113px; overflow: hidden; }

/* sub background */ /* variable width backgrounds */ @media screen and (max-width: 1024px) { #portal_main, #portal_series:after, #portal_lore:after, #portal_dai:after, #portal_da2:after, #portal_dao:after { width: 100%; } } @media screen and (min-width: 1024px) and (max-width: 1650px) { #portal_main, #portal_series:after, #portal_lore:after, #portal_dai:after, #portal_da2:after, #portal_dao:after { width: 100%; } } @media screen and (min-width: 1650px) { #portal_main, #portal_series:after, #portal_lore:after, #portal_dai:after, #portal_da2:after, #portal_dao:after { width: 100%; } }
 * 1) porta_main, #portal_series, #portal_lore #portal_dao, #portal_da2, #portal_dai { position: relative; }
 * 2) portal_series:after, #portal_lore:after, #portal_dao:after, #portal_da2:after, #portal_dai:after { z-index: -1; background-repeat: no-repeat; content : ""; display: block; position: absolute; top: 0; left: 0; height: 100%; opacity : 1; }
 * 3) portal_series:after { background-image: url('http://img4.wikia.nocookie.net/__cb20141018230051/dragonage/images/4/46/Portal2_bg_series.jpg?1'); -webkit-filter: brightness(50%) blur(1px); -moz-filter: brightness(40%) blur(1px); filter: brightness(40%) blur(1px); }
 * 4) portal_lore:after { background-image: url('http://img1.wikia.nocookie.net/__cb20141018230050/dragonage/images/e/e2/Portal2_bg_lore.jpg?1'); -webkit-filter: brightness(70%) blur(1px); -moz-filter: brightness(70%) blur(1px); filter: brightness(70%) blur(1px); }
 * 5) portal_dao:after { background-image: url('http://img1.wikia.nocookie.net/__cb20141018230049/dragonage/images/4/4f/Portal2_bg_dao.jpg?1'); -webkit-filter: brightness(50%) blur(1px); -moz-filter: brightness(50%) blur(1px); filter: brightness(50%) blur(1px); }
 * 6) portal_da2:after { background-image: url('http://img3.wikia.nocookie.net/__cb20141018230048/dragonage/images/8/85/Portal2_bg_da2.jpg?1'); -webkit-filter: brightness(50%) blur(1px); -moz-filter: brightness(50%) blur(1px); filter: brightness(50%) blur(1px); }
 * 7) portal_dai:after { background-image: url('http://img2.wikia.nocookie.net/__cb20141018230049/dragonage/images/7/7c/Portal2_bg_dai.jpg?1'); -webkit-filter: brightness(70%) blur(1px); -moz-filter: brightness(70%) blur(1px); filter: brightness(70%) blur(1px); }

/***************/ /* paper dolls */ /***************/ .paperdoll { background-image: url("http://images1.wikia.nocookie.net/dragonage/images/a/a1/Paperdoll.png"); width: 441px; height: 604px; border: 0px solid white; position: relative; font-family: georgia; font-weight: bold; color: #523F35; } .paperdoll div { width: 56px; height: 56px; } .paperdoll img { width: 56px; height: 56px; } .paperdoll .paperdoll_name { position: absolute; top: 60px; left: 68px; width: 300px; height: 24px; text-align: center; font-size: 16px; } .paperdoll .paperdoll_pri { position: absolute; top: 178px; left: 16px; width: 56px; height: 56px; } .paperdoll .paperdoll_helm { position: absolute; top: 248px; left: 16px; width: 56px; height: 56px; } .paperdoll .paperdoll_gloves { position: absolute; top: 317px; left: 16px; width: 56px; height: 56px; } .paperdoll .paperdoll_armor { position: absolute; top: 387px; left: 16px; width: 56px; height: 56px; } .paperdoll .paperdoll_boots { position: absolute; top: 456px; left: 16px; width: 56px; height: 56px; } .paperdoll .paperdoll_ammo { position: absolute; top: 108px; left: 361px; width: 56px; height: 56px; } .paperdoll .paperdoll_sec { position: absolute; top: 178px; left: 361px; width: 56px; height: 56px; } .paperdoll .paperdoll_belt { position: absolute; top: 248px; left: 361px; width: 56px; height: 56px; } .paperdoll .paperdoll_amulet { position: absolute; top: 317px; left: 361px; width: 56px; height: 56px; } .paperdoll .paperdoll_ring0 { position: absolute; top: 387px; left: 361px; width: 56px; height: 56px; } .paperdoll .paperdoll_ring1 { position: absolute; top: 456px; left: 361px; width: 56px; height: 56px; }

/**********************************/ /* import User:Tierrie/Common.css */ /**********************************/ .gray24_70 { background-image: url("http://images2.wikia.nocookie.net/__cb20101022055407/dragonage/images/1/13/Gray24_70.png");} .gray24_80 { background-image: url("http://images1.wikia.nocookie.net/__cb20101022055252/dragonage/images/e/e5/Gray24_80.png"); } .gray24_90 { background-image: url("http://images4.wikia.nocookie.net/__cb20101022055154/dragonage/images/a/ac/Gray24_90.png"); }

/* gives all polls some padding on the right so it is no longer flush against the edge */ .ajax-poll .pollAnswer { padding-right: 2em !important; }