/**
 * @author  ( Angie Radtke  )
 * @package Joomla
 * @subpackage Accessible-Template-Beez
 * @copyright Copyright (C) 2005 - 2009 Open Source Matters. All rights reserved.
 * @license GNU/GPL, see LICENSE.php
 * Joomla! is free software. This version may have been modified pursuant to the
 * GNU General Public License, and as distributed it includes or is derivative
 * of works licensed under the GNU General Public License or other free or open
 * source software licenses. See COPYRIGHT.php for copyright notices and
 * details.
 */

/* not ready */


h3
{
        font-size:1.1em;
        font-weight:bold;
        margin:10px 0;
}

h4
{
        font-size:1em;
}

fieldset
{
        xxmargin:10px 0 ;
        xxpadding:15px 0px;
        border:solid 1px
}

p
{
        line-height:1.6em;
		xmargin:20px 3px;
        font-size:14px;
		font-family:'Open Sans', Sans sarif;
		xxtext-align:justify;
}

em
{
        font-weight:bold;
}

/* ##########################  general  ########################### */
#all
{
    font-size: 12px;
}

/* ##########################  header content  ########################### */

#header form
{

}

#header form .button
{
        font-weight:bold;
        margin: 0;
        cursor:pointer;
        text-align:center;
        text-transform:uppercase
}

#header form .inputbox
{

        font-size:1em;
        width:13em;
        padding:3px;
}


#header form .inputbox { margin: 2px 13px 2px 2px;}
#header form .inputbox:focus { margin: 1px 11px 0 1px; }

#header ul
{
        display:block;
        margin:0px 0px 1px 0px;
        text-align:right;
        list-style-type:none;
        padding:10px 0px 10px 0px;
        position:absolute;
        top:0;
        right:0px;

}

#header ul li a:link,
#header ul li a:visited
{
        text-transform:uppercase;
        padding:10px;
        display:inline
}

#header ul.menu li
{
        display:inline ;
        padding:0 ;
        margin:0;

}

#header ul.menu li a:link,
#header ul.menu li a:visited
{
        font-weight:bold;
        text-decoration:none;
        padding:0px 10px;
        margin:0 ;
}

#header ul li a:hover,
#header ul li a:active,
#header ul li a:focus
{
        font-weight:bold;
}

#header ul li.active a:link,
#header ul li.active a:visited
{
        text-transform:uppercase;
        padding:10px 10px;
}




/* ##########################  fontsize  ########################### */

#fontsize
{
    padding:0;
    margin:0 20px 0 1px;
    text-align:right;
    margin-bottom:0px;
    float:none;


}

#fontsize h3
{
    padding-right:0;
    font-weight:normal;
    display:inline;
    font-size:1em;

        margin:0
}

#fontsize p
{
    margin:0 0 0 2px;
        padding:0;
    display:inline;
    font-size:1em;


}

#fontsize p a
{
    margin:0 2px;
    display:inline;
    padding:0px 5px;
}


/* ##########################  breadcrumbs  ########################### */

#breadcrumbs
{
        padding:0 0 0 0px;
        text-align:left;
        margin:15px 20px 15px 0px;
        font-size:0.85em
}

#breadcrumbs p
{
        padding:5px;
        display:inline;
}

#breadcrumbs span
{
        padding:0px;
}

#breadcrumbs span a:link,
#breadcrumbs span a:visited
{
        text-transform:none;
        font-weight:normal
}

#breadcrumbs span a:hover,
#breadcrumbs span a:active,
#breadcrumbs span a:focus
{
        text-decoration:none;
}


/* ##########################  navigation column  ########################### */

#nav ul
{
        list-style-type:none;
        margin:0px 0;
}

.module_content
{
        margin:0px 0 0px 0;
        padding:0px 0px 10px 5px
}

.moduletable
{
        xxmargin:0px 0 20px 0;
        padding:0px 0;
}

.moduletable_menu
{
        margin:0px 0 10px 0;
}

.moduletable_js
{
        margin-bottom:5px;
}

#nav h3.js_heading,
#right h3.js_heading
{
        position:relative;
        display:block;
        padding:5px 0px 0 0px ;
        margin:0px ;
        font-size:1.40em;
}

h3.js_heading span.backh
{
        padding:4px 0px 0px 10px;
        display:block;
}

h3.js_heading span.backh1
{
        padding:0px 20px 8px 0px;
        display:block;
}

h3.js_heading a
{
        display:block;
        position:absolute ;
        right:0px ;
        top:0px;
        padding:5px 5px 0 0;
        text-decoration:none;
}

.no
{
        font-size:1px;
}

#nav h3
{
        font-size:1.4em;
        margin:5px 0 6px 0;
        font-weight:normal;
        line-height:1.19em
}


#nav h3 span.backh3
{
        padding:0px 0px 5px 2px;
        display:block;
}


/* ++++++++++++++  first level  ++++++++++++++ */

#nav .moduletable-example ul.menu
{
        margin:0;
        padding:0
}

 ul.menu
{
        list-style-type:none !important;
        margin:0 0 0px 0px ;
        padding: 0px 5px 20px 5px;

}

 .module_content ul.menu
{
        margin-left:-5px;
        padding:10px 0 0 0 ;
}

 ul.menu li
{
        margin:0;
}

ul.menu li a:link,
 ul.menu li a:visited
{
        xxdisplay:block;
        padding:7px 4px 7px 15px;
        text-decoration:none;
}

 ul.menu li.active a:link,
 ul.menu li.active a:visited
{
        xfont-weight:bold;
}

 ul.menu li a:hover,
 ul.menu li a:active,
 ul li a:focus
{

}



/* ++++++++++++++  second level  ++++++++++++++ */
 ul.menu li ul
{
        margin:0 ;
        padding:0 ;
}
 ul.menu li ul li
{
        margin:0;
        padding:0
}

 ul.menu li.active ul li a:link,
 ul.menu li.active ul li a:visited
{
        padding:5px 10px 5px 20px ;
        font-weight:normal;
}


 ul.menu li.active ul li a.active:link,
 ul.menu li.active ul li a.active:visited
{
        padding:7px 10px 7px 20px ;
}

 ul li.active ul li.active a:link,
 ul li.active ul li.active a:visited
{
        font-weight:bold ;
}

/* ++++++++++++++  third level  ++++++++++++++ */

 ul.menu li ul li ul
{
        padding:5px 0 5px 0px;
}

 ul.menu li ul li ul li
{

}

