@charset "UTF-8";
/* CSS Document */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	font-family:'Raleway', sans-serif;
	font-weight:200;
	line-height:22px;
	}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*-------------------------RESET---------------------------------------*/

body{
	width:100%;
	background-image:url(../images/shattered.png);
	font-family: "Century Gothic";
	overflow-x:hidden;
}

/*-------------------START NAV---------------------*/

nav {  
    height: 40px;  
    width: 100%;  
    background: #16a2b3;  
    font-size: 11pt;  
    font-family: "Century Gothic";  
    font-weight: bold;  
    position:fixed;  
    border-bottom: 2px solid #FFF;
	margin:auto;
	z-index:1000;  
} 
 
nav ul {  
    padding: 0;  
    margin:auto;  
    width: 600px;  
    height: 40px;
}

nav li {  
    display: inline;  
    float: left;  
} 

.clearfix:before,  
.clearfix:after {  
    content: " ";  
    display: table;  
}
  
.clearfix:after {  
    clear: both;  
} 
 
.clearfix {  
    *zoom: 1;  
} 

nav a {  
    color: #fff;  
    display: inline-block;  
    width: 100px;  
    text-align: center;  
    text-decoration: none;  
    line-height: 40px;    
}

nav li a {  
    border-right: 1px solid #FFF;  
    box-sizing:border-box;  
    -moz-box-sizing:border-box;  
    -webkit-box-sizing:border-box;  
}
  
nav li:last-child a {  
    border-right: 0;  
} 

nav a:hover, nav a:active {  
    background-color: #94adaf;  
} 

nav a#pull_down {  
    display: none;  
}

/*-------------------END NAV---------------------*/ 

/*-------------------START MEDIA QUERIES---------------------*/

@media screen and (max-width: 600px) {  
    
	nav {   
        height: auto;  
    }
	  
    nav ul {  
        width: 100%;  
        display: block;  
        height: auto;  
    } 
	 
    nav li {  
        width: 50%;  
        float: left;  
        position: relative;  
    }
	  
    nav li a {  
        border-bottom: 1px solid #FFF;  
        border-right: 1px solid #FFF;  
    } 
	 
    nav a {  
        text-align: left;  
        width: 100%;  
        text-indent: 25px;  
    }

} 

@media only screen and (max-width : 600px) {
	  
    nav {  
        border-bottom: 0;  
    }
	  
    nav ul {  
        display: none;  
        height: auto;  
    } 
	 
    nav a#pull_down {  
        display: block;  
        background-color: #16a2b3;  
        width: 100%;  
        position: relative;  
    }
	  
    nav a#pull_down:after {  
        content:"";  
        background: url(../images/nav-icon.png) no-repeat;  
        width: 30px;  
        height: 30px;  
        display: inline-block;  
        position: absolute;  
        right: 15px;  
        top: 10px;  
    }  
}

@media only screen and (max-width : 320px) { 
 
    nav li {  
        display: block;  
        float: none;  
        width: 100%;  
    } 
	 
    nav li a {  
        border-bottom: 1px solid #FFF;  
    }  
}

   

/*-------------------END MEDIA QUERIES---------------------*/

.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:940px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:960px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}
   

#frontend{
	width:100%;
	text-align:center;
	padding: 35px 0px 80px 0px;
	position:relative;
	top:55px;
	height:50px;
	background-image:url(../images/ribbon_banner.png);
	background-size:auto;
	background-position:center;
	background-repeat:no-repeat;
}

	

#main_image {
	background-color:#16a2b3;
  /*background-image:url(../images/splashimage.jpg);
	background-position:center;
	background-repeat:no-repeat;*/
    max-height:500px;
	width:100%;
	text-align:center;
}


/*#main_image, #gallery_tabs, #welcome{
	width:320px;
	padding:10px, 0px, 10px, 0px;
	margin:auto;
}
*/
#wrapper{
	width:960px;
	color:#333;
	overflow:hidden;
	margin:auto;
}

