﻿/* Header styles*/
wrapperHeader
{
       border: 1px solid black;
       overflow: hidden;              
}

.logo
{
    background-image: url('../images/dharteeRangLogo.png');
    width: 40%;    
    height: 5em;
    background-repeat: no-repeat;
    background-size: 90% 100%;
    float: left;
}

.motto
{
   /* background-image: url('../images/pakistan.png');*/
    float: left;
    width:60%;
    height:3em;
    display:inline-block;
    font-size: 1.8em;
    font-family: Centaur;
    color: #008000;    
    text-align:left;
   vertical-align:middle;  
    background-size: 100px 80px;
    background-repeat: no-repeat;
    background-position:right;    
}

.wrapperMenu
{
    display:block;
    width:100%;
    height:3em;
    float:left;
}

/*home page css*/
#work
{   
    display: table-cell;
    table-layout: fixed;   
}

#work td
{   
    padding: 1%;     
    border-bottom: 1px solid #008000;
    width:30%;
    height:auto;
    text-align:left;  
}

#work img
{   width:60%;
    height:auto; 
    margin:2px;
    float:left;       
}

#work p
{
    border-style: none;
    border-width: 2px;
    font-size: 1.1em;
    font-weight: bold;
    color: #003300;
    text-align: left;
    /*width: 405px;*/
}

/*Boutique page css*/ 
 .dressText
{
    background-color: #FFFFFF;
    color: #000000;
}
#boutiqueWork
{
    
    display: block;
    float: left;
    font-size: 1.1em; /*font-weight: bold;*/
    color: #003300;
    margin:10 0 0 10px;
    height:80%;    
    /*width: 15%; /*  background-color:Green;
    color:White;*/
    text-align: left;
 
}
#visual
{
    display:block; 
    float:left;
}

/*about us styles*/
#founders
{
    margin-left:10px;
    display: block;
    float:left;          
    border-bottom: 1px solid #008000;    
    text-align:left;  
}
#founders div
{
   
    display: block;    
    margin-right:10px;
    float:left;
    width:48%;
}
#founders p
{
    display:inline;    
    font-size: 1.0em;   
    color: #003300;
    text-align: left;
}
#founders img{   
    height:auto; 
    margin:2px 10px 2px 10px;
    display:inline;    
}
#ourTeam
{
    display: block;
    float:left;    

}
#ourTeam div
{
    display: block;
    float:left;    
    width:30%;
}
#ourTeam p
{
    display:inline;    
    font-size: 1.0em;   
    color: #003300;
    text-align: left;
}
#ourTeam img
{    
    margin:0px 10px 0px 10px;
}

.efforts
{
    display: block;
    float:left;    
}
.efforts div
{
    vertical-align:top;
    width:20%;         
    display:inline-block;
}
.efforts div img
{
    width:50%;   
    float:left;     
    /*display:inline;*/
}
.efforts div p
{
 border-style: none;
    border-width: 2px;
    font-size: 1.1em;
    font-weight: bold;
    color: #003300;
    text-align: left;}

/*Education*/
#education
{
    margin: 10px 10px 10px 10px;
    display: inline-block;
    text-align: left;
    width: 100%;
    font-size:1.2em;
}

.paras

/*Remote Northern areas Page*/

#list
{
    margin: 5px 5px 5px 10px;
    display: inline-block;
    float: left;
    border-bottom: 1px solid #008000;
    text-align: left;
}
#list > div
{
    display: inline-block;
    float: left;
    width: 42%;
    border-bottom-style: inset;
    margin: 5px 10px 5px 10px; 
}

#list p
{    
    display: inline;
    font-size: 1.2em;
    color: #000000;
    text-align: left;
    vertical-align: text-top;
    font-weight: bold;
}
#list span
{
    float:left;
    color: #000000;
    text-align: left;
    vertical-align: text-top;    
}

#list img{   
    width:40%;
    height:auto; 
    float:right;
    margin:2px 2px 2px 2px;
    display:inline;    
}



#slideshow { 
    display:inline;
    position:relative;
    float:right;
    width: 50%;          
      
    /*box-shadow: 0 0 20px rgba(0,0,0,0.4); */
}

#slideshow > div 
{ 
    display:inline;
    position:absolute;   
    border-bottom-style: outset;   
}
.slideshowtext
{
    font-family: 'Berlin Sans FB';
    text-align: left;
    vertical-align: middle;
    font-size: xx-large;
}
/*about us styles*/
#founders
{
    margin-left:10px;
    display: block;
    float:left;          
    border-bottom: 1px solid #008000;    
    text-align:left;  
}
#founders div
{
   
    display: block;    
    margin-right:10px;
    float:left;
    width:48%;
}
#founders p
{
    display:inline;    
    font-size: 1.0em;   
    color: #003300;
    text-align: left;
}
#founders img{   
    height:auto; 
    margin:2px 10px 2px 10px;
    display:inline;    
}

