/* RESPONSIVNESS */


/* nav */

@media screen and (min-width: 768px) {
    .navbar-nav>li {
        width: 18%;
        float: left;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        border-right: 1px solid #929394;
        padding-left: 25px;
        height: 30px;
    }

    .navbar-nav-2 >li
    {
        width: 30%;
        padding-left: 10%;
    }

    #menu-1 > li.dropdown {
        width: 23%;
    }
}

@media (min-width: 1200px) {
    .nav>li>a {
        color: white;
        display: block;
        line-height: 15px;
        padding-left: 0px;
        margin-left: 35px;
        padding-top: 10px;
    }

        

    #menu-1 > li:nth-child(2) > a {
        border : none;

    }

    
 
    #menu-1 > li.current:nth-child(5) > a
    {
        width: 100px;
    }

    #menu-1 > li.current:nth-child(3) > a{
        width: 140px;
    }


    #menu-1 > li.current:nth-child(3) > a {
        height:35px;
        width: 80%;
    }

    #menu-1 > li.current:nth-child(5) > a{
        height:35px;
        width: 60%;
    }
}


@media screen and (min-width: 1200px) and (max-width: 1320px)
{
    button.btn.-primary.navbar-toggle.desktop {

        left: 1%;
    }
    .navbar-nav {
        left: 16%;
    }

    .navbar-nav-2 {
        left: -5%;
    }

}





@media screen and (max-width: 300px) {
    a.navbar-brand {
        position: absolute;
        top: -5px;
        left: -10px;
    }
    
    .shadow{
    	width: 80%;
        margin: 0 auto;
        display: block;
    }
    
}

@media (max-width: 992px) {
    .left-delimeter,
    .right-delimeter {
        display: none;
    }
    .panel-title {
        font-size: 19px !important;
    }
    
    .navbar-wrapper{
        height: 90px;
        position: relative;
        background: #211f3e;
        border-bottom: none;
    }
    
    .newsletter-section{
        margin-top: 5px;
    }
    
    .motorcycle{
     height: 290px;
    }
    
     .shadow{
    	width: 80%;
        margin: 0 auto;
        display: block;
    }
}
@media (max-width: 1200px) {
    #menu-2 {
        display: none;
    }
    button.btn.-primary.navbar-toggle.desktop {
        display: none;
    }
    .navbar-nav {
        position: relative;
        top: 0;
        left: 0;
    }
    .right-delimeter {
        margin-right: 0px !important;
    }
    .navbar-nav {
        margin: 0 0;
    }
    .navbar-header {
        float: none;
    }
    .navbar-left,
    .navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
            width: 100%;
            background: #3da6d7;
            border-top: 1px solid transparent;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
            margin-top: 20px;
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;

    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-bottom: 5px;
        color: white;
    }
    .collapse.in {
        display: block !important;
    }
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none;
    }
    .navbar-nav>li {
        width: 100% !important;
        border: none;
        max-height: none;
        width: 100%;
    }
    .current a{
        border: 0 !important;
    }
    .contact-vl {
        display: none;
    }
    
    #newsletter{
        margin-top: 10px;
    }
}

/*footer */

@media (min-width: 1200px) {
    .push-sm-1 {
        left: 4.333333%;
    }
    .push-md-1 {
        left: 7.333333%;
    }
}

@media screen and (min-width: 767px)
{
    .social-links {
        margin-left: 4em;
    }
}

@media screen and (max-width: 767px)
{
    .footer {
        min-height: 250px;
    }


    #footer > div > div > div> ul
    {
        margin-bottom: -15px;
    }

    .social-links {
        margin-top: -15px;

    }

    #footer > div > div > div:nth-child(1) > ul > li:nth-child(3) > a {
        width: 100%;

    }

    .footer ul li a {
        padding: 0px 0px 10px 0;
    }

    .logo{
        width: 100px;
    }
    
    body > div.row.margin-r-30 > div:nth-child(3){
        margin-top: -35px;
    }
     .shadow{
    	width: 80%;
        margin: 0 auto;
        display: block;
    }
}