#welcome{
	margin:auto;
	padding:30px 0px;
	width:960px;
}

#content_container{
	width:960px;
/*	max-width:80%;
*/	margin:auto;
	overflow:hidden;
}

#contact_cont{
	margin:auto;
	padding:30px;
}

#contact_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:600px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

#login_cont{
	margin:auto;
	padding:30px;
}

#login_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:600px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

.gallery_body{
	width:100%;
	margin:auto;
}

#welcome h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:960px;
	margin:auto;
	font-weight:800;
}

#welcome p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	max-width:940px;
/*	max-width:80%;
*/}

.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:940px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:960px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}

/*-----------------------TESTIMONIAL DROPDOWNS START----------------------*/

.quotes {
	margin-top:20px;
	margin-bottom:20px;
	padding:10px 0px 10px 0px;
	width:960px;
	letter-spacing:2px;
	margin:auto;
}

.quotes h3 {  
	margin:0;
	padding:5px 0 5px 20px;
	background-color:#16a2b3;
	border:1px solid #fff;
	color: #fff;
	font-weight:bold;
	cursor:pointer;
}

.quotes div {
	background-color: #fff;
	border:1px solid #000;
}

.quotes p {
	left: 60px;
	top: 10px;
}

/*-----------------------TESTIMONIAL DROPDOWNS END----------------------*/
#tabs{
	width:960px;
/*	max-width:80%;
*/	margin:auto;
	padding:20px 0px 20px 0px;
}

#tabs ul{
	list-style:none;
}

#tabs ul li {
	display:inline-block;
	width:236px;
	text-align:center;
}

#gallery_tabs{
	margin-bottom:20px;
	width:100%;
}

#gallery_tabs h1 {
	position:absolute;
	top:0px;
	left:-2000px;
}

#gallery_tabs a:hover{
	opacity: 0.8;
}

/*-----------------------CONTACT FORM START----------------------*/

p.error, p.success {
			font-weight: bold;
			padding: 10px;
			border: 1px solid;
		}
		
		p.error {
			background: #ffc0c0;
			color: #900;
		}
		
		p.success {
			color:#fff;
			background:rgba(22, 162, 179, 1);
		}
		
.contact-area {
	width: 600px;
/*	max-width:80%;
*/	margin:25px auto 0px auto;
	text-align:center;
}

.contact-area input, .contact-area textarea {
	font-weight:400;
	padding: 5px;
	width: 500px;
/*	max-width:80%;
*/	font-size:18px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	background:rgba(255, 255, 255, 0.7);
}

.contact-area textarea {
	height: 150px;
}

.contact-area textarea:focus, .contact-area input:focus {
	border: 2px solid #900;
}

#submit {
	width: 150px;
	color:#fff;
	background:rgba(22, 162, 179, 1);
}

#submit:hover {
	background:rgba(22, 162, 179, 0.5);
}

		
/*-----------------------CONTACT FORM END----------------------*/



/*=======================================================================================*/

@media screen and (max-width: 800px){
	
.quote_interior{
	width:638px;
}
	
.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
	width:100%;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:800px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:800px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}
   

#frontend{
	width:100%;
	text-align:center;
	padding: 35px 0px 80px 0px;
	position:relative;
	top:55px;
	height:50px;
	background-image:url(../images/ribbon_banner.png);
	background-size:auto;
	background-position:center;
	background-repeat:no-repeat;
}

	

#main_image {
	background-color:#16a2b3;
  /*background-image:url(../images/splashimage.jpg);
	background-position:center;
	background-repeat:no-repeat;*/
    max-height:500px;
	width:100%;
	text-align:center;
}


/*#main_image, #gallery_tabs, #welcome{
	width:320px;
	padding:10px, 0px, 10px, 0px;
	margin:auto;
}
*/
#wrapper{
	width:800px;
	color:#333;
	overflow:hidden;
	margin:auto;
}