ul.menu li.active ul li.active ul li a:link,
 ul.menu li.active ul li.active ul li a:visited
{
        padding:5px 4px 5px 30px;
        font-weight:normal;
}

 ul.menu li.active ul li.active ul li.active a:link,
 ul.menu li.active ul li.active ul li.active a:visited
{
        font-weight:bold;
}



/* ##########################  main  ########################### */

/* ++++++++++++++  main general  ++++++++++++++ */

#main h1
{

        padding: 5px;
        font-size:1.4em;
        line-height:1.19em;
        font-weight:normal;
        margin:0 -5px 10px -5px

}

#main h2
{
        font-size:1.6em;
        font-weight:normal;
        margin-bottom:10px;
        padding:3px 0px;
}

#main h2 a
{
        text-decoration:none;
}

#main h3
{
        margin:0px 0 10px;
}

.item
{
        padding:0px 5px 10px 5px;
        display:block
}

.item h2
{
        margin:0 0px 10px 0px;
}

.item-page
{
        padding: 0px;
        xdisplay:block;
        xoverflow:hidden;
		margin:0px;
}


/* h1 on frontpage and blog view */

#main .blog-featured h1,
#main .blog h1
{

        margin:0 0px 10px 0px
}


.blog .category-desc
{
        padding:0 5px;
        margin:10px 0 25px
}

.blog .cat-children .category-desc
{
        padding:0 0px;
        margin:10px 0 25px
}


#main .items-row h2
{
        font-weight:normal;
        padding:5px 2px 5px 2px;
        font-size:1.4em
}
#main ul.subcategories
{
        margin:20px 20px 20px 10px
}
#main .subcategories-link
{
        font-weight:bold
}

#main ul
{
        list-style-position:outside;
        list-style-type:square;
        padding:0 0 0 0px;
        margin:10px 0 10px 0px;
}

#main ol
{
        padding:0 0 0 20px;
        margin:10px 0 10px 0px;
                list-style-position:outside
}

#main ul li,
#main ol li
{
        padding:0;
        line-height:1.7em;
        margin: 0;
}

#main .category-list
{
        padding:0 5px;
        display:block;
}

#main .category-list h1
{
        margin-left:-5px;
        margin-right:-5px;
}

.categories-list
{
        padding:0 5px
}

#main .categories-list ul
{
        margin:0px 0 0 20px;
        padding:0
}

#main .categories-list ul li
{
        padding: 5px;
}

#main .categories-list ul ul
{
        margin-left:15px
}

#main .categories-list dl dt,
#main .categories-list dl dd
{
	display:inline
}

.category-desc
{
        line-height:1.7em;
        margin:10px 0;
        padding-left:0px
}

.small
{
        font-size:11px;
		color:#888;
        margin:15px 0px;
}

.image-left
{
        float:left;
        margin:0 15px 5px 0;


}

.image-right
{
        float:right;
        margin:0 0 5px 15px
}

.archive
{
        padding:0px
}

.archive form
{
        padding:0px
}

ul#archive-items
{
        margin:20px 0 20px 0px;
        list-style-type:none;
        padding:0
}

ul#archive-items li.row0,
ul#archive-items li.row1
{
        padding:0px 0;
        margin:0px 0;
}

/* ++++++++++++++  columns  ++++++++++++++ */

.cols-4 .column-1
{
        width:23%;
        float:left
}

.cols-4 .column-2
{
        width:23%;
        margin-left:1%;
        float:left;
}

.cols-4 .column-3
{
        width:23%;
        margin-left:1%;
        float:left
}

.cols-4 .column-4
{
        width:23%;
        margin-left:0;
        float:right
}

/* ++++++++++++++  top  ++++++++++++++ */

#top h2
{
        font-size:1.4em;
        font-weight:normal
}

/* ++++++++++++++  leading  ++++++++++++++ */

#main .items-leading h2
{
        font-size:1.4em;
        font-weight:normal;
        padding:5px 0px
}

/* ++++++++++++++  readmore  ++++++++++++++ */

#main .readmore a
{
        font-weight:bold;
        xxpadding:2px 5px 2px 10px;
        display:inline-block;
        margin-top:5px;
        text-decoration:none
}

.newsflash  a.readmore:link,
.newsflash a.readmore:visited,
#main a.readmore:link,
#main a.readmore:visited
{
        xxpadding:4px 5px 4px 10px ;
        line-height:1.2em;
        text-decoration:none;
		float:right

}

.newsflash  a.readmore:link,
.newsflash a.readmore:visited
{margin:10px 0;}


a.readmore:hover,
a.readmore:active,
a.readmore:focus
{
        text-decoration:none
}

#main .readmore a:hover,
#main .readmore a:active,
#main .readmore a:focus
{
        text-decoration:none;
}
/* ++++++++++++++  details  ++++++++++++++ */

.article-info
{
        margin:10px 0 10px 0px;
        font-size:0.9em;
}

.article-info-term
{
        display:none
}

dt.category-name,
dt.create,
dt.modified,
dt.createdby
{
        float:left;
        padding-right:5px;
}

.archive .article-info dd,
.article-info dd
{
        margin:2px 0 0px 0;
        line-height:1.2em
}

dd.createdby
{

}

.article-info dd span
{
    text-transform:none;
    display:inline-block;
    padding:0 5px 0 0px;
    margin:0 10px 0 0px;
}

/* ++++++++++++++  icons  ++++++++++++++ */

#main ul.actions
{
        text-align:right;
        padding:0 ;
        width:100%;
        margin:0
}

#main ul.actions li
{
        display:inline
}

#main ul.actions a
{
        text-decoration:none
}

/* ++++++++++++++  items more  ++++++++++++++ */

#main .items-more
{
        padding-top:10px;
}

#main .items-more h3
{
        font-weight:normal;
        margin:0;
        padding:5px 5px 5px 5px;
        font-size:1.4em
}

#main .items-more ol
{
        line-height:1.3em;
        list-style-type:none;
        margin:0;
        padding:10px 0 10px 2px;
}

#main .items-more ol li
{
        padding:2px;
}

#main .items-more ol li a
{
        display:inline;
        margin:0;
        font-weight:normal;
        padding:5px 5px 5px 20px;
}

#main .items-more ol li a:hover,
#main .items-more ol li a:active,
#main .items-more ol li a:focus
{
        font-weight:normal;
        padding:5px 5px 5px 20px;
        text-decoration:none
}


