@import url("../fonts/Corbert/stylesheet.css");
@import url("../fonts/charming_out/stylesheet.css");
@import url("../fonts/charming_reg/stylesheet.css");



body {
    color: #555555;
    font-family: 'proxima-nova',sans-serif;
	background-image: url("../img/background.gif"); 
	}
/**********************************************************************/
/************************** COMMON ELEMENTS **************************/
/********************************************************************/
h1, h2, h3, h4, h5, h6 {

	color: #0000ff; /*#333333; */
    font-family: 'Roboto Condensed',sans-serif;
	background: #ffffff;
}
p {
	line-height: 1.6;
	font-size: 1rem;
	font-family: 'proxima-nova',sans-serif;
	background: #ffffff;
}
a:focus {
    outline: none;
}
.btn:focus, .btn:active:focus, .btn.active:focus {
    outline: none;
}
/** Custom styles **/
.vis-hidden {
	visibility: hidden !important;
}
a {
	-webkit-transition: 0.25s;
	-moz-transition: 0.25s;
	-o-transition: 0.25s;
	transition: 0.25s;
}
h2.sectionTitle {
	color: #428BCA;
    font-size: 3rem;
    margin-top: 1.25rem;
    text-align: center;
	font-weight: 700;
    margin-bottom: 3remx;
}
h3.sectionTitle {
    text-align: center;
    margin-bottom: 3rem;
    margin-top: -20px;
}
.altWrap {
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	background-color: #f7f7f7;
}

div#pagination_controls
{
font-size:1.1rem;
font-weight: bold;
color: #FF0000;
border-style: solid;
border-width :1px;
background-color: #ffffff;
border-color: #0000ff;
text-decoration: none;
opacity: .5;
width: 56rempx;
margin-left: 40px;
}

div#pagination_controls > a:hover 
{ color:#0000FF;
text-decoration: none; 
}

div#pagination_controls > a:visited
{ color:#0000FF; text-decoration: none;
}

.pagetoggle {
color: #FF0000;
font-size: 10px;
}

div#pagination_controls > a:visited .pagetoggle
{ color:#FF0000; 
}

	
	

/**********************************************************************/
/***************************** VALIDATE - AVAILABILITY  ********************************/
/********************************************************************/

.status-available{color:#2FC332;}
.status-not-available{color:#D60202;}
#availability-status{
color:#D60202;
font-weight: bold;
}

#availability-status2{
color:#D60202;
font-weight: bold;
}

/**********************************************************************/
/***************************** NAVBAR ********************************/
/********************************************************************/

.nav-link {
	font-family: 'Roboto Condensed',sans-serif;
	color: #ff0000;
    display: block;
    font-size: 1.5rem;
    font-weight: 400;
    padding: 2rem 1rem;
 	text-shadow: 1px 1px #000000;
}

.navbar .navbar-brand {
    color: #ff0000;
	font-size: 4rem;
	font-weight: 400;
	text-shadow: 2px 2px #000000;
	margin-top: 1rem;
    margin-bottom: 2rem;
	margin-left: 1rem;
	}



/******
/**********************************************************************/
/************************* LOGINS ************************************/
/********/


.logon {
width: 5rem;
}




/******
/**********************************************************************/
/************************* DOCUMENTS ************************************/
/********************************************************************/

.clearfix {
  overflow: auto;
}

.spacer150 { /* need to add for media */
margin-top: 10rem;
}

.head-spacer { /* need to add for media */
margin-top: 10rem;
display: block;
}


.spacer100 { /* need to add for media */
margin-top: 6rem;
}

.spacer50 { /* need to add for media */
margin-top: 3rem;
}

.headspacer_m { /* need to add for media */
margin-top: 0px;;
}

.well3 {
	margin-left: 6rem;
	margin-top: 3rem;
}

.user-right {
font-family: 'Roboto Condensed',sans-serif;
	color: #000;
    font-size: 1rem;
	}

.pagehead {
font-family: 'Roboto Condensed',sans-serif;
color:  #428bca;	
font-size: 2.5em; /* orginal font-size: 28px; */
   font-weight: 400;
}

.wraper {
height: 100%;
}

.docpage_detail { 
font-size: 18px; 
padding: 10px;

}

.input-error {
	color: #FF0000;
    font-family: 'Roboto Condensed',sans-serif;
	font-size: 1.1em;
	}

.input-video {
	color: #FF0000;
    font-family: 'Roboto Condensed',sans-serif;
	}
	
.blog-box{
background: #fff; /* as per dvd system */ 
color: #000;
margin-top: 1.6rem; /* originaly 75px; previously  width: 44rem;*/
margin-left: 1rem;
text-decoration:none;
}
	
ul, li{
    text-decoration: none;
}

.blog-desc{
background: #fff; /* as per dvd system */ 
color: #000;
font-size: 1.5em;
}

.comment-head
{
margin-top: 5px;
color: #428bca;
font-family: 'Roboto Condensed',sans-serif;
font-size: 1.3em;
font-weight: 500;
}

.blog-text{
font-size: 1.1em;
padding-left: 1.5em;
}

