@charset "utf-8";
/*
Template Name: Drywest
Author: <a href="http://www.os-templates.com/">OS Templates</a>
Author URI: http://www.os-templates.com/
Licence: Free to use under our free template licence terms
Licence URI: http://www.os-templates.com/template-terms
File: Framework CSS
*/

html{overflow-y:scroll; overflow-x:hidden;}
html, body{margin:0; padding:0; font-size:14px; }

*, *::before, *::after{box-sizing:border-box;}

.bold{font-weight:bold;}
.center{text-align:center;}
.right{text-align:right;}
.uppercase{text-transform:uppercase;}
.capitalise{text-transform:capitalize;}
.hidden{display:none;}
.nospace{margin:0; padding:0; list-style:none;}
.block{display:block;}
.inline *{display:inline-block;}
.inline *:last-child{margin-right:0;}
.pushright li{margin-right:20px;}
.pushright li:last-child{margin-right:0;}
.borderedbox{border:1px solid;}
.overlay{position:relative; z-index:1;}
.overlay::after{display:block; position:absolute; top:0; left:0; width:100%; height:100%; content:""; z-index:-1;}
.bgded{background-position:top center; background-repeat:no-repeat; background-size:cover;margin: 2px 0px 2px 0px;}
.circle{border-radius:50%; background-clip:padding-box;}

.btn{display:inline-block; padding:8px 18px 10px; text-transform:uppercase; border:1px solid;}

.clear, .group{display:block;}
.clear::before, .clear::after, .group::before, .group::after{display:table; content:"";}
.clear, .clear::after, .group, .group::after{clear:both;}

a{outline:none; text-decoration:none;}

.fl_left, .imgl{float:left;}
.fl_right, .imgr{float:right;}

img{width:23%; max-width:100%; height:auto; margin:0; padding:0; border:none; line-height:normal; vertical-align:middle;}
.imgl{margin:0 15px 10px 0; clear:left;}
.imgr{margin:0 0 10px 15px; clear:right;}


/* Fonts
--------------------------------------------------------------------------------------------------------------- */
body, input, textarea, select{font-family:Verdana, Geneva, sans-serif;}
h1, h2, h3, h4, h5, h6, .heading{font-family:Georgia, "Times New Roman", Times, serif;}


/* Forms
--------------------------------------------------------------------------------------------------------------- */
form, fieldset, legend{margin:0; padding:0; border:none;}
legend{display:none;}
label, input, textarea, select, button{display:block; resize:none; outline:none; color:inherit; font-size:inherit; font-family:inherit; vertical-align:middle;}
label{margin-bottom:5px;}
:required, :invalid{outline:none; box-shadow:none;}


