/*Fast RR style */





body {
	
	
	font-family: Verdana, sans-serif;
	font-weight: normal;
	
	width: 100%;
	margin: 0;
	padding: 0;
	height: auto;
    line-height: 1.8;
	
}

header {
	
	margin: 0;
	width: 100%;
	height: 100px;
	background-color: #007CB2;
	position: fixed;
	z-index: 1;
}
header img {
	
	padding: 0;
}
	nav {
		position: relative;
		margin: 0;
	}
	 nav ul {
		top: 80px;
		width: 100%;
		position: fixed;
	    background-color: #007CB2;
	    overflow: hidden;
	
	    text-align: left;
	    color: #fff;
		
	 	 
 }
 li {
	 display: inline-block;
	 font-family: Arial, Verdana, sans-serif;
	 font-size: 1.1em;
	 color: #ffffff;
	 text-transform: uppercase;
    padding-right: 5px;
	 
	 	 
 }
 li a {
	 text-decoration: none;
	 color: #ffffff;
 }
 a:hover {
	 color: orange;
	
 }
	
section {
	height: 100%;
	width: 100%;
}	
	
 article {
	 height: 100%;
	 
 }
 
 
 
 
 
  .info {
	 height: auto;
	 background-color: #f1f1f1;
	  margin: 10px;
	 padding: 20px;
	 background-color: #fff;
	 width: auto;
	
	 
 }
 
 .info h1 {
	 font-size: 1.3em;
	 color: #000811;
	 font-weight: bold;
 }
 
  .info h2 {
	 font-size: 1.1em;
	 color: #000811;
	 font-weight: bold;
 }
 
 .info p{
	 
	 font-size: 0.97em;
 }
 
 
 
 
 form {
    /* Just to center the form on the page */
    margin: 30px;
    width: 450px;
	height: 450px;
	/* To see the outline of the form */
    padding-right: 35px;
	padding-left: 15px;
	padding-top: 15px;
   
	background-color: #007CB2;
	
}

