/************************************************/ /** Basic **/ /************************************************/ * { margin: 0; padding: 0; } hr { margin: 0.25em 0 1.75em 0; color: #ffffff; border: 0; border-top: solid 1px #d5d5d5; } img { border: 0; } h1,h2,h3 { font-weight: normal; letter-spacing: -1px; color: #222222; } h4,h5 { color: #222222; } h3 a { color: #222222; text-decoration: none !important; } h1 { font-size: 2em; margin: 0 0 1em 0; } h1 a { color: #258B97; text-decoration: underline; } h1 .splitter { padding: 0 0.3em 0 0.3em; color: #B0B0B0; } h1 a:hover { text-decoration: none; } h2 { font-size: 1.75em; margin: 0 0 0.75em 0; } h2.special { font-size: 2em !important; margin: 0 0 1.2em 0; } h2 a { color: #222222; text-decoration: none !important; } .colB h2 { font-size: 1.5em; } a { color: #258B97; text-decoration: none; } a:hover { text-decoration: underline; } br.clear { clear: both; } body { background: url('images/bg3x.png'); min-width: 1000px; } p { line-height: 1.6em; margin: 0 0 2em 0; } body, input, select, textarea { font-family: "Trebuchet MS", sans-serif; font-size: 10pt; color: #353535; } input, select, textarea { border-radius: 4px; } input.text, select { border: solid 1px #d0d0d0; padding: 4px; } textarea { border: solid 1px #d0d0d0; padding: 1em; line-height: 1.5em; } acronym { cursor: help; } sup { font-size: 0.6em; letter-spacing: 0; line-height: 1em; } ol { padding-left: 1.5em; margin: 0 0 3em 0; } ol li { margin: 0; padding: 0; line-height: 1.6em; } ul.normal { padding: 0 0 0 1.5em; list-style: disc; } ul li { margin: 0; padding: 0; line-height: 1.6em; } dl { margin: 0 0 2em 0; } dl dt { margin: 0 0 0.75em 0; font-weight: bold; font-size: 1.1em; } dl dd { margin: 0 0 1.5em 2em; line-height: 1.6em; } .checklist { } .checklist ul { list-style: none; } .checklist ul li { background: url('images/icon-checkmark2.png') 0px 5px no-repeat; padding: 0 0 0 20px !important; min-height: 28px; } .note_error { background-color: #FFEEEE; border: solid 1px #CCAAAA; padding: 1em; margin: 0 0 1.5em 0; line-height: 1.5em; border-radius: 4px; } .note_information { background-color: #EEFFEE; border: solid 1px #AACCAA; padding: 1em; margin: 0 0 1.5em 0; line-height: 1.5em; border-radius: 4px; } .note_information .horizontalRule { border-top: solid 1px #AACCAA; margin-top: 0.75em; padding-top: 0.75em; } .note_nopad { margin: 0; } .positive_number { color: #007700; } .negative_number { color: #dd0000; } .currencySymbol { font-family: arial, helvetica; font-size: 0.9em; padding: 0 0.1em 0 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; } .negative_number .currencySymbol, .positive_number .currencySymbol { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } input.blank, textarea.blank { font-style: italic; color: #999999; } pre.code { background: #F3F3F3; border: dashed 1px #d0d0d0; padding: 15px; margin: 0 0 2em 0; border-radius: 4px; } .marked { background: #D0EAED; font-weight: bold; } .def, .cdef { border-bottom: dotted 1px #808080; } .def:hover, .cdef:hover { border-bottom: 0; } .defClick { } .popup { position: relative; background: #ffffff; width: 400px; height: 300px; padding: 35px; } .popup .closer { position: absolute; top: 15px; right: 15px; width: 23px; height: 23px; text-indent: -9999em; background: url('images/button-popupcloser.gif') top left no-repeat; outline: 0; } /************************************************/ /** Containers **/ /************************************************/ #outer1 { position: relative; background: #DBDBDB url('images/bg1.png') repeat-x 0px 0px; width: 100%; } #outer2 { background: url('images/bg2x.png'); width: 100%; } #outer2 .inner { background: url('images/bg2.png') top left repeat-x; } #outer3 { background: url('images/bg3.png') top left repeat-x; height: 250px; } #main { background: url('images/topbg.jpg?x=1') no-repeat 0px 0px; position: relative; width: 960px; padding: 0 20px 10px 20px; margin: 0 auto; } /************************************************/ /* Layout */ /************************************************/ /** No columns **/ .nocol { width: 960px; position: relative; } /** 2 Columns (v1) **/ .twocol1 { width: 960px; position: relative; } .twocol1 .colA { width: 650px; float: left; } .twocol1 .colB { width: 290px; margin-left: 670px; } /** 2 Columns (v2) **/ .twocol2 { width: 960px; position: relative; } .twocol2 .colA { width: 710px; float: left; } .twocol2 .colB { width: 230px; margin-left: 730px; } @font-face { font-family: 'Arvo'; font-style: normal; font-weight: 400; src: local('Arvo'), url(http://themes.googleusercontent.com/static/fonts/arvo/v5/WJ6D195CfbTRlIs49IbkFw.woff) format('woff'); } /************************************************/ /** Primary Elements **/ /************************************************/ /** Logo **/ #logo a { position: relative; z-index: 100; display: block; text-indent: -9999em; height: 138px; width: 500px; outline: 0; } /** Share Menu **/ #sharemenu { position: absolute; top: 144px; right: 26px; height: 32px; border-bottom: solid 1px #505050; background: url('images/topsubbg.png'); z-index: 1; line-height: 31px; min-width: 198px; border-radius: 4px; } #sharemenu ul { list-style: none; height: 20px; margin: 7px 10px 0 10px; } #sharemenu ul li { float: left; } #sharemenu ul li.t { padding: 0 8px 0 0; } #sharemenu ul li.gp { padding: 0 8px 0 0; } #sharemenu ul li.fb { width: 75px; padding: 0 0 0 0; } /** Top Menu **/ #topmenu { position: absolute; top: 70px; left: 0; width: 100%; } #topmenu ul { position: absolute; right: 40px; list-style: none; } #topmenu ul li { float: left; height: 23px; margin: 0 0 0 30px; background: url('images/ticons.png') no-repeat; } #topmenu ul li.account { padding: 0 0 0 27px; background-position: 0px 0px; } #topmenu ul li.cart { padding: 0 0 0 28px; background-position: 0px -23px; } #topmenu ul li.currency { padding: 0 0 0 23px; background-position: 0px -44px; } #topmenu ul li a { color: #ccc; } #topmenu ul li a:hover { color: #ffffff; text-decoration: none; } /** Menu **/ #menu { position: relative; height: 88px; margin: 0 0 35px 0; } #menu a:hover { text-decoration: none; color: #ffffff !important; } #menu ul { list-style: none; } #menu ul.pri { position: absolute; top: 0; left: 0; height: 43px; } #menu ul.pri li { position: relative; float: left; height: 45px; margin: 0 10px 0 10px; } #menu ul.pri li.first { } #menu ul.pri li.active { background: url('images/tab1.png') no-repeat -5px 0px; } #menu ul.pri li a { display: block; color: #cccccc; line-height: 42px; padding: 0 15px 0 15px; outline: 0; text-shadow: 0px 1px 0px rgba(0,0,0,0.5); } #menu ul.pri li.active span { display: block; position: absolute; z-index: 1; right: 0; top: 0; width: 5px; height: 45px; background: url('images/tab1.png') no-repeat 0px 0px; } #menu ul.pri li.active a { color: #ffffff; } #menu ul.sec { position: absolute; top: 47px; left: 0; height: 45px; } #menu ul.sec li { float: left; line-height: 44px; padding: 0 0 0 18px; } #menu ul.sec li.first { padding: 0 0 0 12px; } #menu ul.sec li.active { } #menu ul.sec li a { color: #ffffff; font-size: 1.2em; padding: 6px 13px 5px 13px; outline: 0; text-shadow: 0px 1px 0px rgba(0,0,0,0.5); } #menu ul.sec li.active a { background: url('images/tab2.png') 0px 0px repeat-x !important; border-radius: 4px !important; border-bottom: solid 1px #35a7b4 !important; border-top: solid 1px #00616d !important; } #menu ul.sec li:hover { } #menu ul.sec li:hover a { background: url('images/tab2.png') 0px -46px repeat-x; border-radius: 4px; border-top: solid 1px #4fc6d3; border-bottom: solid 1px #0a7582; } /** Banner **/ #banner { position: relative; width: 960px; height: 300px; margin: 0 0 25px 0; border-radius: 5px; overflow: hidden; } #banner p { text-indent: -9999em; } #banner ul { text-indent: -9999em; list-style: none; } #banner img.banner { width: 960px; height: 300px; position: absolute; border: 0; top: 0; left: 0; border-radius: 5px; } /** Footer 1 **/ #footer1 { width: 960px; margin: 0 auto; padding: 45px 0 35px 0; color: #a0a0a0; text-shadow: 0px 1px 0px rgba(0,0,0,1.0); } #footer1 ul { list-style: none; } #footer1 ul li { line-height: 1.75em; } #footer1 h2 { color: #ffffff; font-size: 1.5em; margin: 0.25em 0 0.8em 0; } #footer1 h2 a { color: #ffffff; } #footer1 h2 a.icon { position: relative; top: 2px; } #footer1 h2 a.icon img { padding: 0 0 0 10px; } #footer1 a { color: #BBBBBB; text-decoration: underline; } #footer1 a:hover { text-decoration: none; } #footer1 .fb-like-box { position: relative; left: -10px; margin: 0 0 5px 0; } #footer1 .tweets { } #footer1 .tweets ul { } #footer1 .tweets ul li { } #footer1 .tweets ul li p { margin: 0 0 5px 0; } #footer1 .tweets ul li .when { display: block; color: #555; margin: 0 0 10px 0; } #footer1 .colA, #footer1 .colB, #footer1 .colC { height: 310px; padding: 20px 0 20px 25px; } #footer1 .colA { border-right: solid 1px #151515; width: 270px; float: left; } #footer1 .colA .top { border-bottom: solid 1px #151515; margin-right: 25px; padding-bottom: 30px; } #footer1 .colA .bottom { border-top: solid 1px #323232; margin-right: 25px; padding-top: 15px; } #footer1 .colA ul li { margin: 0 0 10px 0; } #footer1 .colA ul li a { } #footer1 .colA ul li span { display: block; width: 50%; font-size: 0.9em; color: #666666; margin: 0; } #footer1 .colB { border-right: solid 1px #151515; border-left: solid 1px #323232; width: 270px; float: left; } #footer1 .colB ul li { margin: 0 0 11px 0; } #footer1 .colC { border-left: solid 1px #323232; width: 320px; float: left; } #footer1 .colC ul li { margin: 0 0 11px 0; } /** Footer 2 **/ #footer2 { width: 960px; margin: 0 auto; text-align: center; padding: 30px 0 0 0; color: #555555; text-shadow: 0px 1px 0px rgba(0,0,0,1.0); } #footer2 a { color: #707070; text-decoration: underline; } #footer2 a:hover { text-decoration: none; } #footer2 .paymethods { margin: 0; display: block; } #footer2 .paymethods img { } #footer2 .info { display: block; margin: 1em 0 0 0; font-size: 0.9em; } #footer2 .copyright { margin: 1.25em 0 0 0; display: block; text-align: center; } /** Account Bar **/ #accountBar { position: absolute; top: 35px; right: 30px; padding: 10px 0 10px 10px; } #accountBar ul { list-style: none; padding: 0; margin: 0; } #accountBar ul li { border-left: solid 1px #d0d0d0; padding-left: 1em; margin-left: 1em; float: left; } #accountBar ul li.first { border: 0; padding: 0; margin: 0; } /************************************************/ /** Secondary Elements **/ /************************************************/ a.continue { background: url('images/icon-paper.gif') center left no-repeat; padding: 0 0 0.2em 25px; line-height: 1em; } .byline { display: block; font-size: 1.1em; color: #777777; position: relative; top: -1.25em; margin: 0 0 0.5em 0; } .smallActionButton { color: #ffffff !important; text-decoration: none !important; background: url('http://www.variowinkel.nl/foto/982/banner8.jpg') 0px 0px; padding: 0.25em 0.5em 0.25em 0.5em; border: 0; font-size: 0.8em; cursor: pointer; border-radius: 4px; border-bottom: solid 1px #1d6068; text-shadow: 0px 1px 0px rgba(0,0,0,0.5); } .smallActionButton:hover { background-position: 0px -112px; } .actionButton { color: #ffffff !important; text-decoration: none !important; background: url('http://www.variowinkel.nl/foto/982/banner8.jpg') 0px 0px; padding: 0.3em 1em 0.3em 1em; border: 0; cursor: pointer; border-radius: 4px; border-bottom: solid 1px #1d6068; text-shadow: 0px 1px 0px rgba(0,0,0,0.5); } .actionButton:hover { background-position: 0px -112px; } .bigActionButton { color: #ffffff !important; text-decoration: none !important; background: url('http://www.variowinkel.nl/foto/982/banner8.jpg') 0px 0px; padding: 0.5em 1em 0.5em 1em; border: 0; font-size: 1.2em; cursor: pointer; border-radius: 4px; border-bottom: solid 1px #1d6068; text-shadow: 0px 1px 0px rgba(0,0,0,0.5); } .bigActionButton:hover { background-position: 0px -112px; } .hugeActionButton { color: #ffffff !important; text-decoration: none !important; background: url('http://www.variowinkel.nl/foto/982/banner8.jpg') 0px 0px; padding: 0.35em 1em 0.3em 1em; border: 0; font-size: 1.8em; cursor: pointer; border-radius: 4px; border-bottom: solid 1px #1d6068; letter-spacing: -1px; text-shadow: 0px 1px 0px rgba(0,0,0,0.5); } .hugeActionButton:hover { background-position: 0px -112px; } .altActionButton { background-position: 0px -56px; border-bottom: solid 1px #000000; } .altActionButton:hover { background-position: 0px -168px; } .darkActionButton { border-top: solid 1px #75E1E4; border-bottom: 0; box-shadow: 0px 0px 2px rgba(0,0,0,0.6); } .darkAltActionButton { border-top: solid 1px #707070; border-bottom: 0; box-shadow: 0px 0px 2px rgba(0,0,0,0.6); } .darkAltActionButton:hover { border-top: solid 1px #909090; } .borderedBox { border: solid 1px #d0d0d0; padding: 1em; } .dashedBox { border: dashed 1px #d0d0d0; padding: 1em; } .horizontalRule { border-top: solid 1px #d0d0d0; width: 100%; height: 1px; line-height: 1px; margin-top: 1em; padding-top: 1.25em; } .dashedHorizontalRule { border-top: dashed 1px #d0d0d0; width: 100%; height: 1px; line-height: 1px; margin-top: 0.5em; padding-top: 0.5em; } .specialBox { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -40px repeat-x; padding: 30px 20px 30px 20px; margin: 0; text-shadow: 0px 1px 0px #ffffff; border-radius: 4px; text-align: center; box-shadow: inset 0px 0px 0px 1px #ffffff; } .specialBox .message { font-size: 1.7em; letter-spacing: -1px; } .specialBox .subtext { display: block; margin: 2em 0 0 0; } /** Pager **/ .af_pager { font-size: 1.25em; position: relative; } .af_pager .actionButton { position: relative; display: block; float: left; width: 26px; height: 26px; padding: 0; margin: 0; text-align: left; text-indent: -9999em; } .af_pager .actionButton span { display: block; width: 26px; height: 26px; background: url('images/pagerbuttons.png') no-repeat; } .af_pager .first { margin-right: 0.5em; } .af_pager .first span { background-position: 0px 0px; } .af_pager .previous span { background-position: 0px -26px; } .af_pager .previous { margin-right: 0.5em; } .af_pager .next span { background-position: -26px -26px; } .af_pager .next { margin-left: 0.5em; } .af_pager .last span { background-position: -26px 0px; } .af_pager .last { margin-left: 0.5em; } .af_pager .pageNumber { height: 26px; line-height: 26px; display: block; float: left; margin: 0 0.35em 0 0.35em; color: #999999; } .af_pager .currentPageNumber { height: 26px; line-height: 26px; display: block; float: left; margin: 0 0.35em 0 0.35em; color: #353535; } /** Simple Table **/ .af_simpleTable { position: relative; width: 100%; border-collapse: collapse; } .af_simpleTable th { text-align: left; vertical-align: top; white-space: nowrap; line-height: 1.75em; padding: 0 2em 0 0; } .af_simpleTable td { vertical-align: top; line-height: 1.75em; padding: 0 1em 0 0; } .af_simpleTable td.first { padding-top: 0; } .af_simpleTable th.first { padding-top: 0; } /** Action List **/ .af_actionList { white-space: nowrap; } .af_actionList { text-align: left; } .af_actionList ul { margin: 0; padding: 0; } .af_actionList ul li { display: inline; padding-right: 0.25em; list-style: none; } .af_actionList ul li.first { } .af_actionList ul li.last { padding-right: 0em; } /** Form **/ .af_form { line-height: 1.5em; } .af_form .fieldError { background-color: #FFEEEE; border: solid 1px #CCAAAA; } .af_form .fieldError td { padding: 0.5em; } .af_form .errorMessage { font-size: 0.8em; margin-top: 0.5em; margin-bottom: 0.2em; } .af_form .infoMessage { font-size: 0.8em; margin-top: 0.5em; margin-bottom: 0.2em; font-style: italic; } .af_form table { border-collapse: collapse; } .af_form table.radioField { position: relative; padding: 0em; margin: 0em; border-collapse: collapse; width: auto; } .af_form table.radioField td { padding-right: 0.75em; } .af_form table.radioField td input.radio { position: relative; top: 0.25em; } .af_form tr.hidden { display: none; } /* 8086 .af_form input.text, .af_form select { border: solid 1px #d0d0d0; padding: 4px; } .af_form textarea { border: solid 1px #d0d0d0; padding: 1em; font-family: "Trebuchet MS", sans-serif; font-size: 1em; } */ .af_form .fieldTitle { font-weight: bold; white-space: nowrap !important; padding: 0.4em 1em 0 0; width: 9em; vertical-align: top; } .af_form tr td { padding: 0.25em 0 0.25em 0; } /** Table **/ div.af_table_layout { position: relative; width: 100%; } div.af_table_layout div.controlsA { position: relative; width: 100%; padding: 0 0 3em 0; } div.af_table_layout div.controlsA div.control1 { position: absolute; top: 0; right: 0; z-index: 1; } div.af_table_layout div.controlsA div.control1 .last { margin-right: 0; } div.af_table_layout div.controlsA div.control2 { position: absolute; top: 0; left: 0; z-index: 1; } div.af_table_layout div.controlsA div.control2 .first { margin-left: 0; } div.af_table_layout div.controlsA div.control3 { position: absolute; width: 100%; text-align: center; } div.af_table_layout div.controlsB { position: relative; width: 100%; padding: 0 0 3em 0; } div.af_table_layout div.controlsB div.control1 { position: absolute; top: 0; right: 0; z-index: 1; } div.af_table_layout div.controlsB div.control1 .last { margin-right: 0; } div.af_table_layout div.controlsB div.control2 { position: absolute; top: 0; left: 0; z-index: 1; } div.af_table_layout div.controlsB div.control2 .first { margin-left: 0; } div.af_table_layout div.controlsB div.control3 { position: absolute; width: 100%; text-align: center; } div.af_table_layout div.selector { } div.af_table_layout div.selector strong { padding: 0 0.5em 0 0; } div.af_table_layout div.selector form { display: inline; margin: 0 0.75em 0 0.75em; } div.af_table_layout div.search { } div.af_table_layout div.pager { position: relative; top: 0.25em; } div.af_table_layout div.globalActions { position: relative; top: 0.25em; } div.af_table_layout div.globalActions .af_actionList { text-align: center; } div.af_table_layout div.table { } .af_table { width: 100%; border-radius: 5px; overflow: hidden; } .af_table table { width: 100%; border-collapse: collapse; border: solid 1px #D0D0D0; } .af_table table th { background: #262626 url('images/bar5bg.png') 0px -1px repeat-x; padding: 0.75em 1em 0.75em 1em; text-align: left; color: #ffffff; } .af_table table th .smallActionButton { background: #262626 url('images/bar5bg.png') 0px -1px repeat-x; } .af_table table tr td { padding: 0.75em 1em 0.75em 1em; text-align: left; } .af_table table tr.row1 td { background: #F3F3F3; text-shadow: 0px 1px 0px #ffffff; } .af_table table tr.row2 td { background: #E8E8E8; text-shadow: 0px 1px 0px #ffffff; } .af_table table tr.rowDark { border-right: solid 1px #e4e4e4; border-left: solid 1px #e4e4e4; } .af_table table tr.rowDark td { color: #ffffff; background: #404040; padding: 1em; border-top: solid 1px #343434; text-shadow: 0px 1px 0px #000000; } /** Definition List **/ .dlist { } .dlist > ul { list-style: none; } .dlist > ul > li { padding: 1em 0 0 0; margin: 1em 0 0 0; border-top: solid 1px #d0d0d0; } .dlist > ul > li.first { border: 0; margin: 0; padding: 0; } .dlist > ul > li > span { display: block; } .dlist > ul > li > p { display: block; margin: 0.5em 0 0 1.25em; line-height: 1.5em; } /** Separated List **/ ul.slist { list-style: none; } ul.slist > li { padding: 1em 0 0 0; margin: 1em 0 0 0; border-top: solid 1px #d0d0d0; } ul.slist > li.first { border: 0; margin: 0; padding: 0; } /** XYZ Label **/ .xyzlabel { display: none; background: #262626; border: solid 1px #888888; color: #ffffff; padding: 16px 24px 16px 24px; width: 275px; font-size: 1em; z-index: 100; border-radius: 5px; } .xyzlabel .arrow { display: block; position: absolute; height: 17px; width: 100%; z-index: 101; } .xyzlabel_top_center { } .xyzlabel_top_center .arrow { bottom: -17px; left: 0; background: url('images/xyzarrow2.png') top center no-repeat; } .xyzlabel_top_right { margin-left: -28px; } .xyzlabel_top_right .arrow { bottom: -17px; z-index: 101; background: url('images/xyzarrow2.png') top left no-repeat; } .xyzlabel_top_left { margin-left: 28px; } .xyzlabel_top_left .arrow { z-index: 101; bottom: -17px; background: url('images/xyzarrow2.png') top right no-repeat; left: -14px; } .xyzlabel_bottom_center { margin-top: 15px; } .xyzlabel_bottom_center .arrow { top: -17px; left: 0; background: url('images/xyzarrow1.png') bottom center no-repeat; } .xyzlabel_bottom_right { margin: 15px 0 0 -28px; } .xyzlabel_bottom_right .arrow { top: -17px; z-index: 101; background: url('images/xyzarrow1.png') bottom left no-repeat; } .xyzlabel_bottom_left { margin: 15px 0 0 28px; } .xyzlabel_bottom_left .arrow { z-index: 101; top: -17px; background: url('images/xyzarrow1.png') bottom right no-repeat; left: -14px; } .xyzlabel span.pg { display: block; margin: 0.8em 0.75em 1em 1.25em; line-height: 1.25em; font-size: 1em; } .xyzlabel span.pglast { margin-bottom: 0.25em; } /** Box **/ .box { position: relative; background: #ffffff; padding: 35px 25px 35px 25px; border: solid 1px #C0C0C0; margin: 0 0 25px 0; border-radius: 5px; box-shadow: 0px 0px 4px rgba(0,0,0,0.1); } .box_view { border-top-right-radius: 0px; } .box_minimal { padding: 5px; } .box_minimal2 { padding: 25px 18px 30px 18px; } .box a { text-decoration: underline; } .box a:hover { text-decoration: none; } .box_minimal3 { padding: 25px 25px 25px 25px; } /** Box Tools **/ .boxtools { position: absolute; top: 30px; right: 25px; font-size: 1em; padding-top: 0.4em; color: #808080; } .boxtools_big { font-size: 1.5em; letter-spacing: -1px; } .boxtools ul { position: relative; list-style: none; float: left; } .boxtools ul li { float: left; padding-left: 1.1em; margin-left: 1.1em; border-left: solid 1px #d0d0d0; } .boxtools ul li.first { padding: 0; margin: 0; border: 0; } .boxtools .icon img { } .boxtools_big .icon img { padding: 0.15em 0 0 0; } .box_minimal3 .boxtools { top: 20px; } /** Thumblist **/ .thumblist { position: relative; } /** Small Thumblist **/ .smallThumblist { } .smallThumblist .thumb { position: relative; width: 175px; float: left; margin: 0 0 30px 7px; } .smallThumblist .first { margin-left: 0; } .smallThumblist .thumb .image { display: table-cell; width: 173px; height: 200px; vertical-align: middle; text-align: center; background: #fff url('images/bar2bg.png') top left repeat-x; border: solid 1px #ccc; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; padding: 4px 0 0 0; } .smallThumblist .thumb_short .image { height: 110px; } .smallThumblist .thumb .image a { display: inline-block; margin: 0 auto; width: 150px; max-height: 180px; overflow: hidden; outline: 0; } .smallThumblist .thumb .image a img { max-width: 150px; padding: 0; margin: 0; } .smallThumblist .thumb .variants { position: absolute; bottom: 12px; left: 13px; z-index: 1; opacity: 0.35; } .smallThumblist .thumb:hover .variants { opacity: 1.0; } .smallThumblist .thumb .variants ul { list-style: none; text-align: center; height: 14px; margin: 0 auto; } .smallThumblist .thumb .variants ul li { display: inline; } .smallThumblist .thumb .variants ul li img { width: 11px; height: 11px; border: solid 1px #343434; border-radius: 3px; } .smallThumblist .thumb .variants ul li.active img { border-color: #aaaaaa; } .smallThumblist .thumb .info { position: relative; width: 175px; height: 35px; background: url('images/thumbbg.png'); color: #ffffff; margin: 1px 0 0 0; } .smallThumblist .thumb .info .name { display: none; } .smallThumblist .thumb .info .description { display: none; } .smallThumblist .thumb .info .price { position: absolute; right: 12px; line-height: 35px; font-size: 1.3em; color: #ffffff; text-shadow: 0px 1px 0px rgba(0,0,0,0.5); } .smallThumblist .thumb .info .type { position: absolute; left: 12px; line-height: 35px; display: none; } .smallThumblist .thumb .actions { display: none; } /** Big Thumblist **/ .bigThumblist { } .bigThumblist .thumb { position: relative; width: 210px; float: left; margin: 0 0 30px 22px; } .bigThumblist .first { margin-left: 0; } .bigThumblist .thumb .image { display: table-cell; width: 208px; height: 280px; vertical-align: middle; text-align: center; border: solid 1px #d8d8d8; background: #fff url('images/bar2bg.png') top left repeat-x; border-radius: 4px; border: solid 1px #ccc; box-shadow: inset 0px 0px 0px 1px #ffffff; padding: 4px 0 0 0; } .bigThumblist .thumb_short .image { height: 140px; } .bigThumblist .thumb .image a { display: inline-block; margin: 0 auto; width: 185px; max-height: 255px; overflow: hidden; outline: 0; } .bigThumblist .thumb .image a img { max-width: 185px; padding: 0; margin: 0; } .bigThumblist .thumb .variants { position: absolute; z-index: 1; left: 12px; bottom: 8px; opacity: 0.35; } .bigThumblist .thumb:hover .variants { opacity: 1.0; } .bigThumblist .thumb .variants ul { list-style: none; text-align: center; height: 18px; margin: 0 auto; } .bigThumblist .thumb .variants ul li { display: inline; } .bigThumblist .thumb .variants ul li img { width: 16px; height: 16px; border: solid 1px #343434; border-radius: 3px; } .bigThumblist .thumb .variants ul li.active img { border-color: #AAAAAA; } .bigThumblist .thumb .info { position: relative; width: 210px; height: 35px; background: url('images/thumbbg.png') -175px 0px; color: #ffffff; margin: 1px 0 0 0; } .bigThumblist .thumb .info .name { display: none; } .bigThumblist .thumb .info .description { display: none; } .bigThumblist .thumb .info .price { position: absolute; right: 12px; line-height: 35px; font-size: 1.3em; } .bigThumblist .thumb .info .type { display: none; } .bigThumblist .thumb .actions { display: none; } /** Big Thumblist **/ .wideThumblist { margin: 30px 0 0 0; } .wideThumblist .thumb { margin: 0 0 60px 0; position: relative; width: 100%; min-height: 300px; } .wideThumblist .thumb_short { min-height: 240px; } .wideThumblist .thumb .image { display: table-cell; width: 293px; height: 300px; float: left; } .wideThumblist .thumb_short .image { height: 200px; } .wideThumblist .thumb .image .inner { display: table-cell; width: 293px; height: 300px; vertical-align: middle; text-align: center; background: #fff url('images/bar2bg.png') top left repeat-x; border: solid 1px #c8c8c8; border-radius: 4px; box-shadow: 0px 1px 3px 2px #efefef, inset 0px 0px 0px 1px #ffffff; } .wideThumblist .thumb_short .image .inner { height: 240px; } .wideThumblist .thumb .image .inner a { display: inline-block; max-height: 280px; overflow: hidden; } .wideThumblist .thumb .image .inner a img { max-width: 270px; /* max-height: 1000px; */ padding: 0; margin: 0 auto; } .wideThumblist .thumb .variants { position: absolute; bottom: 0; right: 0; padding: 10px; background: #EAEAEA url('images/bar7bg.png?x=1') 0px 0px repeat-x; border: solid 1px #d0d0d0; width: 563px; border-radius: 4px; box-shadow: 0px 1px 3px 2px #efefef, inset 0px 0px 0px 1px #ffffff; } .wideThumblist .thumb:hover .variants ul { opacity: 1.0; } .wideThumblist .thumb .variants ul { list-style: none; height: 35px; margin: 0 auto; opacity: 0.5; } .wideThumblist .thumb .variants ul li { display: inline; margin-right: 0px; } .wideThumblist .thumb .variants ul li img { width: 35px; height: 35px; border: solid 1px #ffffff; border-radius: 4px; } .wideThumblist .thumb .variants ul li.active img { border-color: #747474; } .wideThumblist .thumb .info { margin-left: 325px; } .wideThumblist .thumb .info .name { font-size: 2.1em; display: block; margin: 0 0 1.2em 0; padding: 10px 0 0 0; } .wideThumblist .thumb_short .info .name { margin: 0 0 1em 0; } .wideThumblist .thumb .info .name a { color: #222222; text-decoration: none; } .wideThumblist .thumb .info .name a:hover { text-decoration: underline; } .wideThumblist .thumb .info .type { display: none; } .wideThumblist .thumb .info .description { display: block; line-height: 2em; width: 565px; padding-bottom: 60px; overflow: hidden; } .wideThumblist .thumb_short .info .description { } .wideThumblist .thumb .info .description strong { color: #000000; } .wideThumblist .thumb .info .description .left { width: 48%; float: left; } .wideThumblist .thumb .info .description .right { width: 48%; float: left; } .wideThumblist .thumb .info .price { position: absolute; top: 0; right: 0; font-size: 2.25em; background: url('images/bar3bg.png') top left repeat-x; padding: 5px 15px 5px 15px; text-align: center; border: solid 1px #E4D3B9; color: #4C432D; letter-spacing: -1px; border-radius: 4px; text-shadow: 0px 2px 1px #ffffff; box-shadow: inset 0px 0px 0px 1px #ffffff; } .wideThumblist .thumb .actions { height: 30px; position: absolute; bottom: 10px; right: 10px; } .wideThumblist .thumb .actions ul { list-style: none; } .wideThumblist .thumb .actions ul li a { font-size: 1.1em; padding: 0.6em 1em 0.6em 1em; } /** Ad **/ .ad { margin: 0 0 15px 0; display: block; } .ad img { } /** News List **/ .newslist { } .newslist .title { display: block; } .newslist .when { display: block; font-size: 0.9em; color: #777777; margin: 0.5em 0 0 0; } /** News Item **/ .newsitem { } .newsitem .smallThumblist { margin: 0.5em 0 0.5em 0; } .newsitem .smallThumblist .thumb { margin-left: 35px; margin-bottom: 35px; } .newsitem .smallThumblist .first { margin-left: 0; } .newsitem a.continue { font-size: 1.2em; } .newsitem .when { } .newsitem .image { display: block; width: 600px; margin: 0 0 1.5em 0; } .newsitem a.image img { } /** Pager **/ .pager { position: relative; } .pager_top { position: absolute; top: 40px; right: 25px; } /** Colorbox **/ .colorbox { display: inline; } .colorbox strong { display: none; } .colorbox .opt { padding: 3px 17px 3px 17px; cursor: pointer; background-repeat: repeat-x !important; background-position: top left !important; } .colorbox .opt_beige { background: #e6ba8f url('images/color_beige.png'); } .colorbox .opt_black { background: #000000 url('images/color_black.png'); } .colorbox .opt_blue { background: #005bbc url('http://www.variowinkel.nl/foto/982/banner9.jpg'); } .colorbox .opt_brown { background: #5d2700 url('images/color_brown.png'); } .colorbox .opt_cyan { background: #00cddc url('http://www.variowinkel.nl/foto/982/banner10.jpg'); } .colorbox .opt_gray { background: #737879 url('images/color_gray.png'); } .colorbox .opt_green { background: #81b700 url('http://www.variowinkel.nl/foto/982/banner11.jpg'); } .colorbox .opt_magenta { background: #dc0079 url('images/color_magenta.png'); } .colorbox .opt_maroon { background: #470000 url('images/color_maroon.png'); } .colorbox .opt_orange { background: #e65f00 url('images/color_orange.png'); } .colorbox .opt_purple { background: #6000bd url('images/color_purple.png'); } .colorbox .opt_red { background: #dc0000 url('http://www.variowinkel.nl/foto/982/banner12.jpg'); } .colorbox .opt_white { background: #dbdbdb url('images/color_white.png'); } .colorbox .opt_yellow { background: #d8c400 url('images/color_yellow.png'); } .colorbox .opt_none { background: #292929 url('images/color_none2.png'); } .colorbox .panel .opt_none { background: #f7e8d1 url('images/color_none1.png'); } .colorbox .panel { padding: 26px 0 0 0; background: url('images/bar3arrow.png') 195px 0px no-repeat; } .colorbox .panel .inner { position: relative; right: -18px; width: 200px; background: #f5e4ca url('images/bar3bg.png') top left repeat-x; padding: 15px 15px 15px 15px; border-radius: 5px; border-bottom: solid 1px #FBF5E9; box-shadow: 0px 3px 2px rgba(0,0,0,0.2); } .colorbox .panel .inner .opt { border: solid 2px #FFFFFF; margin: 0 4px 0 4px; border-radius: 4px; padding-bottom: 5px; } .colorbox .panel .inner .first { } .colorbox .opener { border: solid 2px #404040; border-radius: 4px; } .colorbox .opener_active { border-color: #e6e6e6 !important; } .colorbox .opener:hover { border-color: #676767; } /** Currencybox **/ .currencybox { display: none; position: absolute; top: 0; left: 0; } .currencybox .panel { padding: 26px 0 0 0; background: url('images/bar3arrow.png') 140px 0px no-repeat; } .currencybox .panel .inner { position: relative; right: -18px; width: 240px; background: #f5e4ca url('images/bar3bg.png') top left repeat-x; padding: 15px 15px 15px 15px; border-radius: 5px; border-bottom: solid 1px #FBF5E9; box-shadow: 0px 3px 2px rgba(0,0,0,0.2); } .currencybox .panel .inner select { width: 100%; } .currencybox .panel .inner img { margin: 18px 0 0 0; } .currencybox .panel .inner p { font-size: 0.9em; margin: 10px 0 0 0; text-shadow: 1px 1px #FFFFFF; color: #7e6a43; } /************************************************/ /** Layouts **/ /************************************************/ /** View Ticket **/ #layout_viewTicket div.af_wa_guestTicketViewer { } /** Template Defaults: rootCommand **/ #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand { position: relative; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand .af_form textarea { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header { height: 5em; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header h2 { position: absolute; top: 0; left: 0; margin: 0; padding: 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header div.status { position: absolute; right: 0; top: 0.25em; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header div.info { position: absolute; top: 2.75em; left: 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header div.info ul { list-style: none; padding: 0; margin: 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header div.info ul li { float: left; margin-left: 0.75em; border-left: solid 1px #c0c0c0; padding-left: 0.75em; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header div.info ul li.first { margin-left: 0; border-left: 0; padding-left: 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header div.info2 { position: absolute; top: 2.75em; right: 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.header div.status .af_actionList { float: right; margin-left: 1em; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.pager { width: 100%; text-align: right; padding: 1em 0 1em 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table { margin: 1em 0 0 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table td { vertical-align: top; padding: 1.5em; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table td.body { width: 100%; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table .postauthor { font-weight: bold; display: block; white-space: nowrap; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table .postdate { font-size: 0.8em; display: block; white-space: nowrap; margin: 1em 0 0 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table td.body .postinfo { font-size: 0.8em; display: block; white-space: nowrap; margin: 2em 0 0 0; padding: 0.5em 0 0 0; color: #a0a0a0; border-top: solid 1px #e0e0e0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table .postattachments { margin: 1.25em 0 0 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table .postattachments ul { list-style: none; margin: 0; padding: 0; } #layout_viewTicket div.af_wa_guestTicketViewer div.rootCommand div.table .postattachments ul li { background: url('images/icon-paper.gif') 0px 2px no-repeat; padding: 0 0 0 25px; line-height: 1.6em; } /** Contact **/ #layout_contact .af_form textarea { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; margin: 1em 0 0 0; } #layout_contact .contactForm { width: 570px; float: left; } #layout_contact .contactAlt { width: 300px; margin-left: 610px; } #layout_contact .contactAlt h2 { margin: 0.2em 0 1.3em 0; } #layout_contact .contactAlt ul { list-style: none; padding: 0; margin: 0; } #layout_contact .contactAlt ul li { border-top: solid 1px #d0d0d0; padding: 2.2em 0 2.2em 0; } #layout_contact .contactAlt ul li a.title, #layout_contact .contactAlt ul li span.title { color: #222222; text-decoration: none; font-size: 1.3em; letter-spacing: -1px; display: block; height: 40px; line-height: 40px; padding-left: 55px; margin: 0 0 0.8em 0; outline: 0; } #layout_contact .contactAlt ul li .title { background: url('images/contacticons.png') no-repeat; } #layout_contact .contactAlt ul li .title a { color: #222222; text-decoration: none; } #layout_contact .contactAlt ul li .title a:hover { text-decoration: underline; } #layout_contact .contactAlt ul li a.title:hover { text-decoration: underline; } #layout_contact .contactAlt ul li .ticket { background-position: 0px 0px; } #layout_contact .contactAlt ul li .social { background-position: 0px -40px; } #layout_contact .contactAlt ul li .mail { background-position: 0px -80px; } #layout_contact .contactAlt ul li p { margin: 0; } #layout_contact .contactAlt ul li.first { border-top: 0; padding-top: 0; } /** Legal **/ #layout_legal { } #layout_legal h3 { font-size: 1em; margin: 0 0 1em 0; letter-spacing: 0px; } #layout_legal ul { list-style: none; } #layout_legal .foobar { padding-left: 1.75em; } #layout_legal ul li, #layout_legal ol li { line-height: 1.6em; margin: 1em 0 1em 0; } #layout_legal ul li h3, #layout_legal ol li h3 { display: inline; } #layout_legal ul li ul, #layout_legal ol li ol { margin-left: 2em; } /** List **/ #layout_list .heading { height: 70px; margin: 0 0 2em 0; } #layout_list .callout { display: none; position: relative; margin: 0 0 2em 0; background: url('images/calloutbg.png') top left repeat-x; padding: 25px 45px 25px 45px; font-size: 1.2em; text-align: center; border: solid 1px #E4D3B9; color: #72684E; border-radius: 4px; } #layout_list .callout strong { color: #42381E; } #layout_list .callout .arrow { position: absolute; top: -21px; left: 25px; background: url('images/calloutarrow.png'); width: 28px; height: 21px; text-indent: -9999em; } #layout_list .callout .closer { position: absolute; top: 8px; right: 8px; background: url('images/icon-close.gif'); width: 19px; height: 19px; text-indent: -9999em; } #layout_list .callout p { margin: 0; } #layout_list .thumblist { } #layout_list .found { display: block; font-size: 1em; color: #777777; position: absolute; top: 80px; right: 25px; } #layout_list .found_single { top: 44px; } #layout_list .calloutOpener { display: block; font-size: 1em; color: #777777; position: absolute; top: 80px; left: 25px; padding: 0 0 0 23px; background: url('images/icon-help.gif') 0px 2px no-repeat; } #layout_list .calloutOpener:hover { text-decoration: underline; } #layout_list .ipp { position: absolute; top: 41px; right: 400px; } #layout_list .ipp select { border: solid 1px #d0d0d0; padding: 3px; margin: 0 5px 0 5px; width: 50px; } #layout_list .switcher { position: absolute; top: 35px; left: 352px; } #layout_list .switcher ul { list-style: none; width: 150px; margin: 0 auto; } #layout_list .switcher ul li { width: 22px; height: 22px; float: left; cursor: pointer; padding: 8px; background: url('images/switcher.png') 0px -66px; margin: 0 5px 0 5px; } #layout_list .switcher ul li.active { background-position: -38px -66px !important; } #layout_list .switcher ul li.active span { position: relative; top: 1px; } #layout_list .switcher ul li:hover { background-position: -76px -66px; } #layout_list .switcher ul li span { display: block; width: 22px; height: 22px; background: url('images/switcher.png'); text-indent: -9999em; } #layout_list .switcher ul li.bigThumbs span { background-position: 0px 0px; } #layout_list .switcher ul li.bigThumbs:hover span { background-position: 0px -44px; } #layout_list .switcher ul li.bigThumbs_active span { background-position: 0px -22px; } #layout_list .switcher ul li.smallThumbs span { background-position: -22px 0px; } #layout_list .switcher ul li.smallThumbs:hover span { background-position: -22px -44px; } #layout_list .switcher ul li.smallThumbs_active span { background-position: -22px -22px; } #layout_list .switcher ul li.wideThumbs span { background-position: -44px 0px; } #layout_list .switcher ul li.wideThumbs:hover span { background-position: -44px -44px; } #layout_list .switcher ul li.wideThumbs_active span { background-position: -44px -22px; } #layout_list .searchbar { position: relative; background: #111111 url('images/bar1bg.png') top left repeat-x; margin: 0 0 20px 0; border-radius: 5px; } #layout_list .searchbar_off { } #layout_list .searchbar_off .container { display: none; } #layout_list .searchbar_off .shutter { background-image: url('http://www.variowinkel.nl/foto/982/banner13.jpg') !important; } #layout_list .searchbar .shutter { position: relative; width: 100%; height: 20px; cursor: pointer; background: #262626 url('images/searchbar-up.png') top center no-repeat; border-radius: 5px; border-top: solid 1px #404040; } #layout_list .searchbar .container { position: relative; } #layout_list .searchbar .shutter:hover { background-color: #373737; border-top: solid 1px #505050; } #layout_list .searchbar form { position: relative; padding: 20px 25px 18px 25px; } #layout_list .searchbar fieldset { position: relative; border: 0; } #layout_list .searchbar label { color: #ffffff; margin: 0 10px 0 0; } #layout_list .searchbar select { border: 0; padding: 3px; } #layout_list .searchbar input.text { border: 0; padding: 4px; } #layout_list .searchbar ul { position: relative; list-style: none; height: 33px; width: 910px; margin-top: 10px; } #layout_list .searchbar ul.first { margin-top: 0; } #layout_list .searchbar ul li { position: absolute; white-space: nowrap; top: 0; line-height: 33px; vertical-align: middle; } #layout_list .searchbar ul li.type { left: 0; } #layout_list .searchbar ul li.category { right: 268px; } #layout_list .searchbar ul li.search { left: 0; } #layout_list .searchbar ul li.price { right: 268px; } #layout_list .searchbar ul li.colors { right: 0; } #layout_list .searchbar ul li.controls { right: 0; height: 35px; position: absolute; width: 240px; bottom: 0; font-size: 1.2em; text-align: right; } #layout_list .searchbar ul li.controls a.reset { padding: 0.3em 1em 0.4em 1em; } #layout_list .searchbar ul li.controls a.search { padding: 0.3em 1em 0.4em 1em; } #layout_list .searchbar select.color { width: 45px; display: none; } #type { width: 258px; } #category { width: 240px; } #search { width: 385px; } #price { width: 135px; } #layout_list .listfooter { position: relative; padding: 3em 0 1em 0; min-height: 80px; } #layout_list .listfooter .colA { position: relative; width: 490px; float: left; border-right: solid 1px #d0d0d0; padding-right: 30px; line-height: 1.5em; } #layout_list .listfooter .colA h3 { font-size: 1em; float: left; } #layout_list .listfooter .colA span { display: block; margin-left: 105px; } #layout_list .listfooter .colB { margin-left: 530px; position: relative; width: 377px; } #layout_list .listfooter .colB .pager { position: absolute; top: 0; right: 0; } #layout_list .listfooter .colB .request { position: absolute; top: 55px; right: 0; } #layout_list .listfooter .colB .request span { padding-right: 0.75em; } #layout_list .noResults { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -40px repeat-x; padding: 20px 20px 30px 20px; margin: 0; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_list .noResults p { text-align: center; font-size: 1.1em; margin: 0 0 1em 0; } #layout_list .noResults .request { letter-spacing: -1px; text-align: center; } #layout_list .noResults .request span { font-size: 1.7em; padding-right: 0.5em; } /** View **/ #layout_view { } #layout_view .variantViewer { position: relative; overflow: hidden; z-index: 1; height: 61px; padding-left: 15px; } #layout_view .variantViewer_single { display: none; } #layout_view .variantViewer h3 { text-shadow: 0 1px 0px #FFFFFF; font-size: 1.2em; display: inline; float: left; padding-top: 19px; } #layout_view .variantViewer ul { list-style: none; position: absolute; right: 0; } #layout_view .variantViewer ul li { list-style: none; float: left; height: 60px; line-height: 60px; overflow: hidden; border-top: solid 1px #C0C0C0; border-right: solid 1px #C0C0C0; border-top-left-radius: 5px; border-top-right-radius: 5px; } #layout_view .variantViewer ul li.first { border-left: solid 1px #C0C0C0; } #layout_view .variantViewer ul li a { position: relative; display: block; border-top: solid 1px #ffffff; border-left: solid 1px #ffffff; border-right: solid 1px #ffffff; border-top-left-radius: 5px; border-top-right-radius: 5px; height: 58px; background: #dcdcdc url('images/bar7bg.png') top left repeat-x; font-size: 1.2em; color: #222222; text-shadow: 0 1px 0px #FFFFFF; padding-left: 50px; outline: 0; } #layout_view .variantViewer ul li a:hover { text-decoration: none; } #layout_view .variantViewer ul li a img { position: absolute; left: 19px; top: 19px; width: 22px; height: 22px; border-radius: 4px; } #layout_view .variantViewer ul li.active { background: #ffffff !important; border-color: #C0C0C0 !important; } #layout_view .variantViewer ul li.active a { border: 0 !important; background: none !important; } #layout_view .variantViewer ul li:hover { border-color: #b8c5c6; } #layout_view .variantViewer ul li:hover a { background: #cce2e4 url('images/bar8bg.png') top left repeat-x; } #layout_view .boxA { padding: 10px; width: 938px; position: relative; top: -1px; } #layout_view .relatedProducts { } #layout_view .relatedProducts .controls { position: absolute; right: 25px; top: 35px; } #layout_view .relatedProducts .controls div { position: relative; display: block; width: 26px; height: 26px; float: left; text-indent: -9999em; cursor: pointer; padding: 0; margin: 0 0 0 10px; } #layout_view .relatedProducts .controls div span { display: block; width: 26px; height: 26px; background: url('images/pagerbuttons.png') no-repeat; } #layout_view .relatedProducts .controls div.disabled { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)"; filter: alpha(opacity=25); -moz-opacity: 0.25; -khtml-opacity: 0.25; opacity: 0.25; cursor: default; } #layout_view .relatedProducts .controls .previous span { background-position: 0px -26px; } #layout_view .relatedProducts .controls .next span { background-position: -26px -26px; } #layout_view .relatedProducts .viewer { position: relative; overflow: hidden; height: 285px; } #layout_view .relatedProducts .viewer .thumblist { position: absolute; left: 0; top: 0; } #layout_view .left { position: relative; float: left; width: 700px; } #layout_view .payFooter { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -40px repeat-x; padding: 20px; margin: 15px; text-align: center; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_view .payFooter p { margin: 0 0 15px 0; font-size: 1.2em; } #layout_view .payFooter .methods { margin: 0 0 25px 0; } #layout_view .payFooter .seal { margin: 30px 0 0 0; } #layout_view .payFooter ul { list-style: none; } #layout_view .payFooter ul li { padding: 0 5px 0 5px; display: inline; } #layout_view .payFooter ul li a { padding-top: 0.5em; padding-bottom: 0.4em; text-align: center; font-size: 1.4em; letter-spacing: -1px; } #layout_view .features { padding: 40px 15px 35px 15px; } #layout_view .features h2 { margin: 0 0 1.2em 0; } #layout_view .features ul { list-style: none; } #layout_view .features ul li { position: relative; margin: 25px 0 0 0; border-top: solid 1px #d0d0d0; padding: 25px 0 0 0; } #layout_view .features ul li.first { border-top: 0; padding: 0; margin: 0; } #layout_view .features ul li .title { margin: 0 0 0.5em 0; background: url('images/icon-checkmark3.png') top left no-repeat; height: 30px; padding: 5px 0 0 38px; line-height: 1.4em; } #layout_view .features ul li .title h3 { font-size: 1.4em; font-weight: normal; display: inline; } #layout_view .features ul li .title .seeLive { padding: 0 0 0 0.5em; position: relative; top: -0.2em; } #layout_view .features ul li p { margin: 0 0 0 38px; } #layout_view .preview { position: relative; border: solid 1px #d0d0d0; background: #F2F6F7; width: 700px; text-align: center; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } #layout_view .preview .image_padded { padding: 40px 0 40px 0; } #layout_view .preview .image_padded img { border: solid 1px #d0d0d0; } #layout_view .preview .image { position: relative; height: 150px; } #layout_view .preview .image img { margin: 0 auto; padding: 0; display: block; } #layout_view .preview .loader { z-index: 100; position: absolute; top: 50%; left: 50%; width: 56px; height: 56px; background: url('images/loader.gif'); margin-left: -28px; margin-top: -28px; display: none; border-radius: 4px; border-bottom: solid 1px #3E787C; } #layout_view .preview .summary { margin: 0 auto; background: #427100 url('images/bar4bg.png') top left repeat-x; color: #ffffff; padding: 1.5em 0 1.5em 0; border-top: solid 1px #75E1E4; border-bottom: solid 1px #1d6068; } #layout_view .preview .source { margin: 0 auto; background: #e8e8e8; padding: 1.5em; } #layout_view .preview .info { padding: 1.25em; line-height: 1.5em; color: #808080; font-size: 0.9em; } #layout_view .preview .info a { color: #808080; } #layout_view .preview .social { margin: 1.5em 0 0.5em 0; } #layout_view .preview .social ul { list-style: none; width: 255px; margin: 0 auto; } #layout_view .preview .social ul li { float: left; width: 80px; margin: 0 5px 0 5px; z-index: 1; position: relative; } #layout_view .preview .social ul li.facebook { width: 47px; } #layout_view .preview .social ul li.twitter { width: 66px; } #layout_view .preview .social ul li.googleplus { width: 54px; } #layout_view .preview .social ul li.pinterest { width: 48px; } #layout_view .dlist { margin: 25px 0 0 725px; width: 200px; } #layout_view .dlist > ul > li { padding: 28px 0 15px 0; } #layout_view .dlist > ul > li.first { padding: 0 0 5px 0; } #layout_view .dlist .price { font-size: 1.5em; } #layout_view .dlist .title { display: block; margin: 0 0 1.25em 0; } #layout_view .dlist h3 { display: inline; font-size: 1.4em; } #layout_view .previewBar { } #layout_view .previewBar { position: relative; background: #111111 url('images/bar1bg.png') top left repeat-x; padding: 25px 25px 25px 25px; margin: 0 0 20px 0; width: 910px; min-height: 80px; border-radius: 5px; } #layout_view .previewBar h1 { color: #ffffff; margin: 0 0 10px 0; } #layout_view .previewBar a { color: #ffffff; text-decoration: underline; } #layout_view .previewBar a:hover { text-decoration: none; } #layout_view .previewBar p { color: #c5c5c5; margin: 0; width: 690px; line-height: 1.4em; } #layout_view .previewBar ul { position: absolute; top: 19px; right: 25px; list-style: none; } #layout_view .previewBar ul li { } #layout_view .previewBar ul li a { display: inline-block; width: 200px; height: 36px; padding: 0; line-height: 36px; text-align: center; margin: 5px 0 5px 0; font-size: 1.4em; letter-spacing: -1px; } #layout_view .liveDemo { position: relative; top: -10px; display: none; margin: 28px 0 25px 0; } #layout_view .liveDemo a { display: inline-block; width: 200px; padding: 0.5em 0 0.4em 0; text-align: center; } #layout_view .thumbViewer { width: 200px; margin: 24px 0 0 0; } #layout_view .thumbViewer ul { list-style: none; display: none; } #layout_view .thumbViewer li { position: relative; margin: 0 0 12px 0; padding: 3px; border: solid 1px #ffffff; border-radius: 4px; } #layout_view .thumbViewer li .title { position: absolute; top: 0; left: 80px; line-height: 63px; display: block; text-shadow: 0px 1px 0px #ffffff; } #layout_view .thumbViewer li .thumb { background: #ffffff; border: solid 1px #d0d0d0; width: 64px; height: 54px; overflow: hidden; } #layout_view .thumbViewer li .thumb .outer { border: solid 2px #ffffff; width: 60px; height: 50px; overflow: hidden; } #layout_view .thumbViewer li .thumb .inner { height: 50px; width: 60px; display: table-cell; vertical-align: middle; } #layout_view .thumbViewer li .thumb .inner img { display: block; width: 60px; } #layout_view .thumbViewer li.active { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -40px repeat-x; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_view .faq { position: relative; color: #bbbbbb; padding: 30px 25px 35px 25px; width: 910px; text-shadow: 0px 1px 0px rgba(0,0,0,1.0); } #layout_view .faq1 { background: #262626 url('images/bar5bg.png') top left repeat-x; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom: solid 1px #101010; } #layout_view .faq2 { background: #181818; margin: 0 0 20px 0; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top: solid 1px #383838; } #layout_view .faq ul { list-style: none; } #layout_view .faq ul li { float: left; width: 280px; margin-left: 30px; } #layout_view .faq ul li.q1 { margin: 0; } #layout_view .faq ul li p { margin: 0; } #layout_view .faq h2 { color: #ffffff; font-size: 1.75em; margin: 0 0 1.3em 0; } #layout_view .faq h3 { font-weight: bold; color: #f7f7f7; margin: 0 0 1em 0; font-size: 1.1em; letter-spacing: 0; } #layout_view .faq a { color: #ffffff; text-decoration: underline; } #layout_view .faq a:hover { text-decoration: none; } #layout_view .faq .faqfooter { text-align: center; margin: 2.5em 0 0 0; border-top: solid 1px #101010; } #layout_view .faq .faqfooter h3 { border-top: solid 1px #383838; padding: 2em 0 0 0; font-size: 1.5em; font-weight: normal; margin: 0 0 0.3em 0; } #layout_view .faq .faqfooter p { margin: 0; font-size: 1.2em; } #layout_view .faq .faqtools { position: absolute; top: 30px; right: 25px; font-size: 1.1em; padding-top: 0.4em; text-align: right; } #layout_view .faq .faqtools ul { position: relative; list-style: none; float: left; } #layout_view .faq .faqtools ul li { float: left; padding-left: 1.1em; margin-left: 1.1em; border-left: solid 1px #cccccc; } #layout_view .faq .faqtools ul li.first { padding: 0; margin: 0; border: 0; } /** Account **/ #layout_account { } #layout_account h1 { margin: 0 0 1.3em 0; } #layout_account .col_messageBox { position: absolute; text-align: center; width: 100%; z-index: 100; height: 100%; } #layout_account .col_messageBox .message { text-align: center; position: absolute; top: 50%; margin-top: -2.5em; width: 100%; } #layout_account .col_messageBox .message p { margin: 0 0 1.5em 0; } #layout_account .colc_disabled { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)"; filter: alpha(opacity=25); -moz-opacity: 0.25; -khtml-opacity: 0.25; opacity: 0.25; background: #BAD3D6; } #layout_account .colc { position: relative; padding: 1.75em 1.75em 2.25em 1.75em; } #layout_account .colc .recentActivity { } #layout_account .colc .recentActivity .activityItem { position: relative; height: 2.75em; } #layout_account .colc .recentActivity .activityItem .when { position: absolute; font-size: 0.8em; bottom: 0; left: 0; } #layout_account .colc .recentActivity .activityItem .type { position: absolute; font-size: 1em; left: 0; top: 0; font-weight: bold; } #layout_account .colc .recentActivity .activityItem .amount { position: absolute; right: 0; font-weight: bold; font-size: 1.2em; } #layout_account .colc .recentOrders { } #layout_account .colc .recentOrders .order { position: relative; height: 3em; margin: 0.2em 0 0.2em 0; } #layout_account .colc .recentOrders .order a { position: absolute; top: 0; left: 0; font-size: 1.1em; white-space: nowrap; } #layout_account .colc .recentOrders .order .when { position: absolute; font-size: 0.8em; left: 0; bottom: 0; } #layout_account .colc .recentOrders .order .numitems { position: absolute; font-size: 0.8em; right: 0; top: 0.2em; } #layout_account .colc .recentOrders .order .total { position: absolute; font-size: 1.2em; right: 0; bottom: 0; font-weight: bold; } #layout_account .colc .af_table { margin: 0 0 1.5em 0; } #layout_account .colc h2 { margin: 0 0 1.1em 0; } #layout_account .colc h3 { font-size: 1em; letter-spacing: 0; margin: 0 0 1.1em 0; } #layout_account .colc ul.options { list-style: none; padding: 0; margin: 0; } #layout_account .colc li { background-position: 0em 1.3em; background-repeat: no-repeat; padding: 1.45em 0 0 1.6em; border-top: solid 1px #d0d0d0; margin: 1.2em 0 0 0; background-image: url('images/icon-arrow.gif'); } #layout_account .colc li.first { border-top: 0; background-position: 0em 0.3em; margin-top: 0; padding-top: 0.45em; } #layout_account .colc li a { display: block; margin: 0 0 0.25em 0; } #layout_account .colc li p { margin: 0; } #layout_account .col1 { position: relative; width: 32%; border: solid 1px #d0d0d0; float: left; margin-right: 1%; border-radius: 5px; } #layout_account .col2 { position: relative; width: 32%; border: solid 1px #d0d0d0; float: left; margin: 0 0.5% 0 0.5%; border-radius: 5px; } #layout_account .col3 { position: relative; width: 32%; border: solid 1px #d0d0d0; float: left; margin-left: 1%; border-radius: 5px; } #layout_account .referralTools { } #layout_account .referralTools .banners { } #layout_account .referralTools .banners ul { list-style: none; } #layout_account .referralTools .banners ul li { width: 49%; float: left; text-align: center; border: solid 1px #d0d0d0; margin-bottom: 10px; } #layout_account .referralTools .banners ul li.first { margin-right: 1%; } #layout_account .referralTools .banners ul li .inner { padding: 25px 25px 35px 25px; position: relative; } #layout_account .referralTools .banners ul li .inner textarea { display: block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; margin: 0 0 25px 0; } #layout_account .referralTools .banners ul li .inner .image { height: 200px; width: 395px; margin: 0 auto 25px auto; background: #ffffff url('images/bar2bg.png') 0px -60px repeat-x; border: solid 1px #d0d0d0; text-align: center; text-shadow: #ffffff 0px 1px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_account .referralTools .banners ul li .inner .image img { } #layout_account .referralTools .urlBox { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -40px repeat-x; padding: 25px; margin: 0 0 1.5em 0; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_account .referralTools .urlBox .link { text-align: center; } #layout_account .referralTools .urlBox .link h2 { position: relative; top: 0.075em; display: inline; margin: 0 0.5em 0 0; line-height: 1.5em; } #layout_account .referralTools .urlBox .link input.text { font-size: 1.25em; width: 23em; padding: 0.5em; margin: 0 0.75em 0 0; } #layout_account .referralTools .urlBox .blurb { margin: 1.75em 0 0 0; padding: 1.75em 0 0 0; border-top: solid 1px #d0d0d0; text-align: center; line-height: 2.25em; } #layout_account .referralTools .urlBox .blurb input.text { margin: 0 0.5em 0 0.5em; width: 8em; } #layout_account .referralTools .XMLFeedBox { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -40px repeat-x; padding: 25px; margin: 0 0 3em 0; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_account .referralTools .XMLFeedBox h2 { font-size: 1.5em; } #layout_account .referralTools .XMLFeedBox input { width: 360px; margin: 0 auto 20px auto; display: block; font-size: 1em; padding: 5px; } #layout_account .referralTools .XMLFeedBox .url { width: 407px; float: left; text-align: center; border-right: solid 1px #d0d0d0; padding: 0 20px 10px 0; } #layout_account .referralTools .XMLFeedBox .key { width: 407px; margin-left: 427px; text-align: center; padding: 0 0 10px 20px; } #layout_account .referralTools .toolsBox { border: solid 1px #d0d0d0; padding: 25px; } #layout_account .referralTools .toolsBox ul { list-style: none; } #layout_account .referralTools .toolsBox ul li.left { border-right: solid 1px #d0d0d0; padding-right: 10px; } #layout_account .referralTools .toolsBox ul li { float: left; width: 49%; text-align: center; padding: 10px 0 15px 0; margin: 0; } #layout_account .referralTools .toolsBox ul li h2 { margin: 0 0 0.5em 0; } #layout_account .referralTools .toolsBox ul li p { margin: 0 0 2em 0; } #layout_account .referralTools .toolsBox ul li.split { clear: both; width: 100%; border-top: solid 1px #d0d0d0; margin: 25px 0 10px 0; padding: 0; } #layout_account .af_wa_shopClientActivity { } #layout_account .af_wa_shopClientActivity .rootCommand { } #layout_account .af_wa_shopClientActivity .rootCommand .heading { position: relative; height: 4em; } #layout_account .af_wa_shopClientActivity .rootCommand .heading h2 { position: absolute; top: 0.25em; left: 0; z-index: 1; } #layout_account .af_wa_shopClientActivity .rootCommand .heading .period { position: absolute; top: 0; right: 0; z-index: 1; } #layout_account .af_wa_shopClientActivity .rootCommand .heading .period select { width: 150px; } #layout_account .af_wa_shopClientActivity .rootCommand .heading .stats { position: absolute; top: 1em; left: 50%; margin-left: -24%; } #layout_account .af_wa_shopClientActivity .rootCommand .heading .stats ul { list-style: none; padding: 0; } #layout_account .af_wa_shopClientActivity .rootCommand .heading .stats ul li { border-left: solid 1px #d0d0d0; padding-left: 1em; margin-left: 1em; float: left; } #layout_account .af_wa_shopClientActivity .rootCommand .heading .stats ul li.first { border: 0; padding: 0; margin: 0; } #layout_account .af_wa_shopClientActivity .rootCommand .table { margin: 0 0 3em 0; } #layout_account .af_wa_shopClientPayouts { } #layout_account .af_wa_shopClientPayouts .af_table tr td { vertical-align: top; padding: 1em; } #layout_account .af_wa_shopClientPayouts .af_table tr td .method { } #layout_account .af_wa_shopClientPayouts .af_table tr td .method .name { display: block; } #layout_account .af_wa_shopClientPayouts .af_table tr td .method .identifier { display: block; margin: 0.75em 0 0 0; padding: 0.75em 0 0 0; font-size: 0.9em; border-top: dotted 1px #d0d0d0; } #layout_account .af_wa_shopClientOrders { } #layout_account .af_wa_shopClientOrders .orderInfo { } #layout_account .af_wa_shopClientOrders .orderInfo .note_error { font-size: 1.2em; margin: 0 0 2em 0; } #layout_account .af_wa_shopClientOrders .orderInfo .footer { text-align: center; margin: 3em 0 2em 0; } #layout_account .af_wa_shopClientOrders .orderInfo .summary { margin: 0 0 2.5em 0; border: dotted 1px #d0d0d0; padding: 1em; border-radius: 4px; } #layout_account .af_wa_shopClientOrders .orderInfo .customer { margin: 0 0 0 0; border: dotted 1px #d0d0d0; padding: 1em; border-radius: 4px; } #layout_account .af_wa_shopClientOrders .orderInfo .customer .VATInfo { margin: 1.5em 0 0 0; border-top: dotted 1px #d0d0d0; padding: 1.5em 0 0 0; } #layout_account .af_wa_shopClientOrders .orderInfo .customer .VATInfo p { margin: 0 0 1em 0; } #layout_account .af_wa_shopClientOrders .orderInfo .items { margin: 0 0 2.5em 0; } #layout_account .af_wa_shopClientOrders .orderInfo .items table tr td { padding: 1.5em; vertical-align: top; } #layout_account .af_wa_shopClientOrders .orderInfo .items .item { } #layout_account .af_wa_shopClientOrders .orderInfo .items .item .thumbnail { float: left; padding: 0 1em 0 0; text-align: center; } #layout_account .af_wa_shopClientOrders .orderInfo .items .item .thumbnail a { margin: 0; display: block; } #layout_account .af_wa_shopClientOrders .orderInfo .items .item .thumbnail img { width: 101px; padding: 2px; border: solid 1px #d0d0d0; } #layout_account .af_wa_shopClientOrders .orderInfo .items .item .name { padding: 0 0 0 0; } #layout_account .af_wa_shopClientOrders .orderInfo .additionalDownloads { position: relative; margin: 2.5em 0 0 0; } #layout_account .af_wa_shopClientOrders .orderInfo .additionalDownloads .item { position: relative; margin: 2em 0 0 0; } #layout_account .af_wa_shopClientOrders .orderInfo .additionalDownloads .item .actionButton { position: absolute; left: 0; top: 0; } #layout_account .af_wa_shopClientOrders .orderInfo .additionalDownloads .item p { margin: 0 0 0 100px; } #layout_account .af_wa_shopClientOrders .orderInfo .additionalDownloads .item h3 { font-size: 1em; font-weight: bold; letter-spacing: 0; margin: 0 0 0.25em 100px; } #layout_account .af_wa_shopClientOrders .orderList { } #layout_account .af_wa_shopClientOrders .orderList table tr td { padding: 2em 1.5em 2em 1.5em; vertical-align: top; } #layout_account .af_wa_shopClientOrders .orderList .mindetails { } #layout_account .af_wa_shopClientOrders .orderList .mindetails .when { padding: 0.25em 0 0 0; color: #8E8E8E; } #layout_account .af_wa_shopClientOrders .orderList .mindetails .total { padding: 0.25em 0 0 0; font-size: 1.2em; } #layout_account .af_wa_shopClientOrders .orderList .minactions { margin: 1em 0 0 0; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul { list-style: none; padding: 0; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li { padding: 1em 0 0 0; border-top: dotted 1px #d0d0d0; margin: 1em 0 0 0; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li.first { border-top: 0; margin: 0; padding: 0; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li .minitem { } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li .minitem .quantity { float: left; padding: 0 1em 0 0; vertical-align: middle; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li .minitem .thumbnail { float: left; padding: 0 1em 0 0; text-align: center; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li .minitem .thumbnail a { margin: 0; display: block; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li .minitem .thumbnail img { width: 61px; padding: 2px; border: solid 1px #d0d0d0; } #layout_account .af_wa_shopClientOrders .orderList .minitems ul li .minitem .name { vertical-align: middle; } #layout_account div.af_wa_ticketManager { } #layout_account div.af_wa_ticketManager select { border: solid 1px #d0d0d0; padding: 4px; } /** Template Defaults: rootCommand **/ #layout_account div.af_wa_ticketManager div.rootCommand { position: relative; } #layout_account div.af_wa_ticketManager div.rootCommand .af_RLPagedTable_layout { position: relative; } #layout_account div.af_wa_ticketManager div.rootCommand .filters { position: absolute; width: 100%; top: -0.6em; margin: 0; padding: 0; text-align: center; z-index: 0; } #layout_account div.af_wa_ticketManager div.rootCommand a.title { font-size: 1.25em; } #layout_account div.af_wa_ticketManager div.rootCommand .id { color: #8E8E8E; } #layout_account div.af_wa_ticketManager div.rootCommand div.lastpostauthor { margin: 0.5em 0 0 0; } #layout_account div.af_wa_ticketManager div.rootCommand div.author { margin: 0.5em 0 0 0; } #layout_account div.af_wa_ticketManager div.rootCommand div.description { font-size: 0.9em; margin: 0.5em 0 0 0; } #layout_account div.af_wa_ticketManager div.rootCommand .af_pager { margin: 0 0 0 1em; } #layout_account div.af_wa_ticketManager div.rootCommand .af_table tr.unread { } #layout_account div.af_wa_ticketManager div.rootCommand .af_table tr.unread td { background: #ffc; border-bottom: solid 1px #DDDD9B; } #layout_account div.af_wa_ticketManager div.rootCommand .af_table tr.closed { } #layout_account div.af_wa_ticketManager div.rootCommand .af_table tr td { padding: 1.5em 1.25em 1.5em 1.25em; } /** Template Defaults: createCommand **/ #layout_account div.af_wa_ticketManager div.createCommand { } #layout_account div.af_wa_ticketManager div.createCommand .af_form textarea { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; } /** Template Defaults: view_editPostCommand **/ #layout_account div.af_wa_ticketManager div.view_editPostCommand { } #layout_account div.af_wa_ticketManager div.view_editPostCommand .af_form textarea { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; } /** Template Defaults: viewCommand **/ #layout_account div.af_wa_ticketManager div.viewCommand { position: relative; } #layout_account div.af_wa_ticketManager div.viewCommand .af_form textarea { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; } #layout_account div.af_wa_ticketManager div.viewCommand div.header { height: 6em; } #layout_account div.af_wa_ticketManager div.viewCommand div.header h2 { position: absolute; top: 0; left: 0; margin: 0; padding: 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.header div.status { position: absolute; right: 0; top: 0.25em; } #layout_account div.af_wa_ticketManager div.viewCommand div.header div.info { position: absolute; top: 3em; left: 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.header div.info ul { list-style: none; padding: 0; margin: 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.header div.info ul li { float: left; margin-left: 0.75em; border-left: solid 1px #c0c0c0; padding-left: 0.75em; } #layout_account div.af_wa_ticketManager div.viewCommand div.header div.info ul li.first { margin-left: 0; border-left: 0; padding-left: 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.header div.info2 { position: absolute; top: 2.75em; right: 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.header div.status .af_actionList { float: right; margin-left: 1em; } #layout_account div.af_wa_ticketManager div.viewCommand div.pager { position: relative; } #layout_account div.af_wa_ticketManager div.viewCommand div.pager .af_pager { margin: 1em 0 0 0; height: 26px; } #layout_account div.af_wa_ticketManager div.viewCommand div.pager .af_pager .inner { position: absolute; right: 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.table { margin: 1em 0 0 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.table td { vertical-align: top; padding: 1.5em; line-height: 1.6em; } #layout_account div.af_wa_ticketManager div.viewCommand div.table td.body { width: 100%; } #layout_account div.af_wa_ticketManager div.viewCommand div.table .postauthor { font-weight: bold; display: block; white-space: nowrap; } #layout_account div.af_wa_ticketManager div.viewCommand div.table .postdate { font-size: 0.8em; display: block; white-space: nowrap; margin: 1em 0 0 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.table td.body .postinfo { font-size: 0.8em; display: block; white-space: nowrap; margin: 2em 0 0 0; padding: 0.5em 0 0 0; color: #8E8E8E; border-top: solid 1px #d0d0d0; } #layout_account div.af_wa_ticketManager div.viewCommand div.table .postattachments { margin: 1.25em 0 0 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.table .postattachments ul { list-style: none; margin: 0; padding: 0; } #layout_account div.af_wa_ticketManager div.viewCommand div.table .postattachments ul li { background: url('images/icon-paper.gif') 0px 2px no-repeat; padding: 0 0 0 25px; line-height: 1.6em; } /** Cart **/ #layout_cart { } #layout_cart .rootCommand { position: relative; } #layout_cart .rootCommand .af_table td { vertical-align: top; padding: 2em 1.5em 2em 1.5em; } #layout_cart .rootCommand .fname { } #layout_cart .rootCommand .fname .remove { float: left; vertical-align: middle; padding: 3px 0 0 0; } #layout_cart .rootCommand .fname .thumbnail { float: left; padding: 0 1.75em 0 1.5em; text-align: center; } #layout_cart .rootCommand .fname .thumbnail a { margin: 0; display: block; } #layout_cart .rootCommand .fname .thumbnail img { width: 100px; padding: 2px; border: solid 1px #d0d0d0; } #layout_cart .rootCommand .fname .name { font-size: 1.4em; margin: 0 0 0.75em 0; } #layout_cart .rootCommand .fname .name a { color: #222222; text-decoration: none; } #layout_cart .rootCommand .fname .description { line-height: 1.6em; } #layout_cart .rootCommand .af_table input { border: 0; padding: 4px; } #layout_cart .rootCommand .checkoutBar { position: relative; text-align: right; margin: 2.5em 0 2em 0; } #layout_cart .rootCommand .checkoutBar .extra { position: absolute; left: 0; top: -15px; } #layout_cart .rootCommand .checkoutBar .controls { } #layout_cart .rootCommand .checkoutBar .controls p { display: inline; padding: 0 1em 0 0; } #layout_cart .rootCommand .checkoutBar .controls a { } #layout_cart .checkoutCommand { position: relative; } #layout_cart .checkoutCommand .offerBox { position: relative; border: dashed 2px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -80px repeat-x; padding: 20px; margin: 0 0 2em 0; list-style: none; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_cart .checkoutCommand .offerBox img { float: left; width: 160px; height: 128px; background: #d0d0d0; margin: 0 25px 0 0; border-radius: 4px; } #layout_cart .checkoutCommand .offerBox h2 { font-size: 1.8em; margin: 0em 0em 0.5em 0em; } #layout_cart .checkoutCommand .offerBox p { margin: 0 0 0.5em 0; font-size: 1.2em; } #layout_cart .checkoutCommand .offerBox span { font-size: 1em; } #layout_cart .checkoutCommand .offerBox_image { padding: 15px; } #layout_cart .checkoutCommand .offerBox_image h2 { margin-top: 0.4em; } #layout_cart .checkoutCommand .processorname { padding: 0.25em 0 0.75em 1em; } #layout_cart .checkoutCommand .processorname .description { } #layout_cart .checkoutCommand .items { } #layout_cart .checkoutCommand .itemsFooter { margin: 2em 0 3em 0; text-align: center; } #layout_cart .checkoutCommand .itemsFooter span { padding: 0 0.5em 0 0; } #layout_cart .checkoutCommand .itemsFooter a { margin: 0 0.75em 0 0; } #layout_cart .checkoutCommand .itemsExtraFooter { text-align: center; } #layout_cart .checkoutCommand .items .af_table td { vertical-align: top; padding: 1em; } #layout_cart .checkoutCommand .items .fname { white-space: nowrap; } #layout_cart .checkoutCommand .items .fname .thumbnail { float: left; padding: 0 1em 0 0; text-align: center; } #layout_cart .checkoutCommand .items .fname .thumbnail a { margin: 0; display: block; } #layout_cart .checkoutCommand .items .fname .thumbnail img { width: 36px; padding: 2px; border: solid 1px #d0d0d0; } #layout_cart .checkoutCommand .items .lastColumn { white-space: nowrap; } #layout_cart .checkoutCommand .items .fname .name { } #layout_cart .checkoutCommand .steps { font-size: 1.25em; margin: 1em 0 1.5em 0; padding: 0 0 1.5em 0; border-bottom: solid 1px #d0d0d0; } #layout_cart .checkoutCommand .steps ul { padding: 0; margin: 0; list-style: none; } #layout_cart .checkoutCommand .steps ul li { float: left; padding: 0 0 0 1em; border-left: solid 1px #d0d0d0; margin: 0 0 0 1em; color: #cecece; } #layout_cart .checkoutCommand .steps ul li a { color: #cecece; text-decoration: none; border-bottom: dotted 1px #cecece; } #layout_cart .checkoutCommand .steps ul li a:hover { color: #222222; border-bottom: dotted 1px #d0d0d0; } #layout_cart .checkoutCommand .steps ul li.first { margin-left: 0; padding-left: 0; border-left: 0; } #layout_cart .checkoutCommand .steps ul li.active { color: #222222; font-weight: bold; } #layout_cart .checkoutCommand .content { position: relative; float: left; border-right: solid 1px #d0d0d0; width: 565px; margin: 0 30px 0 0; padding: 0 30px 0 0; } #layout_cart .checkoutCommand .content input.text { max-width: 400px; } #layout_cart .checkoutCommand .contentFull { width: 100%; border: 0; padding-right: 0; margin-right: 0; } #layout_cart .checkoutCommand .items { position: relative; margin: 3em 0 0 630px; } #layout_cart .checkoutCommand .items table { width: 270px; } #layout_cart .checkoutCommand .items .title { display: block; font-weight: bold; margin: 0 0 1em 0; } #layout_cart .checkoutCommand .stepFinish { } #layout_cart .checkoutCommand .stepFinish .af_form { margin: 0 0 3em 0; } /** FAQ **/ #layout_faq { } #layout_faq h2 { font-size: 2em; margin: 1.5em 0 1em 0; border-bottom: solid 1px #d0d0d0; padding: 0 0 0.5em 0; } #layout_faq h3 { font-size: 1.4em; margin: 2em 0 1em 0; } #layout_faq h4 { font-size: 1.1em; margin: 2em 0 1em 0; } #layout_faq h5 { font-size: 1em; margin: 1.5em 0 0.5em 0; } #layout_faq ul.faqIndex { list-style: none; margin: 3.5em 0 6em 0; } #layout_faq ul.faqIndex li h3 { margin: 0 0 1em 0; padding: 0 0 0.75em 0; border-bottom: solid 1px #d0d0d0; } #layout_faq ul.faqIndex li ul { list-style: none; margin: 0 0 3em 1em; } #layout_faq ul.faqIndex li ul li { line-height: 2.5em; } #layout_faq ul.faqIndex li ul li a { color: #222222; text-decoration: none; border-bottom: dotted 1px #777777; } #layout_faq ul.faqIndex li ul li a:hover { border-bottom: 0px; } #layout_faq ul.faq { list-style: none; margin: 0 0 5em 0; } #layout_faq ul.faq li.entry { margin: 0 0 0 1em; } #layout_faq ul.faq li.entry h3 { position: relative; left: -0.75em; } #layout_faq ul.faq li.entry ol { padding: 0 0 0 3em; } #layout_faq ul.faq li.entry ul { padding: 0 0 0 1.5em; list-style: disc; margin: 0 0 2em 0; } #layout_faq ul.faq li.entry li { line-height: 1.6em; margin: 0.5em 0 0.5em 0; } #layout_faq ul.faq li.entry li p { margin: 0; } #layout_faq ul.faq li.entry li p span.note { margin: 1em 0 0 0; font-size: 1em; font-style: italic; display: block; } #layout_faq ul.faq li.entry li a.url { display: block; margin: 0.5em 0 0 0; } #layout_faq ul.faq li.entry li a.urlb { display: block; margin: 1em 0 0 0; } /** About **/ #layout_about { } #layout_about .box { padding-left: 3em; padding-right: 3em; } #layout_about h1 { position: relative; height: 45px; margin: 0.5em 0 1.25em 0; font-size: 3em; letter-spacing: -3px; } #layout_about h1 img { position: relative; top: 10px; padding: 0 10px 0 10px; } #layout_about ul.points { list-style: none; } #layout_about ul.points li { position: relative; border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -80px repeat-x; padding: 25px; margin: 0 0 20px 0; height: 112px; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_about ul.points li.first { border-top: solid 1px #d0d0d0; } #layout_about ul.points li img { position: absolute; left: 22px; top: 22px; border: solid 1px #d0d0d0; padding: 2px; } #layout_about ul.points li h2 { font-size: 1.75em; margin: 0.25em 0 0.6em 220px; } #layout_about ul.points li p { margin: 0 0 0 220px; } #layout_about ul.actions { list-style: none; margin: 3em 0 0 0; height: 40px; } #layout_about ul.actions li { float: left; margin: 0 1em 0 0; line-height: 40px; } /** Referral Program **/ #layout_referralProgram { } #layout_referralProgram .box { padding-left: 3em; padding-right: 3em; } #layout_referralProgram p.details { margin: 0.9em 0 1.4em 0; font-size: 1.7em; letter-spacing: -1px; line-height: 1.5em; } #layout_referralProgram .tagline { color: #F20000; font-size: 2.25em; letter-spacing: -1px; display: block; margin: 0.75em 0 0.25em 0; } #layout_referralProgram h1 { margin: 0 0 0.65em 0; font-size: 3em; letter-spacing: -3px; } #layout_referralProgram ul.steps { list-style: none; } #layout_referralProgram ul.steps li { position: relative; border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -80px repeat-x; margin: 0 0 20px 0; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_referralProgram ul.steps li div { padding: 25px 25px 25px 95px; background: url('images/icon-checkmark.png') 25px 16px no-repeat; } #layout_referralProgram ul.steps li.first { border-top: solid 1px #d0d0d0; } #layout_referralProgram ul.steps li h2 { font-size: 1.8em; margin: 0.1em 0 0.20em 0; } #layout_referralProgram ul.steps li p { margin: 0 0 0 0; } #layout_referralProgram ul.actions { list-style: none; margin: 3em 0 0 0; height: 40px; } #layout_referralProgram ul.actions li { float: left; margin: 0 1em 0 0; line-height: 40px; } /** Tutorials **/ #layout_tutorials { } #layout_tutorials .tuts { position: relative; border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -80px repeat-x; padding: 25px; margin: 2em 0 0 0; list-style: none; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_tutorials .tuts h2 { margin: 0.15em 0 1em 0; } #layout_tutorials .tuts ul { margin: 0 0 1em 0; } #layout_tutorials .tuts ul li { list-style: none; margin: 1.75em 0 0 0; padding: 1.75em 0 0 0; border-top: solid 1px #d0d0d0; height: 68px; } #layout_tutorials .tuts ul li.first { padding-top: 0; margin-top: 0; border-top: 0; } #layout_tutorials .tuts ul li .info { padding: 8px 0 0 0; } #layout_tutorials .tuts ul li img { display: block; float: left; margin-right: 25px; border: solid 1px #d0d0d0; padding: 2px; } #layout_tutorials .tuts ul li a.title { font-size: 1.2em; } #layout_tutorials .tuts ul li p { margin: 0.4em 0 0 0; } #layout_tutorials .tutorial { } #layout_tutorials .tutorial .intro { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -80px repeat-x; padding: 25px; margin: 0 0 3em 0; height: 134px; text-shadow: #ffffff 0px 1px; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; } #layout_tutorials .tutorial .intro .content { display: table-cell; height: 128px; vertical-align: middle; font-size: 1.1em; line-height: 1.75em; } #layout_tutorials .tutorial .intro img { float: left; margin: 0 25px 0 0; border: solid 1px #d0d0d0; padding: 2px; } #layout_tutorials .tutorial h2 { margin: 3em 0 1.5em 0; padding: 0 0 0.5em 0; border-bottom: solid 1px #d0d0d0; } #layout_tutorials .tutorial h2.first { margin-top: 0; } #layout_tutorials .tutorial ul.index { margin: 0 0 4em 0; padding: 0; list-style: none; } #layout_tutorials .tutorial img { display: block; border: solid 1px #d0d0d0; padding: 5px; margin: 0 0 2em 0; } #layout_tutorials .tutorial ol { } #layout_tutorials .tutorial ol li { } #layout_tutorials .tutorial ol li p { margin: 0 0 1.5em 0; } #layout_tutorials .tutorial ol li img.fl { float: left; margin-right: 1.5em; } #layout_tutorials .tutorial ul { margin: 0 0 2em 0; padding: 0 0 0 1.5em; list-style: disc; } #layout_tutorials .tutorial ul li { margin: 0 0 1em 0; padding: 0; } /************************************************/ /** HRL **/ /************************************************/ #hrlBox { border: solid 1px #d0d0d0; background: #ffffff url('images/bar2bg.png') 0px -40px repeat-x; padding: 60px 120px 60px 120px; margin: 0 auto 3em auto; text-shadow: 0px 1px 0px #ffffff; border-radius: 4px; box-shadow: inset 0px 0px 0px 1px #ffffff; font-size: 1.2em; } #hrlBox .outro { text-align: center; border-top: dashed 1px #d0d0d0; padding-top: 2em; margin-top: 2em; } #hrlBox .intro { text-align: center; border-bottom: dashed 1px #d0d0d0; padding-bottom: 2em; margin-bottom: 2em; } #hrlBox .intro p { margin-bottom: 0; } #hrlBox h3 { font-size: 1.5em !important; letter-spacing: -1px !important; } #hrlBox ul { list-style: disc !important; padding-left: 1em !important; display: block; margin: 0 0 2.5em 0; } #hrlBox ul.last { margin-bottom: 0; } /************************************************/ /** Offer **/ /************************************************/ body#offer { background: url('images/bg3x.png'); } body#offer img.logo { display: block; margin: 70px auto 0 auto; } body#offer .offerBox { width: 600px; position: relative; border: dashed 4px #c8c8c8; background: url('images/bg1.png?x=1') 0px -290px; padding: 40px; margin: 40px auto 0 auto; border-radius: 10px; text-shadow: 0px 2px 1px #ffffff; } body#offer .offerBox .info { min-height: 128px; margin: 0 0 30px 0; } body#offer .offerBox .info img { float: left; border-radius: 5px; } body#offer .offerBox .info p.message { margin: 0 0 0.5em 190px; font-size: 2em; line-height: 1.5em; letter-spacing: -1px; } body#offer .offerBox .bottom { text-align: center; margin: 0 0 10px 0; } body#offer .offerBox .bottom span.instructions { display: block; font-size: 1.25em; margin: 0 0 2.25em 0; } body#offer .offerBox .bottom a { font-size: 1.75em; letter-spacing: -1px; }