#image-holder {
margin-left:0;
float:left;
}


#defimage-holder {
padding-left:100px;;
}

.lead {
background: #ffffff;
}

/**********************************************************************/
/************************* IMAGES ************************************/
/********************************************************************/

.image-box{
	background-color:#ffffff;
	min-height: 5.3rem; 
	padding: 4px; 
	border: 1px solid #000;
	clear:both;
	width:54rem;
}

.image-box-red{
	background-color:#000000;
	border: 2px solid #FF0000;
	
}

.image-image{
	width:5rem;
	height: 5rem;
	background: url("../img/logo.png");
	display:inline;
	float:left;
	margin-left: 5px;
	padding-right: 5px;
	}
	
.image-main{
	width:80%;
	display:block;/* inline */
	float:left;
	overflow:hidden;
}
.image-edit{
	width:1.9rem;
	display:inline;
	float:right; /*original left */
	overflow:hidden;
}
.image-delete{
	width:1.9rem;
	display:inline;
	float:right; /*original left */
}

.image-detail {
	color: #000000; 
	background: #ffffff; 
	font-size:1.4rem; 
	padding-left: 1.3rem;
	display:block;/* inline */
	float:left;
}

.image-small {
	color: #0000ff; 
	background: #ffffff; 
	font-size: 1em; 
	padding-left: .6rem;
	padding-top:1.2rem;
	display:block;/* inline */
	float:left;
}

.portfolio-head {
	font-family: 'proxima-nova' ,sans-serif; /* 'pragmatica-web'*/
	padding: 4px; 
	/* border: 1px solid #ff0000; */
	font-size:1.5rem;
	color: #0000ff;
	background: #ffffff;
}
	
.portfolio {
	font-family: 'proxima-nova' ,sans-serif; /* 'pragmatica-web'*/
	padding: 4px; 
	/*border: 1px solid #ff0000; */
	font-size:1rem;
	background: #ffffff;
	
}

.portfolio-box {
	font-family: 'proxima-nova' ,sans-serif; /* 'pragmatica-web'*/
	padding: 4px; 
	height: 22rem;
}

.portfolio-image {
	 max-width: 100%;
  height: auto;
}


 li {list-style: none;
}

.blog 
{ 
max-width: 85%;
}

.noimage
{
color: #428bca;
font-family: 'proxima-nova',sans-serif;
font-size: 1.5em;
}

.noaccess
{
	margin-left: 1.5rem;
}

.photogallery
{
	margin-bottom: .3rem;
}

.imagegallery
{
	margin-bottom: .3rem;
	/*width: 225px; */
	height: 225px;
}

.imagehead {
	margin-left: 10px;
	font-family: 'Roboto Condensed',sans-serif;
	font-size: 1.6em;
    color: #0000ff;
	}

.category {
	line-height: 1;
	font-size: 1rem;
	font-family: 'proxima-nova',sans-serif;
	color: #0000ff;
	padding-left:25px;
	width: 14rem;
}

.cathead {
	line-height: 1;
	font-size: 1rem;
	font-family: 'proxima-nova',sans-serif;
	color: #ff0000;
	padding-left: 1.3rem;
}

.catheader {
	line-height: 1;
	font-size: 1rem;
	color: #ff0000;
	padding-left: .6rem;
	color: #0000ff; 
    font-family: 'Roboto Condensed',sans-serif;

	}

/**********************************************************************/
/************************* Gallery ************************************/
/********************************************************************/

	

#filters {
	display: inline-block;
	
}

#search {
	float: left;
	
}

/* popup box */

#filter { 
  /*  background-image: url( "../img/message.png" ); */ 
background-color:#fff; 
    border-radius:15px;
    color:#000;
   display:none; 
   margin-top: 100px;
   padding:20px;
    min-width:300px;
    min-height: 180px;
	border: solid 1px #ff0000;
}

.b-close{
    cursor:pointer;
    position:relative;
    float:right;
	right:10px;
    top:5px;
}


.video {
    width: 100%;
    object-fit: cover;
	background-color:#ffffff;
	
}		


.video-box{
	background-color:#ffffff;
	min-height: 10rem; 
	padding: 4px;
	margin-top: .3rem;	
	border: 1px solid #000;
	clear:both;
	width:90%;
}

.video-image{
	width:12rem;
	float:left;
	margin-left: .3rem;
	margin-right: .6rem;
	max-height:9.3rem !important;
	display:inline;
	}

.video-image img {
	height: 150px;
	width: 200px;
}

.videotext-box{
	/* margin-left: 205px; */
	padding-right: .3rem;
	display:inline;
	
	}
		
.video-title {
	color: #0000FF; 
	background: #ffffff; 
	font-size:1.1rem; 
	padding-left: .3rem;
}

	
.video-close {
	color: #0000FF; 
	background: #ffffff; 
	font-size:2rem; 
	padding-left: .3rem;
	width: 8rem;
}

.video-modal {
	background: #ffffff; 
	}
	
	
	
	
	
