@charset "utf-8";

/* CSS Document */





.td1

{background-color: #33437a; 

    width: 140px;

    border-bottom: #FFF 1px solid;

    color: #FFF;

    background: url(../images/list-item5.png) no-repeat 141px 10px #33437a;

    /* padding-right: 10px; */

    float: left;

    padding:5px 0px 5px 0px;

    font-size: 15px;

	padding-left:20px;

	max-width:100%;

	

}

.td3

{ background-color: #ffd85b; 

    width:151px;

    border-bottom: #000 1px solid;

    color: #000;

   /* background: url(../images/list-item5.png) no-repeat right #ffd85b;*/

    /* padding-right: 10px; */

    float: left;

    padding:5px 0px 5px 0px;

    font-size: 15px;

	padding-left:20px;

	text-transform:capitalize;

	border-right:1px #000 solid;

	max-width:100%;

	

}

.td4

{	background: #ffd85b;

    margin-left: 1px;

    width: 271px;

    border-bottom: #000 1px solid;

    color: #000;

    float: right;

    padding: 5px 0px 5px 13px;

    font-size: 15px;

    /* margin-top: -36px; */

    margin-right: 0px;

    text-align: left;

	max-width:100%;

}

.td2

{

	width:297px;

    border-bottom: #d1d1d1 1px solid;

    color: #8b8b8b;

    float: right;

	padding: 5px 0px 5px 2px;

    font-size: 15px;

   /* margin-top: -36px;*/

    margin-right:0px;

	text-align:left;

	max-width:100%;

}



.simplePopup {

display:none;

position:fixed;

border:4px solid #808080;

background:#fff;

z-index:645747547547543;

padding:12px;

width:70%;

min-width:70%;

border-radius:3px;

}



.simplePopupClose {

float:right;

cursor:pointer;

margin-left:10px;

margin-bottom:10px;

}



.simplePopupBackground {

display:none;

background:#000;

position:fixed;

height:100%;

width:100%;

top:0;

left:0;

z-index:1;

}

.modal-h1

{

	color:#FF0000;

	font-size:18px;

	text-transform:capitalize;

	 padding-bottom:10px;

  padding-top:15px;

  border-bottom: 1px solid #e3e3e3;

}

.modal-h2

{

	color:#334465;

	font-size:15px;

	text-transform:capitalize;

	margin-left:5px;

	margin-top:20px;

}

.modal-box-ul

{ 

	list-style:none;

	display:table;

	margin-top:20px;

	width:45%;

	float:left;



	margin-left:20px;

 }

 .modal-box-ul-li

{ 

	list-style:none;

	display:table;

	background:url(../images/list-item4.png) no-repeat left;

	margin-bottom:15px;

	font-size:14px;

	color:#334465;

	width:100%;

	padding-left:10px;

	margin-top:-2px;

	float:left;

	min-height:auto;

 }



.modal-box-img

{ 

	width:250px;

	height:auto;

	float:right;

	margin:0px 0px 6px 6px;

	-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;border:2px solid #4AB846;-webkit-box-shadow: #B3B3B3 1px 1px 1px;-moz-box-shadow: #B3B3B3 1px 1px 1px; box-shadow: #B3B3B3 1px 1px 1px;

 

 }

 

 .modal-box1-ul

{ 

	list-style:none;

	display:table;

	margin:0px 0px 0px 20px;

	width:45%;

	float:right;



	

 }

 .modal-box1-ul-li

{ 

	list-style:none;

	display:table;

	background:url(../images/list-item4.png) no-repeat left;

	margin-bottom:15px;

	font-size:14px;

	color:#334465;

	width:100%;

	padding-left:10px;

	margin-top:-2px;

	float:left;

	min-height:auto;

 }



.modal-box1-img

