/* CSS Document */
/*
Theme Name: Click2Support
Description: Click2Support is a clean responsive theme.
Author: Yadav Singh Basnet
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, right-sidebar, fixed-width, flexible-width, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready
Text Domain: Click2Support
*/

@import url("css/menu.css");

body{ font-size:14px; font-family: 'Poppins', sans-serif; color:black;}
a{  -webkit-transition:1s; transition:1s;}

/* Recommanded */
img{ max-width:100%; height:auto;}


.wp-caption { margin-top: 0.4em;}
.wp-caption { background: #eee; margin-bottom: 1.625em; max-width: 96%; padding: 9px;}
.wp-caption img { display: block; margin: 0 auto; max-width: 98%;}
.wp-caption .wp-caption-text,
.gallery-caption { color: #666; font-size: 12px;}
.wp-caption .wp-caption-text { margin-bottom: 0.6em; padding: 10px 0 5px 40px; position: relative;}
.wp-caption .wp-caption-text:before { color: #666; content: '\2014'; font-size: 14px; font-style: normal; font-weight: bold; margin-right: 5px; position: absolute; left: 10px; top: 7px;}
.sticky{ clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); position: absolute !important;}
.alignleft{ float:left; margin:10px 10px 10px 0;}
.align-left{ text-align:left;}
.aligncenter{ text-align:center;}
.align-right{ text-align:right;}
.alignright{ float:right; margin:10px 0 10px 10px;}

.menubar{ background:#F36F21;}
.home h2{ font-weight: 300; margin-bottom:20px;}

.logobar{ padding:10px 0;}
h1.logo{ margin:0; font-size: 16px; letter-spacing: 0.5px; line-height: 30px; font-weight: 200; text-align: left;}
.home header { width: 100%; background:#fff;}
header { position: relative;width: 100%; background:#fff;}

.titlebar{ background:#eee; padding:100px 0; position: relative;}
.titlebar h2{ font-weight: 900; font-size:48px; text-align: center; color:black;}

h1{ font-size:45px;}
h2{ font-size:35px;}
h3{ font-size:28px;}
h4{ font-size:22px;}
h5{ font-size:18px;}
h6{ font-size:16px;}

/* Main Menu */
.menu-left, .menu-right{ margin:0; padding:0;}
.primary-menu ul{ margin:0; padding:0;}
.primary-menu li{ display:inline-block; vertical-align: middle; margin:0; list-style:none; position: relative;}
.primary-menu li a{ color:#fff; line-height: 60px; font-weight: 500; text-transform: uppercase; font-size:14px; display: block; padding: 0 30px;}
.primary-menu li a:hover{ text-decoration: underline;}
.primary-menu li ul{ display: none; visibility: hidden; margin:0; padding:0;}
.primary-menu li:hover ul{ display:block; visibility: visible; position: absolute; top: 60px; left:0; width:200px; z-index: 9999; margin:0; padding:0;}
.primary-menu li ul li{ display: block; padding:0; margin:0;}
.primary-menu li ul li a{  text-align:left; background:#F36F21; border-bottom: 1px solid #fa8947; color:white; line-height:20px !important; display: block; padding:10px;}
.primary-menu li.current-menu-item a { text-decoration: normal; background: #cd5b17; color: #fff;}


.slider { background: url(images/banner.jpg) no-repeat center center; padding:120px 0; position: relative; text-align: center; color:#000; height:100vh;}
.slider::before { background:url(images/cloud.png) no-repeat center center; content: "" !important; display: block !important; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
/* .slider::before { background-image: radial-gradient(rgba(255,255,255,0.1) 20%, rgba(3,78,162,0.7) 80%); content: "" !important; display: block !important; width: 100%; height: 100%; position: absolute; left: 0; top: 0; } */
.slider h2 { font-weight: 300; font-size: 60px; color: #fff;}
.slider h2 span{ font-weight: 700;}
.slider p{ font-weight: 500; font-size:20px; padding:30px; color:#fff; text-shadow: 1px 0px 2px #000;}
.slider ul{ margin:0; padding:0;}
.slider ul li{ display:inline-block; vertical-align: middle; line-height: 40px;}
.slider ul li a{ border:1px solid #fff; color:#fff; font-weight:500; padding:8px 20px; letter-spacing: 1px; text-transform: uppercase; cursor: pointer;}
.slider ul li a:hover, .slider ul li a:active{ background:black; border:1px solid black; color:#fff;}
.slider .slider-content{ margin: 0; position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); width:100%;}

.welcome{ background:#eee; padding:60px 0; color:#333; text-align: center;}
.welcome h5{ line-height:26px;}

.webdesignwrapper{ padding:120px 0;}
.webdesignfeatures{ background:white; padding:20px; border: 5px solid #ccc;}
.webdesignfeatures ul{ margin:0; padding:0;}
.webdesignfeatures ul li{ display: block; border-bottom:1px dashed #333; padding:15px 0;}
.webdesigntitle{ font-weight: 700; font-size:65px; position: relative; z-index:9999; padding-left:40px;}
.webdesignthumb{ position: relative;}
.webdesignthumb::before { background-image: radial-gradient(rgba(255,255,255,0.1) 10%, rgba(3,78,162,0.7) 90%);  content: "" !important; display: block !important; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
.webdesigncontent{ padding-top:30px;}


.newsletterstyle label{ width:100%; color:black; text-transform: uppercase; margin:0;}
.newsletterstyle input[type=email], .newsletterstyle input[type=tel], .newsletterstyle input[type=text], .newsletterstyle textarea { background:none; padding: 8px 15px; width:100%; margin-top:5px; color:black; border:1px solid black; font-weight: 500;}
.newsletterstyle input[type=email]::placeholder, .newsletterstyle input[type=tel]::placeholder, .newsletterstyle input[type=text]::placeholder, .newsletterstyle textarea::placeholder { color:#ccc; font-weight: 500;}
.newsletterstyle input[type=submit]{ background:none; text-transform: uppercase; color:#000; padding:9px 40px; border: 1px solid #000; font-size:20px;}
.newsletterstyle input[type=submit]:hover{ background:black; color:#fff;}
.newsletterstyle div.wpcf7-validation-errors, .newsletterstyle div.wpcf7-acceptance-missing { border: 2px solid red; color:red;}
.newsletterstyle div.wpcf7-mail-sent-ok { border: 2px solid #398f14; color:#398f14;}

.home h3{ font-size: 50px;}

.services{ padding:60px 0; background:#eee;}
.services h3{ font-size:50px;margin-bottom:60px;}
.services h4{ font-size:35px; margin:20px 0; padding:0;}

.contactushome{ background:#ac2524; color:white; padding:30px; text-align: center;}
.contactushome h3{ font-size:28px;}
.contactushome a{ border-bottom: 1px dashed white;}

.readmore{ display: inline-block; margin-top:30px;}
.readmore a { background: none; border: 1px solid #034EA2; padding: 10px 50px; text-transform: uppercase; font-size: 14px; border-radius: 20px;}
.footerwidget{ background: #716658; padding:60px 0; color:rgba(255,255,255,0.6);}
.footerwidget h5{ color:white;}
.footerwidget ul{ margin:0; padding:0;}
.footerwidget ul li { list-style: none;}
.footerwidget ul li a{ display: block;color:rgba(255,255,255,0.6);}
.footerwidget ul li:last-child a{ border-bottom:none;}
footer{ background:#554b3f; color:#fff; padding:15px 0; }
footer a{ color:#fff; }
footer span{ margin:0 10px;}
footer h4{ color:white;}
footer .footerwidget{ padding:60px 0;}
footer ul li a{ color:rgba(255,255,255,0.6);}
footer ul{ margin:0; padding:0;}
footer ul li { list-style:none;}
.mobile-header{ display: none; visibility: hidden;}
.grecaptcha-badge{ visibility: collapse !important; }

.companyhousetitle h2{ font-size: 56px; text-align: center; font-weight: 700; color: #fff;}
.companyhousetitle h4{ text-decoration: underline;}

.morebutton a{ border:1px solid #034EA2; color:#034EA2; padding:10px 50px; text-transform: uppercase; font-weight: 500;}
.morebutton a:hover{ background:#034EA2; color:#fff;}

.morebuttonservices{ text-align: center;}
.morebuttonservices a{ border:1px solid #034EA2; color:#034EA2; padding:10px 50px; text-transform: uppercase; font-weight: 500;}
.morebuttonservices a:hover{ background:#034EA2; color:#fff;}

.contactushome .wpb_button, .wpb_content_element, ul.wpb_thumbnails-fluid>li{ margin-bottom:0 !important;}
.singleprojects{padding:60px 0;}
.pagetitle{ padding:60px 0; background:#034DA2;}
.pagetitle h2{ color:white; font-size:40px; font-weight: 300; text-align: center;}

.visit{ text-align: center; margin:20px 0 60px 0;}
.visit a{ background:#034DA2; color:white; text-transform: uppercase; padding:10px 20px; border: 1px solid #034DA2; font-weight: 500;}
.visit a:hover{ background:transparent; color:#034DA2;}

.headericon{ text-align: center; margin:35px 0;}
.headericon .headericondetails, .headericon i{ display:inline-block; vertical-align: top;}
.headericon .headericondetails{ text-align: left; font-weight: 500; letter-spacing: 1px;}
.headericon i{ color:#F36F21; margin-right: 10px;}

.volunteer{ background:url(https://click2support.org/wp-content/uploads/2020/05/bg.jpg) no-repeat center left; background-size: cover; background-attachment: fixed; padding:100px 0;}
.objectives{ background:url(https://click2support.org/wp-content/uploads/2020/05/about.jpg) no-repeat center left; background-size: cover; background-attachment: fixed; padding:100px 0; color:white;}
.donatebutton{ margin:35px 0;}
.donatebutton button { border: 1px solid #F36F21; background: transparent; padding: 10px 40px; color: #F36F21; font-weight: 500; text-transform: uppercase; border-radius: 5px; font-size: 18px; letter-spacing: 1px;}
.donatebutton button:hover{ background:#F36F21; color:white;}

.modal{ top:30% !important;}

/* IPAD */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .mobile-header{ display: block; visibility: visible; padding:10px 0;}
    .logobar, .topbar{ display: none; visibility: hidden;}
    .outer-menu { position: absolute; top: 20px; right: 20px; z-index: 9999;}
}
/* IPAD LANDSCAPE */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
}

/* Cell Phones */
@media only screen and (max-width: 767px) {
    .mobile-header{ display: block; visibility: visible; padding:10px 0; position:relative; top:0; left:0; width:100%; background:rgba(255,255,255,0.9);}
    .mobile-header .logo img{ width:80px;}
    .logobar, .topbar, .menubar{ display: none; visibility: hidden;}
    .outer-menu { position: absolute; top: 10px; right: 10px; z-index: 9999;}
    h1.logo { text-align: left; padding-left: 20px;}
    .slider { padding: 120px 0;}
    .slider p { font-size: 16px; }
    .slider h2 { font-size: 40px; }
    .slider ul li a { font-size: 12px; }
}

@media print {}