* { margin: 0; padding: 0}
* { margin: 0; padding: 0}

html { font-size: 18px; font-weight: 400; letter-spacing: -0.01em; line-height: 1.5}
body { color: #444; font-family: 'Open Sans', sans-serif}

a { color: #6c6d6c; font-size: 0.8em; font-weight: 800; text-decoration: none}
a:hover, .active a { color: #005567}
h1, h2, h3, h4, h5, h6 { font-family: 'Roboto', sans-serif; line-height: 1.2}
h1 { font-size: 1.3em}
h2, h2 a { font-size: 1.2em; padding: 1em 0}
h4 { font-size: 1.2em}
p { margin: 1.2em 0}


header { background: #fff; overflow: hidden; position: fixed; z-index: 100; top: 0; left: 0; width: 100%}
		.sticky { border-bottom: 2px solid #005567}
header .logo { color: #005567; float: left; font-size: 1.2em; font-weight: 800; margin-top: 20px}
header .logo a { display: block}
div.logo a img { max-width: 240px}

header .search { display: none}
		#toph h3, #toph .control-label, #toph .element-invisible { display: none}
		#toph #form-login-password, #toph #form-login-submit { display: inline-block; float: left;}
	#toph #modlgn-passwd { margin: 10px 0 0 0 !important; height: 20px !important; width: 180px}
	#toph .logout-button { margin-top: 15px}

header .navigation { clear: right; float: right}
		.navigation ul { display: block; overflow: hidden; list-style: none; margin-bottom: 10px; transition: width .5s;}
		.navigation li { float: left; padding: 0 10px; transition: width .5s;}

#showmenu {height: 30px; position: absolute; top: 40px; right: 20px; z-index:1000}


.show {display:none; position:relative; z-index:999; height:auto; background:#fff}
.show ul {background:#fff}
.show ul.nav-child a {background:#fff}

.main-image { padding: 120px 0 0; position: relative; width: 100%; z-index: 10}
.main-image img { max-width: 100%; vertical-align:bottom; display: block; height: auto}

.intro { background: #f1f1f1; overflow: hidden; font-size: 0.8em}
.about { width: 100%}
.benefits, .features { background: #fff; float: left; width: 42%; margin: 0 2%; padding: 10px 2%}
.news { padding: 60px 0; width: 100%}
.news ul.category-module { padding-top: 10px}
.news li a:first-child{ font-size: 1.2em}
.mod-articles-category-readmore a { color: #005567; font-size: 0.9em !important; float: right; padding-right: 40px}
.logos {  display: inline-block; margin: 40px 0 80px; position: relative; overflow: hidden; width: 100%}
	.logos img { text-align: center; padding: 20px; width: 280px}
	.logos h3 { padding-bottom: 40px}
.news strong::before { content: "\A";
  white-space: pre;}

section#inews, section#promoters { clear: both; position: relative}

.rightf { color: #f1f1f1; }

ul { list-style: none;	padding: 0;}
	ul.accordion { margin: 40px 0}
	.inner { font-size: .8em; padding: 1em; overflow: hidden; display: none}
	.accordion a.show { }
	li { margin: .5em 0; overflow: hidden}
	.accordion a.toggle { width: 100%; display: block; background: rgba(0,0,0,0.78); color: #fefefe; padding: .75em; border-radius: 0.15em; transition: background .3s ease}
	.accordion a:hover { background: rgba(0, 0, 0, 0.9)}
	ul.bullets { padding: .8em 0 0 2em; list-style: disc}

/* #zentools-114 { display: block; clear: both;}
#zentools-114 li { margin: inherit; float: left !important;}
#zentools-114 li:nth-child(3n+1) {  clear: left}
*/

.muted, .icons { display: none}
#content { width:100%; overflow: hidden}
#artikal { font-size: 0.9em; float: left; padding: 40px 0; width: 60%}

#footer { background: rgba(0, 0, 0, 0.78) none repeat scroll 0 0; color: #f1f1f1; padding: 40px 0; overflow: hidden}
	.leftf, .contact, .rightf { float: left; width: 40%; padding: 0 5%}
	.contact span, .contact input, .contact label, .contact textarea { float: left; clear: left}
	.contact label { display: none}
.contact h3 { font-weight: 100}
	.contact textarea#message96 { height: 76px}
	input#send96 { width: 200px}
	.sscf-error { font-size: 0.9em}

.sscf-valid-true span { display: none}
.sscf-valid-error span { display: block; color: #FF0004}

#modlgn-remember, #form-login-username, ul.unstyled { display: none}



input, textarea {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-bottom: -1px; font-size: 16px;
    height: auto;
    padding: 10px;
    position: relative;background-color: #f1f1f1;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    display: block;
    font-size: 14px;
    height: 34px;
    line-height: 1.42857;
	margin-top:2px;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}
input#send96, #form-login-submit button {
    -moz-user-select: none;
	background: #bbb;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857;
    margin-bottom: 0;
    padding: 6px 12px;
    text-align: center;
    touch-action: manipulation;
    vertical-align: middle;
	white-space: nowrap;}

#form-login-submit button { margin-top: 10px;   border: 1px solid #ccc; background: #005567; color: #fff !important;font-weight: 400;} 
#modlgn-passwd {  width: 60%; margin-right: 20px;background-color: #005567; color: #fff !important; font-weight: 400;}
#desno li, #desno a { font-size: 18px}

@media (min-width:960px) {
	.container { margin: 0 auto; padding: 0; width: 960px}
   .navigation ul { line-height: 90px}
	.main-image { margin: 60px 0 0}
	.intro { padding: 60px 0}
	ul.accordion { position: relative; width: 100%}
	.benefits, .features { background: #fff; float: left; width: 42%; margin: 0 2%; padding: 10px 2%}
    .logos img { text-align: center; padding: 20px; width: 280px}
    
#artikal { float: left; width: 60%}
	#desno { float: right; padding-top: 40px; width: 30%}
}
@media (max-width:959px) {
	.container { margin: 0 auto; padding: 0 5px; max-width: 950px}
	
	header { overflow: visible; position: relative; height: 80px; z-inde: 100}
	header .logo { margin-top: 15px}
#zentools-114 li:nth-child(3n+1) {  clear: none}
	header .navigation { background: #fff url("../images/menu.png") no-repeat 10px 34px; float: right; height: 70px; width: 50px; position: relative}
	.navigation ul { display: none}
	.navigation:after { clear: both}
	.navigation:hover ul { background: #f4f4f4; display: block; position: absolute; top: 70px; right: 0; height: auto; width: 240px; overflow: hidden; opacity: 1; visibility: visible; z-index: 999}
	.navigation:hover li { display: block; float: left; clear: left; width: 100%}
	.navigation:hover a { width: 100%}
	
/*	.logos img { clear: both; float: left; text-align: center; padding: 5% 20%; width: 60%} */

	.main-image { margin: 20px 0 0; padding: 20px 0 0; position: relative; width: 100%}
	.intro { padding: 20px 10px}
	ul.accordion { position: relative; width: 96%; padding: 0 2%}
	.benefits, .features, .news { float: left; width: 100%; margin: 0; padding: 10px 0}
	.benefits .moduletable, .features .moduletable { margin: 5px}
	#artikal { float: left; width: 310px; padding: 20px 2%}
	#desno { float: left; paddin-top: 20px; width: 310px; padding: 20px 2%}
	
	.leftf, .contact, .rightf { float: left; width: 100%; padding: 0}
}