@media screen and (max-width: 400px) {
    .footer ul li a {
        font-size: 9px;
    }
     .motorcycle{
     height: 290px;
    }
    
     .shadow{
    	width: 80%;
        margin: 0 auto;
        display: block;
    }
}

/* about page & contact */
@media screen and (max-width: 992px) {
    .quote-author {
        float: none;
    }
    .map-marker {
        float: left;
    }
    .golden-line.contact-vl {
        display: none;
    }
    .spacer-pool {
        height: 10rem;
    }
    .last-specs {
        margin-left: 0;
    }
    .checkboxes{
       margin: 10px -10px;
    }
    .submit-button
    {
        margin-left: 20px;
    }
     body > div.row.margin-r-30 > div:nth-child(3){
        margin-top: -35px;
    }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
    figure {
        margin-right: 0;
    }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
    .map-marker {
        float: right;
        margin: -30px -40%;
    }
    .last-specs {
        margin-left: 0;
    }
    .kitchen-img {
        //height: 410px;
        max-width: 100%;
    }
    .walls-img {
        width: 420px;
        height: 370px;
    }
    .spacer-md-30 {
        height: 30px;
    }
    .spacer-md-70 {
        height: 70px;
    }
    .checkboxes{
        float: right;
        position: absolute;
        right: 10%;
        width: 100%;
    }

}

@media screen and (min-width: 1200px) {
    .walls-img {
        max-width: 500px;
        height: 355px;
        width: 485px;
    }
    .kitchen-img {
        min-width: 475px;
    }
}



/* tower page */
@media screen and (min-width: 992px) and (max-width: 1200px) {
    .buttons-section {
        margin-left: 10%;
    }
}
@media screen and (max-width: 992px) {
    .tower-buttons {
        float: none !important;
    }
    .tower-rightDescription {
        margin-left: 0;
    }
    .buttons-icons {
        margin-left: 10%;
        display: block;
    }
    .div-40-mobile {
        height: 65px;
        line-height: 40px;
        display: block;
        width: 280px;
        margin-top: 5px;
    }
    .mobile-panel-body{margin-left: -60px;margin-right: -30px;}
    .contactus-color {
        font-size: 13px;
    }
    .panel-body{
        padding-bottom: 0;
    }
}
@media screen and (min-width: 350px) and (max-width: 992px) {
    .royal-logo {
        position: absolute;
        bottom: 0;
        right: 0;
    }
}


/*luxury shop */
@media screen and (min-width: 992px) {
    .luxury_buttons {
        position: absolute;
        bottom: 35px;

    }

}

@media screen and (max-width: 500px)
{
    .luxury_buttons
    {
        position: relative;
        left:40px;
    }

    .tower-title{
        font-size: 25px !important;
    }

    .towers-description{
        font-size: 12px !important;
    }

}


@media screen and (max-width: 767px)
{
    .social-links > ul > li {
        float: left;
        padding: 5px;
    }
    
        
    .about_banner, .luxury_banner,.events_banner{
        background-size: 100%;
    }
    
    .about_banner,.eko_banner,.ci_banner,.cp_banner,.evm_banner,.development_banner{
        background-size: 350%;
    }
    

    .contact_banner{
        background-size: 320%;
    }
    
    .gold-clip{
        display: none;
    }

.live-experience{margin:0 auto; display: block;text-align: center;padding-bottom: 10px;}
    .row-35{ margin-left: -15px !important;
        width: 108%;}
    .devs-body{
        padding-top: 15px !important;
        padding-left: 0px !important;
    }
   
    .eko-pearl-logos{
        margin-left:10px;}
    .celebrate-family-bg{
        padding-left: 30px;
    }
    .subtitle{margin: 0 auto;}
    .mr-saad-img{}
    .construction{margin-left: 15px;width: 95%;}
    .video{
        margin: 0 auto;
        text-align: center;  
        padding-right:0px; 
        display: block; 
    }
    .esla-description{padding-right: 0}
    figure{margin-right:0;display: block;}
    .blackLogo{padding-left:15px;}
    .message-chairman{margin-left: 15px;width: 100%;}
    .intro1{margin-left: 15px;width: 100%;}
    #wrapper{margin-left: 30px;}
    
    .mr-saad-img{margin-left: 30px;}
    .gallery-about{padding: 0}
    .modal.in .modal-dialog {
        -webkit-transform: scale(0.9,0.9);
        -ms-transform:scale(0.9,0.9);
        -o-transform: scale(0.9,0.9);
        transform: scale(0.9,0.9);
    }
    .ninety{width: 80%;}
    .eighty{width: 95%;}
     
    .article-description{padding: 0;}
    .article-header{padding: 0 !important;margin:0 !important;}
    .news-title-single{padding:0;}
    .article-gallery{padding: 0}

    .footer-top{ }

     .reset-button{
        margin-top: 15px;
    }

    #map{height: 400px}
    
     .motorcycle{
     height: 290px;
    }

}