label {
    /* To make sure that all labels have the same size and are properly aligned */
    display: inline;
    width: 100px;
    text-align: right;
	color: #fff;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



input, textarea {
    /* To make sure that all text fields have the same font settings
       By default, textareas have a monospace font */
    font: 1em sans-serif;

    /* To give the same size to all text field */
    width: 400px;
	height: 45px;
    

    /* To harmonize the look & feel of text field border */
    border: 2px solid #999;
}

input:focus, textarea:focus {
    /* To give a little highlight on active elements */
    border-color: #777;
}

textarea {
    /* To properly align multiline text fields with their labels */
    vertical-align: top;

    /* To give enough room to type some text */
   
height: 45px;
    /* To allow users to resize any textarea vertically
       It does not work on all browsers */
    resize: vertical;
}


   
   

button {
    /* This extra margin represent roughly the same space as the space
       between the labels and their text fields */
   
	
	padding-top: 5px;
	margin-top: 30px;
	background-color: #333;
	color: #ffffff;
	text-transform: uppercase;
	text-transform: uppercase;
	text-align:center;
	width: 400px;
	height: 45px;
	
}





@media only screen and (max-width: 500px){
	
	
	
	
	form {
    /* Just to center the form on the page */
    margin: 20px;
    width: 300px;
	height: 450px;
	/* To see the outline of the form */
    padding-right: 15px;
	padding-left: 15px;
	padding-top: 15px;
   
  
	background-color: #007CB2;
	
}

label {
    /* To make sure that all labels have the same size and are properly aligned */
    display: inline;
    width: 100px;
    text-align: right;
	color: #fff;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



input, textarea {
    /* To make sure that all text fields have the same font settings
       By default, textareas have a monospace font */
    font: 1em sans-serif;

    /* To give the same size to all text field */
    width: 270px;
    

    /* To harmonize the look & feel of text field border */
    border: 1px solid #999;
}

input:focus, textarea:focus {
    /* To give a little highlight on active elements */
    border-color: #777;
}

textarea {
    /* To properly align multiline text fields with their labels */
    vertical-align: top;

    /* To give enough room to type some text */
   
height: 45px;
    /* To allow users to resize any textarea vertically
       It does not work on all browsers */
    resize: vertical;
	
}
	label {
    /* To make sure that all labels have the same size and are properly aligned */
    display: inline;
    width: 100%;
    text-align: right;
	color: #fff;
}

    

button {
    /* This extra margin represent roughly the same space as the space
       between the labels and their text fields */
   
	
	padding-top: 5px;
	margin-top: 30px;
	background-color: #333;
	color: #ffffff;
	text-transform: uppercase;
	text-transform: uppercase;
	text-align:center;
	width: 100%;
	height: 45px;
}

	    
	
}

/*for mobil first*/

@media only screen and (max-width: 320px){
	
	
	
    form {
        width: 100%;
		margin: 0;
		padding-left: 10px;
		padding-right: 10px;
		background-color: #007CB2;
		
    }
	
	input, textarea {
    
    font: 0.8em sans-serif;

    
    width: 250px;
    

    /* To harmonize the look & feel of text field border */
    border: 2px solid #999;
}
	
	label {
    /* To make sure that all labels have the same size and are properly aligned */
    display: inline;
    width: 100%;
    text-align: right;
	color: #fff;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

	button {
    /* This extra margin represent roughly the same space as the space
       between the labels and their text fields */
   
	
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 30px;
	background-color: #333;
	color: #ffffff;
	text-transform: uppercase;
	text-align:center;
	width: 100%;
	height: 45px;
}

header {
	
	
	width: 100%;
	height: 100px;
	background-color: #007CB2;
	position: relative;
	z-index: 1;
}
	
	 nav ul {
		top: 80px;
		width: 100%;
		position: relative;
	    background-color: #007CB2;
	    overflow: hidden;
	
	    text-align: left;
	    color: #fff;
	 	 
 }
header img {
	
	padding: 0;
}
	
}
/*end mobil*/





 /*responsive */
 
 div.img {
    border: 1px solid #333;
}



div.img img {
    width: 100%;
    height: auto;
}

div.desc {
    padding: 5px;
    text-align: center;
}

* {
    box-sizing: border-box;
}

.responsive {
    padding: 25px;
    float: left;
    width: 49.99999%;
	background-color: #fff;
}




@media only screen and (max-width: 700px){
    .responsive {
        width: 100%;
		float: left;
    }
}


/*end*/

@media only screen and (max-width: 500px){
	
	
	header {
	
	
	width: 100%;
	height: 100px;
	background-color: #007CB2;
	position: relative;
	z-index: 1;
}
	
	 nav ul {
		top: 0px;
		width: 100%;
		position: relative;
	    background-color: #007CB2;
	    overflow: hidden;
	
	    text-align: left;
	    color: #fff;
	 	 
 }
	
	
   
}

/*end query*/


#contact {
	margin: 0;
	background-color: #007CB2;
	padding-top: 10px;
	padding-bottom: 30px;
	height: auto;
}

.but-action {
	color: #000811;
	border-style: solid;
	border-width: 3px;
	border-radius: 5px;
	width: 270px;
	text-align: center;
	background-color: #007CB2;
	display: block;
	margin: auto;
	
	
}
.but-action a {
	color: #fff;
	text-decoration: none;
	
}
/*

article {
	background-color: #f1f1f1;
	height: 400px;
	padding: 60px;
	
	
	clear: both;
}
 */
 article img {
	 
	max-width: 100%;
	height: auto;
	
	
}
 
 
 #separation {
	 background-color: #007CB2;
	 height: 60px;
	 
 }
 .gap {
	 height: 5px;
	 
 }
	 .main-picture{
	height: 350px;
	width: 100%;
	
	
	background-image: url("image/mainr.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	
	
	
}
	
#thanks {
	
	padding-top: 50px;
	margin: 20px;
	height: auto;
}
 
 
 
footer {
	
	height: 270px;
	background-color: #000811;
	
	clear: both;
	
}

footer p {
	padding-left: 20px;
	color: #fff;
	
}