/*===========================================*/
/*                  STYLES                   */
/*===========================================*/

/*-------------------------------------------*/
/*   TABLE OF CONTENTS
/*--------------------------------------------

        01. RESET
        02. LAYOUT
        03. TYPOGRAPHY
        04. SHORTCODES
        05. PAGE HEADER/BREADCRUMBS
        06. LOGO
        07. NAVIGATION MENU
        08. FOOTER
        09. SIDEBAR
        10. WIDGETS
        11. BLOG
        12. PORTFOLIO
        13. PAGINATION
        14. COMMENTS
        15. COLORBOX
        16. NIVO SLIDER
        17. VIDEO JS
        18. COMMON CLASSES

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


/*===========================================*/
/*                01. RESET                  */
/*===========================================*/

/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp, strong, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
        margin:0;
        padding:0;
        outline:0;
        border:0;
        font-size:100%;
        vertical-align:baseline;
        background:transparent;
}

body {
        line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
        display:block;
}

nav ul {
        list-style:none;
}

blockquote{
        quotes:none;
}

blockquote:before, blockquote:after{
        content:'';
        content:none;
}

a {
        margin:0;
        padding:0;
        outline:0;
        border:0;
        font-size:100%;
        vertical-align:baseline;
        background:transparent;
}
/* change colours to suit your needs */
mark {
        background-color:#ff9;
        color:#000; 
        font-style:italic;
        font-weight:bold;
}

del {
        text-decoration: line-through;
}

abbr[title], dfn[title] {
        border-bottom:1px dotted;
        cursor:help;
}

dfn{
font-family: serif;
font-weight: bold;
}

table {
        border-collapse:collapse;
        border-spacing:0;
}

/* change border colour to suit your needs */
hr {
        display:block;
        height:1px;
        border:0;   
        border-top:1px solid #cccccc;
        margin:1em 0;
        padding:0;
}

input, select {
        vertical-align:middle;
}

/*===========================================*/


/*===========================================*/
/*              03. TYPOGRAPHY               */
/*===========================================*/

/* general                                                                                              
/*-------------------------------------------*/
body{
font-family: "Droid Sans" , arial , verdana , sans-serif;
font-size: 12px;
line-height: 20px;
color: #666666;
}

.page_subheader{
border-bottom: 1px solid #e9e9e9;
margin-top: 5px;
padding-bottom: 7px;
}


/* paragraph                                                                                            
/*-------------------------------------------*/
p{
margin: 0 0 15px 0;
}
/* heading                                                                                              
/*-------------------------------------------*/
h1, h2, h3, h4, h5, h6{
font-family: "Droid Serif" , Georgia , serif;
font-style: italic;
font-weight: normal;
color: #666666;
line-height: 1.2em;
margin: 0 0 0.5em 0;
}

h1{
font-size: 36px;
}

h2{
font-size: 30px;
}

h3{
font-size: 24px;
}

h4{
font-size: 18px;
}

h5{
font-size: 16px;
}

h6{
font-size: 14px;
}


/* selection color                                                                                      
/*-------------------------------------------*/
::selection{
background:#f08443;
color:#ffffff;
}
 
::-moz-selection{
background:#f08443;
color:#ffffff;
}

::-webkit-selection{
background:#f08443;
color:#ffffff;
}

/* link                                                                                                 
/*-------------------------------------------*/
a{
color: #999999;
text-decoration: none;
}

a:hover , a:active{
color: #f08443;
}


/* code & pre                                                                                           
/*-------------------------------------------*/
code , pre{
display: block;
padding: 20px 10px;
margin: 0 0 15px 0;

font-family: "Courier New" , monospace;
font-size: 12px;
font-style: normal;
font-weight: bold;
line-height: 20px;
}

code{
border: 1px dashed #d0d0d0;
border-left-style: solid;
border-left-width: 3px;
background: #f6f6f6;
}

pre{
white-space: pre;
border: 1px dashed #d0d0d0;
background: #ffffff;
}



/* table                                                                                                
/*-------------------------------------------*/
table{
width: 100%;
vertical-align:middle;
border-collapse: collapse;
border-spacing: 0;
margin: 0 0 15px 0;
}

th, th:hover{
font-family: "Droid Sans" , Georgia , serif;
font-style: normal;
font-weight: normal;
font-size: 1.1em;
line-height: 1.6em;
text-align: left;
padding: 0.85em;
color: #333333;
background: rgba(200, 200, 200, 0.35);
border-bottom: 1px solid transparent;
}