/* ++++++++++++++  pagination  ++++++++++++++ */

#main .pagination {
	margin:10px auto -10px auto;
	padding:20px 0px 0px 0px;
	clear:both;
	text-align:center;
}

#main .pagination ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

#main .pagination li {
	display:inline;
	text-align:center;
	margin:0 3px;
}

#main .pagination li.pagination-start span.pagenav,
#main .pagination li.pagination-end span.pagenav,
#main .pagination li.pagination-start a.pagenav,
#main .pagination li.pagination-end a.pagenav {
	width:66px;
	display:inline-block;
}
#main .pagination li.pagination-next span.pagenav,
#main .pagination li.pagination-prev span.pagenav,
#main .pagination li.pagination-next a.pagenav,
#main .pagination li.pagination-prev a.pagenav {
	width:30px;
	display:inline-block;
}

p.counter {
	font-weight:bold;
}

#main li.pagination-start span.pagenav,
#main li.pagination-end span.pagenav,
#main span.pagenav.current {
	xxfont-family: Arial, Tahoma, Verdana;
	font-size: 12px;
	background-color:#f3f3f3;
	color:#050505;
	font-weight:normal;
	xxpadding-left:5px;
	xxpadding-right:5px;
	padding-top:1px;
	padding-bottom:2px;
	text-decoration:none;
	xborder: 1px solid #E1E1E1;
	width:30px;
	display:inline-block;
	margin-bottom:10px;
}
#main span.pagenav {
	xxfont-family: Arial, Tahoma, Verdana;
	font-size: 12px;
	background-color:#e31f24;
	color: #ffffff;
	xxpadding-left:5px;
	xxpadding-right:5px;
	padding-top:1px;
	padding-bottom:2px;
	text-decoration:none;
	xxborder: 1px solid #E1E1E1;
	width:30px;
	display:inline-block;
	margin-bottom:10px;
}

#main a.pagenav {
	xxfont-family: Arial, Tahoma, Verdana;
	font-size: 12px;
	background-color:#f3f3f3;
	color: #050505;
	xxpadding-left:5px;
	xxpadding-right:5px;
	padding-top:1px;
	padding-bottom:2px;
	text-decoration:none;
	xxborder: 1px solid #E1E1E1;
	width:30px;
	display:inline-block;
	margin-bottom:10px;
}

#main a.pagenav:hover {
	xxfont-family: Arial, Tahoma, Verdana;
	font-size: 12px;
	background-color:#e31f24;
	color:#FFFFFF;
	font-weight:normal;
	xxpadding-left:5px;
	xxpadding-right:5px;
	padding-top:1px;
	padding-bottom:2px;
	text-decoration:none;
	xxborder: 1px solid #E1E1E1;
	width:30px;
	display:inline-block;
	margin-bottom:10px;
}
#main .pagination li.pagination-prev a.pagenav:hover {
	background: #e31f24 url('../images/arrow-left-hover.png') center center no-repeat;
}
#main .pagination li.pagination-prev a.pagenav {
	background: #f3f3f3 url('../images/arrow-left.png') center center no-repeat ;
}

#main .pagination li.pagination-next a.pagenav:hover {
	background: #e31f24 url('../images/arrow-right-hover.png') center center no-repeat;
}
#main .pagination li.pagination-next a.pagenav {
	background: #f3f3f3 url('../images/arrow-right.png') center center no-repeat;
}


#main .pagination li.pagination-prev span.pagenav {
	background: #f3f3f3 url('../images/arrow-left-gray.png') center center no-repeat ;
}
#main .pagination li.pagination-next span.pagenav {
	background: #f3f3f3 url('../images/arrow-right-gray.png') center center no-repeat;
}

#main li.pagination-start span.pagenav,
#main li.pagination-end span.pagenav {
	background-color:#f3f3f3;
	color:#AFAFAF;
}

.pagination ul li a.pagenav:focus {
	color:#000 !important;
	background:#f3f3f3 !important
}



div.counterz {
	font-weight:normal;
	text-align:right;
	width:130px;
	float:right;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	font-size:12px;
}
div.filterz {
	width:calc(100% - 135px);
	float:left;
	margin: 0px;
	padding: 0px;
}
div.filterz fieldset {
	margin: 0px !important;
}
.newzfilter {
	overflow:hidden;
	margin-bottom:30px;
}
div.counterz div {
	margin-top:6px;
	float:left;
}


/* ##########################  right  ########################### */

#right .moduletable
{
        margin:0px 0px 10px 00px;
        padding:0px 0 20px 0;
}

#right h3
{
        font-size:1.2em;
                line-height:1.4em;
        margin:5px 0 0 0;
        font-weight:normal ;
}

#right h3 span.backh
{
        padding:0px 0px 0px 0;
        display:block;
}

#right h3 span.backh2
{
        display:block;
}

#right h3 span.backh3
{
        padding:0px 0px 5px 0px;
        display:block;
}

#right h3.js_heading span.backh
{
        padding:0px 0 0 10px
}

#right h4
{
        font-size:1em;
        padding:10px 5px 0 0;
        margin:0;
}

#right ul
{

    list-style-type:none;
    margin:10px 0;
    padding:5px 0 0 0px;
    position:relative;
}
#right ul.categories-module ul
{margin: 15px 0 15px 10px}
#right ul li
{

}

#right ul li a
{

}

#right ul.category-module
{
        margin-top:0;
        padding-top:0
}



/*  ####################   forms   #####################  */

#member-registration
{
        padding:0 5px
}
#member-registration fieldset
{
border:solid 1px #ddd
}

form fieldset dt
{
        clear:left ;
        float:left;
        width:12em;
        padding:3px 0
}

form fieldset dd
{
        float:left;
        padding:3px 0
}

/* ########################## search ############################ */
.searchintro
{
        font-weight:normal;
        margin:20px 0 20px;
}

#searchForm,
#finder-search
{
	font-family: 'open sans', sans sarif;
	font-style: normal;
	font-weight: normal;
	font-size:14px;
	color:#050505;
	padding:0 5px
}

.form-limit
{
        margin:20px 0 0;
        text-align:right;
        padding:0 0px 0 0px;
}

.inputbox:focus
{

}

.highlight
{
        font-weight:bold;
}

.ordering-box
{
        width:40%;
        float:left;
		text-align:right;
}

