/**
 * @file
 * Styles are organized using the SMACSS technique. @see http://smacss.com/book/
 *
 * When you turn on CSS aggregation at admin/config/development/performance, all
 * of these @include files will be combined into a single file.
 */

/* HTML element (SMACSS base) rules */
@import "normalize.css";

/* Layout rules */
/*@import "components/layouts/responsive.css";*/

/* Component (SMACSS module) rules */
/*@import "components/misc.css";*/
/* Optionally, add your own components here. */
@import "print.css";

/* SMACSS theme rules */
/* @import "theme-A.css"; */
/* @import "theme-B.css"; */

/* Styles */

@import "optional2.css";


/** Modified layout for POLL **/
/** Unfortunatelly, it does not take from this style.css source
    as the substitute for the original css file, located in modules
	and it doesnt work for POLL and WEBFORM MODULES and its CSS codes**/

.poll {
  overflow: hidden;
}
.poll .bar {
  height: 1em;
  margin: 8px 8px;
  background-color: #d4e4ec;
  box-shadow: 1px 6px 15px  #7a8384;
}
.poll .bar .foreground {
  background-color: #38bdef;
  height: 1em;
  float: left; /* LTR */
}
.poll .links {
  text-align: center;
}
.poll .percent {
  text-align: right; /* LTR */
}
.poll .total {
  text-align: left;
  font-size: 1.1em;
  margin-top: 30px;
}
.poll .vote-form {
  text-align: center;
}
.poll .vote-form .choices {
  text-align: left; /* LTR */
  margin: 0 auto;
  display: table;
}
.poll .vote-form .choices .title {
  font-weight: bold;
}
.node-form #edit-poll-more {
  margin: 0;
}
.node-form #poll-choice-table .form-text {
  display: inline;
  width: auto;
}
.node-form #poll-choice-table td.choice-flag {
  white-space: nowrap;
  width: 4em;
}
td.poll-chtext {
  width: 80%;
}
td.poll-chvotes .form-text {
  width: 85%;
}

p.big {
    line-height: 200%;
}



.first-text {
  font-size: 1.2rem;
  position: absolute;
  left: 2.5rem;
  top: 5rem;
  opacity: 0;
  animation-name: topFadeOut;
  animation-duration: 5s;
}

.second-text {
  font-size: 1.2rem;
  position: absolute;
  top: 8.5rem;
  opacity: 0;
  animation-name: rightFadeInOut;
  animation-delay: 3s;
  animation-duration: 6s;
}

.third-text {
  transform: rotate(-90deg);
  font-size: 1rem;
  position: absolute;
  left: 45%;
  top: 45%;
  opacity: 0;
  animation-name: topFadeOutVertical;
  animation-delay: 7.5s;
  animation-duration: 6s;
  white-space: nowrap;
}

.fourth-text {
  font-size: 1rem;
  position: absolute;
  top: 10.5rem;
  left: 10%;
  opacity: 0;
  animation-name: fadeInOut;
  animation-delay: 8.5s;
  animation-duration: 9s;
}

.fifth-text {
  font-size: 1rem;
  position: absolute;
  left: 5%;
  bottom: 25%;
  opacity: 0;
  animation-name: bottomFadeOut;
  animation-delay: 10s;
  animation-duration: 9s;
}
/********** end of animation for fade in and out text**********/



.language-switcher-locale-url li {
	display: inline-block;
	position: relative;
	padding: 7px 10px 7px 10px;
	z-index: 10;
    border: 1px solid #fff;
    background: #319b10;
	text-decoration: none;
}
.language-switcher-locale-url {
	display: block;
  width: 170px;
  float: right;
	margin-left: auto;
    margin-right: 3%;
  margin-top: -46px;
}
.language-switcher-locale-url li:hover {
	-webkit-transition: all 1.0s ease;
	-moz-transition: all 1.0s ease;
	-o-transition: all 1.0s ease;
   background: rgba(8, 8, 8, 0.9);
}
.language-switcher-locale-url li a {
	display: block;
	color: #fff;
	text-decoration: none;
}
.language-switcher-locale-url li a:hover {

}
.language-switcher-locale-url .active {
  background-color: #175504;
  box-shadow: 0px 0px 0px transparent;
  box-shadow: 0px 0px 0px transparent;
   transform: scaleY(1);
    max-width: 20px;
}
.language-switcher-locale-url .active:hover {
  background-color: rgba(8,0,0,0.5);
  box-shadow: 0px 0px 0px transparent;
  box-shadow: 0px 0px 0px transparent;
   transform: scaleY(1);
    max-width: 20px;
}  
@media(max-width: 500px){
.language-switcher-locale-url {
  float: right;
	margin-left: auto;
    margin-right: 20%;
  margin-top: -90px;
}
}
#webform-client-form-12,
#webform-client-form-11,
#webform-client-form-13 {
  margin-left: auto;
  margin-right: auto;
  max-width: 383px;
}

