﻿.news-content-container{
    padding: 20px;
}
/* bootstrap 3 helpers */
#nav.affix {
    position: fixed;
    top: 68px;
    width: 100%;
    z-index:1000;
}
@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    #nav.affix {
        top: 50px;
    }

    .navbar-news-container{
       padding: 0 !important;
       margin: 0 !important;
       width: 100%;
    }
}

.btn-submit{
    background-size: 20px;
    border: 0 none;
    color:#000;
    background-color: transparent;
    cursor: pointer;
    height: 30px;
    min-width: 20px;
    padding: 0;
    position: absolute;
    right: 20px;
    top: 10px;
    width: 30px;
}
@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .btn-submit {
        top: 8px;
        right: 10px;
    }
}
.btn-submit.hover {
    color:#000;
    background-color: transparent;
}

.navbar-form {
    padding:0;
}
/******* TopBar ******/
#sort-order-text {
     color:#fff;
     font-size:12px;
}

#sortOrder {
    font-size:12px;
}
#sortOrder > option{
    color:#000 !important;
    font-size:12px;
}

/* align anything inside a div (parent) */
#navbar-collapse-news {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
/* align anything inside a div (child) */
.sort-order-form{
  position: relative;
  top: 0;
  transform: translateY(25%);
  -webkit-transform: translateY(25%);
  -ms-transform: translateY(25%);
}

/******* Header ******/
.news-img-small{
    width:25%;
    height:auto;
    max-width:50px;
}

.news-header-container
{
    margin: 0;
    padding: 0;
    display: table;
    width: 100%;
    height: auto;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}



/******* Grid ********/
.news-grid{
    margin-top: 0;
    margin-bottom: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
    /*border-style: solid;
    border-width: 1px;*/
    display: table;
    width: 100%;
    height: 100%;
}

.news-row{
    display:table-row;
    /*width:auto;*/
    clear:both;
}

.news-col{
    /*float:left;*/
    display:table-cell;         
    width:150px;
    vertical-align: top;
    padding: 10px;
    border: none;
    border-bottom: 1px solid #eee;
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .news-row, .news-col {
        display: block;
    }
    /*.news-content-wrapper{
        visibility:hidden;
    }*/
    .news-image-col{
        width:90% !important;
        border-bottom:0;
    }
}


/********* toggle ****************/
/*#nav{
    margin-top:-50px;
}*/
#news-plus-sign
{
    color:#fff;
}
#news-minus-sign
{
    color:#fff;
}

#news-image-caption {
    top:150px;
    left:110px;
    position: absolute; 
    font-size:36px;
    color:#fff;
    font-weight: bold;
    display:none;
}

#news-toggle-caption-text
{
    color: #fff;
}

/*.navbar-toggle-news
{
    display: none;
}*/

#news-toggle-caption {
    display: none;
}

@media only screen and (device-width: 768px), only screen and (max-width: 768px) {
    #news-image-caption
    {
        display: none;
    }
    #news-toggle-caption
    {
        width:  100%;
        padding: 10px;
        margin: 0 auto;
        position: relative; 
        color:#fff;
        display:inline-block;
        /*top: 8px;*/
        font-weight:bold;
    }
    #news-toggle-caption-text
    {
        color: #fff;
    }

    /*.navbar-toggle-news
    {
        display:inline-block;
        padding: 0; 
        margin-top: 0;
        margin-right: 0;
    }*/

    .navbar-toggle:hover, .navbar-toggle:active, navbar-toggle:visited {
        background-color: transparent !important;
    }
}


/* sub menu bar */
#navbar-collapse-news>ul>li>a:focus, #navbar-collapse-news>ul>li>a:hover {
    color: #7ad98f;
    border-bottom: 3px solid #7ad98f;
    background-color: transparent;
}

#navbar-collapse-news>ul>li:not(.disabled).active>a{
    color: #7ad98f;
}

@media(max-width:738px) {
    #navbar-collapse-news>ul>li>a:focus, #navbar-collapse-news>ul>li>a:hover
    {
        border-left: 3px solid #7ad98f;
        border-bottom: 0;
        color: #5FB0E4;
    }
}

 #navbar-collapse-news>ul>li>a
{
    padding-left: 10px;
    margin-left: 0;
}

 /* plus/minus switch */
.accordion-toggle-news {
    display:inline-block;
    position: relative;
    padding: 0; 
    margin-top: 10px;
    margin-right: 0px;
}
.accordion-toggle-news::before,
.accordion-toggle-news::after {
    content: '';
    display: block;
    width: 16px;
    height: 2px;
    padding-top: 2px;
    margin-top: -2px;
    margin-right: 0px;

    background-color: #fff;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: all 0.25s;
    transition: all 0.25s;
}
.accordion-toggle-news::before {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
}
.accordion-toggle-news.collapsed::before {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
}
.accordion-toggle-news.collapsed::after {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

@media only screen and (device-width: 768px), only screen and (max-width: 768px) {
    .accordion-toggle-news
    {
        display:inline-block;
        padding: 0; 
        margin-top: 0;
        margin-right: 0;
        color:#fff;
        top: -2px;
    }
}

/* loading spinner */
#circularG{
	position:relative;
	width:58px;
	height:58px;
	margin: auto;
}