{ 

	width:373px;

	height:auto;

	float:right;

	margin-top:15px;

	max-width:100%;

 }

 

 

 /*======================= responsive table ==============================*/

 /* 

	Generic Styling, for Desktops/Laptops 

	*/

	table { 

		width:462px;

		max-width:75%;

		min-width:200px; 

		border-collapse: collapse; 

		background:#ffd85b;

		border:solid 1px #000;

		

	}

	/* Zebra striping */

	/*tr:nth-of-type(odd) { 

		background: #eee; 

	}*/

	th { 

		background: #333; 

		color: white; 

		font-weight: bold; 

	}

	td, th { 

		padding: 6px; 

		border: 1px solid #dcdc75; 

		text-align: left;

		background:#FFFF9E;

	}

	

	@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; 

			 clear:both;

		}

		

		/* Hide table headers (but not display: none;, for accessibility) */

		thead tr { 

			position: absolute;

			top: -9999px;

			left: -9999px;

		}

		

		tr {  }

		td

		{

			clear:both;

		}

		

		

	/*	td { 

			border: none;

			border-bottom: 1px solid #eee; 

			position: relative;

			padding-left: 50%; 

			background:#ffd85b;

		}*/

		

		/*td:before { 

			position: absolute;

			top: 6px;

			left: 6px;

			width: 45%; 

			padding-right: 10px; 

			white-space: nowrap;

		}*/

		

		/*

		Label the data

		*/

		/*td:nth-of-type(1):before { content: "Material "; }

		td:nth-of-type(2):before { content: "Type"; }

		td:nth-of-type(3):before { content: "Job Title"; }

		td:nth-of-type(4):before { content: "Favorite Color"; }

		td:nth-of-type(5):before { content: "Wars of Trek?"; }

		td:nth-of-type(6):before { content: "Porn Name"; }

		td:nth-of-type(7):before { content: "Date of Birth"; }

		td:nth-of-type(8):before { content: "Dream Vacation City"; }

		td:nth-of-type(9):before { content: "GPA"; }

		td:nth-of-type(10):before { content: "Arbitrary Data"; }*/

	}

	

	/* Smartphones (portrait and landscape) ----------- */

	@media only screen

	and (min-device-width : 320px)

	and (max-device-width : 480px) {

	table, thead, tbody, th, td, tr { 

			display: block; 

			 clear:both;

		}

		

		/* Hide table headers (but not display: none;, for accessibility) */

		thead tr { 

			position: absolute;

			top: -9999px;

			left: -9999px;

		}

		

		tr {  }

		td

		{

			clear:both;

			

		}

	

	/* iPads (portrait and landscape) ----------- */

	@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {

		/*body { 

			width: 495px; 

		}*/

	}



/*.modal-h1

{

	color:#334465;

	font-size:18px;

	text-transform:capitalize;

}

.modal-h2

{

	color:#334465;

	font-size:15px;

	text-transform:capitalize;

	margin-left:25px;

	margin-top:20px;

}



.v-center {

  height: 100%;

  width: 100%;

  display: table;

  position: relative;

  text-align: center;

  margin:auto;

}



.v-center > div {

  display: table-cell;

  vertical-align: middle;

  position: relative;

  top:-10%;

}



.btn {

  font-size: 3vmin;

  padding: 0.75em 1.5em;

  background-color: #fff;

  border: 1px solid #bbb;

  color: #333;

  text-decoration: none;

  display: inline;

  border-radius: 4px;

  -webkit-transition: background-color 1s ease;

  -moz-transition: background-color 1s ease;

  transition: background-color 1s ease;

}



.btn:hover {

  background-color: #ddd;

  -webkit-transition: background-color 1s ease;

  -moz-transition: background-color 1s ease;

  transition: background-color 1s ease;

}



.btn-small {

  padding: .75em 1em;

  font-size: 0.8em;

}



.modal-box {

  display: none;

  position:fixed;

  z-index: 1000;

  width:80%;

  max-width:100%;

  background: white;

  border-bottom: 1px solid #aaa;

  border-radius: 4px;

  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);

  border: 1px solid rgba(0, 0, 0, 0.1);

  background-clip: padding-box;

 margin:auto;





}







.modal-box header,

.modal-box .modal-header {

  padding-bottom:10px;

  padding-top:15px;

  border-bottom: 1px solid #e3e3e3;

  width:95%;

  max-width:100%;

  margin:auto;

}



.modal-box header h3,

.modal-box header h4,

.modal-box .modal-header h3,

.modal-box .modal-header h4 { margin: 0; }



.modal-box .modal-body 

{

	 padding:5px 5px 5px 5px;

	 width:95%;

	 margin:auto;

	 max-width:100%;

 }



.modal-box .modal-body ul

{ 

	list-style:none;

	display:table;

	margin-top:20px;

	width:55%;

	float:left;

	max-width:100%;

 }



.modal-box .modal-body  img

{ 

	width:373px;

	height:auto;

	float:right;

	margin-top:15px;

	max-width:100%;

 }

.modal-box .modal-body ul li

{ 

	list-style:none;

	display:table;

	background:url(../images/list-item4.png) no-repeat left;

	margin-bottom:15px;

	font-size:14px;

	color:#334465;

	width:100%;

	padding-left:10px;

	margin-top:-2px;

	float:left;

	min-height:auto;

 }

.modal-box footer,

.modal-box .modal-footer {

 

   padding-bottom:0px;

  padding-top:0px;



  width:95%;

  margin:auto;

}

.modal-box footer,

.modal-box .modal-footer a {

 margin-bottom:15px;

 float:left;

 margin-left:20px;

 

}



.modal-overlay {

  opacity: 0;

  filter: alpha(opacity=0);

  position: absolute;

  top: 0;

  left: 0;

  z-index: 900;

  width: 100%;

  height:2000px;

   background: rgba(0, 0, 0, 0.8) !important;

}



a.close {

  line-height: 1;

  font-size: 1.5em;

  position: absolute;

  top: 2%;

  right:3%;

  text-decoration: none;

  color: #bbb;

}



a.close:hover {

  color: #222;

  -webkit-transition: color 1s ease;

  -moz-transition: color 1s ease;

  transition: color 1s ease;

}*/