@media screen and (min-width: 767px) and (max-width: 1200px) {
    .navbar-nav .open .dropdown-menu {
        margin-left: 20%;
        margin-top: -42px;
    }
}

@media screen and (min-width: 1200px){
    .navbar-nav .open .dropdown-menu {
        top:47px;
    }
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    .quote{margin-left: 15%;width: 75%}
     .footer-top{padding-top: 10px}
}

@media only screen and (max-device-width: 400px)  {


    input[type="email"]::-webkit-input-placeholder {
         
         font-size: 10px;
    }
    input[type="email"]:-moz-placeholder {
        /* Firefox 18- */

       
        font-size: 10px;
    }
    input[type="email"]::-moz-placeholder {
        /* Firefox 19+ */

        
         font-size: 10px;
    }
    input[type="email"]:-ms-input-placeholder {
       
         font-size: 10px;
    }
    input[type="text"]::-webkit-input-placeholder {
         border-right: 1px solid #cccccc;
        max-width: 35%;
        height: 80%;
         font-size: 10px;
    }
    input[type="text"]:-moz-placeholder {
        /* Firefox 18- */

        border-right: 1px solid #cccccc;
        max-width: 35%;
        height: 80%;
         font-size: 10px;
    }
    input[type="text"]::-moz-placeholder {
        /* Firefox 19+ */

         border-right: 1px solid #cccccc;
        max-width: 35%;
        height: 80%;
         font-size: 10px;
    }
    input[type="text"]:-ms-input-placeholder {
         border-right: 1px solid #cccccc;
        max-width: 35%;
        height: 80%;
         font-size: 10px;
    }
    select{font-size: 10px;}
}

@media (min-width: 768px)
.modal-dialog {
    width: 80% !important;
    margin: 0 auto !important;
}
 }


 /* 
Generic Styling, for Desktops/Laptops 
*/
table { 
  width: 100%; 
  border-collapse: collapse; 
}
 
th { 
  background: #78bb6b; 
  color: white; 
  font-weight: bold; 
   font-family: 'manrope';
}
td, th { 
    border: 1px solid #ccc;
    text-align: left;
    padding-right: 75px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 15px;
    font-family: 'manrope';
    font-size: 14px;
}

body > div.row > div.row > div:nth-child(1) > div > table > tbody > tr > td:nth-child(1) {
    font-weight: bolder;
}


/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

    /* Force table to not be like tables anymore */
    table, thead, tbody, th, td, tr { 
        display: block; 
    }
    
    /* Hide table headers (but not display: none;, for accessibility) */
    thead tr { 
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    
    tr { border: 1px solid #ccc; }
    
    td { 
        /* Behave  like a "row" */
        border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50%;
    font-weight: bolder;
 
    }
    
    td:before { 
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        left: 6px;
        width: 45%; 
        padding-right: 10px; 
        white-space: nowrap;
    }
    
    /*
    Label the data
    */
 

   

  table > tbody > tr  > td:nth-child(1){
    background: #2c98cb;
    color: white;
    margin: 0 auto;
    display: block;
}
    
}