@charset "utf-8";
/* CSS Document */
body{width: 100%;font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;background-color: #FFFFFF;margin: 0;}/* Container */.container{width: 98%;margin-left: auto;margin-right: auto}/* 
Define this in your CSS 
.bgColor = Replace it by the name you want to give your animation
.bgAnimObj = Assign this class to the object you want to apply the effect
*/
.container {
	background:#E3F4FC;
	/* Chrome, Safari */
	-webkit-animation: bgColor 5s;
	/* Firefox */
	-moz-animation: bgColor 5s;
	/* Standard Syntax */
	animation: bgColor 5s;
}

	.dropbtn {width: 100%;
  background-color: #04AA6D;
  color: white;padding: 2px;
text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  transition-duration: 0.4s;
  cursor: pointer;}

.dropbtn:hover, .dropbtn:focus {
  background-color: #3e8e41;
}


.dropdown {width: 80%;margin-left: 10%;
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color:#8B8B8B;
  width: 100%;font-size: 14px;color:#fff;
  overflow: auto;
  border: 1px solid #ddd;
  z-index: 10000;
}
.dropdown-content a {
  padding: 3px 8px;font-size: 14px;color:#fff;
  display: block;
}
.dropdown a:hover {background-color: #ddd;font-size:14px;color: #000000}

.show {display: block;}

	


/* 
Define the keyframe and changes
*/
/* Chrome, Safari */
@-webkit-keyframes bgColor {
	from {
 		background:#E3F4FC;
	} 
	to {
 		background: #ebebeb;
	}
}
/* Firefox */
@-moz-keyframes bgColor {
    from {
        background:#E3F4FC;
    }
    to {
        background: #ebebeb;
    }
}

/* Standard syntax */
@keyframes bgColor {
	from {
		background:#E3F4FC;
	}
	to {
		background: #ebebeb;
	}
}/* Header */header{width: 100%;}.logo{margin-left: auto;margin-right: auto;text-align: center;padding-top: 5px;line-height: 2em;font-size: 22px;}.hero_header{color: #FFFFFF;text-align: center;font-family: Arial;font-size: 1.5em;margin: 0;letter-spacing: 2px;}/* About Section */.text_column{width: 90%;text-align: right;font-weight: lighter;line-height: 25px;direction: rtl; padding-left: 20px;padding-right: 20px;color: #A3A3A3;}.gallery{clear: both;display: inline-block;width: 100%;background-color: #FFFFFF;/* [disabled]min-width: 400px;*/padding-bottom: 35px;padding-top: 0px;margin-top: -5px;margin-bottom: 0px;}.thumbnail{width: 18%;text-align: center;float: right;margin-top: 35px;background-color: #F8F8F8;padding-bottom: 20px;margin-left: 1%;margin-right: 1%;border-radius: 3px;padding-top: 20px;padding: 15px 5px 20px 0px;border-bottom: 4px solid #6DC7D0;}.thumbnail img{width: 82%;}.gallery .thumbnail h4{margin-top: 5px;margin-bottom: 5px;color: #fff;text-align: center;padding-left: 20px;padding-right: 20px;font-family: Arial; font-size:1.5em; font-color: #FFFFFF;}.gallery .thumbnail p{margin: 0;color:#151515;font-family:Arial;text-align: center;font-size :0.9em;font-weight:bold;padding-right: 20px;}/* More info */.intro{background-color: #FFFFFF;padding-bottom: 35px;background:url("../images/SKIII.jpg");padding-top:80px;background-repeat:no-repeat;background-size: cover ;width: 100%}.column{direction: rtl;width: 50%;text-align: center;padding-top: 20px;float: left;}.intro .column h3{color:#1A0FDB;font-family:abril "abril-fatface";text-align: center;}.intro .column p{color: #F24911;font-family: arial;}.cards{width: 85%;height: auto;max-width: 400px;max-height: 100px;}.intro .column p{text-align: justify;line-height: 25px;font-weight: bold;margin:0px 60px 0px 0px ;width: 80%;margin-top: 4%;}.button{width: 200px;margin-top: 5px;margin-right: auto;margin-bottom: auto;margin-left: auto;padding-top: 20px;padding-right: 10px;padding-bottom: 20px;padding-left: 10px;text-align: center;vertical-align: middle;border-radius: 0px;text-transform: uppercase;font-weight: bold;font-family: Arial;font-size:1.5em;letter-spacing: 2px;border: 3px solid #FFFFFF;color: #FFFFFF;transition: all 0.3s linear;}.button:hover{background-color:#1F0DF0;color: #FFFFFF;cursor: pointer;}.copyright{text-align: center;padding-top: 20px;padding-bottom: 20px;background-color: #717070;color: #FFFFFF;text-transform: uppercase;font-weight: lighter;letter-spacing: 2px;border-top-width: 2px;}footer{background-color:#E7570A;padding-top:3px;padding-bottom: 3PX;}.intro{display: inline-block;background-color: #FFF;}.profile{width:80%;}.gallery .thumbnail .tag{color: #5D5E5D;padding-bottom: 4px;padding-top: 4px;text-align: center;padding-left: 20px;padding-right: 20px;font-family: Arial;font-weight: bold;}a{text-decoration: none;}/* Mobile */@media (max-width: 320px){.logo{width: 90%;text-align: center;margin-top: 5px;margin-right: 0px;margin-bottom: 0px;margin-left: 0px;}.text_column{width: 100%;text-align: justify;padding: 0;}.intro .column p{width: 80%;margin-left: 0px;text-align: justify;line-height: 15px;font-weight: lighter;font-size:0.8em;margin-top: 2%;}.text_column{padding-left: 20px;}.thumbnail{width: 100%;}.thumbnail img{width:40%;}.column{width: 100%;margin-top: 0px;}.hero_header{padding-left: 10px;padding-right: 10px;line-height: 22px;text-align: center;}.cards{width: 60%;height: auto;max-width: 400px;max-height: 100px;}}/* Small Tablets */@media (min-width: 321px)and (max-width: 767px){.button1 p{font-size: 0.5em;}.logo{width: 50%;align-items: center;margin-top: 18px;margin-right: 0px;margin-bottom: 0px;margin-left: 0px;}.text_column{width: 100%;text-align: left;padding: 0;}.thumbnail{width: 100%;}.thumbnail img{width:40%;}.column{width: 100%;margin-top: 0px;}.text_column{padding-left: 20px;padding-right: 20px;width: 90%;}.column{width: 100%;margin-left: 0px;margin-right: 0px;}.profile{width: 100%;}.column p{padding-left:5%;}.intro .column p{width: 80%;margin-left: 0px;text-align: justify;line-height: 15px;font-weight: bold;font-size:0.8em;margin-top: 2%;}.cards{width: 40%;height: auto;max-width: 400px;max-height: 100px;}}/* Small Desktops */@media (min-width: 768px) and (max-width: 1096px){.text_column{width: 100%;}.cards{width: 25%;height: auto;max-width: 400px;max-height: 100px;}.thumbnail{width: 100%;}.text_column{width: 90%;margin: 0;padding: 20px;}.intro .column p{width: 80%;}}.footer{width:100%;position:relative;height:auto;background-color:#0412BF;direction: rtl;font-family: Arial}.footer .col{width:190px;height:auto;float:right;box-sizing:border-box;padding:0 20px 20px}.footer .col h1{margin:0;font-family:inherit;font-size:12px;line-height:17px;padding:20px 0 5px;color:#FFF;font-weight:400;text-transform:uppercase;letter-spacing:.25em}.footer .col ul{list-style-type:none;margin:0;padding:0}.footer .col ul li{color:#FFF;font-size:11px;font-family:inherit;font-weight:700;padding:5px 0;cursor:pointer;transition:.2s}.footer .col ul li a{color:#FFF}.footer .col img{max-width:80%;}.social ul li{display:inline-block;padding-right:1px!important}.footer .col ul li:hover{color:#C1F8C5;transition:.1s}.clearfix{clear:both}@media only screen and (min-width: 1280px){.col{width:1200px;margin:0 auto}}@media only screen and (max-width: 1139px){.col.social{width:1000px;display:block}.social h1{margin:0}}@media only screen and (max-width: 950px){.footer .col{width:33%}.footer .col h1{font-size:14px}.footer .col ul li{font-size:13px}}@media only screen and (max-width: 500px){.footer .col{width:50%}.footer .col h1{font-size:13px}.footer .col ul li{font-size:11px}}@media only screen and (max-width: 340px){.footer .col{width:100%}}
.span_3_of_3 {
width: 100%;
}
.span_2_of_3 {
width: 66.1%;
}
.span_1_of_3 {
width: 32.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
.col1 { margin: 1% 0 1% 0%;}
.col { margin: 1% 0 1% 0%;}.column { margin: 1% 0 1% 0%;}
.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
.section {font-size: 0.8em; font-weight:600;}
}
.jpg {
width: 80%;
}
.section { direction: rtl;
clear: both;
margin: 0px;background-image:linear-gradient(90deg,#45CD4E 0,#0B8F13);
padding:2rem 0 5rem 0;
color: #fff;
-webkit-clip-path: polygon(100% 100%,100% 0,-400% 0);
clip-path: polygon(100% 100%,100% 0,-400% 0);
}
.section a{font-weight: bold;color: #FFFFFF;font-size: 0.8em}
/*  COLUMN SETUP  */
.col1 {
display: block;
float:right;
margin: 1% 0 1% 1.6%;
}
.col1,.column:first-child { margin-left: 0; }
.section .span_1_of_3{padding-right:2.5%;}	
.col {
display: block;
float:left;
margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }
/*  GROUPING  */
.group:before,
.group:after {
content:"";
display:table;
}
.group:after {
clear:both;
}
.group {
zoom:1; /* For IE 6/7 */
}
@media(max-width:800px){
.c{
    position: relative;
    display: inline-block;
    width: 100%;
}
table.responsive{width:100%;display:block;margin-bottom:20px}
}
@media(min-width:1008px) and (max-width:1920px){table.responsive{width:100%;clear:right;display:block}
thead tr th{background:#fff;text-align:center;color:#ff272a;font-size:1.3em;border:.02px solid #040b69}
th,td{padding:0 10px;background:#fff}
	tbody th,tbody td{border:.02px solid #eb2800;text-align:center;color:#0f01ab}
}
*
.c{clear:none;width:100%}
table.responsive{max-width:100%;align-self:center;display:block;background:#fff;font-size:1.2em}
thead tr th{background:#D9D9D9;text-align:center;color:#ff272a;font-size:1em;border:.02px solid #040b69}
th,td{padding:0 10px;background:#fff}
tbody th,tbody td{width:1%;border:.02px solid #eb2800;color:#0f01ab;font-size:0.8em}
* {
  box-sizing: border-box;
}

body {
  font-family: 'Arial';
}
.heading-primary {
  font-size: 2em;
  padding: 2em;
  text-align: center;
}
.accordion dl,
.accordion-list {
  border: 1px solid #ddd;
}
.accordion dl:after,
.accordion-list:after {
  content: "";
  display: block;
  height: 0.5em;
  width: 100%;
  background-color:#000A8E;
}

.accordion dd,
.accordion__panel {
  background-color: #eee;
  font-size: 1em;
  line-height: 1.5em;
  max-height: 100%;
}

.accordion p {
  padding: 1em 2em 1em 2em;
}

.accordion {
  position: relative;
  background-color:#EFFFD4;
width: 100%;
}
.accordion ul,ol,il {
	 padding: 1em 2em 1em 2em;
}
.accordion.container {
  max-width: 100%;
  margin: 0 auto;
  padding: 2em 0 2em 0;
}
.accordionTitle,
.accordion__Heading {
  background-color:#00087C;
  text-align: right;
  font-weight: 700;
  padding:0.8em;
  display: block;
  text-decoration: none;
  color: #fff;
  -webkit-transition: background-color 0.5s ease-in-out;
  transition: background-color 0.5s ease-in-out;
  border-bottom: 4px solid #4ABCFB;
}
.accordionTitle:before,
.accordion__Heading:before {
	content:url("../images/logo_s.png");
  font-size: 1.5em;
  line-height: 0.5em;
  float: left;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.accordionTitle:hover,
.accordion__Heading:hover {
  background-color: #2ba659;
}

.accordionTitleActive,
.accordionTitle.is-expanded {
  background-color: #2ba659;
}
.accordionTitleActive:before,
.accordionTitle.is-expanded:before {
  -webkit-transform: rotate(-225deg);
          transform: rotate(-225deg);
}

.accordionItem {
  height: auto;
  overflow: hidden;
  max-height: 50em;
  -webkit-transition: max-height 1s;
  transition: max-height 1s;
}
@media screen and (min-width: 48em) {
  .accordionItem {
    max-height: 15em;
    -webkit-transition: max-height 0.5s;
    transition: max-height 0.5s;
  }
}
.accordionItem.is-collapsed {
  max-height: 0;
}

.no-js .accordionItem.is-collapsed {
  max-height: auto;
}

.animateIn {
  -webkit-animation: accordionIn 0.45s normal ease-in-out both 1;
          animation: accordionIn 0.45s normal ease-in-out both 1;
}

.animateOut {
  -webkit-animation: accordionOut 0.45s alternate ease-in-out both 1;
          animation: accordionOut 0.45s alternate ease-in-out both 1;
}

@-webkit-keyframes accordionIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.9) rotateX(-60deg);
            transform: scale(0.9) rotateX(-60deg);
    -webkit-transform-origin: 50% 0;
            transform-origin: 50% 0;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes accordionIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.9) rotateX(-60deg);
            transform: scale(0.9) rotateX(-60deg);
    -webkit-transform-origin: 50% 0;
            transform-origin: 50% 0;
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes accordionOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.9) rotateX(-60deg);
            transform: scale(0.9) rotateX(-60deg);
  }
}
@keyframes accordionOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.9) rotateX(-60deg);
            transform: scale(0.9) rotateX(-60deg);
  }
}
* .gallery {
    overflow: hidden;
    margin: 10px;
  max-width: 1950px;
  margin-left: auto;
  margin-right: auto; text-align: center;color: #94103e;font-weight:bolder;
	}
.gallery:hover .overlay {
  bottom: 0;
  height: 100%;
}
.card {
    float: right;
    position: relative;
    width: 25%;
    padding-bottom:10%;background-color: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.cardInner {
/* Chrome, Safari */
-webkit-transform: rotateX(18deg) rotateY(7deg) rotateZ(25deg);
/* Firefox */
-moz-transform: rotateX(18deg) rotateY(7deg) rotateZ(25deg);
/* Opera */
-o-transform: rotateX(18deg) rotateY(7deg) rotateZ(25deg);
/* Internet Explorer */
-ms-transform: rotateX(18deg) rotateY(7deg) rotateZ(25deg);
/* Standard Syntax */
transform: rotateX(18deg) rotateY(7deg) rotateZ(20deg);
    position: absolute;
    left: 8px;
    right: 8px;
    top: 10px;
    bottom: 1px;
    overflow: hidden;
	border-bottom: 4px solid #6DC7D0;	

}
 .cardInner img { width:40% }
a {text-decoration: none}
.colp {background:#D6D6D6}
@media only screen and (max-width:480px) { 
    /* Smartphone view: 1 tile */
 .card {
        width: 100%;
	 padding-bottom: 40%;}
	.cardInner img { width: 48% }
    }
@media only screen and (max-width:1050px) and (min-width:651px) { 
    /* Small desktop / ipad view: 3 tiles */
    .card {
        width: 20%;margin-left: 1.2%;padding-right: 5%;
		padding-bottom: 17.3%}.card img{width: 90%;}
    }
@media only screen and (max-width:1290px) and (min-width:1051px) { 
    /* Medium desktop: 4 tiles */
    .card {
        width: 25%;
        padding-bottom: 25%;
    }
}