/*
----------------------------------------------
* Customize.css v1.2 // CSS-Framework
* Marcel Hinz
* Jobware GmbH
----------------------------------------------
*/

/*
---------------------------------
Table Of Contents
---------------------------------

1. Base Styles

2. The Grid
    2.1. Twelve-Column-Grid
    2.2. Grid-Shortcuts
    2.3. Grid-Offsets
    2.4. Clearfixes

3. Text Formatting
    3.1. Font Weights
    3.2. Font Sizes
    3.3. Alignment & Display

4. Typography
    4.1. Title
    4.2. Subtitle
    4.3. Text & List Headings

5. Lists

6. Links & Buttons

7. Images

8. Various

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


/*
---------------------------------
1. Base Styles
---------------------------------
*/

body {
    background-color: #ffffff;
    color: #666666;
    font-weight: normal;
    font-size: 13px;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.3;
}

.container {
    position: relative;
    box-sizing: border-box;
    margin: 20px auto;
    max-width: 870px;
    border: 1px solid #666666;
}

.content {
    box-sizing: border-box;
    margin: 0;
    padding: 35px 55px 20px;
}


/*
---------------------------------
2. The Grid
---------------------------------
*/

.row {
    margin: 10px 0;
}

.row:last-child {
    margin-bottom: 0;
}

.col {
    float: left;
    box-sizing: border-box;
    margin-left: 4%;
}

.col:first-child {
    margin-left: 0;
}


/* 2.1. Twelve-Column Grid
-----------------------------
*/
.one.col {
    width: 4.66666666667%;
}

.two.col {
    width: 13.3333333333%;
}

.three.col {
    width: 22%;
}

.four.col {
    width: 30.6666666667%;
}

.five.col {
    width: 39.3333333333%;
}

.six.col {
    width: 48%;
}

.seven.col {
    width: 56.6666666667%;
}

.eight.col {
    width: 65.3333333333%;
}

.nine.col {
    width: 74%;
}

.ten.col {
    width: 82.6666666667%;
}

.eleven.col {
    width: 91.3333333333%;
}


/* 2.2. Grid-Shortcuts
-----------------------------
*/
.full.col,
.twelve.col {
    margin-left: 0;
    width: 100%;
}

.one-half.col,
.two-fourth.col {
    width: 48%;
}

.one-third.col {
    width: 30.6666666667%;
}

.two-third.col {
    width: 65.3333333333%;
}

.one-fourth.col {
    width: 22%;
}

.three-fourth.col {
    width: 74%;
}


/* 2.3. Grid-Offsets
-----------------------------
*/
.offset-by-one-third.col {
    margin-left: 34.6666666667%;
}

.offset-by-two-third.col {
    margin-left: 69.3333333333%;
}

.offset-by-one-fourth.col {
    margin-left: 26%;
}

.offset-by-three-fourth.col {
    margin-left: 78%;
}

.offset-by-one-half.col,
.offset-by-two-fourth.col {
    margin-left: 52%;
}

.offset-by-one.col {
    margin-left: 8.66666666667%;
}

.offset-by-two.col {
    margin-left: 17.3333333333%;
}

.offset-by-three.col {
    margin-left: 26%;
}

.offset-by-four.col {
    margin-left: 34.6666666667%;
}

.offset-by-five.col {
    margin-left: 43.3333333333%;
}

.offset-by-six.col {
    margin-left: 52%;
}

.offset-by-seven.col {
    margin-left: 60.6666666667%;
}

.offset-by-eight.col {
    margin-left: 69.3333333333%;
}

.offset-by-nine.col {
    margin-left: 78.0%;
}

.offset-by-ten.col {
    margin-left: 86.6666666667%;
}

.offset-by-eleven.col {
    margin-left: 95.3333333333%;
}


/* 2.4. Clearfixes
-----------------------------
*/

/* Version 1 */
.row:after {
    display: table;
    clear: both;
    content: "";
}

/* Version 2 // More margin top & bottom */
/*
.row:before,
.row:after {
    display: block;
    visibility: hidden;
    content: ".";
}

.row:after {
    clear: both;
} */


/*
---------------------------------
3. Text Formatting
---------------------------------
*/

p {
    margin-top: 0;
}

p.opener {
	margin-top: 20px;
}


/* 3.1. Font Weights
-----------------------------
*/

.fw-light {
    font-weight: lighter;
    font-weight: 300; /* 100, 200 */
}

.fw-normal {
    font-weight: normal;
    font-weight: 400;
}

.fw-medium {
    font-weight: 500;
}

b,
strong,
.fw-bold {
    font-weight: bold;
    font-weight: 700; /* 600 */
}


/* 3.2. Font Sizes & Styles
-----------------------------
*/

.fs-small {
    font-size: 80%;
}

.fs-large {
    font-size: 120%;
}

.fs-italy {
    font-style: italic;
}


/* 3.3. Alignment & Display
-----------------------------
*/
.center {
    text-align: center;
}

.just {
    text-align: justify;
}

.right {
    text-align: right;
}

.inl {
	display: inline;
}

.blk {
	display: block;
}


/*
---------------------------------
4. Typography
---------------------------------
*/

/* 4.1. Title
-----------------------------
*/
h1 {
    margin: 25px 0;
    padding: 0;
    font-weight: bold;
    font-size: 15px;
    line-height: 1.1;
	color: #024a94;
	text-align: center;
}


/* 4.2. Subtitle
-----------------------------
*/
h2 {
    margin: 10px 0;
    padding: 0;
    font-weight: normal;
    font-size: 22px;
    line-height: 1.1;
}


/* 4.3. Text & List Heading
-----------------------------
*/
h3 {
    margin: 0;
    padding: 0;
    font-weight: bold;
    font-size: 13px;
    line-height: 1.1;
	color: #024a94;
}


/*
---------------------------------
5. Lists
---------------------------------
*/

ul {
    list-style-type: disc; /* Default Value */
}

ol {
    list-style-type: decimal; /* Default Value */
}

ul,
ol {
    margin-top: 3px;
    margin-left: 50px;
	margin-bottom: 25px;
    padding-left: 0;
    /* list-style-position: inside; */
}

li {
    margin-bottom: 2px;
	padding-left: 3px;
    /* list-style-image: url(); */
}

ul ul,
ul ol,
ol ol,
ol ul {
    margin: 10px 0 10px 20px;
}

ul.square {
    list-style-type: square;
}

ul.circle {
    list-style-type: circle;
}

ol.lower-alpha {
    list-style-type: lower-alpha;
}

ol.upper-alpha {
    list-style-type: upper-alpha;
}


/*
---------------------------------
6. Links & Buttons
---------------------------------
*/

a,
a:hover,
a:active,
a:visited,
a:focus {
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
    /* border-bottom: 1px solid #000000; */
}

a.btn,
a.btn:visited,
a.btn:focus {
    display: inline-block;
    box-sizing: border-box;
    margin: 10px 0;
    padding: 10px 25px;
    background-color: #024a94;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    font-size: 14px;
	font-weight: bold;
    line-height: 1;
    cursor: pointer;
}

a.btn:hover,
a.btn:active {
    background-color: #1663b2;
}


/*
---------------------------------
7. Images
---------------------------------
*/

img {
    /*display: block;*/
    max-width: 100%;
    height: auto;
}

img#logo {
	margin-bottom: 20px;
}


/*
---------------------------------
8. Various
---------------------------------
*/

.separator {
    margin: 0 0 30px;
    border-top: 1px solid #dddddd;
}
@media screen and (max-width: 600px) {
	
	.container {
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;

	}
	
	.content {
    padding: 20px;
	margin:0;
}


}