#welcome{
	width:800px;
	margin:auto;
	padding:30px 0px;
}

#content_container{
	width:800px;
	max-width:80%;
	margin:auto;
	overflow:hidden;
}

#contact_cont{
	margin:auto;
	padding:30px;
}

#contact_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:600px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}

#login_cont{
	margin:auto;
	padding:30px;
}

#login_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:600px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}

.gallery_body{
	width:100%;
	margin:auto;
}

#welcome h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:800px;
	margin:auto;
	font-weight:800;
}

#welcome p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	max-width:800px;
	max-width:80%;
}

.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:800px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:800px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}

/*-----------------------TESTIMONIAL DROPDOWNS START----------------------*/

.quotes {
	margin-top:20px;
	margin-bottom:20px;
	padding:10px 0px 10px 0px;
	width:740px;
	max-width:80%;
	letter-spacing:2px;
	margin:auto;
}

.quotes h3 {  
	margin:0;
	padding:5px 0 5px 20px;
	background-color:#16a2b3;
	border:1px solid #fff;
	color: #fff;
	font-weight:bold;
	cursor:pointer;
}

.quotes div {
	background-color: #fff;
	border:1px solid #000;
}

.quotes p {
	left: 60px;
	top: 10px;
}

/*-----------------------TESTIMONIAL DROPDOWNS END----------------------*/
#tabs{
	width:800px;
/*	max-width:80%;
*/	margin:auto;
	padding:20px 0px 20px 0px;
}

#tabs ul{
	list-style:none;
}

#tabs ul li {
	display:inline-block;
	width:390px;
	text-align:center;
}

#gallery_tabs{
	margin-bottom:20px;
	width:100%;
}

#gallery_tabs h1 {
	position:absolute;
	top:0px;
	left:-2000px;
}

#gallery_tabs a:hover{
	opacity: 0.8;
}

	
}

/*=======================================================================================*/

@media screen and (max-width: 600px){
.quote_interior{
	width:478px;
}
	
.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:600px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:600px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}
   

#frontend{
	width:100%;
	text-align:center;
	padding: 35px 0px 80px 0px;
	position:relative;
	top:55px;
	height:50px;
	background-image:url(../images/ribbon_banner.png);
	background-size:auto;
	background-position:center;
	background-repeat:no-repeat;
}

	

#main_image {
	background-color:#16a2b3;
  /*background-image:url(../images/splashimage.jpg);
	background-position:center;
	background-repeat:no-repeat;*/
    max-height:500px;
	width:100%;
	text-align:center;
}


/*#main_image, #gallery_tabs, #welcome{
	width:320px;
	padding:10px, 0px, 10px, 0px;
	margin:auto;
}
*/
#wrapper{
	width:600px;
	color:#333;
	overflow:hidden;
	margin:auto;
}

#welcome{
	width:600px;
	margin:auto;
	padding:30px 0px;
}

#content_container{
	width:600px;
/*	max-width:80%;
*/	margin:auto;
	overflow:hidden;
}

#contact_cont{
	margin:auto;
	padding:30px;
}

#contact_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:400px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

#login_cont{
	margin:auto;
	padding:30px;
}

#login_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:400px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

.gallery_body{
	width:100%;
	margin:auto;
}

#welcome h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:600px;
	margin:auto;
	font-weight:800;
}

#welcome p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	max-width:600px;
/*	max-width:80%;
*/}

.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:600px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:600px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}

/*-----------------------TESTIMONIAL DROPDOWNS START----------------------*/

.quotes {
	margin-top:20px;
	margin-bottom:20px;
	padding:10px 0px 10px 0px;
	width:600px;
/*	max-width:80%;
*/	letter-spacing:2px;
	margin:auto;
}

.quotes h3 {  
	margin:0;
	padding:5px 0 5px 20px;
	background-color:#16a2b3;
	border:1px solid #fff;
	color: #fff;
	font-weight:bold;
	cursor:pointer;
}