.phrases-box
{
        width:60%;
        float:left;
		padding-top:5px;
}

.only,
.phrases
{
        margin:10px 0 0 0px;
        xpadding:15px ;
        line-height:1.3em;
}

label.ordering
{
        xxdisplay:block;
        margin:0px 0 0px 0

}

.word
{
        padding:10px 10px 10px 0;
}

.word input
{
        xxfont-weight:bold;
        margin:0px 10px 0px 10px;
        padding:4px;
        font-size:1em;
		width:180px;
}

.word input:focus
{
        xxmargin:0px;
}

.word label
{
    xxfont-weight:bold
}

fieldset.only label,
fieldset.phrases label
{
    margin:0 10px 0 0px
}

.ordering-box label.ordering
{
    margin:0 0px 0px 0;
    xxfloat:right;
}


form .search label,
form .finder label
{
        display:none
}

form #finder-filter-select-list label
{
        display:block;
        margin-top: 10px;
        margin-bottom: 2px;
}

.search legend
{xxfont-weight:bold}
/* ++++++++++++++  selects  ++++++++++++++ */
.phrases .inputbox
{
        width:10em;
}

.phrases .inputbox option
{
        padding:2px;
}


/* ++++++++++++++  search results  ++++++++++++++++++ */

dl.search-results {
	font-family: 'open sans', sans sarif;
	font-style: normal;
	font-weight: normal;
	font-size:14px;
	color:#050505;
}

dl.search-results dt.result-title
{
        padding:15px 15px 0px 5px;
        font-weight:bold;
		color:#e31f24;
}

dl.search-results dd
{
        padding:2px 15px 2px 5px
}

dl.search-results dd.result-text
{
        padding:10px 15px 10px 5px;
        line-height:1.7em
}

dl.search-results dd.result-url
{
        font-size:90%;
        padding:2px 15px 15px 5px;
}

dl.search-results dd.result-created
{
        padding:2px 15px 15px 5px
}

dl.search-results dd.result-category
{
	 padding:10px 15px 5px 5px
}

/* ########################### contacts ########################### */

.contact
{
        padding:0 5px
}

.contact-category
{
        padding:0 10px
}

.contact-category  #adminForm fieldset.filters
{
	border:0;
	padding:0
}

.contact-image
{
	margin:10px 0;
	overflow:hidden;
}

.contact-image img
{
/* as you like
float:right;
float:left */
}


address
{
        font-style:normal;
        margin:10px 0;

}

address span
{
        display:block
}
.contact-address
{
margin:0px 0 10px 0;
}


.contact-email div
{
        padding:2px 0;
        margin:0 0 10px 0;
}

.contact-email label
{
        width:17em;
        float:left;

}
span.contact-image
{
    margin-bottom:10px;
    overflow:hidden;
    display:block
}
#contact-textmsg
{padding: 2px 0 10px 0}

#contact-email-copy
{
        float:left;
        margin-right:10px;

}


.item-page .button,
.contact .button
{
        xxfloat:none !important;
		
        clear:left;
        display:block;
        margin:20px 0 0 0;
}



dl.tabs {
    float: left;
    margin: 50px 0 0 0;
    z-index: 50;
    clear:both;


}

dl.tabs dt {
    float: left;
    padding: 4px 10px;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
    margin-right: 3px;
    background: #f0f0f0;
    color: #666;
}

dl.tabs dt.open {
    background: #F9F9F9;
    border-bottom: 1px solid #F9F9F9;
    z-index: 100;
    color: #000;

}

div.current {
    clear: both;
    border: 1px solid #ccc;
    padding: 10px 10px;
}


div.current dd {
    padding: 0;
    margin: 0;
}

dl#content-pane.tabs {
    margin: 1px 0 0 0;
}


/* ##########################  user profile  ########################### */

#users-profile-core,
#users-profile-custom
{
        margin:10px 0 15px 0;
        padding:15px;
}

#users-profile-core dt,
#users-profile-custom dt
{
        float:left;
        width:12em;
        padding:3px 0;


}

#users-profile-core dd,
#users-profile-custom dd
{
        padding:3px 0;



}

#member-profile fieldset,
.registration fieldset
{
        margin:10px 0 15px 0;
        padding:15px;

}

#users-profile-core legend,
#users-profile-custom legend,
.profile-edit legend,
.registration legend
{
		font-weight:bold
}

.profile-edit form#member-profile fieldset dd,
.registration form#member-registration fieldset dd
{ float:none; padding:5px 0}

.profile-edit form#member-profile fieldset dd input,
.profile-edit form#member-profile fieldset dd select,
.registration form#member-registration fieldset dd input
{width:17em}
.profile-edit form#member-profile fieldset dt,
.registration form#member-registration fieldset dt
{padding:5px 5px 5px 0; width:13em}


span.optional
{font-size:0.9em}
/*#################### tables ############################ */

table
{
        border-collapse:collapse
}

table.weblinks,
table.category

{
        font-size:1em;
        margin:10px 10px 20px 0px;
        width:99%;
}

table.weblinks td
{
        border-collapse:collapse;
}

table.weblinks td,
table.category td

{
        padding:12px 7px;
}

table.weblinks th,
table.category th

{
        padding:7px;
        text-align:left
}

td.num
{
        vertical-align:top;
        text-align:left;
}

td.hits
{
        vertical-align:top;
        text-align:center
}

td p
{
        margin:0;
        line-height:1.3em
}

.filter
{
        margin:10px 0
}

.display-limit, .filter {
	text-align:right;
	margin-right:7px;
	font-size:13px;
}

.display-limit select#limit option {
	padding:3px 0px 3px 10px;
}



/* ++++++++++++++  category table  ++++++++++++++ */

