body {font-family: 'Open Sans', sans-serif;}

html {font-size: 14px;}

strong {font-weight:700}

a:hover {color:#b0b0b0;}

._searchBar {background:#d5d6b2; height: auto;}
._brandLogo {/*background:#ffffff; height: 140px; */}

._brandLogo h1 {margin: 0px; color: #316132; font-size: 5.5rem; /* margin-left: 3rem; */ float: left; font-weight: 200;}
._brandLogo h4 {margin: 0px; color: #316132; font-size: 1.1rem; font-weight: 500; float: left; position: relative; top: 41px; line-height: 1.15em; left: 3px;} 

._header-logo {
    background-image: url(/fileadmin/templates/gfoi/img/bg-header.png);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-color: #ffffff;
    /* background-blend-mode: difference; */
}

._header-logo .row {margin-bottom: 0px;}

._header-search .row {margin-bottom:0;}

/* ------
/* social icon */

#c554656 {float: right; position: relative; top: 3px; right: -6px;}
._social-icon {font-size:2rem; color:#858669; padding: 0px 4px; position: relative; top: 5px;}
._social-icon:hover {color:#858669; opacity: 0.8;}

/* --------------
/* search input */
#c554658 {position: relative;}
#c554658 input[type=text]:not(.browser-default) {width:95%; height:1.5em; margin: 10px 0 10px 0;background-color:#c7c89d;padding:8px 15px;border-radius:5px;}
._search-icon {position:absolute; font-size:1.3rem; top:15px; right:1px;}


/* home - videos */

#c554971 {clear: both;}

#c561842 {margin-left: -10px; margin-right: 10px;}

/* ------------------
/* nav desktop-demo */

nav {background:#316132; /* margin-bottom: 80px;*/ }
nav:before {display: content; clear: both; content:'';}

li#_87030 {display: none;}

li#_86988 a.dropdown-button {background:rgb(255, 99, 0) none repeat scroll 0% 0%;}
/* logout */
li#_86989 a {color:#cc0000; font-weight: bold;}

/*
nav ul a {padding:13px 15px;}

nav ul.desktop-vers a {display: initial;}
nav ul.desktop-vers li {float: none; display: inline;}
nav ul.desktop-vers li:not(:last-child):after {
  content: '|';
  position: relative; 
  top: -2px; 
  padding-right: 0px; 
  color: #fff;
}
*/

nav ul.desktop-vers li._icon-home a {font-size: 1.25rem;}



/* ----------
/* language  */

._languageBar ul li {display: inline; font-size:0.89rem;}
._languageBar ul li:not(:last-child):after {content: '|'; position: relative; top: 0px; padding-right: 8px; color:#c0c0c0;}

._languageBar ._mobilelang ul li {font-size:1.1rem;}
._languageBar ._mobilelang ul li a {padding: 0 9px 0 3px;}
._languageBar ._mobilelang ul li:not(:last-child):after {top: -1px;}

/* --------------------
/* language - mobile  */

._languageBar ul li a {padding: 0 11px 0 6px;}

.card-panel {margin: .5rem 0 2.5rem 0}

.card h3,
.card-panel h3 {font-size: 1.4rem; margin-top: 0px;}

.card-panel .csc-textpic-imagewrap {width:100% !important;}
.card-panel .csc-textpic-imagewrap img {width:100% !important; height: auto !important;}

.card-panel._lightgreen {background-color:#f7f8eb;}
.card-panel._darkgreen {background-color:#316132; color:#ffffff;}


#c558533, 
#c564156 {max-width: 790px;}


/* --------------
/* main column */

h1 {font-size: 2.3rem; margin: 1rem 0 2.5rem 0;}
h2 {font-size: 2.05rem;}
h3 {}
h4 {font-size: 1.4rem;}
h5 {font-size: 1.2rem;}
h6 {font-weight: 600;}



._main-content h3 {font-weight: 500; color: #316132}
._main-content .csc-default h3 {font-size: 1.4rem; border-top: 2px solid #c8ca97; padding-top: 5px;}

._main-content ul {list-style-type: disc; padding-left: 40px;}
._main-content ul li {list-style-type: disc;}

._main-content .indent ul {padding-left: 80px;}
._main-content .indent ul li {list-style-type: circle;}

/* --------------
/* right column */

._col-right .card-panel h3 {font-size: 1.4rem; line-height: normal; margin: 0; color: #316132; font-weight: 500;}
._col-right .card-panel._lightgreen {}


/* ---------
/* footer */

.page-footer {background:#316132; border-top: 5px solid #d5d6b2;}
.page-footer img.logo-footer {width:23rem;}

.page-footer ul._footer-detail {font-size: 0.89rem;}

/* ----------
/* dyna fef */

#dyna_fef_page {max-width:710px;}

#dyna_fef_page textarea {height: auto;}

div#dyna_fef_page .dyna_form_field {margin-top: 25px;}
div#dyna_fef_page .dyna_form_label {font-weight: 600;}
div#dyna_fef_page .dyna_form_data input {font-size: inherit !important; padding: inherit !important; margin: inherit !important;}

div#dyna_fef_page .dyna_form_data input.error,
div#dyna_fef_page .dyna_form_data .error {color:#cc0000; border-bottom:1px solid #cc0000; font-weight: 600;}
div#dyna_fef_page .dyna_form_data label.error {border-bottom: none !important;}

div#dyna_fef_page .dynafef_display_error-title,
div#dyna_fef_page .dynafef_display_error-text,
div#dyna_fef_page .dynafef_display_error-bottom {background: none !important;}

div#dyna_fef_page .dynafef_display_error-text ul li {background-image: none !important;}

div#dyna_fef_page .dyna_form_data_type_calendar img.dyna_form_input-calendar-icon {float: right; position: relative; top: -35px;}
div#dyna_fef_page .dyna_form_data_type_calendar img.dyna_form_input-calendar-icon:hover {cursor: pointer;}

div#dyna_fef_page .dynafef_actions_box {text-align: center;}
div#dyna_fef_page .dynafef_actions_box div {display: inline;}
div#dyna_fef_page .dynafef_actions_box div input {float: none !important; margin: 40px 0 50px 0; text-decoration: none; color: #fff; background-color: #a63c26; text-align: center; letter-spacing: .5px; font-size: 0.9rem; border: none; padding: 7px 15px;}

div#dyna_fef_page .dynafef_actions_box div#div_delete_button input {background: #888;}
div#dyna_fef_page .dynafef_actions_box div input:hover {opacity: 0.8;}


#dyna_fef_page td.dynafef_image_gallery_fields input {opacity: 1; pointer-events: auto;}





form#id_form_dyna_fee div.dyna_form_data input {background: #f9f9f9; padding: 0px 10px !important;}

.tx-dynafef-pi3 div.dyna_form_data input {max-width: 90%;}

.select-wrapper span.caret {z-index:999;}


/* materialize customization */

/* nav bar - submenu */
.dropdown-content {min-width:205px;}

.dropdown-content li {min-height: 39px;}
.dropdown-content li > a, .dropdown-content li > span {font-size:0.9rem; color:#000000; padding: 8px 16px;}

.dyna_form_data .dropdown-content li>a, 
.dyna_form_data .dropdown-content li>span {color:#000000; font-size: inherit;}

#divcheckbox_related.dyna_form_data [type="checkbox"]:not(:checked), 
#divcheckbox_related.dyna_form_data [type="checkbox"]:checked {opacity: 1 !important; pointer-events: auto;} 

#divcheckbox_related.dyna_form_data span {display: block; left: 22px; top: -4px; position: relative;}


/* ----------
/* dyna list */

.tx-dynalist-pi1 .title h4, 
.tx-dynalist-pi1 .list-title h4 {margin-top: 0.2rem; font-size: 1.4rem; margin-bottom: 0.5rem;}
.tx-dynalist-pi1 .type {color: #c3c3c3; text-transform: uppercase; font-size: 0.9rem; margin-bottom: 0.5rem; margin-top: -0.4rem;}
.tx-dynalist-pi1 .lng-buttons {text-align: right; font-weight: 600; text-transform: uppercase; font-size: 0.8rem; margin-top: 5px;}
.tx-dynalist-pi1 .lng-buttons span {padding: 5px 10px; color:#ffffff; margin-right: 1px;}
.tx-dynalist-pi1 .lng-buttons span.highlight {background:#f6f6f6; padding: 5px 7px; margin-right: 4px;}
.tx-dynalist-pi1 .lng-buttons span.highlight i {color:#606060; font-size: 1.5rem; position: relative; top: 5px;}
.tx-dynalist-pi1 .lng-buttons span.published {background:#008d2e;}
.tx-dynalist-pi1 .lng-buttons span.draft {background:#ff6600;}
.tx-dynalist-pi1 .lng-buttons img {margin: 0px 3px;}
.tx-dynalist-pi1 .lng-buttons a {background: #f6f6f6; padding: 5px 8px; color: #0798c8; color:#606060;}
.tx-dynalist-pi1 .lng-buttons a:hover {background: #e8e8e8;}
.tx-dynalist-pi1 .lng-buttons a i {font-size: 1.5rem; position: relative; top: 5px;}
.tx-dynalist-pi1 .lng-buttons a i.fa-trash-o {top:4px; /* color:#606060; */}
/*.tx-dynalist-pi1 .lng-buttons a i.fa-pencil-square-o { color:#e18700; }*/


.tx-dynalist-pi1 .content {font-size: 0.96rem; line-height: 1.3rem;}

.tx-dynalist-pi1 .divider {margin-bottom: 1.5rem;}

.tx-dynalist-pi1 .event-calendar .rom {margin-bottom: 0.8rem;}

.tx-dynalist-pi1 .event-calendar h4 {font-size: 1.1rem; margin: 0px;}

.tx-dynalist-pi1 .event-calendar .list-date {color: #c50000; text-align: center; min-width: 30px; margin-top: -4px;}
.tx-dynalist-pi1 .event-calendar .list-date #month {font-size: 1.1rem; display: block; color: #343434;}
.tx-dynalist-pi1 .event-calendar .list-date #day {font-size: 1.4rem; display: block; margin-top: -7px;}

.tx-dynalist-pi1 .event-calendar .divider {display: none;}

.tx-dynalist-pi1 .video-home .list-title {background: rgba(0,0,0,0.8); padding: 0.5rem 1rem; margin-top: -5px; margin-bottom: 1.2rem;}
.tx-dynalist-pi1 .video-home .list-title h4 {font-size: 1.1rem;}
.tx-dynalist-pi1 .video-home .list-title h4 a {color:#ffffff;}

.tx-dynalist-pi1-langtool {width: auto;}
.tx-dynalist-pi1-langtool td {background-image: none !important;}

#c561552 h5 {border-top: 1px solid #717171; margin-top: 1.5em; padding-top: 0.4em; margin-bottom: 1.2em;}

#c561842 .tx-dynalist-pi1 .title h4, 
#c561727 .tx-dynalist-pi1 .title h4 {margin-top: 0.5rem; margin-bottom: 0.7rem;}

.detail_image img {max-width: 600px; width: 100%;}

/* --------- Slick SLICK GALLERY */

.full-resp-gallery {width: 100%; max-height: 400px; float: left; overflow: hidden; margin-right: 0px; margin-top:1px;}

.full-resp-gallery div {overflow:hidden; max-height: 400px;}
.full-resp-gallery img {width:100%; height: auto; margin: 0px;}

.full-resp-gallery .fa-angle-left, 
.full-resp-gallery .fa-angle-right {
    font-size: 0;
    line-height: 0;
    position: absolute;
    display: block;
    z-index: 99;
    /* background: rgba(0, 0, 0, 0.3); */
    height: 400px;
    top: 200px;
    width: 30px;
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
}

.full-resp-gallery .fa-angle-left:hover, 
.full-resp-gallery .fa-angle-right:hover {background: rgba(0, 0, 0, 0.3);}

.full-resp-gallery .fa-angle-left:before, 
.full-resp-gallery .fa-angle-right:before {
    content: "\f105";
    color: #ffffff;
    top: 50%;
    position: relative;
    left: 9px;
    font-size: 35px;
}
.full-resp-gallery .fa-angle-left:before {
    content: "\f104";
}

.full-resp-gallery .fa-angle-left {left: 0px;}
.full-resp-gallery .fa-angle-right {right: 0px;}

.full-resp-gallery .slick-cont {position: relative; width: 258px;}
.full-resp-gallery .slick-cont .caption {
    position: absolute; 
    min-height: 84px; 
    bottom: 0; 
    background: rgba(0,0,0,0.5);
    color: #ffffff; 
    width: 100%; 
    padding: 20px 25px; 
    font-size: 1.5rem; 
    font-weight: 600; 
    text-shadow:3px 3px 1px rgba(0,0,0,1)
    text-align: center; 
    text-transform: uppercase;
}

.full-resp-gallery .slick-cont .caption-text {margin: 0 auto; max-width:80%;}

.slick-dots {/* z-index:999999 !important;*/ text-align: right !important; top: 2px; right: 30px;}
.slick-dots li {margin: 0px 2px !important;}
.slick-dots li.slick-active button:before {color:#ffffff !important; opacity: 1 !important;}
.slick-dots li button:before {font-size: 1rem !important; opacity: .35 !important; color: white !important;}

.slick-dotted.slick-slider {margin-bottom: 0px !important;}

/*
#c589715 .csc-textpic-image {width:100% !important; max-width: 130px;}
#c589715 .csc-textpic-image img {width:100% !important; height: auto !important;}
*/ 

.responsive {width: 100%; max-height: 100px; float: left; overflow: hidden; margin-right: 0px;}

.responsive div {/*overflow:hidden; max-height: 196px;*/}
.responsive img {width:90%; max-width: 258px; height: auto; max-height: 100px; margin: 0px 15px;}

.responsive .fa-angle-left, 
.responsive .fa-angle-right {
    font-size: 0;
    line-height: 0;
    position: absolute;
    display: block;
    z-index: 99;
    background: rgba(255, 255, 255, 1);
    height: 100px;
    top: 46px;
    width: 15px;
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
}

.responsive .fa-angle-left:hover, 
.responsive .fa-angle-right:hover {background: rgba(255, 255, 255, 0.8);}

.responsive .fa-angle-left:before, 
.responsive .fa-angle-right:before {
    content: "\f105";
    color: #808080;
    top: 45%;
    position: relative;
    left: 4px;
    font-size: 35px;
}
.responsive .fa-angle-left:before {
    content: "\f104";
}

.responsive .fa-angle-left {left: 0px;}
.responsive .fa-angle-right {right: 0px;}

.responsive .slick-cont {position: relative; width: 258px;}
.responsive .slick-cont .caption {
    position: absolute; 
    min-height: 84px; 
    bottom: 0; 
    /* background: rgba(0,0,0,0.3); */ 
    color: #ffffff; 
    width: auto; 
    padding: 20px 25px; 
    font-size: 1.1em; 
    font-weight: 600; 
    text-shadow:1px 1px 3px rgba(0,0,0,0.3)
}
 



.borderContent {
    /*max-width:1280px;*/
    width:70%;
    margin:0 auto;
    /* The background image */

    /* background: rgba(0, 0, 0, 0) url("/fileadmin/templates/gfoi/img/GFOI_background_photo.jpg") repeat fixed 50% 40px; */
    background: rgba(0, 0, 0, 0) url("/fileadmin/templates/gfoi/img/GFOI_background_photo.jpg") no-repeat center center;
    /*background-size: cover;-9
    min-height: 400px;
    border-top: 1px solid #fff;
  
    /* background-image: url("/fileadmin/templates/gfoi/img/GFOI_background_photo.jpg"); */
    /* background-image: url("/fileadmin/templates/gfoi/img/GFOI_background_photo.jpg"); */
    /* background-image: url("https://4.bp.blogspot.com/_AQ0vcRxFu0A/S9shDGGyMTI/AAAAAAAAAYk/kn3WTkY2LoQ/s1600/IMG_0714.JPG"); */
    /* background-image: url("http://www.psyncgroup.com/wp-content/uploads/2015/04/Tech-1.jpg"); */
    
    /* Set a specified height, or the minimum height for the background image */
  
    /* Set background image to fixed (don't scroll along with the page) 
    background-attachment: fixed;
    /* Center the background image 
    background-position: center;
    /* Set the background image to no repeat 
    background-repeat: no-repeat;
    /* Scale the background image to be as large as possible 
    background-size: cover;
    */
}

.borderContent .short-text {margin: 0 auto; max-width: 1280px; position: relative; min-height: 400px;}

.borderContent p {background: rgba(0,0,0,0.6); display: block; color: #fff; max-width: 900px; width: 70%; padding: 1em; position: absolute; bottom: 0px;}


.dropdown-menu {
  background-color:#fbfbfb;
  }

.dropdown-menu li {
  margin-left:2em;
  }

.dropdown-menu li a {
  padding:7px 20px;
  height:auto;
  line-height:30px;
  }

.dropdown-menu li.sub-active {
  background-color:#f2f2f2;
  }

/* ---------------
/* MEDIA QUERIES */

@media only screen and (min-width: 601px) {
    
    nav, nav .nav-wrapper i, nav a.button-collapse, nav a.button-collapse i {height: 45px; line-height: 45px;}

}

@media only screen and (max-width: 620px) {
    
    .full-resp-gallery {display: none !important;}
    .borderContent p {margin-left: 0; width: 100%; margin-top: 11em;}
    
     dl.csc-textpic-image,
     li.csc-textpic-image {
      width:auto !important;
      margin-right:0 !important;
     }

     dl.csc-textpic-image img,
     li.csc-textpic-image img {
      width:100% !important;
      height:auto;
      }


    DIV.csc-textpic DIV.csc-textpic-single-image IMG {
      width:100% !important;
      height:auto;
  }
}

@media only screen and (max-width: 480px) {
    
    .responsive img {width: 100%;}

}

@media only screen and (max-width: 992px)  {
    
    DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap {float: none;}
    
}