.quotes div {
	background-color: #fff;
	border:1px solid #000;
}

.quotes p {
	left: 60px;
	top: 10px;
}

/*-----------------------TESTIMONIAL DROPDOWNS END----------------------*/
#tabs{
	width:600px;
/*	max-width:80%;
*/	margin:auto;
	padding:20px 0px 20px 0px;
}

#tabs ul{
	list-style:none;
}

#tabs ul li {
	display:inline-block;
	width:297px;
	text-align:center;
}

#gallery_tabs{
	margin-bottom:20px;
	width:100%;
}

#gallery_tabs h1 {
	position:absolute;
	top:0px;
	left:-2000px;
}

#gallery_tabs a:hover{
	opacity: 0.8;
}

/*-----------------------CONTACT FORM START----------------------*/

p.error, p.success {
			font-weight: bold;
			padding: 10px;
			border: 1px solid;
		}
		
		p.error {
			background: #ffc0c0;
			color: #900;
		}
		
		p.success {
			color:#fff;
			background:rgba(22, 162, 179, 1);
		}
		
.contact-area {
	width: 540px;
/*	max-width:80%;
*/	margin:25px auto 0px auto;
	text-align:center;
}

.contact-area input, .contact-area textarea {
	font-weight:400;
	padding: 5px;
	width: 500px;
/*	max-width:80%;
*/	font-size:18px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	background:rgba(255, 255, 255, 0.7);
}

.contact-area textarea {
	height: 150px;
}

.contact-area textarea:focus, .contact-area input:focus {
	border: 2px solid #900;
}

#submit {
	width: 150px;
	color:#fff;
	background:rgba(22, 162, 179, 1);
}

#submit:hover {
	background:rgba(22, 162, 179, 0.5);
}

		
/*-----------------------CONTACT FORM END----------------------*/


}

/*=======================================================================================*/

@media screen and (max-width: 480px){

.quote_interior{
	width:382px;
}
	
.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:480px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:480px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}
   

#frontend{
	width:100%;
	text-align:center;
	padding: 35px 0px 80px 0px;
	position:relative;
	top:55px;
	height:50px;
	background-image:url(../images/ribbon_banner.png);
	background-size:auto;
	background-position:center;
	background-repeat:no-repeat;
}

	

#main_image {
	background-color:#16a2b3;
  /*background-image:url(../images/splashimage.jpg);
	background-position:center;
	background-repeat:no-repeat;*/
    max-height:500px;
	width:100%;
	text-align:center;
}


/*#main_image, #gallery_tabs, #welcome{
	width:320px;
	padding:10px, 0px, 10px, 0px;
	margin:auto;
}
*/
#wrapper{
	width:480px;
	color:#333;
	overflow:hidden;
	margin:auto;
}

#welcome{
	width:480px;
	margin:auto;
	padding:30px 0px;
}

#content_container{
	width:480px;
/*	max-width:80%;
*/	margin:auto;
	overflow:hidden;
}

#contact_cont{
	margin:auto;
	padding:30px;
}

#contact_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:400px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

#login_cont{
	margin:auto;
	padding:30px;
}

#login_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:400px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

.gallery_body{
	width:100%;
	margin:auto;
}

#welcome h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:480px;
	margin:auto;
	font-weight:800;
}

#welcome p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	max-width:480px;
/*	max-width:80%;
*/}

.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:480px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:480px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}

/*-----------------------TESTIMONIAL DROPDOWNS START----------------------*/

.quotes {
	margin-top:20px;
	margin-bottom:20px;
	padding:10px 0px 10px 0px;
	width:480px;
/*	max-width:80%;
*/	letter-spacing:2px;
	margin:auto;
}

.quotes h3 {  
	margin:0;
	padding:5px 0 5px 20px;
	background-color:#16a2b3;
	border:1px solid #fff;
	color: #fff;
	font-weight:bold;
	cursor:pointer;
}

.quotes div {
	background-color: #fff;
	border:1px solid #000;
}