.circularG{
	position:absolute;
	background-color:rgb(130,30,60);
	width:14px;
	height:14px;
	border-radius:9px;
		-o-border-radius:9px;
		-ms-border-radius:9px;
		-webkit-border-radius:9px;
		-moz-border-radius:9px;
	animation-name:bounce_circularG;
		-o-animation-name:bounce_circularG;
		-ms-animation-name:bounce_circularG;
		-webkit-animation-name:bounce_circularG;
		-moz-animation-name:bounce_circularG;
	animation-duration:1.1s;
		-o-animation-duration:1.1s;
		-ms-animation-duration:1.1s;
		-webkit-animation-duration:1.1s;
		-moz-animation-duration:1.1s;
	animation-iteration-count:infinite;
		-o-animation-iteration-count:infinite;
		-ms-animation-iteration-count:infinite;
		-webkit-animation-iteration-count:infinite;
		-moz-animation-iteration-count:infinite;
	animation-direction:normal;
		-o-animation-direction:normal;
		-ms-animation-direction:normal;
		-webkit-animation-direction:normal;
		-moz-animation-direction:normal;
}

#circularG_1{
	left:0;
	top:23px;
	animation-delay:0.41s;
		-o-animation-delay:0.41s;
		-ms-animation-delay:0.41s;
		-webkit-animation-delay:0.41s;
		-moz-animation-delay:0.41s;
}

#circularG_2{
	left:6px;
	top:6px;
	animation-delay:0.55s;
		-o-animation-delay:0.55s;
		-ms-animation-delay:0.55s;
		-webkit-animation-delay:0.55s;
		-moz-animation-delay:0.55s;
}

#circularG_3{
	top:0;
	left:23px;
	animation-delay:0.69s;
		-o-animation-delay:0.69s;
		-ms-animation-delay:0.69s;
		-webkit-animation-delay:0.69s;
		-moz-animation-delay:0.69s;
}

#circularG_4{
	right:6px;
	top:6px;
	animation-delay:0.83s;
		-o-animation-delay:0.83s;
		-ms-animation-delay:0.83s;
		-webkit-animation-delay:0.83s;
		-moz-animation-delay:0.83s;
}

#circularG_5{
	right:0;
	top:23px;
	animation-delay:0.97s;
		-o-animation-delay:0.97s;
		-ms-animation-delay:0.97s;
		-webkit-animation-delay:0.97s;
		-moz-animation-delay:0.97s;
}

#circularG_6{
	right:6px;
	bottom:6px;
	animation-delay:1.1s;
		-o-animation-delay:1.1s;
		-ms-animation-delay:1.1s;
		-webkit-animation-delay:1.1s;
		-moz-animation-delay:1.1s;
}

#circularG_7{
	left:23px;
	bottom:0;
	animation-delay:1.24s;
		-o-animation-delay:1.24s;
		-ms-animation-delay:1.24s;
		-webkit-animation-delay:1.24s;
		-moz-animation-delay:1.24s;
}

#circularG_8{
	left:6px;
	bottom:6px;
	animation-delay:1.38s;
		-o-animation-delay:1.38s;
		-ms-animation-delay:1.38s;
		-webkit-animation-delay:1.38s;
		-moz-animation-delay:1.38s;
}



@keyframes bounce_circularG{
	0%{
		transform:scale(1);
	}

	100%{
		transform:scale(.3);
	}
}

@-o-keyframes bounce_circularG{
	0%{
		-o-transform:scale(1);
	}

	100%{
		-o-transform:scale(.3);
	}
}

@-ms-keyframes bounce_circularG{
	0%{
		-ms-transform:scale(1);
	}

	100%{
		-ms-transform:scale(.3);
	}
}

@-webkit-keyframes bounce_circularG{
	0%{
		-webkit-transform:scale(1);
	}

	100%{
		-webkit-transform:scale(.3);
	}
}

@-moz-keyframes bounce_circularG{
	0%{
		-moz-transform:scale(1);
	}

	100%{
		-moz-transform:scale(.3);
	}
}



#navbar-collapse-news.navbar-collapse.in {
    overflow-y: hidden !important;
}

.img-news{
    max-width: 400px;
}

/*body {
    height: 80% !important;
}*/

.news-title {
    color: #66D37E;
    padding-top: 5px;
    border-top: 3px solid #a0a0a0;
    padding-bottom: 5px;
    border-bottom: 1px solid #a0a0a0;
}


.news-content  {
    padding-bottom: 30px;
    min-height: 100px;
}

.news-footer{
    font-size:smaller;
}

.news-author {
    margin-right: 50px;
    float: left;
}

@media only screen and (device-width: 768px), only screen and (max-width: 768px) {
    .img-news{
        max-width: 300px;
    }
}





@media screen and (min-width: 769px){
    .news-img-header {
        background: url(../../images/news_bg_001.jpg) no-repeat;
        width: 100%;
        height: 400px;
        max-height: 400px;
        background-size:100% 100%;
    }
}

@media only screen and (device-width: 768px), only screen and (max-width: 768px) {
    .news-img-header
    {
        background: url(../../images/news_bg_001_sm.jpg) no-repeat;
        min-height:200px;
        width: 100%;
        background-size:100% 100%;
        max-height: 300px;
    }
}