/*https://www.w3schools.com/css/css_positioning.asp*/

@font-face{
	/* https://stackoverflow.com/questions/107936/how-to-add-some-non-standard-font-to-a-website */
    font-family: "CenturyGothic";
    src: url("font/centurygothic/CenturyGothic.ttf") format("truetype");
}
@font-face{
    font-family: "futura light bt";
    src: url("font/futura/futura light bt.ttf") format("truetype");
}

body{
 margin: auto;
 margin-top: 20px;
 width: 100%;
 font-family: "Futura Light Bt", Futura, CenturyGothic,  "Century Gothic", Helvetica, Arial, sans-serif ;
 /* border: 1px solid grey; */
 /*https://www.wfonts.com/font/futura*/
}

.title{
 margin-top: -10px;
 text-align: left;
 letter-spacing: 10px;
 color: #004E66;
 font-size:50px;
 text-shadow: 5px 5px 10px #004E66, 0px 0 0px grey, 0 0 0px darkgrey;
}
.title li{
display: inline;
}

.nav_login{
 margin: auto;
 /* border: 4px solid red; */
 padding: 1px;
}
.nav_login li:nth-last-child(1) , .nav_login li:nth-last-child(2) {
 float:right;
}
.nav_login li:nth-last-child(2) {
 margin-right:50px; float:right;
}


.menu{
 position:relative;
 display:block; /*wondering if useful*/
 margin-top: -20px;
 margin-left: 109px;
 margin-bottom: 10px;
 margin-right: 200px; /*if absent the login link won't show*/
 height:auto;
 padding-top: 0px;
 /* border: 4px solid blue; */
}
/*https://stackoverflow.com/questions/11540268/prevent-wrapping-of-menu-items*/
.menu ul, .nav_login ul {
 position:relative;
 list-style-type: none;
 white-space:nowrap;
 margin: 0;
 padding: 0;
 vertical-align: bottom;
 /* border: 1px solid grey; */
}
.menu > ul > li  , .nav_login li{
 position: relative;
 display:inline-block;
 margin-left: 5%;
 vertical-align: bottom;
 text-align:left ;
 /* border: 1px solid grey; */
}
.menu li:nth-child(1) {
 margin-left: 10px;
}
.menu li:nth-last-child(1) , .menu li:nth-last-child(2) {
 display:none;
}
.home_image{
 display:block;
}
.home_image_mobile{
 display:none;
}

.menu li img {
 vertical-align: bottom;
 margin-top: 10px;
 /* border: 1px solid grey; */
}
/*Style for dropdown links*/
.menu li:hover ul a {
 background: #f3f3f3;
 color: #2f3036;
 height: 40px;
 line-height: 40px;
}
/*Hover state for dropdown links*/
.menu li:hover .menu ul a:hover {
 color: #4db3ff;
}
/*Style 'show menu' label button and hide it by default*/
.menu .show-menu {
 text-decoration: none;
 color: #fff;
 /*background: #8aa8bd;*/
 background: white;
 text-align: left;
 width:auto;
 margin-top: 20px;
 /* margin-left: 30px; */

 /* margin-right: 30px; */
 padding: 10px 10px;
 display: none;
 cursor: pointer;
 /* text-transform: uppercase; */
}
.menu .show-menu span{
  padding-left: 0px;
}
/*Hide checkbox*/
.menu input[type=checkbox]{
  display: none;
}
/*Show menu when invisible checkbox is checked*/
.menu input[type=checkbox]:checked ~ #menu2{
  display: block;
}


.home_image{
 position:relative;
 margin: auto;
 width: auto;
 height:auto;
 /* border: 4px solid red; */
}
.home_image img{
 position:relative;
 display: block;
 max-width: 100%;
 max-height: 100%;
 /* border: 4px solid green; */
}

.content_about{
 position:relative;
 margin: auto;
 height: auto;
 /* background-image: url("pexels-photo-257856-2.jpeg"); */
}
.content_services{
 /* border:4px solid black; */ /* uncomment to check  */
 position:relative;
 margin: auto;
 height:auto;
 /* background-image: url("pexels-photo-257856-2.jpeg"); */
}
.content_services2{
 position:relative;
 width: 50%;
 height: auto;
 padding: 30px;
 margin: auto;
 background-image: url("fade3.jpeg");
}




