@font-face {
    font-family: 'Antonio-Regular';
    src:url('fonts/Antonio-Regular.ttf.woff') format('woff'),
        url('fonts/Antonio-Regular.ttf.svg#Antonio-Regular') format('svg'),
        url('fonts/Antonio-Regular.ttf.eot'),
        url('fonts/Antonio-Regular.ttf.eot?#iefix') format('embedded-opentype'); 
        font-weight: normal;
        font-style: normal;
}

@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/lato-v14-latin-regular.eot');
    src: local('Lato Regular'), local('Lato-Regular'),
         url('fonts/lato-v14-latin-regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/lato-v14-latin-regular.woff2') format('woff2'), 
         url('fonts/lato-v14-latin-regular.woff') format('woff'),
         url('fonts/lato-v14-latin-regular.ttf') format('truetype'), 
         url('fonts/lato-v14-latin-regular.svg#Lato') format('svg'); 
  }
  

    body {
        font-family: "Lato";
        color: #828992;
    }
    h1 {
      font-family: "Antonio-Regular";
    }
    h1, h2, h3, h4, .h1, .h2, .h3{
        color: #333f48;
    }

    .call-to-action {
        width: max-content;
        font-size: 2em;
    }

    .main-p {
        font-size: 16px;
    }
        
    .btn-launch {
    	background-color: #f15b28;
    }
    
    .lg-outer .lg-thumb-item img {
	visibility: hidden !important;
    }
    
    .sidebar-collapse .navbar .dropdown.show .dropdown-menu, .sidebar-collapse .navbar .dropdown .dropdown-menu {
         height: auto !important; 
	 overflow-y: auto !important;
    }
    
    .image-category {
	background-size: cover;
    }
    
        .key-sector .sector-card {
            height: 200px;
            background-color: #ffffff;
            border-radius: 10px;
            color: #3c3c3c;
        }

        .count-up {
            background-color: #ffffff;
        }
        .section-menu {
            background-color: #f1f1f1;
        }

        .policy-summary {
            margin-top: -10px;
            background-color: #ffffff;
        }

        .key-sector-container {
            padding-top: 10px;
        }

        .key-sector-container h2{
            /*font-size: 600%; */
            /*font-weight: 550;
            margin-top: 50%;
            font-size: 4em;*/
          
        }
        
        .clickable {
	    cursor: pointer;
	}
        
        .startup-modal p {
            text-align: center;
        }

        .key-sectors{
            margin-top: 40%;
            font-size: 6em;
        }
        .key-sector-container span, .key-sectors span{
            text-decoration: underline;
            text-decoration-color: #f15b28;
            display: inline-block;
        }
        
        
        .welcome-modal h3{
            text-align: center;
            font-size: 350%;
            padding:0;
            margin:0;
            line-height: 1;
        }
        .welcome-modal span {
            text-align: center;
            font-size: 40% ;
            padding:0;
            margin:0;
        }

        .key-sector h2 {
            margin-top: 40px;
            font-size: 8em;
            /*font-weight: bold;*/
            text-align: left;
            font-family: "Lato";
            line-height: 0.5;
            padding-left: 10px;

        }
        .more h2{
            color: #f15b28;
            
        }
        .green-text h2 {
            color: #4db53c;
        }
        .stroke h2 {
            -webkit-text-stroke: 1px #f15b28;
            -webkit-text-fill-color: white;
        }
        

        .key-sector h2 span {
            font-size: 70%;
            text-decoration: none;
        }

        .key-sector p {
            color: #828992;
            padding-left: 10px;
        }

        .larger-p {
            font-size: 1.2em;
            margin-bottom: -0.2rem;
        }
        .form-control-lg {
            font-size: 1.5em !important;
        }
        .nav-tabs .nav-item {
            /* padding-top: 10px !important; */
        }
        .order {
	  -webkit-animation: bounce .3s infinite alternate;
	  -moz-animation: bounce .3s infinite alternate;
	  animation: bounce .3s infinite alternate;
	}
	@-webkit-keyframes bounce {
	  to { -webkit-transform: scale(1.2); }
	}
	@-moz-keyframes bounce {
	  to { -moz-transform: scale(1.2); }
	}
	@keyframes bounce {
	  to { transform: scale(1.2); }
	}