table.category th a img
{
        padding:2px 10px
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.filter-search
{
        float:left;

}
.filter-search .inputbox
{width:10em}


legend.element-invisible
{
        position:absolute;
        /* need margin top and left doesn't work for the legend element */
        margin-left:-3000px;
        margin-top:-3000px;
        height:0px;
}

.cat-items
{
       xxmargin-top:20px
}


/* #################### footer ############################ */
#footer-sub
{

    padding:0px
}
#footer
{
        padding:15px 10px 15px 20px;
        text-align:right;
        margin:0 auto;
        display:block;
        max-width:1020px;
        overflow:hidden
}

#footer div
{
        float:left;
        font-size:0.8em;
        line-height:1.7em;
}

#footer-outer
{
        padding:0;
}

.box
{
        text-align:left
}

.box ul
{
        list-style-type:none
}

#bottom .newsfeed-item
{
        padding:0;
        margin-bottom:10px
}

.box .moduletable_menu,
.box .moduletable
{
        margin:10px 20px;
}

.box3
{
        padding-left:10px
}

.box h3
{
        font-size:1.3em
}

#bottom ul.latestnews
{
        padding-left:0
}

#footer p
{
        font-size:0.8em;
        margin:0
}

p.syndicate
{
        float:left;
        display:block;
        text-align:left;
}


/* ++++++++++++++  Error Message contact form  ++++++++++++++ */
p.error
{
        padding:10px;
}

/* ++++++++++++++  editor  ++++++++++++++ */
.contentpaneopen_edit
{
        float: left;
}

.contentpaneopen_edit img
{

}


a.mceButton:hover  {background:none !important}

/* ++++++++++++++  pagebreak  ++++++++++++++ */
table.contenttoc
{
        padding:10px;
        margin:10px;
}

table.contenttoc tr td
{
        padding:1px 0px
}

.pagenavcounter
{
        font-weight:bold;
}


/* ++++++++++++++  edit  ++++++++++++++ */
legend
{
        padding:3px 5px;
}

form#adminForm
{

}

.edit form#adminForm fieldset
{
        padding:20px 15px;
        margin:10px 0 15px 0;
}

.formelm
{
        margin:5px 0
}


.formelm label
{
        width:13em;
        display:inline-block;
        vertical-align:top;
}

form#adminForm .formelm-area
{
        padding:5px 0
}

form#adminForm .formelm-area label
{
        vertical-align:top;
        display:inline-block;
        width:7.9em
}

.formelm-buttons
{
        text-align:right;
        margin-bottom:10px
}

.button2-left
{

}

a.modal-button,
.button2-left .blank a,
.button2-left a,
.button2-left div.readmore a
{background:#eee;
padding:4px !important;
margin:0 !important;
line-height:1.2em; border:solid 1px #ddd;
font-weight:bold; text-decoration:none;
margin-top:10px !important}

/* ++++++++++++++  tooltip  ++++++++++++++ */


.tip
{
        font-size:0.8em;
        text-align:left;
        padding:3px;
        max-width:400px
}

.tip-title
{
        font-weight:bold;
}


/* #################### modules ############################ */

/* ++++++++++++++  newsflash  ++++++++++++++ */

/* newsflash horizontal */
.newsflash-horiz
{
        overflow:hidden;
        list-style-type:none !important;
        margin:0 5px!important;
        padding:20px 10px !important
}

.newsflash-horiz li
{
        float:left;
        width:30%;
        margin:0 1% !important;
        padding:10px 5px;
}

ul.newsflash-horiz li h4
{
    font-size:1.4em;
}

.newsflash-horiz li img
{
    display:block;
    margin-bottom:10px
}

/* newsflash vertical */

.newsflash-vert
{
    padding:0
}


/* ++++++++++++++  banner  ++++++++++++++ */

.banneritem
{
        margin: 10px 0px 10px 0px;
        padding:0px;
}

.banneritem a
{
        font-weight:bold
}


/* ++++++++++++++  latest, popular  ++++++++++++++ */

#nav .module_content ul.latestnews,
#nav .module_content ul.mostread
{
        margin:10px 0 0 0
}

ul.latestnews,
ul.mostread
{
        padding-left:10px;
        list-style-type:none !important;
}

ul.latestnews li a,
ul.mostread li a
{
    padding:2px 2px 2px 15px ;
    display:block;
    text-decoration:none
}


/* ++++++++++++++  newsflash  ++++++++++++++ */
.newsflash
{
    margin:0px;

}

/* ++++++++++++++  newsfeed  ++++++++++++++ */
.newsfeed
{
        padding:0 5px
}

ul.newsfeed
{
        padding:0 !important
}

.newsfeed-item
{
        padding:5px 0 0 0;
        margin:0
}

.newsfeed-item h5 a
{
        font-size:1.1em;
        font-weight:bold !important
}

.feed-item-description img
{margin: 5px 10px 10px 0}

dl.newsfeed-count dt,
dl.newsfeed-count dd
{
        display:inline
}

/* ++++++++++++++  weblinks  ++++++++++++++ */

dl.weblink-count dt,
dl.weblink-count dd
{
        display:inline;

}

/* ++++++++++++++  login  ++++++++++++++ */

#login-form
{
        padding-top:5px
}

#login-form fieldset
{
        padding:0px;

}

#login-form .inputbox
{
        padding:2px
}

#login-form fieldset.input
{
        padding:10px 0 0 0;
        margin:0px 0 10px 5px
}

#login-form label
{
        margin-right:10px;
        width:8.4em;
        display:block;
        float:left
}

#form-login-remember label
{
	float:none;
	width:auto;
	display:inline
}

.logout-button
{
	margin-top:10px
}

input.button,
button.button,
button.validate
{
        cursor:pointer;
        padding:3px 5px 3px 7px ;
        font-weight:bold;
        line-height:1.2em;
        font-family:arial;
}

#modlgn-username,
#modlgn-passwd
{
        width:9em
}

.module_content #form-login-username label,
.module_content #form-login-password label
{
            float:left;
            width:5.2em
}

.login-fields
{
        margin:10px 0
}

.login-fields label
{
        float:left;
        width:9em
}

.login-description img,
.logout-description img
{
        float:left;
        margin-right:20px
}

.login-description,
.logout-description
{
        overflow:hidden;
                padding-left:5px;
                margin:20px 0 10px 0
}

.logout-description
{
        margin-bottom:20px
}



/* ++++++++++++++  tabs/ slide  ++++++++++++++ */
.slide
{
        height:auto !important;

}

ul.tabs
{
    overflow:hidden;
    padding:0 !important;
    margin:0 !important
}

.tabopen ul.newsflash-horiz,
.tabopen ul.newsflash-vert,
.tabopen ul.latestnews
{
    margin:0 !important;
    padding:0 !important;
}

.tabopen ul.newsflash-horiz li,
.tabopen ul.newsflash-vert li
{
    padding:0 6px !important;
}

ul.tabs li
{
    list-style-type:none;
    float:left;
    width:auto;
    padding:0;
    display:block;
    margin:0;
    font-size:1em;
}

ul.tabs li a:link,
ul.tabs li a:visited
{
    text-decoration:none;
    padding:7px 5px;
    margin:0px ;
    display:block;
    font-size:0.9em;
    font-weight:normal;
}

ul.tabs li a.linkopen:link,
ul.tabs li a.linkopen:visited
{
    font-weight:bold;
}

ul.tabs li a:hover,
ul.tabs li a:active,
ul.tabs li a:focus
{
        text-decoration:underline;
}

.tabcontent
{
        padding:15px 10px;
        margin-top:-1px;
}

.tabcontent:focus
{
	outline:none
}
.tabopen
{
        display:block;
        margin-bottom:20px;
        overflow:hidden
}

.tabclosed
{
        display:none
}

.tabcontent ul
{
        padding:0
}

.tabcontent ul li
{
        list-style-type:none
}

.tabcontent .linkclosed
{

}

a.linkopen
{

}

.tabouter
{
        margin-top:20px
}


.module_content
{border:solid 1px #000;
padding:10px}

/* ++++++++++++++  random  ++++++++++++++ */

#right .random-image,
#nav .random-image
{
        margin-top:10px;
        margin-left:10px
}



/* ++++++++++++++  content-module ++++++++++++++ */
.category-module li
{
        padding:5px 0 5px 0
}

.category-module span
{
        display:block;
        font-size:0.85em;
}

.category-module a span
{
        display:inline
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

a.mod-articles-category-title
{
        text-decoration:none;
        font-weight:bold
}



/*-------------------------------*/

.australia
{
        margin:0px 0;
        padding:10px 65px 10px 10px;
}

.australia h3
{
        font-size:1.4em;
}

.australia a
{
        font-weight:bold
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.australia p
{
        line-height:1.4em
}

/* ###########  Categories list ############ */
#main .categories-listalphabet ul
{
padding:0;
margin:20px 10px 10px 0;
list-style-type:none;
list-style-position:inside
 }
#main .categories-listalphabet ul li
{
display :inline;
padding:5px;
border-right:solid 1px #ddd
}


#main .categories-list ul
{list-style-type:none;
margin:0}

#main .cat-children
{ padding-left:5px
}
#main .cat-children ul dl dt,
#main .cat-children ul dl dd
{ display:inline}

#main .cat-children ul
{list-style-type:none;
 margin:0;
 padding:0;
}
 #main .cat-children ul
 {margin:20px 20px 20px 0;}
  #main .cat-children ul ul
  {margin:20px}

  #main .cat-children ul li
  {margin:10px 0 10px 0}




  /* mod stats  */


    .stats-module dl
    {margin:10px 0 10px 0}
    .stats-module dt
    {float:left;
    margin:0 10px 0 0;
    font-weight: bold;
    }
      .stats-module dt,   .stats-module dd
      {padding:2px 0 2px 0 }
/* syndicate */

a.feed-link
{
margin-top:15px;
display:block;
text-decoration:none
}

.feed-link img
{border:0}

/* pagenav */
#main ul.pagenav {
	list-style-type:none;
	padding:0;
	overflow:hidden;
}
ul.pagenav li {
	display:inline-block;
	padding:0px;
	margin:0;
}
#main ul.pagenav li {
	line-height:2em;
}
#main ul.pagenav li.pagenav-prev {
	width:45%!important;
	float:left;
}
#main ul.pagenav li.pagenav-next {
	width:45%!important;
	float:right;
	text-align:right;
}