.quotes p {
	left: 60px;
	top: 10px;
}

/*-----------------------TESTIMONIAL DROPDOWNS END----------------------*/
#tabs{
	width:480px;
/*	max-width:80%;
*/	margin:auto;
	padding:20px 0px 20px 0px;
}

#tabs ul{
	list-style:none;
}

#tabs ul li {
	display:inline-block;
	width:236px;
	text-align:center;
}

#gallery_tabs{
	margin-bottom:20px;
	width:100%;
}

#gallery_tabs h1 {
	position:absolute;
	top:0px;
	left:-2000px;
}

#gallery_tabs a:hover{
	opacity: 0.8;
}

/*-----------------------CONTACT FORM START----------------------*/

p.error, p.success {
			font-weight: bold;
			padding: 10px;
			border: 1px solid;
		}
		
		p.error {
			background: #ffc0c0;
			color: #900;
		}
		
		p.success {
			color:#fff;
			background:rgba(22, 162, 179, 1);
		}
		
.contact-area {
	width: 420px;
}

.contact-area input, .contact-area textarea {
	font-weight:400;
	padding: 5px;
	width: 300px;
/*	max-width:80%;
*/	font-size:18px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	background:rgba(255, 255, 255, 0.7);
}

.contact-area textarea {
	height: 150px;
}

.contact-area textarea:focus, .contact-area input:focus {
	border: 2px solid #900;
}

#submit {
	width: 150px;
	color:#fff;
	background:rgba(22, 162, 179, 1);
}

#submit:hover {
	background:rgba(22, 162, 179, 0.5);
}

		
/*-----------------------CONTACT FORM END----------------------*/


}

/*=======================================================================================*/

@media screen and (max-width: 320px){
	
	.quote_interior{
	width:254px;
}
	
.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:320px;
	max-width:80%;
}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:320px;
	max-width:80%;
	margin:auto;
	font-weight:800;
}
   

#frontend{
	width:100%;
	text-align:center;
	padding: 35px 0px 80px 0px;
	position:relative;
	top:55px;
	height:50px;
	background-image:url(../images/ribbon_banner.png);
	background-size:auto;
	background-position:center;
	background-repeat:no-repeat;
}

	

#main_image {
	background-color:#16a2b3;
  /*background-image:url(../images/splashimage.jpg);
	background-position:center;
	background-repeat:no-repeat;*/
    max-height:500px;
	width:100%;
	text-align:center;
}


/*#main_image, #gallery_tabs, #welcome{
	width:320px;
	padding:10px, 0px, 10px, 0px;
	margin:auto;
}
*/
#wrapper{
	width:320px;
	color:#333;
	overflow:hidden;
	margin:auto;
}

#welcome{
	width:320px;
	margin:auto;
	padding:30px 0px;
}

#content_container{
	width:320px;
/*	max-width:80%;
*/	margin:auto;
	overflow:hidden;
}

#contact_cont{
	margin:auto;
	padding:30px;
}

#contact_cont h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:320px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

#login_cont{
	margin:auto;
	padding:30px;
}

#login_cont h1{
	font-size:24px;
	paddin: 20px 0px 20px 0px;
	width:320px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

.gallery_body{
	width:100%;
	margin:auto;
}

#welcome h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:320px;
	margin:auto;
	font-weight:800;
}

#welcome p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	max-width:320px;
/*	max-width:80%;
*/}

.admin_func li, .pricing li{
	padding: 10px 0px 10px 20px;
}

.pricing{
	list-style-type:square;
	list-style-position:inside;
}
	
#page-wrap{
	overflow:hidden;
	margin:20px 0px 60px 0px;
}

#guts p{
	margin:20px auto 20px auto;
	padding:10px;
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	width:320px;
/*	max-width:80%;
*/}

#guts h1{
	font-size:24px;
	padding: 20px 0px 40px 0px;
	width:320px;
/*	max-width:80%;
*/	margin:auto;
	font-weight:800;
}