@media(max-width: 500px){
#webform-client-form-12,
#webform-client-form-11,
#webform-client-form-13 {
    max-width: 320px;
}
}
@media(max-width: 400px){
#webform-client-form-12,
#webform-client-form-11,
#webform-client-form-13 {
    max-width: 280px;
}
}
@media(max-width: 300px){
#webform-client-form-12,
#webform-client-form-11,
#webform-client-form-13 {
    max-width: 220px;
}
}


.field field-name-field-video-dir field-type-video-embed-field field-label-hidden,
.field-items,
.field-item even,
.embedded-video,
.player   {
  margin-left: 10%;
  margin-right: 10%;

}

/*-=-=-=-=-=-=-=-=-=-=-=- */
/* Column Grids */
/*-=-=-=-=-=-=-=-=-=-=-=- */
.col_half { width: 40%; }
.col_third { width: 32%; }
.col_fourth { width: 85%;
  font-size: 14px; 
  margin-top: 5px;
  margin-bottom: 0px;
    border: 1px solid #319b10;
  border-radius: 0%;
}

.col_fifth { width: 18.4%; }
.col_sixth { width: 15%; }
.col_three_fourth { width: 74.5%;}
.col_twothird{ width: 66%;}
.col_half,
.col_third,
.col_twothird,
.col_fourth,
.col_three_fourth,
.col_fifth{
	position: relative;
	display:inline;
	display: inline-block;
	float: left;
	margin-right: auto;
    margin-left: auto;
	margin-bottom: 0px;
    color: #319b10;
}
.col_fourth p { 
  color: rgba(8,0,0,1); 
  text-transform: uppercase;
  text-align: center;
}
.end { 
  margin-right: 0 !important; }
/* Column Grids End */

.wrappercount { 
  width: auto; 
  margin: 0px auto; 
  position: relative;}

.counter, .col_fourth { 
  background-color: rgba(255,255,255,0.8); 
  padding: 5px; 
  min-height: 125px;
  line-height: 1.1em;
  }
  @media(max-width: 1200px){
.counter {
    display: none;
	font-size: 0px:
}
}
.count-title { 
  font-size: 17px; 
  font-weight: bold; 
  margin-top: 10px;
  padding-top: 8px; 
  padding-bottom: 8px; 
  text-align: center; 
  border: 1px solid #319b10;
  max-width: 40%;
  margin-left: auto;
  margin-right: auto;
  border-radius: 30%;
}
.count-text { 
  font-size: 14px; 
  color: red;
  text-transform: uppercase;
  margin-top: 2px; 
  line-height: 1em;
  margin-bottom: 0; 
  text-align: center; }
.count-title h3 { 
  font-size: 12px; 
  color: #033e72;
  text-transform: uppercase;
  margin-top: 2px;  margin-bottom: 0; 
  text-align: center; }
.fa-2x { 
  margin: 0 auto; 
  float: none; 
  display: table; 
  color: #4ad1e5; }


@media(max-width: 1100px) {
.col_fourth { 
  width: 48%; 
  margin-right: 10px;
  height: auto;
	margin-bottom: 5px;
    min-height: 200px;
}
}
@media(max-width: 850px) {
.col_fourth { 
  width: 98%; 
  margin-right: auto;
  margin-left: auto;
  margin-right: 5px;
  height: auto;
	margin-bottom: 5px;
}
}
@media(max-width: 380px) {
.col_fourth { 
  width: 98%; 
  margin-right: auto;
  margin-left: auto;
  margin-right: 5px;
  height: 100px;
	margin-bottom: 5px;
}
}
@media(max-width: 850px) {
.counter { 
  padding: 40px 0; 
  min-height: 130px;
  line-height: 1.3em;
  }
  .count-title { 
  font-size: 20px; 
  font-weight: normal;  
  margin-top: 0px; 
  margin-bottom: 0; 
  text-align: center; }
.count-text { 
  font-size: 14px; 
  font-weight: normal;  
  margin-top: 0px; 
  margin-bottom: 0; 
  text-align: center; }
.fa-2x { 
  margin: 0 auto; 
  float: none; 
  display: table; 
  color: #4ad1e5; }
}
/*-=-=-=-=-=-=-=-=-=-=-=- */
/* END Column Grids */
/*-=-=-=-=-=-=-=-=-=-=-=- */