#popup{
  position: fixed;
  bottom: 4rem;
  width: 17rem;
  height:auto;
  font-size: 0.8rem;
  right:1rem;
  border: 1px solid white;
  padding:1rem;
  text-align:justify;
  z-index:999;
  border-radius: 5px;
}
#popup button{
  background: -webkit-gradient(linear,left top, left bottom,from(#33ccccaa),to(#2CEAA3aa));
  background: -o-linear-gradient(#33ccccaa,#2CEAA3aa);
  background: linear-gradient(#33ccccaa,#2CEAA3aa);
  float:left;
}
#popup button:hover{
  background: -webkit-gradient(linear,left top, left bottom,from(#33ccccee),to(#2CEAA3ee));
  background: -o-linear-gradient(#33ccccee,#2CEAA3ee);
  background: linear-gradient(#33ccccee,#2CEAA3ee);
  
}

form h3{
  color: #2CEAA3cc;
  font-size:1.5rem;
}
label:hover{
  border-radius:5px;
  background:#333;
  
}
.home-first{
  height:100vh;
  width:100vw;
  background:#333;
  z-index:99999999999999999999999;
}
.home-first h1{
  top:5rem;
  position:relative;
  font-size:2.5rem;
}
.anyone-top{
  display:none;
}
.anyone-topvis{
  -webkit-animation:highlight 2s;
          animation:highlight 2s;
}

.contain {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.contain input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}


.checkmark {
  position: absolute;
  top: 5px;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}


.contain:hover input ~ .checkmark {
  background-color: #ccc;
}
.contain input:checked ~ .checkmark {
  background:-webkit-gradient(linear,left top, left bottom,from(#33cccc),to(#2CEAA3));
  background:-o-linear-gradient(#33cccc,#2CEAA3);
  background:linear-gradient(#33cccc,#2CEAA3);
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.contain input:checked ~ .checkmark:after {
  display: block;
}

.contain .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}

q{
  display:block;
  background:#333;
  
  -o-border-image: -o-linear-gradient(bottom, #33cccc, #2CEAA3);
  
     border-image: -webkit-gradient(linear, left bottom, left top, from(#33cccc), to(#2CEAA3));
  
     border-image: linear-gradient(0deg, #33cccc, #2CEAA3);
  border-image-slice: 1;
  border-left:0.2rem solid transparent;
  padding:0.5rem;
  
  font-style:italic ;
}

.code-py{
  background: #222;
  border-top: 0.1rem solid white;
  color:white;
  font-size: 1rem;
  
}
input{
  background-color:#272727;
  border-radius: 5px;
  color:white;
  padding:0.5rem;
}
textarea{
  color:white;
  background:#222;

}
pre i{
  background:-o-linear-gradient(135deg,#33ccccaa, #f66079aa,#2CEAA3aa,#33ccccaa, #f66079aa,#2CEAA3aa);
  background:linear-gradient(-45deg,#33ccccaa, #f66079aa,#2CEAA3aa,#33ccccaa, #f66079aa,#2CEAA3aa);
  display:block;
  color:white;
  width:100%;
  height: 100%;
  text-align:right;
  padding:3px;
  padding-right:10px;
  -webkit-animation: gradient 16s ease infinite;
          animation: gradient 16s ease infinite;
  background-size: 400% 400%;
 
}
@-webkit-keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
.dropbtn {
  background-color: #167a7a;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
}

.dropbtn:hover,
.dropbtn:focus {
  background-color: #167a7aaa;
  
}

.dropdown {
  position: relative;
  display: inline-block;
  z-index:99;
  
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #333;
  min-width: 160px;
  overflow: auto;
  
  z-index: 1;
  color: white;
  z-index:99;
  
}
#ceeblist li{
  line-height: 2rem;
}
li{
  line-height: 2rem;
}
.dropdown-content a {
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  z-index:99;
}
.content-ar{
  margin-top:5px;
 
}

/*button for menu python*/
ol button{
  color:white;
 background: transparent;
 border:0;
 
  padding:0.5px;
  margin-bottom:5px;
  border-radius:2px;
  padding-left:2px;
  padding-right:2px;
  border-bottom: 3px solid #33ccccaa;

}

ol button:hover{
  background: #33ccccaa;
  -webkit-animation: highlight2 0.5s;
          animation: highlight2 0.5s;
  opacity:1;
  border-radius:5px;

 
}
button:focus{
  color: white;
  border: 0.5px solid #33cccc;
  

}

@-webkit-keyframes highlight2{
  0%{
    opacity:0.7;
  }
  100%{
    opacity:1;
  }
}

@keyframes highlight2{
  0%{
    opacity:0.7;
  }
  100%{
    opacity:1;
  }
}
.dropdown a:hover {
  background-color: #167a7a;
  border-radius:0;
}

.show {
  display: block;
}
button{
  border-radius:5px;
  background:-webkit-gradient(linear,left top, left bottom,from(#33ccccaa),to(#2CEAA3aa));
  background:-o-linear-gradient(#33ccccaa,#2CEAA3aa);
  background:linear-gradient(#33ccccaa,#2CEAA3aa);
  cursor: pointer;
}
button:hover{
  background: -webkit-gradient(linear,left top, left bottom,from(#33ccccee),to(#2CEAA3ee));
  background: -o-linear-gradient(#33ccccee,#2CEAA3ee);
  background: linear-gradient(#33ccccee,#2CEAA3ee);
}

.active {
  background: -webkit-gradient(linear,left top, left bottom,from(#33cccc99),to(#2CEAA399));
  background: -o-linear-gradient(#33cccc99,#2CEAA399);
  background: linear-gradient(#33cccc99,#2CEAA399);
  color:white;
  border:none;
}


#one a {
  color: #f2f2f2;
  border:0;
}

#mobnav .active {
  color: white;
  background: -webkit-gradient(linear,left top, left bottom,from(#33ccccaa),to(#2CEAA3aa));
  background: -o-linear-gradient(#33ccccaa,#2CEAA3aa);
  background: linear-gradient(#33ccccaa,#2CEAA3aa);
}

.foot a {
  color: white;
  border:0;
  border-bottom:3px solid#167a7a;
}

.topnav {
  background-color: #232323;
  overflow: hidden;
  -webkit-box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  
}

#loader {
  height: 100%;
  width: 100%;
  position: fixed;
  background-color: #2b2b2b;
  z-index: 99999999999999999999999999;
}

#menu{
  background:-webkit-gradient(linear,left top, left bottom,from(#33ccccaa),to(#2CEAA3aa));
  background:-o-linear-gradient(#33ccccaa,#2CEAA3aa);
  background:linear-gradient(#33ccccaa,#2CEAA3aa);
  color:white;
  border-radius:5px;
  font-size:1.5rem;
  border:0;
  
}


#menu:hover{
  background:-webkit-gradient(linear,left top, left bottom,from(#33ccccee),to(#2CEAA3ee));
  background:-o-linear-gradient(#33ccccee,#2CEAA3ee);
  background:linear-gradient(#33ccccee,#2CEAA3ee);
 
}

#loader img {
  height: 400px;
  left: 50%;
  margin-top: -200px;
  margin-left: -200px;
  position: absolute;
  top: 50%;
  width: 400px;
  opacity: 0.8;
  margin-bottom: 1rem;
}

#loader p {
 width:157px;

  top: 60%;
  position:relative;
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  border-right: .15em solid #33cccc; /* The typwriter cursor */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: .10em; /* Adjust as needed */
  -webkit-animation: 
    typing 2s steps(20, end),
    blink-caret .75s step-end infinite;
          animation: 
    typing 2s steps(20, end),
    blink-caret .75s step-end infinite;
  
  
  
}
@-webkit-keyframes typing {
  from { width: 0 }
  to { width: 157 }
}
@keyframes typing {
  from { width: 0 }
  to { width: 157 }
}

/* The typewriter cursor effect */
@-webkit-keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: #33cccc; }
}
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: #33cccc; }
}

.visible {

  height: 100%;
  background-color: #333;
  z-index: 99999999999999999999999999;
 
}

.topnav.responsive{
  
  -webkit-animation:
  drop 0.3s steps(40,end);
  
          animation:
  drop 0.3s steps(40,end);
}


@-webkit-keyframes up{
  from { height: 60% }
  to { height: 0 }
}


@keyframes up{
  from { height: 60% }
  to { height: 0 }
}
@-webkit-keyframes drop{
  from { height: 0 }
  to { height: 60% }
}
@keyframes drop{
  from { height: 0 }
  to { height: 60% }
}
.invisible {
 display:none;
  
}

@-webkit-keyframes highlight{
  0%{
    opacity:1;
     
  }
  100%{
    opacity:0.7;
 
  }
}

@keyframes highlight{
  0%{
    opacity:1;
     
  }
  100%{
    opacity:0.7;
 
  }
}
/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  border:0;
}

.topnav .icon {
  display: none;
  border:0;
}



.codepaste {
  background: rgb(27, 27, 27)
}

.codepaste pre {
  color: white;
  font-size: 1rem;
}
.codepaste td:first-child{
  border-right: 1px solid white;
  padding-right:0.4rem;
}
.codepaste td{
  padding-left:0.4rem;
}

.topnav a:hover {
  background-color: #167a7a;
  color: white;

}

#mobnav a {
  border-radius: 0;
  color:white;
  border: 0;

}

.code {
  display: block;
  overflow: auto;
  font-family: consolas;
  background: rgb(27, 27, 27);
  font-size: 1.1rem;
  border: 1px solid white;

}

code {
  font-family: consolas;
  background-color: #333;
  color: #33cccc;
  padding: 2px;
  overflow:hidden;
 
}
.code-py{
  overflow:auto;
  display:block;
}

.code pre {
  margin: 1rem;
  color: white;
}

pre{
  font-size:1.2rem;
  font-family:consolas;
}
.code h4 {
  font-family: consolas;
  font-size: 1.3rem;
  color: #33cccc;
  margin-top: 0.5rem;
  margin-left: 0.5rem;
  display: none;
}



/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 1260px) {

  .topnav a:not(:first-child) {
    display: none;
  }

  .topnav a.icon {
    float: right;
    display: block;
  }

  .row1 {
    font-size: 0.6rem;
  }
}

#mobnav {
  position: fixed;
  -ms-flex-line-pack: justify;
      align-content: justify;
  top: 0;
  z-index: 999999;
  width: 100%;
  padding-top: 10px;
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 1260px) {
  .topnav.responsive {
    position: relative;
 
  }

  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 10px;
  }

  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }


}

.uparrow {
  color: #f2f2f2;
  bottom: 8%;
  right: 8%;

  position: fixed;
  z-index: 99;
  height:3.3rem;
  width:3.3rem;
  background-color: #44444400;
  text-align:center;
  
  border: 2px white solid;
  border-radius:50%;
}
html{
  cursor: url(images/cursor.png), auto;
}
.uparrow p{
  line-height: inherit;
  

  background: #33333300;
  
}
.uparrow a{
  border:none;
}
.uparrow a:hover{
  background:transparent;
  -webkit-animation:none;
          animation:none;
  
}
.uparrow:hover{
  background:  -webkit-gradient(linear, left top, right top, from(#33ccccaa), to(#2CEAA3aa));
  background:  -o-linear-gradient(left, #33ccccaa, #2CEAA3aa);
  background:  linear-gradient(90deg, #33ccccaa, #2CEAA3aa);
  -webkit-animation:
   ease-in fade 0.25s;
          animation:
   ease-in fade 0.25s;
  margin-bottom:1px;
   
}
#dropar{
 margin-top:0.5rem;
  width:100%;
  height:auto;
  background:#333;
  z-index:99;
  position: relative;

  
  border: 0.5px solid white;
  
}
#x{
  float:right;
  margin-right:10px;
  border:0;
 
}

.arrow a {
  color: #f2f2f2;
  font-size: 2rem;
  text-align: center;
  padding: 0;

  background: transparent;

}

#acc table {
  font-weight:300;
  font-size: 1.2rem;
  text-align: justify;
}

#acc td {
  padding-right: 1rem;
  font-weight:300;
  text-align: center;
}
#acc th{
  padding: 0.5rem;
  font-weight:300;
  text-align:center;
}

.python-select{
  text-align:justify;
}
.python-select ::-moz-selection{
  background:#3ad19aaa;
  color:white;
}
.python-select ::selection{
  background:#3ad19aaa;
  color:white;
}

.pink ::-moz-selection {
  background: pink;
  color: white;
}

.pink ::selection {
  background: pink;
  color: white;
}

.or ::-moz-selection {

  background: #f66079;
  color: white;
}

.or ::selection {

  background: #f66079;
  color: white;
}

.gr ::-moz-selection {
  background: #2CEAA3aa;
  color: white;
}

.gr ::selection {
  background: #2CEAA3aa;
  color: white;
}

.cy ::-moz-selection {
  background: #33ccccaa;
  color: white;
}

.cy ::selection {
  background: #33ccccaa;
  color: white;
}

.yel ::-moz-selection {
  background: #F2ED56;
  color: white;
}

.yel ::selection {
  background: #F2ED56;
  color: white;
}

#tx {
  font-size: 1vw;
}

#tx img{
  border-radius: 50%;
}

#mobnav #tx {
  font-size: 20px;
}

#one {
  position: fixed;
  font-size: 1vw;
  border-radius: 25px;
  margin-bottom: 25px;
  -webkit-box-shadow: 2px 2px 8px 8px rgba(0, 0, 0, 0.2);
          box-shadow: 2px 2px 8px 8px rgba(0, 0, 0, 0.2);
  background:#333;
}
#textarAns{

  border: 3px solid transparent;
  -o-border-image: -o-linear-gradient(left, #33cccc, #2CEAA3);
     border-image: -webkit-gradient(linear, left top, right top, from(#33cccc), to(#2CEAA3));
     border-image: linear-gradient(90deg, #33cccc, #2CEAA3);
  border-image-slice: 1;
  
}
#mobnav {
  background-color: #232323;
}

#one ::-moz-selection {
  background: #33cccc;
  color: white;
}

#one ::selection {
  background: #33cccc;
  color: white;
}

#one img {
  width: 1.5vw;
  height: auto;
}

@media only screen and (min-width: 1550px) {
  #mobnav {
    display: none;
  }
}

@media only screen and (max-width: 1150px) {

}

@media only screen and (max-width: 900px) {
  #mobnav #tx {
    display: none;
  }

  #mobnav {
    font-size: 12px;
    background-color:#232323;

  }
}

@media only screen and (max-width: 1550px) {
  #one {
    display: none;
  }

}

body {
  background:black;
  color: #FFFFFF;
  font-family: 'Open Sans', Helvetica, Arial, sans-serif;
  font-weight: 300;
  overflow-x: hidden;

}

a {
  text-decoration: none;
  color: white;
  padding: 2px;
/*   
  margin-bottom:5px;
  -o-border-image: -o-linear-gradient(left, #33cccc, #2CEAA3);
     border-image: -webkit-gradient(linear, left top, right top, from(#33cccc), to(#2CEAA3));
     border-image: linear-gradient(90deg, #33cccc, #2CEAA3);
  border-image-slice: 1;
  border-bottom: 3px solid transparent; */
 
}

a:hover {
  text-decoration: underline;
  /* color: white;
  text-decoration: none;
  background:  -webkit-gradient(linear, left top, right top, from(#33ccccaa), to(#2CEAA3aa));
  background:  -o-linear-gradient(left, #33ccccaa, #2CEAA3aa);
  background:  linear-gradient(90deg, #33ccccaa, #2CEAA3aa);
  border-radius: 2px;
  -webkit-animation:
   ease-in fade 0.25s;
          animation:
   ease-in fade 0.25s; */
}

@-webkit-keyframes fade {
  0% {
    opacity: 0.3;
   
  }

  100% {
    opacity: 1;
   
  }
}

@keyframes fade {
  0% {
    opacity: 0.3;
   
  }

  100% {
    opacity: 1;
   
  }
}

.f {
  width: 7rem
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 300;
}

h3 {
  font-size: 1.3rem;
}

.tm-site-logo {
  width: 40px;
  height: 40px;
  border: 7px solid white;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
  display: inline-block;
  vertical-align: middle;
}
#prog1 {
  width: 100%;
  background-color: #222;
  border-radius:10px;
  z-index:99;
}
#bar1 {
  width: 0%;
  height: 1.5rem;
  color: white;
  background: -o-linear-gradient(45deg, #33ccccaa, #2CEAA3aa);
  background: linear-gradient(45deg, #33ccccaa, #2CEAA3aa);
  border-radius:10px;
  z-index: 9;
}

.tm-site-title {
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 0;
}

.tm-site-header {
  padding-top: 45px;
  padding-bottom: 45px;
  margin-bottom: 0;
}

.header {
  position: fixed;
  top: 0;
  z-index: 9999999;
  width: 100%;
  background-color: #333;
}
.complete{
  border-radius:5px;
  background:-webkit-gradient(linear,left top, left bottom,from(#33ccccaa),to(#2CEAA3aa));
  background:-o-linear-gradient(#33ccccaa,#2CEAA3aa);
  background:linear-gradient(#33ccccaa,#2CEAA3aa);
  color:white; 
  font-size: 1.3rem;
  border: 1px solid transparent;

}
.complete:hover{
  background:-webkit-gradient(linear,left top, left bottom,from(#33ccccee),to(#2CEAA3ee));
  background:-o-linear-gradient(#33ccccee,#2CEAA3ee);
  background:linear-gradient(#33ccccee,#2CEAA3ee);
}

.progress-bar {
  height: 8px;
  background: -o-linear-gradient(45deg, #33cccc, #2CEAA3);
  background: linear-gradient(45deg, #33cccc, #2CEAA3);
  width: 0%;
}

.progress-con {
  width: 100%;
  height: 8px;
  padding-bottom: 5px;
  background: #222;
}


.row1 {
  background-color: #333333;
  text-align: center;
  padding-bottom: 5px;
  margin-bottom: 0px;
  position: fixed;
  width: 100%;
  bottom: 0;
  z-index:99;

}
.foot a{
  border-radius:0;
}
.row1 {
  font-size: 0.5 rme;
  -webkit-box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index:99;
}

.row2 {
  background-color: #333;
  text-align: center;
  bottom: 0;
  padding-top: 15px;
  padding-bottom: 5px;
  position: relative;
  -webkit-box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index:999;
}
.foot ::-moz-selection {
  color: white;
  background-color: #33cccc;
  border-radius: 7px;
}
.foot ::selection {
  color: white;
  background-color: #33cccc;
  border-radius: 7px;
}
.row1 {
  padding:8px 8px;
}
.row2 a {
  margin: 20px;
  padding: 10px;
  border-radius: 0px;
  z-index:999;
}

@media only screen and (max-width:1500px) {
  .row2 {
    display: none;
  }


}

.tm-welcome-text {
  margin-top: 65px;
  margin-bottom: 65px;
  font-size: 2.2rem;
}

.tm-font-400 {
  font-weight: 400;
}

.tm-text-light-gray {
  color: #CDCDCD;
}

.tm-text-gray {
  color: #CCCCCC;
}

.tm-text-red {
  color: #f66079;
}

.tm-text-white {
  color: #FFFFFF;
}

a.tm-text-white:hover,
a.tm-text-white:focus {
  color: #FFFFFF;
}

.tm-text-green {
  color: #2CEAA3;
}

.tm-text-cyan {
  color: #33CCCC;
}

.tm-text-yellow {
  color: #F2ED56;
}

.tm-text-orange {
  color: #f66079;

}

.tm-bg-dark {
  background-color: #262626;
}

.tm-bg-dark-light {
  background-color: #404040;
}

hr {
  background: white;
  border: 2px solid transparent;
  -o-border-image: -o-linear-gradient(left, #33cccc, #2CEAA3);
     border-image: -webkit-gradient(linear, left top, right top, from(#33cccc), to(#2CEAA3));
     border-image: linear-gradient(90deg, #33cccc, #2CEAA3);
  border-image-slice: 1;
  max-width: 70%;
  border-radius:25%;
}

.tm-video-iframe {
  height: auto;
}

.tm-timeline-item {
  margin-left: 70px;
}

.tm-timeline-item-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  
}

.tm-img-timeline {
  width: 160px;
  height: 160px;
  display: inline-block;
  vertical-align: middle;
 
  -webkit-box-shadow: 2px 2px 8px 8px rgba(0, 0, 0, 0.2);
 
          box-shadow: 2px 2px 8px 8px rgba(0, 0, 0, 0.2);

}

.tm-timeline-connector {
  width: 55px;
  height: 3px;
  background: -webkit-gradient(linear,left top, left bottom,from(#2CEAA3),to(#33cccc));
  background: -o-linear-gradient(#2CEAA3,#33cccc);
  background: linear-gradient(#2CEAA3,#33cccc);
}

.tm-timeline-connector-vertical {
  height: 60px;
  width: 3px;
  background: -webkit-gradient(linear,left top, left bottom,from(#2CEAA3),to(#33cccc));
  background: -o-linear-gradient(#2CEAA3,#33cccc);
  background: linear-gradient(#2CEAA3,#33cccc);

  margin-left: 260px;
}

.tm-timeline-description {
  display: inline-block;
  vertical-align: middle;
  border-radius: 20px;
  padding: 35px 40px;
  max-width: 712px;
  -webkit-box-shadow: 2px 2px 8px 8px rgba(0, 0, 0, 0.2);
          box-shadow: 2px 2px 8px 8px rgba(0, 0, 0, 0.2);

}

.tm-section-mb {
  margin-bottom: 85px;
}

.tm-section-mt {
  margin-top: 85px;
}

::-webkit-scrollbar {
  width: 10px;
  height:10px;
}


::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(45deg,#555,#444,#333,#222);
  

}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #333;
}

iframe {
  max-width: 100%;
}
input{
  border:1px solid white;
}
input,
textarea,
[contenteditable] {
  caret-color: #FFFFFF;
}

p {
  line-height: 1.9;
  cursor:text;
}

@media (min-width: 1200px) {
  .container {
    max-width: 1310px;
  }

  .tm-container-2 {
    max-width: 1170px;
  }

}

@media (max-width: 991px) {
  .tm-timeline-item {
    margin-left: 25px;
  }
}

@media (max-width: 767px) {
  .tm-timeline-item {
    margin-left: 0;
  }

}

@media (max-width: 584px) {
  .tm-timeline-item-inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }

  .tm-timeline-connector {
    width: 3px;
    height: 55px;
  }

  .tm-timeline-connector-vertical {
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 575px) {
  .container {
    max-width: 540px;
  }
}