/*
        .text-sector {
            margin-left: 30%;
            margin-top: 30%;
        }


 */      /*scroll down */
 	@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:300,400);

		section {
		  position: relative;
		  width: 100%;
		  height: 100%;
		}
		section::after {
		  position: absolute;
		  bottom: 0;
		  left: 0;
		  content: '';
		  width: 100%;
		  height: 80%;
		}


		.scroll a {
		  position: absolute;
		  bottom: 20px;
		  left: 50%;
		  z-index: 2;
		  display: inline-block;
		  -webkit-transform: translate(0, -50%);
		  transform: translate(0, -50%);
		  color: #fff;
		  font : normal 700 20px/1 'Josefin Sans', sans-serif;
		  letter-spacing: .1em;
		  text-decoration: none;
		  transition: opacity .3s;
		}
		.scroll a:hover {
		  opacity: 0.5;
		}



		#sectionscroll a {
		  padding-top: 80px;
		}
		
		#sectionscroll a span {
		  position: absolute;
		  top: 0;
		  left: 50%;
		  width: 24px;
		  height: 24px;
		  margin-left: -12px;
		  border-left: 3px solid #fff;
		  border-bottom: 3px solid #fff;
		  -webkit-transform: rotate(-45deg);
		  transform: rotate(-45deg);
		  -webkit-animation: sdb07 2s infinite;
		  animation: sdb07 2s infinite;
		  opacity: 0;
		  box-sizing: border-box;
		}
		#sectionscroll a span:nth-of-type(1) {
		  -webkit-animation-delay: 0s;
		  animation-delay: 0s;
		}
		#sectionscroll a span:nth-of-type(2) {
		  top: 16px;
		  -webkit-animation-delay: .15s;
		  animation-delay: .15s;
		}
		#sectionscroll a span:nth-of-type(3) {
		  top: 32px;
		  -webkit-animation-delay: .3s;
		  animation-delay: .3s;
		}
		@-webkit-keyframes sdb07 {
		  0% {
		    opacity: 0;
		  }
		  50% {
		    opacity: 1;
		  }
		  100% {
		    opacity: 0;
		  }
		}
		@keyframes sdb07 {
		  0% {
		    opacity: 0;
		  }
		  50% {
		    opacity: 1;
		  }
		  100% {
		    opacity: 0;
		  }
		}

		.key-sector h4 {
		     text-align: center;
		}
 
 	/* end scroll down */ 
        
        .sector-card-orange:hover {
            color: #ffffff;
            text-decoration-color: #f15b28;
            background-color: #f15b28;
            -moz-transform: scale(1.015);
            -webkit-transform: scale(1.015);
            -o-transform: scale(1.015);
            -ms-transform: scale(1.015);
            -webkit-transform: scale(1.015);
            transform: scale(1.015);
            box-shadow: 0 5px 15px rgba(0,0,0,0.3);

            -webkit-transition: transform 0.5s ease-in-out;
            -moz-transition:transform 0.5s ease-in-out;
            -ms-transition:transform 0.5s ease-in-out;
        }

        .sector-card:hover p {
            color: #ffffff;
        }

        .sector-card:hover h2 {
            color: #ffffff;
        }

        .sector-card-green:hover {
            color: #ffffff;
            text-decoration-color: #4db53c;
            background-color: #4db53c;
            -moz-transform: scale(1.015);
            -webkit-transform: scale(1.015);
            -o-transform: scale(1.015);
            -ms-transform: scale(1.015);
            -webkit-transform: scale(1.015);
            transform: scale(1.015);
            box-shadow: 0 5px 15px rgba(0,0,0,0.3);

            -webkit-transition: transform 0.5s ease-in-out;
            -moz-transition:transform 0.5s ease-in-out;
            -ms-transition:transform 0.5s ease-in-out;
        }

        h1{
                margin: 40px 0 60px 0;
            }

            .dark-area {
                background-color: #666;
                padding: 40px;
                margin: 0 -40px 20px -40px;
                clear: both;
            }
            
            .summary_caption {
                margin-top: 0;
                padding-top: 0;
                top: 0;
            }

            .clearfix{
                text-align: center;
                padding: 15px 15px 0 15px;
            }
            .clearfix {*zoom: 1;}
            .big {
                margin: 35px;
            }

            .summary-header {
                text-align: right;
            }
            .summary-header h3 {
                font-size:400%;
                line-height: 1.5;
                margin: 0;
                padding-top: 10px;
                letter-spacing: -3px;
            }
            .summary-header span{
                line-height: 1;
                font-size: 1.5em;
                color: #f15b28;
                font-weight: bold;
                font-style: italic;
            }

    .home-overlay{
        position: absolute;
        top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          height: 100%;
          width: 100%;
          opacity: 0.5;
          transition: .3s ease;
          background-color: black;
    }


    #countup p {
    display: inline-block;
    padding: 5px;
    background: #FFA500;
    margin: 0 0 20px;

    }

    .text-center {
        text-align: center;
    }

    .content-center .caption {

    }

    .h1-seo {
        line-height: 1;
        font-size: 6em !important;
        font-family: "Antonio-Regular";
    }
    
    .intro-name {
        text-align: center;
        letter-spacing: 3.5px;
        text-transform: uppercase;
    }
    
    .brand .caption {
    	font-size: 2.8em !important;
    }
    
    .nav-pills .nav-item .nav-link {
    	margin: 0 auto;
    }
    
    .nav-item h5 {
	    margin-top: 0 !important;
	}

    .modal.vertically-modal .modal-dialog {
	  transform: translateY(-25%);
	  top: 50%;
	  margin: 0 auto;
	}
	
	.modal.vertically-modal.show .modal-dialog {
	  transform: translateY(-50%);
	}
	
	.modal.vertically-modal .modal-content {
	  max-height: 100vh;
	  overflow-y: auto;
	  padding: 40px;
	}
	
    .c100.green > span {
    	color: #9CCC65;
    }
    
    .c100.green {
    	background-color: #9CCC65;
    }
    .logo-sivio {
        min-width: 80px;
    }

    .zim-primary-btn a{
        color: #ffffff;
        background-color: #f15c27;
    }
    .zim-primary-btn a:hover, .zim-white-btn a:hover , .zim-blue-btn a:hover {
        text-decoration: none;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }
    .zim-white-btn a:hover {
        color: #444 !important;
    }
    .zim-default-btn a{
        color: unset;
        background-color: #ffffff;
    }
    .zim-default-btn a:hover {
        text-decoration: none;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }

    @media (max-width: 768px) {
        .key-sectors{
            margin-top: 0;
            font-size: 3.5em;
            text-align: center;
        }
        
        .key-sector h2 {
            font-size: 8em;
            margin-top: 35px;
            line-height: 0.5;
            padding-left: 5px;
            
        }

        .summary-header {
                text-align: center;
                line-height: 0;
                margin-bottom: 0;
                padding-bottom: 0;
            }

        #countup {
        
            padding-left: 10%;
        }

        .h1-seo {
        line-height: 1;
        font-size: 3.8em !important;
        }
        
        .brand .caption {
	    font-size: 1.6em !important;
	}   

    }
    
    @media (max-width: 767px) {
    	.welcome-modal h3 {
    	   font-size: 2.2em;
    	   line-height: 1;
    	}
    	.category-modal .modal-dialog {
	    max-width: 100%;
	}
	
	.nav-pills-primary.flex-column {
	    flex-direction: row !important;
	}
    
    }
    
    @media (min-width: 576px) and (max-width: 1280px) {
    	.category-modal .modal-dialog {
	    max-width: 95%;
	}
    
    }
    @media (min-width: 1280px) {
    	.category-modal .modal-dialog {
	    max-width: 1200px;
	}
    
    }
    
    @media (min-width: 576px) and (max-width: 991px) {
        .key-sector h2 {
            font-size: 6.5em;
            padding-top:20px;
            padding-left: 3px;
            
        }
               
    }
    @media (min-width: 576px) {
		.modal.vertically-modal .modal-dialog {
		    max-width: 750px !important;
		}
	}
     @media (max-width: 575px) {
     	.modal.vertically-modal .modal-content {
	  padding: 20px;
	}
	.welcome-modal h3 {
	 line-height: 1;
	}
	
	.h1-seo {
	    font-size: 2.8em !important;
	}
	
	.small_header_title {
    
    		font-size: 4em !important;
	}
     
     }
     
     @media screen and (max-width: 3839px) {
	.sidebar-collapse .navbar-collapse:before {
	     background: #212121 !important; 
	}
	
	
    }
    
    @media(max-width: 345px) {
      .h1-seo {
	    font-size: 2em !important;
	}
	
	.scroll a {
	    left: 40% !important;
	}
    
    }
    
    @media(max-width: 674px) {
     
	.scroll a {
	    left: 40% !important;
	}
    
    }