ul.pagenav li a {
	font-size: 0px;
	color: #050505;
	padding-top:1px;
	padding-bottom:2px;
	text-decoration:none;
	width:30px;
	display:inline-block;
	margin-bottom:10px;

}
ul.pagenav li.pagenav-prev { float:left;  }
ul.pagenav li.pagenav-next { float:right; }
ul.pagenav li.pagenav-prev a { background: #f3f3f3 url('../images/arrow-left.png')  center center no-repeat; }
ul.pagenav li.pagenav-next a { background: #f3f3f3 url('../images/arrow-right.png') center center no-repeat; }
ul.pagenav li.pagenav-prev a:hover { background: #e31f24 url('../images/arrow-left-hover.png')  center center no-repeat !important; }
ul.pagenav li.pagenav-next a:hover { background: #e31f24 url('../images/arrow-right-hover.png') center center no-repeat !important; }
ul.pagenav li.pagenav-prev a:focus { background: #e31f24 url('../images/arrow-left-hover.png')  center center no-repeat !important; }
ul.pagenav li.pagenav-next a:focus { background: #e31f24 url('../images/arrow-right-hover.png') center center no-repeat !important; }



#main .pagination li.pagination-prev a.pagenav:hover {
	background: #e31f24 url('../images/arrow-left-hover.png') center center no-repeat;
}
#main .pagination li.pagination-prev a.pagenav {
	
}





/* pagebreak */

#article-index
{
	width:25%;
	float:right;
	border:solid 1px #eee;
	padding:10px;
	margin: 10px 0px 20px 30px;
	background:#f9faf9
}
#article-index h3
{
	margin:0;
	font-size:1em;


}

#article-index ul
{
	list-style-type:disc;
	color:#666
}


/* mailto window */


#mailto-window
{
	background:#f5f5f5;
	padding:15px;
	border:solid 1px #ddd;
	position:relative
}
#mailto-window label
{
	width:10em
}

.mailto-close
{
	position:absolute;
	right:0;
	top:5px;
	background:none;




}


.mailto-close a
{
background:#f5f5f5 url(../images/close.png) no-repeat !important;
min-width:25px;
display:block;
min-height:25px;
overflow:visible
}

.mailto-close a  span
{
	position:absolute;
	left:-3000px;
	top:-3000px;
	display:inline

	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
#mailto-window  .inputbox
{
	background:url("../images/content_bg.gif") repeat-x scroll 0 0 #FFFFFF;
	border:1px solid #ccc;
	padding:3px;
}

#mailto-window p
{
	margin-top:20px
}

#mailto-window button
{
	margin:0 5px 0 0
}


span.spacer > span.text label {
	white-space: nowrap;
	font-weight: bold;
	color: #666;
}
.red {
	font-weight: bold;
	color: #c00;
}

.star {
	color:#cc0000;
}

/* ++++++++++++++  news feeds direction ++++++++++++++ */

.redirect-ltr {
	direction: ltr;
	text-align: left;
}

.redirect-rtl {
	direction:rtl;
	text-align: right;
}


#main h3.title,
#main2 h3.title,
#main dl.tabs h3,
#main2 dl.tabs h3
{margin:0}
/* ++++++++++++++  feed-display-module ++++++++++++++ */

div.feed {
	display:block;
	padding: 5px 10px;
}

/* ++++++++++++++  image float style ++++++++++++++ */
.img-fulltext-left {
	float:left;
	margin-right: 15px;
	margin-bottom: 0px;
	margin-top: 25px;
	padding:2px;
	border:1px solid #eee;
	max-width:250px;
}

.img-intro-left {
	float: left;
	margin-right: 15px;
	margin-bottom: 0px;
	padding:2px;
	border:1px solid #eee;
}

.img-fulltext-right {
	float: right;
	margin-left: 15px;
	margin-bottom: 0px;
	padding:2px;
	border:1px solid #eee;
}

.img-intro-right {
	float: right;
	margin-left: 15px;
	margin-bottom: 0px;
	padding:2px;
	border:1px solid #eee;
}

.img-fulltext-right img,
.img-fulltext-left img {
	max-width:250px;
}









/* vision & mission & values */

.content-title {
	font-size:18px;
	color:#0665a5;
	margin-top:0px;
	margin-bottom:0px;
	font-weight:bold;
	font-family: 'open sans', sans sarif;

}
.content-title-2-line {
	font-size:16px;
	color:#0665a5;
	margin-top:10px;
	margin-bottom:10px;
	font-weight:bold;
	font-family: 'open sans', sans sarif;
	text-transform:uppercase;
	line-height:18px;

}
.content-subtitle {
	font-size:16px;
	color:#0665a5;
	font-family: 'open sans', sans sarif;

}
.corevalues_item {
	margin-top:0px;
	margin-right:20px;
}
.corevalues_item2 {
	margin-top:0px;
	margin-right:10px;
}

.corevalues {
	padding:3px;
	margin:5px 20px 20px 5px;
	-moz-box-shadow: 0 0 4px #999; 
	-webkit-box-shadow: 0 0 4px #999;
	box-shadow: 0 0 4px #999;
}
img.corevalues {
	float: left;
}

/* services */

.bulleted-list li {
	background: url("../images/marker_1.gif") no-repeat left 9px;
	list-style:none;
	font-size:14px;
	padding-left: 12px !important;
	margin-bottom: 3px !important;
	margin-left: 5px !important;
}
.div_2col {
	margin:0px;
	margin-right:20px;
	width: calc(50% - 20px);
	float:left;
}
.div_2col_outer {
	width:100%;
	display:block;
	overflow:hidden;
}


.div_3col {
	margin:0px;
	margin-right:20px;
	width: calc(33.3% - 21px);
	float:left;
}
.div_3col_outer {
	width:100%;
	display:block;
	overflow:hidden;
}

.corevalue_content {
	overflow:hidden;
	width:50%;
	float:left;
}
.clearboth {
	clear: both;
}

.ourstaff {
	border:0px solid #bbb;
	margin-bottom:1px;
	overflow:hidden;
	width:358px;
	font-size:14px;
	margin:0px auto;
}
.ourstaff_title {
	width:270px;
	background:url('../images/bullet-project.gif') 10px center no-repeat;
	float:left;
	padding:6px 6px 6px 30px;
}
.ourstaff_num {
	width:15px;
	float:left;
	padding:2px;
	text-align:right;
	padding:6px 30px 6px 6px;
}
.ourstaff:nth-child(odd) {
    background:#f5f5f5;
}
.ourstaff:nth-child(even) {
    background:#fbfbfb;
}


.title_total {
	width:270px;
	float:left;
	padding:6px 6px 6px 30px;
	text-align:right;
	font-weight:bold;
}
.num_total {
	width:15px;
	float:left;
	padding:2px;
	text-align:right;
	padding:6px 30px 6px 6px;
	font-weight:bold;
}

.ourstaff_columnchart {
	width:50%;
	float:left;
}
.main_projectfar {
	border:0px solid #bbb;
	margin-bottom:1px;
	overflow:hidden;
	width:418px;
	font-size:14px;
	margin:0px auto;
}
.title_projectfar {
	width:330px;
	background:url('../images/bullet-project.gif') 10px center no-repeat;
	float:left;
	padding:6px 6px 6px 30px;
}
.num_projectfar{

	width:15px;
	float:left;
	padding:2px;
	text-align:right;
	padding:6px 30px 6px 6px;
	
}
	
.total_projectfar {
	border:0px solid #bbb;
	margin-bottom:1px;
	overflow:hidden;
	width:408px;
	font-size:14px;
	font-weight:bold;
	margin:0px auto;
}
	
.total_title_projectfar {
	width:320px;
	float:left;
	padding:6px 6px 6px 30px;
	text-align:right;
	font-weight:bold;

}
.total_num_projectfar {
	width:15px;
	float:left;
	padding:2px;
	text-align:right;
	padding:6px 30px 6px 6px;
	font-weight:bold;
}
.main_projectfar:nth-child(odd) {
    background:#f5f5f5;
}
.main_projectfar:nth-child(even) {
    background:#fbfbfb;
}

/*project so far start*/
.project_table {
	width:100%;
	
}
.project_far_right {
	width:50%;
	float:left;
	text-align:left;
	xbackground-color:#eee;

}
.project_far_left {
	width:50%;
	float:left;
	
}


/*project so far start*/

.ourstaff_table {
	width:50%;
	float:left;
	
}
.button_next {
  display: inline-block;
  border-radius: 4px;
  background:linear-gradient(#F5F5F1,#E8E8E4);
  
  border:1px solid #dddddd;
  border-radius:5px;
  color: #444444;
  text-align: center;
  font-size: 14px;
  width:140px;
  transition: all 0.5s;
  cursor: pointer;
  height:35px;
  float:right;
  margin-top:17px;
}
.button_next span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}
.button_next:hover {
	background:linear-gradient(#E8E8E4,#F5F5F1);
}



.menu_projectz,
.menu_clientz {
	text-align:center;
}
.menu_projectz ul,
.menu_clientz ul {
	text-align:center;
}
.menu_projectz li, 
.menu_clientz li {
	float: left;
	border: 5px solid #f9f9f9 !important;
	margin: 0px 20px 40px !important;
	background: #fdfdfd;
	font-size: 14px;
	width:calc(25% - 50px);

	display: table;
	height:100px;
	text-align: center;
	vertical-align: middle;

}
.menu_projectz ul.menu li a,
.menu_clientz ul.menu li a {
	background-image: none !important;
	height: 100px;
	width: 150px;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.menu_projectz li:hover,
.menu_clientz li:hover {
	background: #f9f9f9;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.menu_projectz ul.menu li a:hover,
.menu_clientz ul.menu li a:hover {
	color: #0665a5 !important;
}








.button_readmore{
	float:right!important;
	margin:20px 0 0 0!important;
}
.ourprogress_columnchart {
	width:60%;
}

.xxclientele_cat {
	width: calc(50% - 10px);
	float: left; 
	padding-right: 10px;
}

.clientele_cat ul.bulleted-list li {
	width: calc(50% - 20px);
	float: left; 
	padding-right: 10px;
}
.clientele_cat p {
	clear:both;
	padding-top:18px;
}






div.service_planning, div.service_design, div.service_construction, div.service_commissioning {
	width:calc(25% - 50px);
	margin:10px 10px 20px;
	float:left;
	text-align:center;
	background:#fde;
	font-size:14px;
	text-transform:uppercase;
	font-weight:bold;
	letter-spacing:1px;
	padding-top:160px;
	padding-bottom:10px;
}

div.service_planning {
	background: #FdFdFd url('../images/service_planning.png') center center no-repeat;
}
div.service_design {
	background: #FdFdFd url('../images/service_design.png') center center no-repeat;
}
div.service_construction {
	background: #FdFdFd url('../images/service_construction.png') center center no-repeat;
}
div.service_commissioning {
	background: #FdFdFd url('../images/service_commissioning.png') center center no-repeat;
}


div.service_arrow_1, div.service_arrow_2, div.service_arrow_3 {
	background: url('../images/service_arrow_left.png') center center no-repeat;
	width:40px;
	height:188px;
	margin:10px 0px 20px;
	float:left;
}

.vertline2col, .vertline3col {
	border-right: 1px solid #f0f0f0;
	padding-bottom:2000px;
	margin-bottom:-2000px;
}

div.cright div.newsflash p {
	xxbackground:#fde;
}



div#contact-left {
	font-size:14px;
}


div.newsflash h4.newsflash-title {
	font-size:14px;
}

div.cright_block p, div.newsflash p {
	font-size:13px;
	margin-top:6px;
	margin-bottom:8px;
	margin-left:0px;
}
div.cright_block img {
	float:left;
	margin-top:8px;
	margin-bottom:4px;
}
div.newsflash p img {
	float:left;
	margin-bottom:4px;
}

div.category-list div.cat-items fieldset.filters {
	padding-top:2px;
}





/*
Template Name: Boss - Multipurpose Premium Html5 Templates
Template URI: https://wrapbootstrap.com/user/eony
Description: Multipurpose, premium, bootstrap based bussiness, corporate, portfolio, blog, onepage, creative, magazine, personal, landing, coming soon html5 css3 template
Version:1.0
*/

/* =================================================
--------------- Table of Contents ------------------

1. General
2. Elements / Bootstrap Overwrite
- 2.1	Dropdown Menu
- 2.2	Buttons
- 2.3	Forms
- 2.4	Tabs
- 2.5	Progress Bars
- 2.6	Lists
- 2.7	Icons
- 2.8	Collapses
- 2.9	Grid
- 2.10  Tooltips
- 2.11  Popover
- 2.12  Bootstrap slider
- 2.13  Maps
- 2.14  Counters
- 2.15  Services
- 2.16  Pagination
- 2.17  Bootstrap Modal
- 2.18  Dividers
- 2.19  Team Members
- 2.20  Labels
- 2.21  Callouts
3. Header / Navbar
- 3.1.navbar-default
- 3.2.navbar-white
- 3.3.navbar-inverse
- 3.4.navbar-transparent
4. Content
5. Homepages
- 5.1	index4
- 5.2	index6
- 5.3	index7
- 5.4	index8
- 5.5	index10
- 5.6	index13-14-15-16-17
- 5.7	index18
- 5.8	index19
- 5.9	index20
- 5.10  index23-24
- 5.11  index25-28
- 5.12  index29-31
- 5.13  index32-35
6. Service Pages
7. Pricing Tables
8. Login
9. Blog
10. About Us
11. About Me
12. Team
13. Testimonilas
14. Events
15. Knowledge Base
16. Contact Us
17. Products
18. Product.html (Single Product)
19. Category
20. Cart
21. Compare
22. Checkout
23. Wishlist
24. Portfolio
25. 404 Pages
26. Footer
- 26.1.footer-inverse
- 26.2.footer-default
- 26.3.footer-custom
27. Social Icons
28. Owl Carousel
29. Scroll Top Button
30. Retina Display


/* =============================================
-------------------  1.General ---------------
==============================================*/


.scroll-btn {
	display:block;
	width:24px;
	height:38px;
	border:2px solid #3e3e3e;
	position: absolute;
	bottom:40px;
	left:50%;
	z-index: 200;
	margin-left:-13px;
	border-radius: 12px;
	text-align: center;
	line-height: 0;
	transition: border 0.35s ease;
	-webkit-transition: border 0.35s ease;
}

.scroll-btn > span {
	display:inline-block;
	position: relative;
	margin:5px 0;
	width:2px;
	height:6px;
	background-color: #4e4e4e;
	border-radius: 8px;
	-webkit-animation-name: downup;
	animation-name: downup;
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	transition: border 0.35s ease;
	-webkit-transition: border 0.35s ease;
}

.scroll-btn:hover,
.scroll-btn:focus {
	border-color: #2e2e2e;
}

.scroll-btn:hover > span,
.scroll-btn:focus > span {
	background-color: #2e2e2e;
}

.scroll-btn.light {
	border-color:#f1f1f1;
}

.scroll-btn.light > span{
	background-color: #f1f1f1;
}

.scroll-btn.light:hover,
.scroll-btn.light:focus {
	border-color: #fff;
}

.scroll-btn.light:hover > span,
.scroll-btn.light:focus > span {
	background-color: #fff;
}

@-webkit-keyframes downup {
  0% {
    transform:translateY(0);
  }

  50%{
    transform:translateY(18px);
  }

   100% {
    transform:translateY(0);
  }
}

@keyframes downup {
  0% {
    transform:translateY(0);
  }

  50%{
    transform:translateY(18px);
  }

   100% {
    transform:translateY(0);
  }
}