.margin_r0 { 
 margin-right: 0px; 
 -moz-border-radius: 15px;
 border-radius: 15px
}
.margin_r15{
 margin-right: 15px; 
 -moz-border-radius: 15px;
 border-radius: 15px
}
.margin_r35 { 
 margin-right: 35px; 
 -moz-border-radius: 15px;
 border-radius: 15px;
}

a:link, a:visited {
 color: #010019;
 text-decoration: none;
 text-shadow: 2px 2px 5px #555;
 /* font-family: Century Gothic, Arial, Helvetica; */
 font-weight: normal; 
}
a:hover {
 color: #bbb;
}
a:active {
  text-shadow: -1px -1px 1px #555;
  position: relative;
  top: 1px;
  left: 1px;
}


.one_column {
 /* border:4px solid black; */ /* uncomment to check  */
 position:relative;
 width: 50%;
 height: auto;
 padding-left: 30px;
 padding-right: 30px;
 margin: auto;

 text-align: left;
 /* border: 4px solid green; */

 /* background-image: url("fade2.jpeg"); */

/* background-image: -moz-linear-gradient(
   center bottom,
   rgb(255,255,255) 10%,
   rgb(255,255,255) 10%,
   #D3D3D3 80%
    );
 background-image:  -webkit-gradient(
   linear,
   left bottom,
   left top,
   color-stop(0.5, rgb(255,255,255)),
   color-stop(0.5, rgb(255,255,255)),
   color-stop(0.9, #D3D3D3)
   );
*/
/*
 box-shadow: 10px 10px 5px #ccc;
 -moz-box-shadow: 10px 10px 5px #ccc;
 -webkit-box-shadow: 10px 10px 5px #ccc;
 -khtml-box-shadow: 10px 10px 5px #ccc;
*/
}
.one_column img{
 margin-right: 30px;
 margin-left: 30px;
 margin-bottom: 30px;
}
.two_column {
 float: left;
 width: 360px;
 height: 600px;
 padding-right: 30px;
 margin-left: 30px;

 background-image: -moz-linear-gradient(
   center bottom,
   rgb(255,255,255) 10%,
   rgb(255,255,255) 10%,
   #A7CAE8 80%
    );
 background-image:  -webkit-gradient(
   linear,
   left bottom,
   left top,
   color-stop(0.1, rgb(255,255,255)),
   color-stop(0.1, rgb(255,255,255)),
   color-stop(0.8, #A7CAE8)
   )
}




/* For mobile phones: */
@media only screen and (max-width: 1000px) {

.title{
 display: none;
}
/*to integrate login in the dropdown menu*/

.nav_login {
 display: none;
 width : 0px;
}

.menu .lines {
 /* the menu bars icon*/
 margin-top: 16px;
 margin-left: 0px;
 margin-bottom: 0px;
 margin-right: 0px;

 /* border-bottom: 15px double #f8f8f8;  */
 /* border-top: 5px solid #f8f8f8;  */
 border-bottom: 15px double grey; 
 border-top: 5px solid grey; 
 content:"";
 height: 5px; 
 width:20px;
 padding-right:15px;
 float: right;
}
.menu{
 margin-left: 0px;
 margin-right: 0px;
}
.menu li:nth-child(1) {
 display: none;
}
.menu li:nth-last-child(1) , .menu li:nth-last-child(2) {
 display:block;
}
.home_image{
 display:none;
}
.home_image_mobile{
 display:block;
}

.menu > ul > li  {
 display:block;
 margin-left: 5%;
 margin-top: 5%;
 vertical-align: bottom;
 text-align:left ;
 /* border: 1px solid grey; */
}
 /*Make dropdown links appear inline*/
 .menu ul {
  position: static;
  display: none;
 }
 /*Create vertical spacing*/
 .menu li {
  margin-bottom: 1px;
 }
 /*Make all menu links full width*/
 .menu ul li, .menu li a {
  width: 100%;
 }
 /*Display 'show menu' link*/
.menu .show-menu {
  display:block;
  height:35;
}
.show-menu img{
 margin-top: 5px;
}

.content_about{
 position:relative;
 margin-left: 0%;
 margin-right: 0%;
 height: auto;
 background-image: url("fade2.jpeg");
}

.one_column {
 position:relative;
 width: 85%;
 height: auto;
 padding-left: 5%;
 padding-right: 5%;
 margin: auto;
}

.content_services2{
 position:relative;
 width: 85%;
 height: auto;
 padding-left: 5%;
 padding-right: 5%;
 margin: auto;
 background-image: url("fade3.jpeg");
}


}