/*******************************************************************



     DESIGN AND DEVELOP BY : Imam ul Tahir
     CONTACT And  Whatsapp : +92 033 437 65516



*********************************************************************/
a {text-decoration:none;}
.topline {background:#213069; padding: 15px 0; font-size: 15px; color:#fff;}
.topline a {color:#fff; text-decoration:none;}
.topline a:hover, .topline a:active, .topline a:visitedm, .topline a:link {color:#fff; text-decoration:none;}

.logodiv {padding:10px 0; text-align:center; color:#000;}
.logodiv h1 {font-family: "Days One", sans-serif; font-size: 30px;}

.nav_bar {background:#2dabf5; background-repeat: repeat-x; padding: 10px 0;}


.mainboxdiv {font-family: "Days One", sans-serif; padding: 50px 0;}
.mainboxdiv .mainboxdivone {background:#2e4f9e; border-right: 5px solid #fff; text-align:center; color:#fff;}
.mainboxdiv .mainboxdivotwo {background:#2e4f9e; border-right: 5px solid #fff; text-align:center; color:#fff;}
.mainboxdiv .mainboxdivothree {background:#2e4f9e; text-align:center; color:#fff;}
.mainboxdiv a {color:#fff; text-decoration:none;}
.mainboxdiv a:hover {color:#fff;}

.contentdiv {padding: 10px;}
.contentdiv p span, .contentdiv h2 {color:#2e4f9e;}
.contentdiv .col-sm-12, .contentdiv .col-sm-6 {padding:0px !important;}
 

.topfooter {border-top: 16px solid #2dabf5; background: #000; padding: 20px 0; margin:30px 0 0 0; color:#fff;}
.topfooter a {color:#fff;}
.topfooter a:hover {color:#fff;}
.topfooter h4 {font-family: "Days One", sans-serif;}

.footer {background: #213069; color: #b3b3b3; padding: 10px 0;}

.imgresponsive {margin-top: 30px;}
.imgresponsive img {width:100%;}

table {
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  table-layout: fixed;
}

table caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}

table tr { 
  border: 1px solid #ddd;
  padding: .35em;
}

table th,
table td {
  padding: .625em; 
  border: 1px solid #ccc;
}

table th {
  font-size: .85em;
  letter-spacing: .1em;
  text-transform: uppercase;
}

@media screen and (max-width: 600px) {
  table {
    border: 0;
  }

  table caption {
    font-size: 1.3em;
  }
  
  table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  
  table td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em; 
  }
  
  table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
    width: 60%;
  }
  
  table td:last-child {
    border-bottom: 0;
  }
}




/* general styling */
body {
  font-family: "Open Sans", sans-serif;
  line-height: 1.25;
}



.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
}

.active, .accordion:hover {
  background-color: #ccc; 
}

.panel {
  padding: 0 18px;
  display: none;
  background-color: white;
  overflow: hidden;
}

.blog-img {float: left; margin: 0 20px 20px 0;}

input[type=text] {
  width: 100%;
  padding: 5px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

input[type=submit] {
  width: 100%;
  background-color: #2e4f9e;
  color: #ffff;
  font-weight: bold;
  padding: 5px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
} 


.rightdiv {background:#000; border-radius: 17px; padding: 10px; color: #fff; color: #fff; width: 100%; margin: 0 auto; display: block;}
.rightdiv a {color: #fff;}
.rightdiv a:hover; {color: #fff; text-decoration:none;}
.rightdiv2 {border: 7px solid #000;} 






 /* ===============                      ===============
                   Phones and Handhelds
   ===============                      =============== */
@media only screen and (max-width: 799px) { 
.mainboxdiv {padding:0 !important;}
.mainboxdiv .mainboxdivone {border-right: 0; padding: 4px 0; border-bottom:5px solid #fff;}
.mainboxdiv .mainboxdivotwo {border-right: 0; padding: 4px 0; border-bottom:5px solid #fff;}
.mainboxdiv .mainboxdivothree {padding: 5px 0;}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {padding:3px !important;}
}

@media only screen and (max-width: 749px) and (min-width: 600px) { 
.mainboxdiv {padding:0 !important;}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {padding:3px !important;}
}

@media only screen and (max-width: 850px) and (min-width: 750px) { 
.mainboxdiv {padding:0 !important;}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {padding:3px !important;}
}


@media (min-width:750px) and (min-width: 700px) {


}

/* ===============                      ===============
                         Tablets
   ===============                      =============== */
@media only screen and (max-width: 990px) and (min-width: 600px) {
}

/* ===============                      ===============
                         Laptops
   ===============                      =============== */
@media only screen and (max-width: 1125px) and (min-width: 1000px) { 

}

/* ===============                      ===============
                         Big Screen
   ===============                      =============== */
@media only screen and (max-width: 1200px) and (min-width: 1050px) {  

}