/* CSS Document for Screens */


body {background-color:#fff; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color:#009;}

/* Text */
h1 { margin: 0 0 1em; font-size: 1.2em; font-weight: 700;}
h4 { margin: 0 0 1em; font-size: 1.2em; font-weight: 700;}
/* Page */

#page{background-color: #fff; max-width: 1100px; margin: 25px auto; position: relative;}


/*.container { background-color: #656565; margin-left: auto; margin-right:auto;}*/
/* Header */



header { height:75px; position: relative;}

header a.logo {
    z-index: 1;
    position: absolute;
    display: block; width:160px; height: 60px;
	   background: url(../Images/Logo5.jpg) no-repeat 0 0; background-size: contain;
    top: -20px; left:20px;
	}
header a.logo span { display:none;}

header div.welcome { position:absolute; width: 42%; top: 35px; left:40%;}
header div.welcome h1{ line-height: 1em; margin: 0 0 30px; color: #de1dde;}

/* Section - All */

section {  padding: 0px 30px}
section::after{ content:''; display:block; clear: both;}

/* Section - Gallery */

section.gallery{margin-top: 2em;}

.gallery ul, .gallery li {list-style:none;margin:0;padding:0;}

.photos{-moz-column-count:4;column-count:4;column-gap: 1em;margin-bottom: 2em;}

.photos img{max-width:100%;max-height: 160px;margin-bottom: 1em;}

.photos li{position:relative;float:none;}

.photos a:hover:after{content: attr(title);display:block;width:96%;position:absolute;top:0;line-height: 2.5em;color: white;text-align: center;
background: rgba(25,25,25,.8);z-index: 500;}

.photosV{-moz-column-count:5;column-count:5;column-gap: 1em;margin-bottom: 2em;}

.photosV img{max-width:100%;max-height: 240px;margin-bottom: 1em;}

.photosV li{position:relative;float:none;}

.photosV a:hover:after{content: attr(title);display:block;width:81%;position:absolute;top:0;line-height: 2.5em;color: white;text-align: center;
background: rgba(25,25,25,.8);z-index: 500;}

section.galleryLarge{margin-top: 2em;}

.galleryLarge ul, .galleryLarge li {list-style:none;margin:0;padding:0;}

.photosLarge{-moz-column-count:1;column-count:1;}

.photosLarge img{max-width:100%;max-height: 660px;margin-bottom: 1em;margin-left: 2em;}

.photosLargeV img{max-width:100%;max-height: 660px;margin-bottom: 1em;margin-left: 20em;}

.photosLarge li{position:relative;float:none;}

.photosLarge a:hover:after{content: attr(title);display:block;width:96%;position:absolute;top:0;line-height: 2.5em;color: white;text-align: center;
background: rgba(25,25,25,.8);z-index: 500;}

/* Section - Main our aim */
section.aim { margin-top: 10px; margin-bottom: 20px; padding-right:10px;}

/* Section - Main*/

section.main { margin-top: 20px; margin-bottom: 30px; padding: 0px;}
section.main aside{ width: 24%; float: left; text-align: center}
section.main aside.pm{ width: 48%; float: left; text-align: center}
section.main aside.ourpm{ width: 72%; float: left; text-align: center}
section.main aside.selectedpm{ width: 80%; float:none; text-align: center;padding-left: 20em}
section.main aside.selectedpmOverview{ width: 90%; float:none; text-align: center;padding-left: 5em}
section.main aside.usnav{ width: 24%; float: left; text-align: center}
section.main aside.us{ width: 72%; float: left; text-align: center}
section.main aside.cus{ width: 72%; float: left; text-align: left}
section.main aside.services{ width: 72%; float: left; text-align: left}
section.main aside.cus label{ display: block; width: 12em; float: left; text-align: right;padding-right: 4px;}

section.main .content { margin: 15px; background: no-repeat center top; background-size: 100px 100px; padding-top:110px;}
section.main .footer_content { margin: 15px; background: no-repeat center top; background-size: 50px 50px; padding-top:70px;}

section.main aside .content.nav     { background-image: url(../images/home2.jpg);}
section.main aside .content.cafm    { background-image: url(../images/home1.jpg);}
section.main aside .content.pm      { background-image: url(../images/home2.jpg);}
section.main aside .content.consult { background-image: url(../images/home3.jpg);}
section.main aside .content.news    { background-image: url(../images/home2.jpg);}
section.main aside .content.options { background-image: url(../images/home2.jpg);}


.btn-readmore{ color: #ffffff; background-color: #1808E4; border:0; border-bottom: 4px solid #1808E4;}
.btn-readmore:hover,
.btn-readmore:focus,
.btn-readmore:active { color: #ffffff; background-color: #999999; border-color:#5e7996;}

   /* Navigation */

nav {
    background-color: #fff;
    position: relative;
    padding: 30px 0 0 0;
    color: #69676a;

}

nav::after {content:''; display: block;clear:both;}

nav a.mobile_menu {
    width: 32px; height: 32px;
    background: url(../images/icon_menu.svg) no-repeat 0 0;
    background-size: contain;
    position: absolute; top: 22px; left:50%; margin-left: -16px;
    display: none;
}

nav ul {list-style: none; margin: 0; padding: 0;}

nav ul li:hover{background-color: #fff;}
nav ul li:hover > ul {display:block;}

nav ul li a {
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
    width: 100px;
    position: relative;
}

nav ul li a:visited{ color: #69676a;}

nav ul li a:hover{ color: #69676a;}

nav ul ul {position: absolute; top:100%; background-color: #fff; display: none;}

nav ul ul li {position:relative;}

nav ul ul ul { left: 100% top: 0px;}

/* top-level */

nav > ul { padding-left: 200px;}
nav > ul > li { float:left; }
nav > ul > li > a {width: auto; padding: 10px 20px 15px 20px;}


nav a[aria-haspopup="true"]::after {
    content: '';
    display: block; width: 0px; height: 0px;
    position: absolute;
    top: 16px; right: 15px;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 4px solid #de1dde;
}

nav >ul >li > a[aria-haspopup="true"]::after{
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #de1dde;
    left; 20px; right: auto;
    bottom: 6px; top:auto;
}



/* Footer */

footer { font-size: .9em; color:#ffffff; background-color:#1A446C;}
footer::after{ content:''; display:block; clear: both;}

footer a { text-decoration: none;color:#ffffff}
footer.main aside h4 {font-size: 1.8em; font-weight: 500;}
footer.main { margin-top: 20px; margin-bottom: 20px; padding: 0px;}
footer.main aside{ width: 24%; float: left; text-align: left; padding-left:5px;}
footer.main aside a:hover{ color:#07F1DF;}

footer.main aside.copyright{ width: 100%; float: left; margin-top:15px;margin-bottom:15px; text-align: left;}
footer.main aside.copyright a:hover{ color:#07F1DF;}
/* -------------- Media Queries -------------------- */

@media screen and (min-width: 914px){

    nav { display: none;}
    /* Section - Main our aim */
    section.aim .welcome { display:none;}

}

/* ------------- Max Width 915px ------------------- */

@media screen and (max-width: 916px){

    section.aim { width: 85%;}
    section.main aside { width: 95%; float: none;}
    section.main aside.pm { width: 95%; float: none;}
    section.main aside .content.nav {display: none;}
	section.main aside.us {padding-left: 25px;}
    header div.welcome {text-align: center;}
    section.aim .welcome h1 { margin: 0 0 0; font-size: 1em; font-weight: 600; color: #de1dde;}
	footer.main aside { width: 95%; float: none;}

}

/* ------- Max Width 700px (iPhone 6S in Portrait / Landscape------------ */
@media screen and (max-width: 700px){

    /* Header */

    header { height:auto; min-height: 75px;  position: relative;}
    header div.welcome { position:absolute; width: 42%; top: 10px; left:55%;}
    header div.welcome h1{ line-height: 1em; margin: 0 0 30px;}

    /* Navigation */
    nav{ font-size: .8em; padding: 50px 15px 20px 15px; height: 0px; overflow: hidden;}

    nav a.mobile_menu {display: block; margin-left: 30PX;}

	nav ul, nav ul ul, nav ul ul ul { display: block; position: static; }
	nav > ul { padding: 0px; }
	nav > ul > li { float: none; margin-top: 12px; }
	nav ul li:hover { background: none; }

	nav ul li a {
        width: auto;
		display: block;
		margin: 8px 10px;
		padding: 5px 10px;
		border-bottom: 1px solid rgba(255,255,255,.25);

	}
	nav ul li a:hover { background-color: rgba(255,255,255,.2); }

	nav ul ul { background: none; }
	nav ul ul li a { margin-left: 30px; }
	nav ul ul ul li a { margin-left: 60px; }
	nav a[aria-haspopup="true"]::after { display: none; }

}