/*families of victims page*/
#families, th,td {
    border-bottom: 1px solid #ddd;
}

.help
{
    width: 96%;
    float: left;
    padding: 10px;
    border-bottom-style: outset;
    font-family: 'Lucida Sans';
    font-size: medium;
}
.help tr:nth-child(even) {background-color: #f2f2f2}
.helpimg
{
    float: right;
    width: 20%;
    display: inline;
    padding-right: 10px;
    padding-left: 10px;
}
.table
{
}
/*Main drop down Menu CSS*/
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
  margin: 0;
  padding: 0;
  position: relative;
}
#cssmenu
{
    line-height: 1;
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #ffffff));
    background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 100%);
    background: -o-linear-gradient(top, #ffffff 0%, #ffffff 100%);
    background: -ms-linear-gradient(top, #ffffff 0%, #ffffff 100%);
    background: linear-gradient(to bottom, #ffffff 0%, #ffffff 100%);
    border-bottom: 2px solid #008000;
    width: auto;
}
#cssmenu:after,
#cssmenu ul:after {
  content: '';
  display: block;
  clear: both;
}
#cssmenu a {
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #ffffff));
  background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 100%);
  background: -o-linear-gradient(top, #ffffff 0%, #ffffff 100%);
  background: -ms-linear-gradient(top, #ffffff 0%, #ffffff 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #ffffff 100%);
  color: #ffffff;
  display: block;
  font-family: Helvetica, Arial, Verdana, sans-serif;
  padding: 19px 20px;
  text-decoration: none;
}
#cssmenu ul {
  list-style: none;
}
#cssmenu > ul > li {
  display: inline-block;
  float: left;
  margin: 0;
}
#cssmenu.align-center {
  text-align: center;
}
#cssmenu.align-center > ul > li {
  float: none;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu.align-right > ul {
  float: right;
}
#cssmenu.align-right ul ul {
  text-align: right;
}
#cssmenu > ul > li > a
{
    color: #000000;
    font-size: 1 em;
    font-weight: bold;
}
#cssmenu > ul > li:hover:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #008000;
  margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
  border-radius: 5px 0 0 0;
  -moz-border-radius: 5px 0 0 0;
  -webkit-border-radius: 5px 0 0 0;
}
#cssmenu.align-right > ul > li:first-child > a,
#cssmenu.align-center > ul > li:first-child > a {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}
#cssmenu.align-right > ul > li:last-child > a {
  border-radius: 0 5px 0 0;
  -moz-border-radius: 0 5px 0 0;
  -webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a,
#cssmenu > ul > li:hover > a {
  color: #000000;
  box-shadow: inset 0 0 3px #d9d9d9;
  -moz-box-shadow: inset 0 0 3px #d9d9d9;
  -webkit-box-shadow: inset 0 0 3px #d9d9d9;
  background: #f2f2f2;
  background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));
  background: -webkit-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
  background: -o-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
  background: -ms-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
  background: linear-gradient(to bottom, #ffffff 0%, #f2f2f2 100%);
}
#cssmenu .has-sub {
  z-index: 1;
}
#cssmenu .has-sub:hover > ul {
  display: block;
}
#cssmenu .has-sub ul {
  display: none;
  position: absolute;
  width: 200px;
  top: 100%;
  left: 0;
}
#cssmenu.align-right .has-sub ul {
  left: auto;
  right: 0;
}
#cssmenu .has-sub ul li {
  margin-bottom: -1px;
}
#cssmenu .has-sub ul li a
{
    background: #008000;
    border-bottom: 1px dotted #ff0f1b;
    font-size: 0.8 em;
    filter: none;
    display: block;
    line-height: 120%;
    padding: 10px;
    color: #ffffff;
    border-bottom-color: #008000;
}
#cssmenu .has-sub ul li:hover a
{
    background: #003300;
    color: #FFFFFF;
}
#cssmenu ul ul li:hover > a {
  color: #ffffff;
}
#cssmenu .has-sub .has-sub:hover > ul {
  display: block;
}
#cssmenu .has-sub .has-sub ul {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
}
#cssmenu.align-right .has-sub .has-sub ul,
#cssmenu.align-right ul ul ul {
  left: auto;
  right: 100%;
}
#cssmenu .has-sub .has-sub ul li a
{
    background: #003300;
    border-bottom: 1px dotted #ff0f1b;
    color: #FFFFFF;
    border-bottom-color: #FFFFFF;
}
#cssmenu .has-sub .has-sub ul li a:hover
{
    background: #003300;
    color: #FFFFFF;
}
#cssmenu ul ul li.last > a,
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul ul li.last > a,
#cssmenu ul ul ul li:last-child > a,
#cssmenu .has-sub ul li:last-child > a,
##008000cssmenu .has-sub ul li.last > a {
  border-bottom: 0;
}