td{
line-height: 1.6em;
text-align: left;
padding: 0.85em;
color: #666666;
background: transparent;
}

tr{
border-bottom: 1px dashed #bbbbbb;
}

tr:hover{
background: rgba(200, 200, 200, 0.1);
}

tfoot tr{
border-top: 1px solid transparent;
border-bottom: none;
}

tfoot td, tfoot td:hover{
text-align: center;
background: rgba(200, 200, 200, 0.18);
}

table caption{
font-style: normal;
color: #aaaaaa;
}


/* buttons                                                                                              
/*-------------------------------------------*/



.secondary_button ,
.button ,
button ,
input[type = "button"] ,
input[type = "submit"] ,
input[type = "reset"]{
margin: 0.1em;
padding: 0.4em 0.8em;
cursor: pointer;
border: 1px solid transparent;
color: #ffffff;
background-color: #333333;
background-image: url('../images/button_sprite.png');
background-repeat: repeat-x;
background-position: top left;
background-image: -moz-linear-gradient(top , rgba(255 , 255 , 255 , 0.3) , rgba(255 , 255 , 255 , 0) 70\
%);
background-image: -webkit-gradient(linear, left top, left 70%, from(rgba(255 , 255 , 255 , 0.3)), to(rg\
ba(255 , 255 , 255 , 0)));
text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
-moz-border-radius: 500px;
-webkit-border-radius: 500px;
border-radius: 500px;
}

/*  ---------------------------------------*/
/* Inaktives ausgrauen
/* -----------------------------------------*/
input:disabled {
    background: gainsboro;
  }
  input[value]:disabled {
    color: whitesmoke;
  }

/* von mir hinzugefuegt 7.12.2017 */


.button.small ,
button.small ,
input[type = "button"].small ,
input[type = "submit"].small ,
input[type = "reset"].small{
font-weight: bold;
padding: 0.6em 1em;
}

.button.fancy ,
button.fancy ,
input[type = "button"].fancy ,
input[type = "submit"].fancy ,
input[type = "reset"].fancy{
font-weight: bold;
padding: 0.7em 1.1em;
}

.button.large ,
button.large ,
input[type = "button"].large ,
input[type = "submit"].large ,
input[type = "reset"].large{
font-weight: bold;
padding: 0.8em 1.2em;
}

.button:hover ,
button:hover ,
input[type = "button"]:hover ,
input[type = "submit"]:hover ,
input[type = "reset"]:hover{
color: #ffffff;
background-color: #444444;
}

.button:active ,
button:active ,
input[type = "button"]:active ,
input[type = "submit"]:active ,
input[type = "reset"]:active{
color: #ffffff;
background-color: #393939;
}

.button::-moz-focus-inner ,
button::-moz-focus-inner ,
input[type = "button"]::-moz-focus-inner ,
input[type = "submit"]::-moz-focus-inner ,
input[type = "reset"]::-moz-focus-inner{
border: none;
padding: 0;
}


.secondary_button{
border: 1px solid #e0e0e0;
color: #666666;
background-color: #fafafa;
background-repeat: repeat-x;
background-position: top left;
background-image: -moz-linear-gradient(top , rgba(0 , 0 , 0 , 0) , rgba(0 , 0 , 0 , 0.05) 70%);
background-image: -webkit-gradient(linear, left top, left 70%, from(rgba(0 , 0 , 0 , 0)), to(rgba(0 , 0\
 , 0 , 0.05)));
text-shadow: none;
}

.secondary_button:hover{
color: #666666;
background-color: #ffffff;
}

.secondary_button:active{
color: #666666;
background-color: #fbfbfb;
}




/* text inputs                                                                                          
/*-------------------------------------------*/
input[type="text"] ,
input[type="password"] ,
textarea{
font-family: "Droid Sans" , arial , verdana , sans-serif;
font-size: 12px;
font-style: normal;
display: inline-block;
vertical-align: middle;
padding: 0.5em;
color: #666666;
background: #f0f0f0;
border: 1px solid #e6e6e6;
outline: none;
resize: none;
}

input[type="text"].invalid ,
input[type="password"].invalid ,
textarea.invalid{
border: 1px solid #ff0000;
}

input[type="text"]:hover ,
input[type="password"]:hover ,
textarea:hover{
background: #f6f6f6;
}

input[type="text"]:focus ,
input[type="password"]:focus ,
textarea:focus{
background: #ffffff;
}