.video-info {
	color: #0000ff; 
	background: #ffffff; 
	font-size:0.9rem; 
	padding-left: .3rem;
}

.video-info-text {
	color: #000000; 
	background: #ffffff; 
	font-size:0.9rem; 
	padding-left: .3rem;
		
	}

.video-info-summary {
	color: #000000; 
	background: #ffffff; 
	font-size:0.9rem; 
	padding-left: .3rem;
	}
	

.image-small {
	color: #0000ff; 
	background: #ffffff; 
	font-size: 1em; 
	padding-left: 0.6rem;
	padding-top:1.2rem;
	display:block;/* inline */
	float:left;
}

#data-title {
	font-size: 2em;
}

/**********************************************************************/
/************************* FOOTER ************************************/
/********************************************************************/
footer {
	padding: 2.5rem;
	margin-left: 2rem;
	}
footer p {
	color: #000;
    font-weight: 300;
    margin: 0 0 1.2rem 0;
	font-size: 1rem;
}

/**********************************************************************/
/****************** UPLOADS PROGRESS *********************************/
/********************************************************************/

#progressbox {
border: 1px solid #0099CC;
padding: 1px; 
position:relative;
width:400px;
border-radius: 3px;
margin: 10px;
display:none;
text-align:left;
}
#progressbar {
height:20px;
border-radius: 3px;
background-color: #0000FF;
width:1%;
}
#statustxt {
top:3px;
left:50%;
position:absolute;
display:inline-block;
color: #0000FF;
}



/**********************************************************************/
/****************** MEDIA QUERIES ************************************/
/********************************************************************/


@media (min-width: 1251px) and  (max-width: 1800px){
.navbar .navbar-brand {
	font-size: 1.25em;
	text-shadow: 0px 0px #000000;
}

.nav-link {
	font-family: 'Roboto Condensed',sans-serif;
	color: #ff0000;
    display: block;
    font-size: 1.25rem;
    font-weight: 400;
    padding: 2rem 1rem;
 	text-shadow: 1px 1px #000000;
}

.head-spacer { /* need to add for media */
margin-top: 10rem;
display: block;
}

.blog-desc{
font-size: 1.2rem;
	margin-right: 2.5rem;
}

.blog 
{ 
max-width: 80%;
}
}
  


@media (min-width: 979px) and  (max-width: 1250px){
.navbar .navbar-brand {
	font-size: 1.25em;
	text-shadow: 0px 0px #000000;
}

.nav-link {
	font-family: 'Roboto Condensed',sans-serif;
	color: #ff0000;
    display: block;
    font-size: 1.25rem;
    font-weight: 400;
    padding: 2rem 1rem;
 	text-shadow: 1px 1px #000000;
}

.head-spacer { /* need to add for media */
margin-top: 10rem;
display: block;
}

.blog-desc{
font-size: 1.2rem;
	margin-right: 2.5rem;
}

.blog 
{ 
max-width: 85%;
}

.video-box{
	background-color:#ffffff;
	min-height: 10rem; 
	padding: 4px;
	margin-top: .6rem;	
	border: 1px solid #000;
	clear:both;
	width:90%;
}
}
  
  
@media  (min-width: 768px) and  (max-width: 979px) {

.navbar .navbar-brand {
	font-size: 1.25em;
	text-shadow: 0px 0px #000000;
}

.nav-link {
	font-family: 'Roboto Condensed',sans-serif;
	color: #ff0000;
    display: block;
    font-size: 1.25rem;
    font-weight: 400;
    padding: 2rem 1rem;
 	text-shadow: 1px 1px #000000;
}
	
.blog-box {width: 30rem;}
.blog 
{ 
max-width: 85%;
}

.blog-desc{
font-size: 1.2rem;
}

.head-spacer { /* need to add for media */
margin-top: 10rem;
display: block;
}
.image-box{ width:30rem;}
.image-detail {	font-size:1.1rem; padding: .6rem;}
.portfolio-image {height: 11rem;}
.portfolio-box {height: auto; }
.video-box{
margin-left: 0px;
}
}
 
  
@media  (min-width: 476px) and  (max-width: 767px) {
.navbar {box-shadow: 0 0 0 ;}
.navbar-right {display: none;}
.navbar-brand {display:none;}
.head-spacer { /* need to add for media */
margin-top: 5rem;
display: block;
}
.navbar-collapse {
		float: none;
	}
.blog-box{
	width: 30rem;
	margin-left: 0px;
	}
.blog-desc{
font-size: 1.2rem;
}
.image-box{ width:30rem;}
.image-detail {	
font-size:1.1rem;
padding: .6rem;}
.portfolio-image {height: auto;}
.portfolio-box {height: auto; }
}


@media (max-width: 475px) {
.blog-box {width: 18rem; }
.navbar-right {display: none}
.navbar-brand {display:none}
.image-box { width:18rem;}
.image-detail { font-size:1rem; padding: .3rem;  }
.portfolio-box {height: auto; }
.portfolio-image {height: auto;}
.head-spacer{display: none;	}
.videotext-box{
	margin-left: 0px;
	padding-right: .3rem;
	display:block;
	}
}