/*-----------------------TESTIMONIAL DROPDOWNS START----------------------*/

.quotes {
	margin-top:20px;
	margin-bottom:20px;
	padding:10px 0px 10px 0px;
	width:320px;
/*	max-width:80%;
*/	letter-spacing:2px;
	margin:auto;
}

.quotes h3 {  
	margin:0;
	padding:5px 0 5px 20px;
	background-color:#16a2b3;
	border:1px solid #fff;
	color: #fff;
	font-weight:bold;
	cursor:pointer;
}

.quotes div {
	background-color: #fff;
	border:1px solid #000;
}

.quotes p {
	left: 60px;
	top: 10px;
}

/*-----------------------TESTIMONIAL DROPDOWNS END----------------------*/
#tabs{
	width:320px;
/*	max-width:80%;
*/	margin:auto;
	padding:20px 0px 20px 0px;
}

#tabs ul{
	list-style:none;
}

#tabs ul li {
	display:inline-block;
	width:309px;
	text-align:center;
}

#gallery_tabs{
	margin-bottom:20px;
	width:100%;
}

#gallery_tabs h1 {
	position:absolute;
	top:0px;
	left:-2000px;
}

#gallery_tabs a:hover{
	opacity: 0.8;
}

/*-----------------------CONTACT FORM START----------------------*/

p.error, p.success {
			font-weight: bold;
			padding: 10px;
			border: 1px solid;
		}
		
		p.error {
			background: #ffc0c0;
			color: #900;
		}
		
		p.success {
			color:#fff;
			background:rgba(22, 162, 179, 1);
		}
		
.contact-area {
	width: 263px;
}

.contact-area input, .contact-area textarea {
	font-weight:400;
	padding: 5px;
	width: 250px;
/*	max-width:80%;
*/	font-size:18px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	background:rgba(255, 255, 255, 0.7);
}

.contact-area textarea {
	height: 150px;
}

.contact-area textarea:focus, .contact-area input:focus {
	border: 2px solid #900;
}

#submit {
	width: 100px;
	color:#fff;
	background:rgba(22, 162, 179, 1);
}

#submit:hover {
	background:rgba(22, 162, 179, 0.5);
}

		
/*-----------------------CONTACT FORM END----------------------*/


}




	
/*-----------------------FOOTER START----------------------*/

footer{
	width:100%;
	padding:20px, 0px, 20px, 0px;
	background-color:#16a2b3;
	color:#FFF;
}

#footer_content{
	width:320px;
	margin:auto;
	padding-top:30px;
	padding-bottom:30px;
}

.contact_info{
	text-align:center;
	margin-top:20px;
}

.social_media{
	display:inline-block;
	text-align:center;
}

#social_1 a:hover, #social_2 a:hover, #social_3 a:hover{
	opacity:0.8;
}
	

#social_1, #social_3{
	width:128px;
	float:left;
}

#social_2{
	width:64px;
	float:left;
}

/*-----------------------FOOTER END----------------------*/

/**
 * Grid container
 */
#tiles {
  list-style-type: none;
  position: relative; /** Needed to ensure items are laid out relative to this container **/
  margin: 0;
  padding: 0;
}

/**
 * Grid items
 */
#tiles li {
  background-color: #ffffff;
  border: 1px solid #dedede;
          border-radius: 2px;
     -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  display: none; /** Hide items initially to avoid a flicker effect **/
  cursor: pointer;
  padding: 4px;
}

#tiles li.inactive {
  visibility: hidden;
  opacity: 0;
}

#tiles li img {
  display: block;
}

/**
 * Grid item text
 */
#tiles li p {
  color: #666;
  font-size: 13px;
  line-height: 20px;
  text-align: center;
  font-weight: 200;
  margin: 7px 0 2px 7px;
}



/*-------------------TABLE START---------------------------*/

table, td, th {
    border: 1px solid black;
	padding:15px;
	text-align:right;
}

