@basecolor : rgb(45,53,62); @compcolor : spin(@basecolor, 180); @bordercolor : lighten(@basecolor, 60%); @bodycolor : #eeeeee; @contentbackground:#fff; @textcolor : #555; @linkcolor : #009999; @linkcolorhover : darken(@linkcolor, 10); @linkcolorvisited : darken(@linkcolorhover, 10); @linkcolorfocus : darken(@linkcolorvisited, 10); @backgroundlogoheader: #009999; @headermenugradientfrom:#eee; @headermenugradientto:#ddd; @uxelmentsgradientfrom: #ffffff; @uxelmentsgradientto: #dddddd; @uxelmentshovergradientfrom: #00B9B9; @uxelmentshovergradientto: #009999; body { background: @bodycolor } h3 { color: @textcolor } h2 a { text-decoration: none } h2,.moduletable h3, .items-leading h2 { border-bottom: solid 1px #ddd; } .items-row h2 { border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; } a:link,a:visited { color: @linkcolor } a:hover,a:active,a:focus { background:@linkcolor ; color: #FFF; } .logoheader { background: @backgroundlogoheader; color: #FFFFFF; min-height: 200px; } #all { background: @contentbackground; color: @textcolor ; } #shadow #all { box-shadow: 0px 20px 10px #555555 } #header ul.menu { background-color:#ddd; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@headermenugradientfrom, endColorstr=@headermenugradientto); background-image: -khtml-gradient(linear, left top, left bottom, from(@headermenugradientfrom), to(@headermenugradientto)); background-image: -moz-linear-gradient(top, @headermenugradientfrom, @headermenugradientto); background-image: -ms-linear-gradient(top, @headermenugradientfrom, @headermenugradientto); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @headermenugradientfrom), color-stop(100%, @headermenugradientto)); background-image: -webkit-linear-gradient(top, @headermenugradientfrom, @headermenugradientto); background-image: -o-linear-gradient(top, @headermenugradientfrom, @headermenugradientto); background-image: linear-gradient(@headermenugradientfrom, @headermenugradientto); border-color: #b2b2b2 #b2b2b2 hsl(114, 0%, 62.5%); text-shadow: 0 1px 1px rgba(255, 255, 255, 0.49); -webkit-font-smoothing: antialiased; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05); border: solid 1px #ddd; border: 1px solid #e5e5e5; text-transform: uppercase; } #header ul.menu a:link,#header ul.menu a:visited { color: #333; font-weight: bold; text-decoration: none; padding: 0px 10px; margin: 0; display: inline-block; margin: 0 0 0; padding: 12px 15px; position: relative; border-right: 1px solid #ddd; box-shadow: 1px 0px 0px #f5f5f5; } /* grey background */ .button,button,p.readmore a,#header input.button,.pagenav a:link,.pagenav a:visited,#advanced-search-toggle,.profile-edit a:link,.profile-edit a:visited,h3.js_heading,.article-info { background-color:#ddd; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@uxelmentsgradientfrom, endColorstr=@uxelmentsgradientto); background-image: -khtml-gradient(linear, left top, left bottom, from(@uxelmentsgradientfrom), to(@uxelmentsgradientto)); background-image: -moz-linear-gradient(top, @uxelmentsgradientfrom, @uxelmentsgradientto); background-image: -ms-linear-gradient(top, #ffffff, #dddddd); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @uxelmentsgradientfrom), color-stop(100%, @uxelmentsgradientto)); background-image: -webkit-linear-gradient(top, @uxelmentsgradientfrom, @uxelmentsgradientto); background-image: -o-linear-gradient(top, @uxelmentsgradientfrom, @uxelmentsgradientto); background-image: linear-gradient(@uxelmentsgradientfrom, @uxelmentsgradientto); border-color: #b2b2b2 #b2b2b2 hsl(114, 0%, 62.5%); text-shadow: 0 1px 1px rgba(255, 255, 255, 0.49); -webkit-font-smoothing: antialiased; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05); color: @linkcolor; border: solid 1px #ddd } .article-info {color:@textcolor} /* +++++++++++++ table display Catgegories table, contact etc, ++++++++++++++++++++* */ table { border: solid 1px #ddd } table th a:link,table th a:visited { color: #fff } tr.odd,tr.cat-list-row1 { background: #f8f8f8 } table tr:hover td { background: #FEFDE2; } /* blue background */ .button:hover, .button:active, .button:focus, button:hover, p.readmore a:hover, #header ul.menu a:hover, #header ul.menu a:active, #header ul.menu a:focus, .pagenav a:hover, .pagenav a:active, .pagenav a:focus, #advanced-search-toggle:hover, #advanced-search-toggle:active, #advanced-search-toggle:focus, .profile-edit a:hover, .profile-edit a:active, .profile-edit a:focus, #fontsize a:hover,#fontsize a:active,#fontsize a:focus, #mobile_select h2 a,table th,.logoheader { background-color:@uxelmentshovergradientfrom; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@uxelmentshovergradientfrom, endColorstr=@uxelmentshovergradientto); background-image: -khtml-gradient(linear, left top, left bottom, from(@uxelmentshovergradientfrom), to(@uxelmentshovergradientto)); background-image: -moz-linear-gradient(top,@uxelmentshovergradientfrom, @uxelmentshovergradientto); background-image: -ms-linear-gradient(top, @uxelmentshovergradientfrom, @uxelmentshovergradientto); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @uxelmentshovergradientfrom), color-stop(100%, @uxelmentshovergradientto)); background-image: -webkit-linear-gradient(top, @uxelmentshovergradientfrom, @uxelmentshovergradientto); background-image: -o-linear-gradient(top, @uxelmentshovergradientfrom, @uxelmentshovergradientto); background-image: linear-gradient(@uxelmentshovergradientfrom, @uxelmentshovergradientto); border-color: @uxelmentshovergradientto; color: #fff ; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; } input:focus,textarea:focus { box-shadow: 0 1px 1px @headermenugradientto inset, 0 0 8px @uxelmentshovergradientfrom; outline: 0 none; } /* +++++++++++++++++ Pagination +++++++++++++++ */ .pagination span,.pagination span a:hover { color: #999999; background-color: #f5f5f5; } /* active item */ span.pagenav { background: @uxelmentshovergradientto; color: #fff; } .pagination-start span.pagenav,.pagination-prev span.pagenav,.pagination-end span.pagenav,.pagination-next span.pagenav { background-color: #f5f5f5; color: #444; } /* +++++++++++++++++ content +++++++++++++++ */ ul.menu a:link,ul.menu a:visited { color: #444; } /* ++++++++++++++++++++++ menu ++++++++++++++++++++++++++ */ .moduletable_menu { border: solid 1px #ddd; background: #f9f9f9; } #header ul.menu { border: solid 1px #D5D5D5; box-shadow: 0 1px 0 #FFFFFF inset, 0 1px 5px rgba(0, 0, 0, 0.1); } #header ul.menu a { box-shadow: none; border-bottom: 0 } ul.menu a:hover,ul.menu a:active,ul.menu a:focus { background-color: #F5F5F5; background-image: -moz-linear-gradient(center top, #FFFFFF, #E6E6E6); background-repeat: repeat-x; background: url(../images/arrow.png) no-repeat right center; color:@linkcolor } /* ++++++++++++++++ highlightning active menuitem +++++++++++++++++++ */ ul.menu li.active a,ul.menu li.active ul li.active a,ul.menu li.active ul li.active ul li.active a,ul.menu li.active ul li.active ul li.active ul li.active a,ul.menu li.active ul li.active ul li.active ul li.active ul li.active a { font-weight: bold; } ul.menu li.active ul li a,ul.menu li.active ul li.active ul li a,ul.menu li.active ul li.active ul li.active ul li a,ul.menu li.active ul li.active ul li.active ul li.active ul li a { font-weight: normal } ul.menu a { box-shadow: 0 1px 0 #fff; border-bottom: solid 1px #ddd; text-shadow: 0 1px 0 #fff } ul.menu ul a { background: #e5e5e5; margin-bottom: 1px } ul.menu ul ul ul a { background: #f5f5f5 url(../images/arrow.png) no-repeat 24px center; } ul.menu ul ul ul ul a { background: #fff; } /* +++++++++++++++++++++++ SLIDER ++++++++++++++++++++ */ .panel h3.pane-toggler a { background: url(../images/slider_plus.png) right top no-repeat; color: #333 } .panel h3.pane-toggler-down a { background: url(../images/slider_minus.png) right top no-repeat; border-bottom: solid 1px #ddd; color: #333 } /* +++++++++++++++++ Tabs ++++++++++++++++++++++ */ ul.tabs li,dl.tabs dt h3 a:link,dl.tabs dt h3 a:visited { background: #f5f5f5 url(../images/nature/box.png) repeat-x; } ul.tabs li a:link,ul.tabs li a:visited,dl.tabs dt a { color: #333; border: solid 1px #ddd; border-bottom: 0 } ul.tabs li a:hover,ul.tabs li a:active,ul.tabs li a:focus { color: #000 } .tabcontent,div.current { background: #fff; color: #000; border: solid 1px #ddd; } .tabcontent .linkclosed { color: #000; border-bottom: solid 1px #e5e5e5; } ul.tabs li a.linkopen,dl.tabs dt.open h3 a:link,dl.tabs dt.open h3 a:visited { background: #fff; color: #333; border-radius: 5px 5px 0px 0px; } ul.tabs li a.linkclosed:hover,ul.tabs li a.linkclosed:active,ul.tabs li a.linkclosed:focus,ul.tabs li a.linkopen:hover,ul.tabs li a.linkopen:active,ul.tabs li a.linkopen:focus { background: #555; color: #fff } #footer-inner,#footer { background: #f5f5f5; box-shadow: 0px 20px 10px #555 } #footer { background: #555; max-width: 1025px; margin: 0 auto; box-shadow: 0px 0px 10px #555555; color: #fff } #footer a { color: #fff; background: none } #bottom a { background: none } .box1 { border-right: solid 1px #ccc } .box3 { border-left: solid 1px #ccc } #bottom ul li a { background-image: none; padding-left: 0 } /* responsive */ #mobile_select h2 {border:0; margin:-17px 0 0 0; padding:0; background:@uxelmentshovergradientto;text-align:right} #mobile_select h2 a { display:inline-block; font-size:0.8em; border-radius:4px 4px 0 0; padding:6px; font-size:0.75em; margin-right:5px; } @media only screen and (max-width: 480px) { img { max-width: 100%; height: auto; border: 0; -ms-interpolation-mode: bicubic; } #fontsize{display:none} #nav,#wrapper2,#wrapper,.cols-3 .column-1,.cols-3 .column-2,.cols-3 .column-3,#right,.box,#header form { float: none; width: 100% } #header {padding-top:3em} #header form {margin:0} .logoheader {background:@uxelmentshovergradientto; min-height:100px; margin:0} .box { border-left: 0 !important; border-bottom: solid 1px #ddd; } #line { text-align: center; top: 0; right: auto; max-width: 100% ; min-width:100%; margin: 0 0px; background:@uxelmentshovergradientfrom; } #header form input { float: none; margin-bottom:4px } #menuwrapper { margin-top:10px; } #header ul.menu {position:relative; top:0;left:20px; right:20px; margin:0; width:90%; border-radius:4px} #header ul.menu li:first-child a {border-radius: 4px 4px 0 0} #header ul.menu li:last-child a {border-radius:0 0 4px 4px } #header ul.menu li a:link, #header ul.menu li a:visited { display: block; padding: 6px 10px; border-bottom: solid 1px #ccc } } @media only screen and (min-width: 600px) { } @media only screen and (min-width: 768px) { } @media only screen and (min-width: 992px) { } @media only screen and (min-width: 1382px) { /* Styles */ } @media only screen and (-webkit-min-device-pixel-ratio: 1.5) , only screen and (min--moz-device-pixel-ratio: 1.5) , only screen and (min-device-pixel-ratio: 1.5) { /* Styles */ }