html, body
{

    min-height: 99%;
	height: 99%;
	
    position:relative;
	
    margin: 0;
    padding: 0;

	background: url(images/back.jpg) no-repeat center center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
  	background-color:#333;
}

*{ margin:0; padding:0; }

img{ border: none; }

.left { float: left; }

.right { float: right; }

ul, li, p { 

    margin:0;
    padding:0;
    list-style: none;
    
    color: #fff;
    line-height: 1.5em;
	font-size: 15px;
	font-family: 'square721_btroman', Arial, Helvetica, sans-serif;
    
}

div {
	
	border-radius: 5px;
    -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

h1, h2, h3, h4 { margin:0;  padding:0; font-weight: normal; }

.lft { float: left; }

.rgt { float: right; }

.cntr { display: block; margin: 0 auto 0 auto; }

.cntrTxt { text-align: center; }

.clear {clear: both}

.thumbnail {
    display: block;
    padding: 0;
    margin-bottom: 0;
    line-height: ;
    background-color: transparent;
    border: none;
    border-radius: 0;
    -webkit-transition: 0;
    -o-transition: 0;
    transition: 0;
}


/***********************************************************/
/************* HEADER STYLES ARE IN NAVBAR.CSS *************/
/*********** HEADER IS BUILT WITH BOOTSTRAP NAV ************/
/***********************************************************/

.wrp { 

	margin: 12px auto 0 auto;
	
	width: 99%;
	min-height: 99%;
	
	border: 1px solid #00b4ff;
	
	border-radius: 5px;
    -webkit-border-radius: 5px;
	-moz-border-radius: 5px;

}

.cmpnyimg { 
	
	float: right;
	
	margin-top: -20px;
	
	width: 425px;
	height: 275px;
	
	background-image: url("images/design.gif");
	background-position: center;
	background-repeat: no-repeat;
}

.bdyscrll {
    
	position: absolute;
    top: 135px;
	bottom: 55px;
    left: 21%;
	
	margin: 0 auto 0 auto;
	
	width: 58%;

	overflow: scroll;
	
	color: #c5e2ff;
	
	background: #004471;
	
	border-top: 20px solid #0099ff;
	border-bottom: 20px solid #0099ff;
	
	opacity: 0.7;
	-moz-opacity: 0.7;
	-khtml-opacity: 0.7;
	
	-webkit-transition: all .8s ease;
	-moz-transition: all .8s ease;
	-ms-transition: all .8s ease;
	-o-transition: all .8s ease;
	transition: all .8s ease; 
}
 

.bdyscrll:hover {
    
	opacity: 0.9;
	-moz-opacity: 0.9;
	-khtml-opacity: 0.9;
	
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease; 
}


.bdyscrll h1 {
    
	margin-top: 0;
    margin-bottom: 0;
	
	margin: 0 20px;
	
	font-size: 40px;
	letter-spacing: -1px;
	font-family: 'BankGothicLtBTLight', Arial, Helvetica, sans-serif;
}

.bdyscrll p, .bdyscrll li  { padding: 20px 20px 0 20px; }

.bdyscrll p a { color: #c5e2ff; text-decoration: underline; }

.bdyscrll li  { padding: 20px 20px 0 30px; list-style-type: square; }

.idxBox li {
    
    margin: 23px;
    padding: 15px;
	
	display: inline-block;
    
    width: 43.5%;

    line-height: 1.4em;
    
	background: #0067ab;
	
	border: 1px solid #0099ff;
	
	-webkit-transition: all .8s ease;
	-moz-transition: all .8s ease;
	-ms-transition: all .8s ease;
	-o-transition: all .8s ease;
	transition: all .8s ease; 
}

.idxBox li:hover {
	
	opacity: 1;
	-moz-opacity: 1;
	-khtml-opacity: 1;
	
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease; 
}

.idxBox li h1 {
    
    margin: 0;
    padding-bottom: 5px;
    
    font-size: 20px;
    font-family: 'BankGothicLtBTLight', Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
    
    border-bottom: 1px solid #c5e2ff;

}

.idxBox li h1 a { color: #c5e2ff; text-decoration: none; }

.idxBox li p { color: #c5e2ff; margin: 6px 0 0 0; padding: 0; height: 70px; overflow-y: hidden; }

.idxBox li a { color: #c5e2ff; }


.idxBox li span {
	
	float: right;

	display: block;
	
	margin-top: 5px;
	padding: 5px 10px;
	
	border: 1px solid #0099ff;
	
	background: #0067ab;
}

.idxBox li:hover span, .idxBox li:hover span a { color: #0067ab; text-decoration: none; background: #c5e2ff; }




.dsgnHd {

	width: 100%;
	height: auto;
}

.dsgnHd h1 {

	margin: 0;
	
	padding: 65px 0 10px 20px;
    
	color: #fff;
	font-size: 50px;
	letter-spacing: -3px;
	font-family: 'BankGothicLtBTlight', Verdana, Arial, Helvetica, sans-serif;
}



/******** page backgrounds ********/
.hdGUI { background-image: url('images/hd-gui.png'); }
.bckGUI { background: #660000; }

.hdWD { background-image: url('images/hd-wd.png'); }
.bckWD { background: #04829c; }

.hdMD { background-image: url('images/hd-md.png'); }
.bckMD { background: #363c57; }

.hdGD { background-image: url('images/hd-gd.png'); }
.bckGD { background: #76005e; }

.hdBLD { background-image: url('images/hd-bld.png'); }
.bckBLD { background: #270666; }

.hdED { background-image: url('images/hd-ed.png'); }
.bckED { background: #aa8603; }

.hdAD { background-image: url('images/hd-ad.png'); }
.bckAD { background: #8b3001; }

.hdBD { background-image: url('images/hd-bd.png'); }
.bckBD { background: #3c6001; }


.dsgnBox {
    
    padding: 0 0 20px 0;
	
	width: 50%;
	
    color: #fff;
    font-size: 16px;
    text-align: center;
}

.dsgnBox img, .dsgnBoxCntr img {
	
	padding: 3px;
	border: 1px solid #0099ff;
	
}

.dsgnBox h1 {
	
	margin: 0;
	padding: 0;
    
    font-size: 16px;
	font-weight: bold;
}

.dsgnBoxCntr {
    
    margin: 0 auto;
    
    width: auto;
	
	color: #fff;
    font-size: 16px;
    text-align: center;
}



.cntctBttn a {
    
    float: right;
    
    margin: 10px 20px 0 0;
	padding: 6px 12px;
    
    position:relative;
    display: block;
    
    color: #ccc;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-decoration: none;
    
	border: 1px solid #ccc;
}

.cntctBttn a:hover {
    
    color: #fff;

    text-decoration: none;
    
    border: 1px solid #fff;
    
    box-shadow: 0px 0px 14px #fff;
    -moz-box-shadow: 0px 0px 14px #fff;
	-webkit-box-shadow: 0px 0px 14px #fff;
	
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease; 
}

.pageForm ul { margin: 0 auto; width: 95%; }

.pageForm ul li {
    
    list-style: none;
	
	padding: 10px;
    
    width: 100%;
}

input, select, textarea  {
 
    color: #c5e2ff;
	
	padding: 7px;
    
    width: 100%;
    
    border: 1px #0099ff solid;
	
	background: transparent;
}

.slct { background: #004471; }

.submit { color: #fff; font-size: 18px; background: #009900; }

.submit:hover { color: #fff; background: #00cc00; }


.neoCopy { 

	position: absolute;
    bottom: 1%;
    left: 21%;
	
	display: block;

	padding: 5px;
	
	width: 58%;
	
	color: #c5e2ff; 
	text-align: center;	
	font-family: 'square721_btroman', Arial, Helvetica, sans-serif;
	
	background: #004471; 
	
	border: 1px solid #0099ff;
	
	opacity: 0.7;
	-moz-opacity: 0.7;
	-khtml-opacity: 0.7;
	
	-webkit-transition: all .8s ease;
	-moz-transition: all .8s ease;
	-ms-transition: all .8s ease;
	-o-transition: all .8s ease;
	transition: all .8s ease; 
}

.neoCopy:hover { 

	opacity: 0.9;
	-moz-opacity: 0.9;
	-khtml-opacity: 0.9;
	
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease; 
}






/* ============================ */
/* ========== MOBILE ========== */
/* ============================ */

@media (max-width: 1300px) { 

.dsgnBox img, .dsgnBoxCntr img { width: 90%; }

.ad100 img { width: 40%; }

}




@media (max-width: 1025px) { 

.idxBox li { margin: 18px; }

.idxBox li h1 { font-size: 20px; letter-spacing: -1px; }

.dsgnHd h1 { font-size: 44px; }

.ad350 img { width: 90%; }

}



@media (max-width: 960px) {

.idxBox li { margin: 15px; }

.idxBox li h1 { font-size: 18px; letter-spacing: -1px; }

.idxBox li p { font-size: 12px; }

.dsgnHd h1 { font-size: 42px; }
	
}


@media (max-width: 800px) {

.wrp { margin: 0; }

.bdyscrll { 

	position: static;
    top: none;
	bottom: none;
    left: none;
	
	margin-top: 20px;

	width: 90%; 
	
	height: 100%; 

}

.cntctBttn a {
    
    color: #fff;
    font-size: 14px;
    
	border: 1px solid #fff;
}

.dsgnHd h1 { font-size: 50px; }

.idxBox li h1 { font-size: 20px; }

.idxBox li p { height: 65px; font-size: 14px; }
	
.neoCopy { 

	position: relative;
	bottom: 0%;
    left: 0%;
	
	margin: 10px auto 0 auto;
	
	width: 90%;
	
}
	
}


@media (max-width: 767px) {

.bdyscrll p { font-size: 16px; }

.idxBox li {

	margin: 5px;
	
	width: 47%;
}

.idxBox li h1 { font-size: 22px; height: 25px; overflow-y: hidden; }

.idxBox li p { font-size: 16px; line-height: 21px; }

.dsgnHd h1 { font-size: 44px; }

.dsgnHd h1 img { display: none; }
	
}



@media (max-width: 600px) {

.bdyscrll h1 { font-size: 32px; }

.idxBox li h1 { font-size: 20px; }

.dsgnHd h1 { font-size: 42px; }

.dsgnBox { padding: 20px; width: 100%; }

.dsgnBox img { margin: 0 auto; }

.ad468 img { width: 90%; }

}



@media (max-width: 480px) {

.dsgnHd h1 { padding: 60px 0 10px 10px; font-size: 34px; }
	
}



@media (max-width: 420px) {

.bdyscrll h1 { font-size: 30px; }

.cntctBttn a {
    
	margin: 5px auto;
	padding: 4px 10px;
	
	width: 100%;

}

.dsgnHd h1 { font-size: 27px; }

.idxBox li { margin: 10px 0 0 0; width: 100%; }

.idxBox li h1 { font-size: 24px; }

.ad160 img { width: 90%; }
	
}



@media (max-width: 360px) {

.idxBox li h1 { font-size: 22px; }

.dsgnHd h1 { font-size: 25px; }
	
}