table {
    width: 100%;
	margin:30px 0px 30px 0px;
}

th {
    height: 30px;
	text-align:center;
	vertical-align:middle;
	background-color:#16a2b3;
	color:#FFF;
}

/*-----------------------ADMIN FORMS START----------------------*/

.feedback-form{
	font-weight:400;
	padding: 5px;
	width: 500px;
	max-width:80%;
	font-size:18px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	background:rgba(255, 255, 255, 0.7);
}

label{
	font-size:18px;
	font-weight:600;
	padding:20px 0px 0px 0px;
}

.radio{
	font-size:18px;
	font-weight:400;
	padding:20px 0px 20px 0px;
}

.radio input{
	width:25px;
}

#add-user {
	width: 100px;
	height:40px;
	font-size:18px;
	color:#fff;
	background:rgba(22, 162, 179, 1);
	margin:20px 0px;
}

#add-user:hover {
	background:rgba(22, 162, 179, 0.5);
}

#categories{
	padding:20px 5px 20px 5px;
}

.image_input{
	font-weight:400;
	padding: 5px;
	width: 300px;
	max-width:80%;
	font-size:18px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	background:rgba(255, 255, 255, 0.7);
}

#image_submit {
	width: 150px;
	height:40px;
	font-size:18px;
	color:#fff;
	background:rgba(22, 162, 179, 1);
	margin:20px 0px;
}

#image_submit:hover {
	background:rgba(22, 162, 179, 0.5);
}


/*-----------------------LOGIN FORM START----------------------*/

.login {
	width: 600px;
/*	max-width:80%;
*/	margin:25px auto 0px auto;
	text-align:center;
}

.login input{
	font-weight:400;
	padding: 5px;
	width: 500px;
	max-width:80%;
	font-size:18px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
	background:rgba(255, 255, 255, 0.7);
}

#log-in {
	width: 150px;
	height:30px;
	font-size:18px;
	color:#fff;
	background:rgba(22, 162, 179, 1);
}

#log-in:hover {
	background:rgba(22, 162, 179, 0.5);
}

#backend{
	width:100%;
	text-align:center;
	padding: 30px 0px 40px 0px;
	position:relative;
	top:55px;
	height:50px;
	background-color:#FFF;
}

#main_image_admin {
	background-color:#16a2b3;
  /*background-image:url(../images/splashimage.jpg);
	background-position:center;
	background-repeat:no-repeat;*/
    max-height:363px;
	width:100%;
	text-align:center;
}

.splash_image{
	max-width: 100%;
	height: auto;
	margin:auto;	
}

#backend_content{
	margin: 50px auto 50px auto;
	padding:30px;
}

#backend_content h1{
	font-size:24px;
	padding: 20px 0px 20px 0px;
	width:960px;
	margin:auto;
	font-weight:800;
}

#backend_content p{
	font-family:"Century Gothic";
	font-size:18px;
	line-height:26px;
	max-width:80%;
}

#backend_content a{
	text-decoration:none;
	color:#16a2b3;
}

#backend_content a:hover{
	color:#666;
}

/*-------------------GRID START---------------------*/ 
/**
 * Grid container
 */
#tiles {
  list-style-type: none;
  position: relative; /** Needed to ensure items are laid out relative to this container **/
  margin: 0;
  padding: 0;
}

/**
 * Grid items
 */
#tiles li {
  background-color: #ffffff;
  border: 1px solid #dedede;
          border-radius: 2px;
     -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  display: none; /** Hide items initially to avoid a flicker effect **/
  cursor: pointer;
  padding: 4px;
}

#tiles li.inactive {
  visibility: hidden;
  opacity: 0;
}

#tiles li img {
  display: block;
}

/**
 * Grid item text
 */
#tiles li p {
  color: #666;
  font-size: 13px;
  line-height: 20px;
  text-align: center;
  font-weight: 200;
  margin: 7px 0 2px 7px;
}

/*-------------------END GRID---------------------*/

</style>