/* Generalise
--------------------------------------------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6, .heading{margin:0 0 0px 0; font-size:22px; line-height:normal; font-weight:normal; text-transform:uppercase;}

address{font-style:normal; font-weight:normal;}
hr{display:block; width:100%; height:1px; border:solid; border-width:1px 0 0 0;}

.font-xs{font-size:.8rem;}
.font-x1{font-size:1.2rem;}
.font-x2{font-size:1.8rem;}
.font-x3{font-size:2.8rem;}
.head_bg{
  background: linear-gradient(135deg, #6a11cb, #2575fc);
  padding: 10px;
  text-align: center;
 
}
.head {
  color: #fff;
  font-weight: bold;
  margin: 0;
  padding: 10px;
  font-size: 20px;
  text-transform: uppercase;
}

.btn-group {
  display: flex;
  justify-content: center;
  gap: 15px;
  flex-wrap: wrap;
  margin: 20px 0;
}

.btn-auth, .btn-logout {
  padding: 10px 18px;
  border-radius: 6px;
  font-weight: bold;
  text-decoration: none;
  color: #fff;
  transition: all 0.3s ease-in-out;
  text-align: center;
  min-width: 120px;
}

/* Gradient buttons */
.btn-auth {
  background: linear-gradient(135deg, #ff512f, #dd2476);
  box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}
.btn-auth:hover {
  background: linear-gradient(135deg, #dd2476, #ff512f);
  transform: translateY(-2px);
}

/* Logout button (different color) */
.btn-logout {
  background: linear-gradient(135deg, #11998e, #38ef7d);
}
.btn-logout:hover {
  background: linear-gradient(135deg, #38ef7d, #11998e);
  transform: translateY(-2px);
}

/* Forum links */
.forum-link {
  color: #ff512f;
  text-decoration: none;
  font-weight: bold;
}
.forum-link:hover {
  color: #dd2476;
  text-decoration: underline;
}
/* Forum card container */
.forum-card {
  text-align: center;
  margin: 15px auto;
}
.forum-box {
  width: 100%;                        /* take full width */
  background: #fff;
  border-radius: 10px;
  padding: 25px;
  margin: 15px 0;                     /* space between boxes */
  text-align: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hover effect */
.forum-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
}


/* Forum title */
.forum-box h2 {
  font-size: 22px;
  margin-bottom: 10px;
  color: #333;
}

/* Forum description */
.forum-box p {
  font-size: 14px;
  color: #666;
  margin-bottom: 15px;
}

/* Forum button */
.forum-btn {
  display: inline-block;
  padding: 10px 18px;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
  border-radius: 6px;
  background: linear-gradient(135deg, #ff416c, #ff4b2b);
  transition: all 0.3s ease-in-out;
}

/* Hover button */
.forum-btn:hover {
  background: linear-gradient(135deg, #ff4b2b, #ff416c);
}
.info-box {
  background: linear-gradient(135deg, #ffe066, #fff, #7cd992);
  border-radius: 10px;
  padding: 20px;
  margin: 20px auto;
  max-width: 900px;
  text-align: justify;
  font-style: italic;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
  border: 2px solid #5e0035;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.info-box:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
}

.info-box strong {
  color: #5e0035;
}
/* Info card */
.info-card {
  max-width: 980px;            /* control card width */
  margin: 18px auto;           /* center with top/bottom spacing */
  padding: 2px;                /* small outer padding for border effect */
  border-radius: 12px;
  background: linear-gradient(180deg, #ffffff, #f8f8f8); /* faint outer layer */
  box-shadow: 0 8px 28px rgba(0,0,0,0.12);
}

/* Inner panel */
.info-card-inner {
  border-radius: 10px;
  padding: 22px 26px;
  background: linear-gradient(120deg, #fff7d6 0%, #ffffff 45%, #dff7e6 100%);
  border: 3px solid rgba(235,54,54,0.12);  /* subtle red-ish border */
  text-align: left;
  font-style: normal;                /* more readable than italic for long text */
  color: #1b1b1b;
  font-family: "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
  font-size: 15px;
}

/* Title */
.info-title {
  margin: 0 0 10px 0;
  font-size: 20px;
  font-weight: 800;
  color: #7a1336;                  /* dark accent color */
  letter-spacing: 0.6px;
  text-transform: none;            /* keep natural casing */
}

/* Paragraphs */
.info-card-inner p {
  margin: 0 0 12px 0;
}

/* Optional highlight for small bold text inside paragraphs */
.info-card-inner strong {
  color: #5e0035;
  font-weight: 700;
}

/* Responsive tweaks */
@media (max-width: 640px) {
  .info-card-inner {
    padding: 16px;
    font-size: 14px;
  }
  .info-title {
    font-size: 18px;
  }
}
.satta-card {
  max-width: 960px;
  margin: 20px auto;
  padding: 28px 32px;
  background: linear-gradient(135deg, #265882 0%, #173d5a 100%);
  color: #fffb06;
  font-size: 16px;
  font-family: "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  text-align: left;
}

.satta-card p {
  margin-bottom: 14px;
}

.satta-link {
  color: #57FF0B;
  text-decoration: none;
  font-weight: bold;
  transition: color 0.3s ease;
}

.satta-link:hover {
  color: #ffffff;
  text-decoration: underline;
}

.satta-card strong {
  color: #FFD700;
}

.satta-card em {
  color: #ADEAFF;
  font-style: normal;
  font-weight: 600;
}
 /* Header */
    header.site-header {
      background: linear-gradient(90deg, #d9534f, #ff006c);
      color: #fff;
      text-align: center;
      padding: 20px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.4);
    }
    header.site-header h1 {
      margin: 0;
      font-size: 32px;
      font-weight: 900;
      letter-spacing: 2px;
    }
    header.site-header p {
      margin: 5px 0 0;
      font-size: 16px;
      font-weight: 500;
    }

    /* Main container */
    .container {
      max-width: 1100px;
      margin: 30px auto;
      padding: 20px;
    }

    /* Info banner */
    .info-banner {
      background: linear-gradient(90deg,#ffe066,#fff,#7cd992);
      border: 2px solid #ff006c;
      padding: 20px;
      border-radius: 8px;
      font-style: italic;
      font-weight: bold;
      font-size: 14px;
      margin-bottom: 20px;
      text-align: center;
    }

    /* Section blocks */
    .section {
      background: #fff;
      padding: 25px;
      margin-bottom: 20px;
      border-radius: 8px;
      box-shadow: 0 3px 12px rgba(0,0,0,0.15);
    }
    .section h2 {
      text-align: center;
      margin-bottom: 15px;
      font-size: 20px;
      color: #d9534f;
    }
    .section p {
      font-size: 14px;
      line-height: 1.6;
      text-align: justify;
    }

    /* Notice box */
    .notice {
      background: #fffb06;
      border: 2px solid #222;
      padding: 15px;
      font-weight: bold;
      font-style: italic;
      border-radius: 6px;
      margin: 20px 0;
      text-align: center;
    }

    /* Login */
    .login-form input[type="text"],
    .login-form input[type="password"] {
      width: 100%;
      padding: 12px;
      margin: 10px 0;
      border: 1px solid #ccc;
      border-radius: 6px;
    }
    .login-form input[type="submit"] {
      width: 100%;
      padding: 12px;
      background: #02577C;
      color: #fff;
      border: none;
      border-radius: 6px;
      font-weight: bold;
      font-size: 16px;
      cursor: pointer;
    }
    .login-form input[type="submit"]:hover {
      background: #013e5a;
    }

    /* Footer */
    footer {
      background: #111;
      color: #ddd;
      text-align: center;
      padding: 25px;
      font-size: 14px;
      margin-top: 40px;
    }
    footer p {
      margin: 5px 0;
    }
    footer a {
      color: #ffcc00;
      text-decoration: none;
      font-weight: 600;
    }
    footer a:hover {
      text-decoration: underline;
    }



.wrapper{display:block;border-radius: 6px; position:relative; width:100%; margin:0; padding:0; text-align:center; word-wrap:break-word;border-width: 3px;
  border-color: #5e0035;
  border-style: inset;}
/*
The "hoc" class is a generic class used to centre a containing element horizontally
It should be used in conjunction with a second class or ID
*/
.hoc{display:block; margin:0 auto;}


/* HTML 5 Overrides
--------------------------------------------------------------------------------------------------------------- */
address, article, aside, figcaption, figure, footer, header, main, nav, section{display:block; margin:0; padding:0;}


/* Grid
--------------------------------------------------------------------------------------------------------------- */
.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter{display:inline-block; float:left; margin:0 0 0 3.06748466257669%; list-style:none;}

.first{margin-left:0; clear:left;}

.one_quarter{width:22.69938650306748%;}
.one_third{width:31.28834355828221%;}
.one_half, .two_quarter{width:48.46625766871166%;}
.two_third{width:65.6441717791411%;}
.three_quarter{width:74.23312883435584%;}


/* Spacing
--------------------------------------------------------------------------------------------------------------- */
.btmspace-10{margin-bottom:10px;}
.btmspace-15{margin-bottom:15px;}
.btmspace-30{margin-bottom:30px;}
.btmspace-50{margin-bottom:50px;}
.btmspace-80{margin-bottom:80px;}

.inspace-5{padding:5px;}
.inspace-10{padding:10px;}
.inspace-15{padding:15px;}
.inspace-30{padding:30px;}
.inspace-50{padding:50px;}
.inspace-80{padding:80px;}