/*
FOR CHAKOYAKI STYLE
*/
/* 
    Created on : May 22, 2021 11:24 AM
    Author     : Ace Pedrido
*/
html, body{
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f63838+0,0e0e0e+100 */
background: #f63838; /* Old browsers */
background: -moz-linear-gradient(top,  #f63838 0%, #0e0e0e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f63838 0%,#0e0e0e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f63838 0%,#0e0e0e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f63838', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
}
.header-bar{
    width:100%;
    padding:10px 0;
    position: fixed;
    z-index: 888;
    background-image: url(../images/heading.gif);
    background-size: 100% 150px;
    height:150px;
}
.headHeight{
    height:120px;
}
.wrapper{
    width:100%;
    max-width:1000px;
    margin: 0 auto;
    font-family: 'Carter One', cursive;
    -moz-box-shadow: 0px 0px 8px 3px #333333; 
	-webkit-box-shadow: 0px 0px 8px 3px #333333; 
	box-shadow: 0px 0px 8px 3px #333333; 
	/* Alas, box-shadow is not fully supported by IE < 9 */
}
.textFontCarter{
    font-family: 'Carter One', cursive;
    text-shadow: 3px 2px 2px rgba(0,0,0,0.6);
}
.bgd_page{
    background: #eee;
}
.border-red{
    border:1px solid red !important;
    background-color:#e7c3c3 !important;
}
.widgetBox{
    text-align: center;
    width:160px;
    margin:5px;
    display: inline-block;
    vertical-align: top;
}
.loaderSlider li.slide{
    display:none;
}

h3.title{
    color:#f63838;
}
.midSize{
    font-size:1.2em;
}
.smallFonts{
    font-size:.8em;
}
.smallFontsB{
    font-size:.9em;
}
.text-grey{
    color:#ccc;
}
.text-gold{
    color:gold;
}
a.text-gold:hover{
    color:goldenrod;
}
.logoBrand{
    margin:0 0 0 10px;
}
.bg-white{
    background-color: #FFF;
}
.bg-grey{
    background-color: #EEE;
}
.padTopBot{
    padding:10px 0 !important;
}
.margTopBot5{
    margin:5px 0 !important;
}
.margTopBot10{
    margin:10px 0 !important;
}
.hide-on-large{
    display: none !important;
}
.noPadding{
    padding:0 !important;
}
.noMargin{
    margin:0 !important;
}
.padSet5{
    padding:5px !important;
}
.margSet5{
    margin:5px !important;
}
.navRight{
   margin:0 !important;
}
.navRight > li{
    float:none !important;
    display: inline-block;
    height:100% !important;
    padding:0;
}
.navRight li a{
    color:#fff !important;
    line-height:50px;
    display:block;
    text-decoration: none;
    padding:10px 15px;
}
.navRight li a:hover{
    background-color: #f63838 !important;
    -webkit-border-top-left-radius: 29px; 
    -moz-border-top-left-radius: 29px; 
    border-top-left-radius: 29px; 
    -webkit-border-bottom-right-radius: 29px; 
    -moz-border-bottom-right-radius: 29px; 
    border-bottom-right-radius: 29px; 
}

.navCenter{
   margin:0 !important;
}
.navCenter > li{
    float:none !important;
    display: inline-block;
    height:100% !important;
    padding:0;
}
.navCenter li a{
    color:#067A07 !important;
    line-height:30px;
    display:block;
    text-decoration: none;
    padding:10px 15px;
}
.navCenter li a:hover{
    background-color: rgba(133, 133, 133, 0.2) !important;
    color:#000 !important;
}

ul.sideBar{
    margin:0 !important;
    position: fixed;
    top:0;
    left:-210px;
    width:200px;
    background-color: #fff;
    height:100%;
    z-index: 888;
    border-right: 1px solid rgba(133, 133, 133, 0.9) !important;
    list-style-type: none;
    padding: 0;
}
ul.sideBar li{
    padding:0 !important;
    border-bottom: 1px solid #eee;
}
ul.sideBar li a{
    background-color:#fff !important;
    color:green !important;
    width:100%;
    height:100%;
    display: block;
    padding:15px;
    text-decoration: none;
    
}
ul.sideBar li a:hover{
    background-color:rgba(125, 180, 2, 0.9) !important;
    color: #fff !important;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}
ul.sideBar li a.slideBack{
    color:#999 !important;
}
ul.sideBar li a.slideBack:hover{
    background-color:rgba(39, 125, 44, 0.9) !important;
    color: #fff !important;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}
.wrapperSlide {
    margin: 10px auto 0;
    max-width: 1000px;
    width: 100%;
}

/*-----PHOTO SORT-----*/
.loopPhoto{
	cursor:move;
	/*---SHADOW---*/
        -moz-box-shadow: 1px 3px 7px #202020;
        -webkit-box-shadow: 1px 3px 7px #202020;
        box-shadow: 1px 3px 7px #202020; /* For IE 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#202020')"; /* For IE 5.5 - 7 */
        filter: progid:DXImageTransform.Microsoft.Shadow(Strength = 4, Direction = 135, Color = '#202020');
        display:inline-block; 
        vertical-align:top;
	margin:8px;
	background-color:#eee;
        padding:2px;
	width:110px;
        height:110px;
	position: relative;
}
.photoSort ul{
	list-style-type:none;
}
button.removeImg{
    position: absolute;
    top:-5px;
    right:-5px;
    z-index: 888;
}

/*------SLIDER BLOCK--------*/
.sliderContainer{
    position: relative; margin: 0 auto;
    top: 0px; left: 0px; width: 1300px; height: 450px; overflow: hidden;
}
.loadingSet{
    position: absolute; top: 0px; left: 0px;
}
.loadingFilter{
    filter: alpha(opacity=70); opacity: 0.7; position: absolute; display: block;
    top: 0px; left: 0px; width: 100%; height: 100%;
}
.loaderImage{
    position: absolute; display: block; 
    background: url(../images/loading.gif) no-repeat center center; 
    top: 0px; left: 0px; width: 100%; height: 100%;
}
.slideMain{
    cursor: move;
    position: absolute; 
    left: 0px; 
    top: 0px; 
    width: 1300px;
    height: 450px; 
    overflow: hidden;
}
.slideTextLeft{
    font-family: 'Proza Libre', sans-serif;
    position: absolute; 
    width: 450px; 
    height: 120px; 
    top: 30px; 
    left: 80px; 
    padding: 5px;
    text-align: left; 
    line-height: 60px; 
    font-size: 2.8em;
    color: rgb(255, 255, 255);
    text-shadow: rgb(3, 3, 3) -1px 0px 4px,-1px 1px 0 #000,1px -1px 0 #000,1px 1px 0 #000;
    font-weight:bold;
}
.slideTextRight{
    font-family: 'Proza Libre', sans-serif;
    position: absolute; 
    width: 450px; 
    height: 120px; 
    top: 30px; 
    right: 80px; 
    padding: 5px;
    text-align: right; 
    line-height: 60px; 
    font-size: 2.8em;
    color: rgb(255, 255, 255);
    text-shadow: rgb(3, 3, 3) -1px 0px 4px,-1px 1px 0 #000,1px -1px 0 #000,1px 1px 0 #000;
    font-weight: bold;
}
.breakLine{
    width:100%;
    height:20px;
}
button.linkBtn{
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border:3px solid #fff;
    padding:10px 25px;
}
button.linkBtn:hover{
    border:3px solid #f63838;
    background-color: #fff;
    color:#f63838;
}
button.linkBtnGrey{
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border:3px solid #ccc;
    padding:7px 20px;
}
button.linkBtnGrey:hover{
    border:3px solid #f63838;
    background-color: #eee;
}
.imageOverflow{
    width:100%;
    height:150px;
    margin: 0 auto 5px auto;
    background: #fff;
    overflow:hidden;
    text-align: center;
    position: relative;
}
.imageOverflow img{
    position:absolute;
    max-width:350px !important;
    bottom: -50%;
}
.imageBoxSlider{
    width:100%;
    height:185px;
    margin: 0 auto 5px auto;
    background: #fff;
    overflow:hidden;
    text-align: center;
    position: relative;
}
.imageBoxSlider img{
    position:absolute;
    max-width:250px !important;
    bottom: 0;
}
.imgFloat{
    display: inline-block;
    vertical-align: middle;
}
.imageBox img{
    display: inline-block;
    vertical-align: middle;
    margin:auto;
    position: relative;
}


/*------BOXES--------------*/
.boxA{
    background-color: #80B600;
    color:#fff;
    height:320px !important;
}
.boxA i.gearSize{
    font-size:10em;
}
.boxA button.btnSet{
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border:3px solid #fff;
    background-color: #80B600 !important;
    font-size:1em;
    padding:10px 25px;
    margin:10px auto;
}
.boxA button.btnSet:hover{
    border:3px solid #fff;
    background-color: #549014 !important;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}
.boxB{
    background-color: #549014;
    color:#fff;
    height:320px !important;
}
.boxB button.btnSet{
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border:3px solid #fff;
    background-color: #549014 !important;
    font-size:1em;
    padding:10px 25px;
    margin:10px auto;
}
.boxB button.btnSet:hover{
    border:3px solid #fff;
    background-color: #80B600 !important;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}
.boxC{
    background-color: #E6E6E6;
    color:#277D2C;
    height:320px !important;
}
.boxC button.btnSet{
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border:3px solid #277D2C;
    background-color: #E6E6E6 !important;
    font-size:1em;
    padding:10px 25px;
    margin:10px auto;
    color:#277D2C;
    font-weight:bold;
}
.boxC button.btnSet:hover{
    border:3px solid #fff;
    background-color: #277D2C !important;
    color:#fff;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

/*-------PHOTO PREVIEWS------*/
.galleryBar{
    width:100%;
    padding:10px 0 0;
    text-align: center;
    margin:10px 0;
}
.galleryBar h3{
    margin:5px 0;
    color:#fff;   
}
.centralBar{
    text-align:center;
    background-image: url(../images/more-photos-bgd.jpg);
    background-repeat: repeat-x;
    background-position: center left;
}
.centralBar a.btnSet{
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border:3px solid #fff;
    background-color: gold !important;
    font-size:1.2em;
    padding:10px 25px;
    margin:10px auto;
    color:#000;
    font-weight:bold;
}
.centralBar a.btnSet:hover{
    border:3px solid #fff;
    background-color: goldenrod !important;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
    color:#fff;
}

/*------INFORMATION-----------*/
p.infoText{
    font-size: 1.3em;
}
p.infoText span.text-success{
    font-weight: bold;
}
hr.lineColor{
    border-color:#000;
}

/*-----FOOTER-----------*/
.footer{
    width:100%;
    background-color: #333333;
    color:#fff;
    font-family: 'Quicksand', sans-serif;
    margin:5px 0 0;
    padding:10px 0 20px;
}
.footerWrap{
    width:100%;
    max-width: 1000px;
    margin: 0 auto;
}
.footerWrap h3{
    color: #BED120;
}
.footerWrap a{
    color: #6EB72A;
}
.footerWrap ul{
    padding:0 0 0 20px;
}
.footerWrap ul.knowmore{
    list-style-type: none !important;
}
.footerWrap ul li{
    padding:2px 0;
}
.footStandards{
    border-top: 1px solid #7D7D7D;
    margin:20px 0 10px;
    padding:15px 0;
    font-size:.8em;
    text-align: center;
    color:#7D7D7D;
}
.emailForm .form-control:focus{
    border-color:limegreen !important;
    box-shadow:0 0 8px rgba(110, 183, 42, 0.6) !important;
}
.emailForm input, .emailForm textarea{
    margin:2px 0 5px;
    background-color: #666666;
    border:none;
    color:#fff;
}
.emailForm button{
    background: transparent !important;
    color: #BED120 !important;
    font-weight: bold !important;
    padding:0 !important;
    border:none !important;
    font-size:1.6em; 
}
.emailForm button:hover{
    color: #6EB72A !important;
}

/*------RIBBONSET-----------*/
.box {
  position: relative;
}
.ribbon {
  position: absolute;
  right: -5px; top: -5px;
  z-index: 1;
  overflow: hidden;
  width: 75px; height: 75px;
  text-align: right;
}
.ribbon span {
  font-size: 12px;
  font-weight: bold;
  color: #FFF;
  text-align: center;
  line-height: 20px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  width: 100px;
  display: block;
  background: #79A70A;
  background: linear-gradient(#195C03 0%, #368A18 100%);
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 19px; right: -21px;
}
.ribbon span::before {
  content: "";
  position: absolute; left: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid #368A18;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #368A18;
}
.ribbon span::after {
  content: "";
  position: absolute; right: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid transparent;
  border-right: 3px solid #368A18;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #368A18;
}

/*---------------FOR PAGINATION---------------*/
/*---------------NAVIGATE PAGE----*/
#paging_containerAcc .no_more{
    background:transparent;
    color: gray;
    cursor: default;
}

.page_navigationAcc a, .alt_page_navigation a{
	padding:0 4px 0 4px;
	margin:0 4px 0 4px;
	color:#202020;
	text-decoration:none;
	display:inline-block;
	background:transparent;
}
.info_textAcc{
    width:100%; font-size:.85em; height:20px; border-top:1px solid #ccc; margin:0; padding:5px 0 0 0;
}
.page_navigationAcc{
    font-size:1.2em; width:100%; height:20px; padding:5px 0 10px 0;
}

.alt_page_navigationAcc{
	padding:0;
	margin:0;
}

.active_page{
	background:transparent !important;
	color:#4A5DFF !important;
}	
.contentAcc, .alt_content{
	color: black;
}

.contentAcc li, .alt_content li, .contentAcc > p{
	padding:0;
        margin:0;
}


ul.contentAcc{
    list-style-type:none;
}

/*------RESPONSIVENESS------*/
@media screen and (max-width:1024px){
    .header-bar{
        height:100px;
        background-size: 110% 100px;
    }
    .headHeight{
        height:100px;
    }
}
@media screen and (max-width:980px){
    
}
@media screen and (max-width:900px){
    
}
@media screen and (max-width:800px){
    ul.hide-on-mobile{
        display: none !important;
    }
    ul.hide-on-large{
        display: inline-block !important;
    }
    .menuRight{
        text-align:right;
    }
    .header-bar{
        height:80px;
        background-size: 120% 80px;
    }
    .headHeight{
        height:100px;
    }
}
@media screen and (max-width:640px){
    
}
@media screen and (max-width:600px){
    .header-bar{
        height:90px;
        background-size: 170% 90px;
    }
}
@media screen and (max-width:480px){
    .header-bar{
        height:70px;
        background-size: 200% 70px;
    }
}
@media screen and (max-width:360px){

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

}